/* /assets/css/style.css */
/* Hoja de estilos completa para el Sistema de Registro de Autobús */
/* Ubicación: Campeche, Campeche, México. Fecha: 05/Abr/2025 10:20 AM CST */

/* --- Variables de Color --- */
:root {
  --color-guinda: #900C3F; /* Tono guinda/borgoña principal */
  --color-guinda-darker: #7a0a35; /* Tono más oscuro para hover/active */
  --card-border-color: #dee2e6; /* Color de borde más estándar */
  --card-header-bg: #f8f9fa;   /* Fondo claro para cabeceras de tarjeta */
  --text-muted-light: #6c757d; /* Color de texto apagado */
  --bs-primary-rgb: 13, 110, 253; /* Para sombras de focus */
  --bs-guinda-rgb: 144, 12, 63; /* Para sombras de focus guinda */
  --bs-blue-rgb: 13, 110, 253; /* Para icono stats */
  --bs-warning-rgb: 255, 193, 7; /* Para badge 'Más frecuente' */
}

/* --- Estilos Globales y Helpers --- */
body {
  background-color: #f0f2f5; /* Fondo general ligeramente diferente */
  color: #212529;
  padding-top: 70px; /* Espacio para navbar fija */
  /* --- Propiedades de Tipografía Poppins (Integradas) --- */
  font-family: 'Poppins', sans-serif; /* Fuente principal: Poppins */
  font-weight: 400; /* Peso Regular por defecto */
}

/* --- Peso Bold (700) para Elementos Clave (Poppins) --- */
h1, h2, h3, h4, h5, h6,
strong,
b,
.clase-negrita { /* Puedes añadir clases personalizadas si usas */
  font-weight: 700; /* Peso Bold */
  /* Mantén otras reglas si las tenías para estos selectores */
}

/* Ajuste para iconos Bootstrap */
[class^="bi-"]::before, [class*=" bi-"]::before {
    vertical-align: -0.125em;
}
.btn [class^="bi-"], .btn [class*=" bi-"] {
    margin-right: 0.3rem;
}
.card-title-custom [class^="bi-"], .card-title-custom [class*=" bi-"] {
     margin-right: 0.5rem;
}
.form-label {
    font-weight: 500; /* Cambiado de 500 a usar el 700 heredado o dejar 400 - Revisar diseño */
    /* Si quieres que las etiquetas sean bold por defecto (700), no necesitas esta línea. */
    /* Si quieres que sean regular (400), añade: font-weight: 400; */
    margin-bottom: 0.5rem;
}
.text-muted {
    color: var(--text-muted-light) !important;
}
/* Estilo para badges guinda (usado en estadísticas) */
.bg-guinda {
  background-color: var(--color-guinda) !important;
}
/* Feedback para AJAX barcode check */
#barcode-feedback {
    min-height: 1.2em; /* Evita salto de layout */
}

/* --- Estilos para la Página de Login (index.php) --- */
body.login-page {
  /* Imagen de Fondo y Overlay */
  /* !!! IMPORTANTE: Cambia la URL por la ruta a TU imagen de fondo real !!! */
  background-image: linear-gradient(rgba(0, 0, 0, 0.55), rgba(0, 0, 0, 0.55)), url('../assets/img/fondo-login.jpg');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;

  /* Centrado Flexbox */
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 1rem;
  overflow-y: auto;
  padding-top: 0; /* Resetear padding-top solo para login */
}

/* Tarjeta de login */
.login-card {
  background-color: rgba(255, 255, 255, 0.97);
  border: none;
  border-radius: 10px;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
  max-width: 400px; /* Tamaño reducido */
  width: 100%;
}

/* Logo opcional dentro del login */
.login-logo {
    text-align: center;
    margin-bottom: 1.5rem;
}
.login-logo img {
    max-width: 150px;
    height: auto;
}

/* Título "Iniciar Sesión" */
.login-card .card-title {
  font-weight: 300; /* Usará Poppins si no se define aquí otra font-family, pero será Light (300) */
  /* Si quieres que sea Bold (700), cambia a: font-weight: 700; */
  /* Si quieres que sea Regular (400), cambia a: font-weight: 400; */
  color: #333;
  font-size: 1.8rem;
}

/* Inputs del formulario de login */
.login-card .form-control {
  border-radius: 5px;
  border: 1px solid #ced4da;
  padding: 0.75rem 1rem;
  background-color: rgba(255, 255, 255, 0.9);
  /* Hereda font-family: Poppins y font-weight: 400 del body */
}
.login-card .form-control:focus {
   border-color: var(--color-guinda);
   box-shadow: 0 0 0 0.25rem rgba(var(--bs-guinda-rgb), 0.25);
   background-color: #fff;
}
.login-card .form-control.is-invalid { border-color: var(--bs-danger); }
.login-card .form-control.is-valid { border-color: var(--bs-success); }

/* Botón de login */
.login-card .btn-lg {
  padding: 0.75rem;
  font-size: 1rem;
  border-radius: 5px;
  font-weight: 600; /* Este es un peso intermedio, ni 400 ni 700. Asegúrate que Poppins lo soporte o cámbialo a 400 o 700 */
  /* Poppins soporta 600 (SemiBold), así que está bien si lo quieres así */
  transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
}

/* Ajustes para alertas dentro del login */
.login-card .alert {
    border-radius: 5px;
    font-size: 0.9rem; /* Hereda Poppins 400 */
}


/* --- Estilo Barra de Navegación (Guinda) --- */
.navbar-guinda {
  background-color: var(--color-guinda) !important;
  /* Los elementos dentro heredarán Poppins 400 a menos que se especifique lo contrario */
}
.navbar-guinda .navbar-brand { font-weight: 500; /* Poppins soporta 500 (Medium), ok si lo quieres así */ }
.navbar-guinda .navbar-nav .nav-link { color: rgba(255,255,255,0.85); /* Hereda Poppins 400 */}
.navbar-guinda .navbar-nav .nav-link:hover,
.navbar-guinda .navbar-nav .nav-link:focus { color: #fff; }
.navbar-guinda .navbar-nav .nav-link.active {
    font-weight: 700; /* Asegura que el link activo use Poppins Bold (700) */
    color: #fff;
    /* background-color: rgba(255, 255, 255, 0.1); */
    /* border-radius: 4px; */
}
.navbar-guinda .navbar-text { color: rgba(255,255,255,0.75); /* Hereda Poppins 400 */ }
.navbar-guinda .navbar-toggler { border-color: rgba(255,255,255,0.2); }
.navbar-guinda .navbar-toggler-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.85%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); }

/* Botón logout en navbar */
.navbar-guinda .navbar-nav .btn-outline-light {
    border-color: rgba(255,255,255,0.5);
    color: rgba(255,255,255,0.8);
    /* Hereda Poppins 400 por defecto de 'body' */
    /* Si quieres un peso específico, añádelo aquí, ej: font-weight: 500; */
}
.navbar-guinda .navbar-nav .btn-outline-light:hover {
     border-color: #fff;
     color: #fff;
     background-color: rgba(255,255,255,0.1);
}


/* --- Estilo Botón Guinda (General) --- */
.btn-guinda {
  color: #fff;
  background-color: var(--color-guinda);
  border-color: var(--color-guinda);
  padding: 0.5rem 1rem;
  font-weight: 500; /* Poppins soporta 500 (Medium), ok si lo quieres así */
  transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  /* Hereda font-family: Poppins del body */
}
.btn-guinda:hover {
  color: #fff;
  background-color: var(--color-guinda-darker);
  border-color: var(--color-guinda-darker);
}
.btn-guinda:focus, .btn-guinda.focus {
  color: #fff;
  background-color: var(--color-guinda-darker);
  border-color: var(--color-guinda-darker);
  box-shadow: 0 0 0 0.25rem rgba(var(--bs-guinda-rgb), 0.5);
}
.btn-guinda.btn-lg {
    padding: 0.75rem 1.5rem;
    font-size: 1.15rem; /* Hereda font-weight: 500 de .btn-guinda */
}


/* --- Estilos Modernos para Tarjetas (Dashboard, Admin, Ver Registros) --- */
.modern-card {
  border: none;
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 1.5rem;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.06);
  /* Hereda Poppins 400 para el texto dentro */
}
.modern-card .card-header-custom {
  background-color: #fff;
  border-bottom: 1px solid var(--card-border-color);
  padding: 0.8rem 1.2rem;
}
.modern-card .card-title-custom {
    color: #343a40;
    font-weight: 500; /* Poppins soporta 500 (Medium), ok si lo quieres así */
    font-size: 1.1rem;
    /* Hereda font-family: Poppins */
}
.modern-card .card-body {
    padding: 1.5rem;
    background-color: #fff;
}
/* Estilo específico para tarjetas de estadísticas */
.card-body .fs-2 { font-size: 2.5rem !important; /* Hereda Poppins, el peso dependerá del elemento (ej. <h1> sería 700) */ }


/* --- Estilos Formularios Internos (Dashboard, Admin) --- */
.form-control,
.form-select {
    border: 1px solid #ced4da;
    border-radius: 6px;
    padding: 0.5rem 0.8rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    /* Hereda Poppins 400 */
}
.form-control:focus,
.form-select:focus {
   border-color: var(--color-guinda);
   box-shadow: 0 0 0 0.2rem rgba(var(--bs-guinda-rgb), 0.25);
}
.form-control::placeholder {
    color: #adb5bd;
    opacity: 1;
    /* Hereda Poppins 400 */
}
.form-text {
    font-size: 0.85rem; /* Hereda Poppins 400 */
}
/* Estilos validación Bootstrap */
.form-control.is-invalid, .form-select.is-invalid {
    border-color: var(--bs-danger);
    padding-right: calc(1.5em + 0.75rem); /* Espacio para icono error */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(0.375em + 0.1875rem) center;
    background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}
.form-control.is-valid, .form-select.is-valid {
     border-color: var(--bs-success);
     padding-right: calc(1.5em + 0.75rem);
     background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
     background-repeat: no-repeat;
     background-position: right calc(0.375em + 0.1875rem) center;
     background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}
textarea.form-control {
    min-height: calc(1.5em + 1rem + 2px); /* Hereda Poppins 400 */
}


/* --- Estilos Tabla Registros (ver_registros.php) --- */
.table {
    border-collapse: separate;
    border-spacing: 0;
    margin-bottom: 0;
    /* Hereda Poppins 400 para celdas */
}
.table thead th {
    background-color: var(--card-header-bg);
    border-bottom: 2px solid #dee2e6;
    color: #495057;
    font-weight: 600; /* Poppins soporta 600 (SemiBold), ok si lo quieres así */
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.5px;
    vertical-align: middle;
    padding: 0.75rem;
    white-space: nowrap;
    /* Hereda font-family: Poppins */
}
.table tbody td {
    vertical-align: middle;
    padding: 0.75rem;
    border-top: 1px solid #eff2f5;
    font-size: 0.9rem; /* Hereda Poppins 400 */
}
.table tbody tr:hover {
    background-color: rgba(var(--bs-guinda-rgb), 0.05);
}
/* Para la tabla responsiva */
.table-responsive {
    border: 1px solid var(--card-border-color);
    border-radius: 6px;
    background-color: #fff;
}

/* --- Estilos DataTables --- */
.dataTables_wrapper .row:first-child { padding: 0.5rem 0; } /* Espaciado controles (Mostrar X entradas, Buscar) */
.dataTables_wrapper .row:last-child { padding: 0.5rem 0; } /* Espaciado info y paginación */
.dataTables_length select { margin: 0 0.5em; /* Hereda Poppins 400 */ } /* Espacio alrededor del select de entradas */
.dataTables_filter input { margin-left: 0.5em; /* Hereda Poppins 400 */ } /* Espacio input buscar */
.page-item.active .page-link {
    background-color: var(--color-guinda); /* Paginación activa en Guinda */
    border-color: var(--color-guinda);
    /* Hereda Poppins 400 */
}
.page-link {
  color: var(--color-guinda); /* Color enlaces paginación */
  /* Hereda Poppins 400 */
}
.page-link:hover {
  color: var(--color-guinda-darker);
}

/* --- FIN DEL ARCHIVO styles.css --- */