/* General Styles */
.header-logo {
    height: 50px;
    margin-right: 15px;
}
.header-title {
    font-size: 1.5rem;
    font-weight: bold;
    margin-right: calc(var( bs-gutter-x ) * .5);
    margin-left: calc(var( bs-gutter-x ) * .5);
}

body {
    background-color: #f8f9fa; /* Fondo claro */
    font-family: Arial, sans-serif;
    color: #212529;
    margin: 0;
    padding: 0;
    line-height: 1.5;
}

/* Container Styles */
.container {
    padding: 0%; /* Reduce el padding general del contenedor */
    background-color: #f8f9fa; /* Fondo blanco para formularios */
}
.container-fixed {
    width: 50%;
    margin: 0 auto; /* Centrado horizontal */
}

/* Login Card */
.login-card {
    max-width: 125%; /* Ajuste del ancho máximo de la tarjeta */
    max-height: 100%;
    padding: 5px; /* Ajuste del padding interno */
    border: none;
    border-radius: 10px;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1); /* Sombra ligera */
}
/* Heading Styles */
h3.text-center {
    font-size: 1rem; /* Reduce el tamaño de la cabecera */
    margin-bottom: 10px; /* Espacio inferior más pequeño */
    font-weight: bold;
}

/* Form Styles */
form label {
    font-size: 0.8rem; /* Tamaño reducido para etiquetas */
    color: #495057; /* Texto gris */
    margin-bottom: 5px;
    display: block;
}

form input {
    font-size: 0.8rem; /* Texto más pequeño dentro de los inputs */
    padding: 5px; /* Reduce el padding interno */
    border: 1px solid #ced4da;
    border-radius: 5px;
}

form input:focus {
    border-color: #80bdff; /* Borde azul en foco */
    outline: none;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.5);
}

/* Button Styles */
.btn-primary {
    background-color: #000; /* Fondo negro */
    color: #ffc107; /* Letras amarillas */
    border: 2px solid #ffc107;
}

.btn-primary:hover {
    background-color: #ffc107; /* Fondo amarillo */
    color: #000; /* Letras negras */
}   
/* Utility Classes */
.vh-60 {
    height: 60vh; /* Reduce la altura total del contenedor */
}

.mb-1 {
    margin-bottom: 5px; /* Márgenes más pequeños entre elementos */
}

/* Link Styles */
a {
    color: #007bff; /* Azul predeterminado */
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
    color: #0056b3; /* Azul más oscuro en hover */
}

.btn-custom {
background-color: #000; /* Fondo negro */
color: #ffc107; /* Letras amarillas (color de Bootstrap warning) */
border: 2px solid #ffc107; /* Borde amarillo */
}
.btn-custom:hover {
background-color: #ffc107; /* Fondo amarillo */
color: #000; /* Letras negras */
border: 2px solid #000; /* Borde negro */
}

/* Footer Styles */
footer {
    background-color: #000; /* Fondo negro */
    color: #fff; /* Texto blanco */
    font-size: 0.8rem; /* Texto más pequeño */
    padding: 10px 0;
    text-align: center;
}

footer a {
    color: #ffc107; /* Amarillo */
    text-decoration: none;
}

footer a:hover {
    text-decoration: underline;
}