/* Adaptaciones de CSS BS3-era para que rinda bajo Bootstrap 5.
   Solo lo carga base_bs5.html. No toca biometrypass.css (BS3 sigue intacto).
   Parte de la migración IS-M02 (ver docs/security/poc/IS-M02/TASKS_BS5.md). */

/* --- Tipografía base: BS3 usaba body 14px; BS5 usa 16px. Restauramos 14px global. ---
   navbar/sidebar/breadcrumb heredan de aquí. Los elementos que BS5 fija a 1rem
   (.btn, .form-control, .form-select) se ajustan aparte abajo. */
body {
  font-size: 14px;
}

/* --- Navbar: restaurar fondo que daba .navbar-fixed-top (clase eliminada en BS5) --- */
.navbar.fixed-top {
  background: #f1f1f1;
  border: 0;
  /* BS5 agrega padding-y 0.5rem que BS3 no tenía → navbar 70px vs 56px. Igualamos a BS3. */
  padding-top: 0;
  padding-bottom: 0;
  min-height: 56px;
}

/* En BS3 la navbar no tenía clase de tema → sus <a> usaban el color de link por
   defecto (#337ab7). BS5 los pinta de gris vía .nav-link; restauramos el azul. */
.navbar.fixed-top .nav-link {
  color: #337ab7;
}
.navbar.fixed-top .nav-link:hover,
.navbar.fixed-top .nav-link:focus {
  color: #23527c;
}

/* --- Controles que BS5 fija a 1rem (no heredan del body): botones y campos de formulario.
   BS3 eran 14px; los bajamos. --- */
.btn,
.form-control,
.form-select,
.input-group-text,
.dropdown-menu {
  font-size: 14px;
}

/* --- btn-primary: BS5 usa #0d6efd (azul brillante). Lo igualamos al azul de la app
   (#4187c1, el de la barra de breadcrumb) para que sean consistentes. --- */
.btn-primary {
  --bs-btn-bg: #4678b2;
  --bs-btn-border-color: #4678b2;
  --bs-btn-hover-bg: #3a6496;
  --bs-btn-hover-border-color: #3a6496;
  --bs-btn-active-bg: #3a6496;
  --bs-btn-active-border-color: #3a6496;
  --bs-btn-disabled-bg: #4678b2;
  --bs-btn-disabled-border-color: #4678b2;
}

/* --- Título de ficha/modal: BS5 lo deja en 24px (h4=1.5rem); BS3 era 18px. --- */
.modal-title {
  font-size: 18px;
}

/* --- btn-success (ej. Guardar de las fichas): color definido por el usuario. --- */
.btn-success {
  --bs-btn-bg: #53af71;
  --bs-btn-border-color: #53af71;
  --bs-btn-hover-bg: #469560;
  --bs-btn-hover-border-color: #469560;
  --bs-btn-active-bg: #469560;
  --bs-btn-active-border-color: #469560;
  --bs-btn-disabled-bg: #53af71;
  --bs-btn-disabled-border-color: #53af71;
}

/* --- Breadcrumb (barra azul): centrar verticalmente su contenido en la barra de 40px.
   BS5 hace .breadcrumb display:flex pero sin align-items:center. --- */
.breadcrumb {
  align-items: center;
}
.breadcrumb > p {
  margin: 0;
}
/* Hamburger del breadcrumb: centrado (sin float) y un poco más grueso/grande.
   bi-list es fino; lo engrosamos con text-stroke. */
.breadcrumb #menu-toggle {
  font-size: 24px;
  padding-right: 8px;
  -webkit-text-stroke: 0.7px currentColor;
}

/* --- bootstrap-datepicker: .table-condensed se eliminó en BS5 ---
   BS3 aplicaba padding:5px a las celdas; lo restauramos para el popup.
   (Se valida/afina al renderizar locations.) */
.datepicker table.table-condensed > thead > tr > th,
.datepicker table.table-condensed > tbody > tr > td {
  padding: 5px;
}

/* --- nav-tabs: que envuelvan LIMPIO (todos los tabs siempre visibles) ---
   Los `.nav-link` de BS5 traen más padding que los tabs de BS3 → barras con varios tabs
   (p.ej. familia Configuración de vouchers: 5 tabs) se parten a 2 filas a anchos < ~1150px, y
   la pestaña ACTIVA quedaba con el borde inferior "roto" porque su `margin-bottom:-1px` (que en
   1 fila la une al contenido) se solapaba con la fila de abajo (distorsión, PATRON §7). Fix:
   reducir un poco el padding (entran en 1 fila a más anchos) y, cuando SÍ envuelven, separar las
   filas con `row-gap` y anular el `margin-bottom` negativo del tab activo (que solo tiene sentido
   en la última fila) para que cada fila se vea como una pestaña limpia. NO usar overflow/scroll:
   ocultaría tabs. */
.nav-tabs {
  row-gap: 4px;
}
.nav-tabs .nav-link {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
.nav-tabs .nav-link.active {
  margin-bottom: 0;
  border-bottom-color: var(--bs-border-color, #dee2e6);
}