/* Tipografía real de Modernize (no incluida en los assets del build,
   la plantilla asume la fuente instalada en el sistema o vía CDN). */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&display=swap');

/* ── Puente Modernize (spec 014) ─────────────────────────────────────
   Se carga DESPUÉS de styles.css y de shared.css (orden: styles.css →
   shared.css → bridge.css), para poder:
   1) Remapear los tokens de shared.css (--accent, --surface, --border,
      --bg, --text*, --shadow-*) a la paleta real de Modernize
      (Blue_Theme). Así todo componente existente construido sobre esos
      tokens (botones, cards, inputs, tablas...) hereda la identidad
      visual de Modernize sin reescribir el CSS de cada página.
   2) Corregir choques puntuales entre clases globales de Modernize
      (pensadas para sus demos) y patrones estándar de Bootstrap. */

:root {
  --bg:             #f6f9fc;
  --surface:        #ffffff;
  --border:         #e5eaef;
  --border-focus:   #5d87ff;
  --text:           #2a3547;
  --text-secondary: #5a6a85;
  --text-muted:     #7c8fac;
  --accent:         #5d87ff;
  --accent-d:       #4570e0;
  --accent-l:       #ecf2ff;
  --success:        #13dea9;
  --danger:         #fa896b;
  --shadow-sm: 0 1px 3px rgba(43,45,66,.06), 0 1px 4px rgba(43,45,66,.04);
  --shadow-md: 0 4px 12px rgba(43,45,66,.08), 0 2px 4px rgba(43,45,66,.05);
  --shadow-lg: 0 14px 36px rgba(43,45,66,.12), 0 4px 12px rgba(43,45,66,.06);
  --r:  7px;  /* radio de Modernize (--bs-border-radius) */
  --rs: 7px;  /* radio de Modernize (--bs-border-radius-sm real es 5px, pero
                 7px da mejor lectura en inputs pequeños existentes) */
  --font: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
}
body, input, textarea, select, button { font-family: var(--font); }
[data-theme="dark"] {
  --bg:             #1a2536;
  --surface:        #223044;
  --border:         #2e3c50;
  --border-focus:   #5d87ff;
  --text:           #eef2f6;
  --text-secondary: #a6b4c9;
  --text-muted:     #7c8fac;
  --accent:         #5d87ff;
  --accent-d:       #7ea0ff;
  --accent-l:       #22304a;
}

/* Modernize fuerza color blanco global en .nav-link.active (pensado para
   .nav-pills con fondo de color); en .nav-tabs necesita texto oscuro. */
.nav-tabs .nav-link { color: var(--bs-secondary-color, #7c8fac); border: none; border-bottom: 2px solid transparent; background: transparent; }
.nav-tabs .nav-link.active { color: var(--bs-primary, #5D87FF) !important; border-bottom-color: var(--bs-primary, #5D87FF); background: transparent; }

/* El reboot de Bootstrap deja checkbox/radio SIN borde ni fondo salvo que
   lleven la clase .form-check-input (que añade su propio marcado SVG).
   Los checkboxes propios de cada herramienta (selección masiva en
   bd_centros, tareas en gestor_incidencias/checklist, etc.) no usan esa
   clase y quedaban invisibles. Se restaura una apariencia nativa visible
   sin exigir tocar el marcado de cada página. */
input[type="checkbox"]:not(.form-check-input),
input[type="radio"]:not(.form-check-input) {
  -webkit-appearance: none;
  appearance: none;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
  width: 15px;
  height: 15px;
  flex-shrink: 0;
  margin: 0;
  border: 1.5px solid #7c8fac;
  border-radius: 4px;
  background-color: #fff;
  vertical-align: middle;
  position: relative;
  cursor: pointer;
}
input[type="radio"]:not(.form-check-input) { border-radius: 50%; }
input[type="checkbox"]:not(.form-check-input):checked,
input[type="radio"]:not(.form-check-input):checked {
  background-color: #5d87ff;
  border-color: #5d87ff;
}
input[type="checkbox"]:not(.form-check-input):checked::after {
  content: "";
  position: absolute;
  left: 4px; top: 1px;
  width: 4px; height: 8px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
input[type="radio"]:not(.form-check-input):checked::after {
  content: "";
  position: absolute;
  left: 4px; top: 4px;
  width: 5px; height: 5px;
  border-radius: 50%;
  background: #fff;
}