/* ════════════════════════════════════════════════════════════════════════
   DESIGN TOKENS — fuente única de color, tipografía, radios, sombras y layout.
   Regla del proyecto: NINGÚN color/espaciado suelto fuera de estas variables.
   Para re-tematizar (o preparar modo oscuro) basta con reasignar estos tokens.
   ════════════════════════════════════════════════════════════════════════ */
:root{
  /* ─ Marca · PALETA VERDE INSTITUCIONAL (D50 — Onil) ─
     Color primario de la institución. Comunica identidad, no estado. */
  --brand-900:#0D4D2A; --brand-800:#115C30; --brand-700:#146B36;
  --brand-600:#17743E; --brand-500:#1E8B4C; --brand-400:#3DA868;
  --brand-300:#60C086; --brand-200:#A3DABA; --brand-100:#D1EDDA; --brand-50:#EEF8F1;
  --brand:#17743E;                    /* primario   */
  --brand-hover:#146B36;              /* hover      */
  --brand-pressed:#115C30;            /* pressed    */
  --brand-disabled:#82C9A0;           /* disabled   */
  --brand-strong:var(--brand-700); --brand-contrast:#ffffff;
  --ring:rgba(23,116,62,.35);         /* foco fuerte (anillo 2 px) */
  --ring-soft:rgba(23,116,62,.19);    /* foco suave (inputs)       */

  /* ─ Acento complementario (ámbar cálido) — uso puntual ─ */
  --accent-600:#c2620c; --accent-500:#f59e0b; --accent-50:#fff8ec;

  /* ─ ACENTO DIGITAL (v145 + D50) — sistema híbrido de alta densidad ─
     Uso EXCLUSIVO: pestaña activa (nivel 2), ítem activo del menú lateral
     (nivel 1), migas de pan y enlaces/valores accionables (nivel 3).
     No se usa como fondo de bloques ni para estados de dominio. */
  --acc:#60AB25; --acc-600:#4A8019; --acc-700:#3D6B17;
  --acc-50:#F4FAEB; --acc-100:#E6F5D3;
  --acc-ring:rgba(96,171,37,.22);

  /* ─ Neutros (escala gris Tailwind — casi toda la app se construye aquí) ─ */
  --n-0:#ffffff; --n-50:#FAFAFA; --n-100:#F5F5F5; --n-150:#F0F1F2; --n-200:#E5E7EB;
  --n-300:#D1D5DB; --n-400:#9CA3AF; --n-500:#6B7280; --n-600:#4B5563; --n-700:#374151;
  --n-800:#1F2937; --n-900:#111827;

  /* ─ Superficies y texto ─
     Superficie blanca, contraste vía hairline. */
  --bg:#FAFAFA;                 /* fondo alternativo (gris 50) */
  --surface:#ffffff;            /* tarjetas, paneles */
  --surface-2:#F5F5F5;          /* fondo elevado — solo para diferenciar bloques */
  --hairline:#F5F5F5;           /* divisiones internas */
  --border:#E5E7EB;             /* TODOS los bordes: 1 px, nunca oscuros */
  --border-strong:#D1D5DB;
  --text:#111827;               /* títulos  */
  --text-subtle:#374151;        /* texto normal */
  --text-muted:#6B7280;         /* texto secundario / auxiliar */

  /* ─ Semánticos ─ */
  --success:#15803d; --success-bg:#dcfce7; --success-border:#bbf7d0; --toggle-on:#16a34a;
  --warning:#b45309; --warning-bg:#fffbeb; --warning-border:#fde68a;
  --danger:#b91c1c;  --danger-bg:#fee2e2;  --danger-border:#fecaca; --danger-500:#dc2626;
  --info:#17743E;    --info-bg:#EEF8F1;    --info-border:#A3DABA;
  --num:#0369a1;     /* números destacados (teléfonos, contadores) */
  --ring-ok:rgba(22,163,74,.35);

  /* ─ Estados de dominio (turnos) ─ */
  --st-libre:#16a34a;       --st-libre-bg:#f0fdf4;
  --st-ocupada:#17743E;     --st-ocupada-bg:#EEF8F1;
  --st-sustitucion:#9333ea; --st-sustitucion-bg:#faf5ff;
  --st-enfermeria:#0891b2;  --st-enfermeria-bg:#ecfeff;
  --st-vacacion:#eab308;    --st-vacacion-bg:#fefce8;
  --st-libredia:#64748b;    --st-libredia-bg:#f8fafc;
  --st-media:#f97316;       --st-media-bg:#fff7ed;
  --st-guardia:#e11d48;     --st-guardia-bg:#fff1f2;
  --st-reten:#d97706;       --st-reten-bg:#fffbeb;

  /* ─ Festivos ─ */
  --fest-fg:#be123c; --fest-bg:#ffe4e6; --fest-border:#fecdd3; --fest-cell:#fff1f2;

  /* ─ Radios / sombras ─ */
  /* Radios (v147): botones/inputs 12 · tarjetas 16 · modales 20 · badges pill */
  --r-sm:8px; --r-md:10px; --r-btn:12px; --r-lg:16px; --r-xl:20px; --r-pill:9999px;
  /* SOMBRA ÚNICA — casi imperceptible. Nunca acumular varias. */
  --sh-1:none;
  --sh-2:0 1px 2px rgba(16,24,40,.04), 0 8px 24px rgba(16,24,40,.05);
  --sh-3:var(--sh-2);
  --sh-pop:var(--sh-2);
  --sh-drawer:var(--sh-2);
  /* Movimiento: 180–220 ms, sin rebotes */
  --ease:cubic-bezier(.2,.8,.2,1); --dur:200ms;
  /* Espaciado base 8 px */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-6:24px; --sp-8:32px;

  /* ─ Layout / navegación ─ */
  --header-bg:linear-gradient(180deg,#ffffff 0%,#fbfdfe 100%);
  --header-ink:var(--brand-700);      /* título y elementos activos */
  --header-sub:var(--text-muted);     /* subtítulo / meta */
  --header-chip:#f1f5f9;              /* cajas de fecha / sesión */
  --login-bg:linear-gradient(180deg,#f8fafc 0%,#eef4f7 100%);
  --scroll-thumb:#cbd5e1;
  --touch:44px;
}
.ico{width:20px;height:20px;flex:none;stroke:currentColor;fill:none;
  stroke-width:2;stroke-linecap:round;stroke-linejoin:round;color:var(--n-500);
  transition:color var(--dur) var(--ease)}
.ico-sm{width:16px;height:16px}
.ico-lg{width:24px;height:24px}
.sn-item.active .ico,.view-tab.active .ico{color:var(--brand)}
*{box-sizing:border-box}
body{font-family:'Inter',sans-serif;background:var(--bg);color:var(--text)}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:var(--n-150)}
::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border-radius:4px}
@media print{
  body{background:#fff}
  .appbar,#sideNav,#sideNavOverlay,.snav-btn,.tabbar,.bulk-bar,.toast,.dd-menu{display:none!important}
  body{padding-left:0!important}
  .app-main{padding:0!important;max-width:none!important}
  .card,.gr-card,.dchip,.acard,.kbox,.agenda-day,.gr-day,.agd-row,.mcell,
  .empcal-row,.sec,.sec-body,.grc-contacts,.gr-obs-box,.rep-obsg{
    break-inside:avoid;page-break-inside:avoid;
  }
  .card{border:1px solid #e2e8f0;box-shadow:none}
  .sec.collapsed .sec-body{display:block!important}   /* nada oculto en el PDF */
  .sec-chev{display:none}
  h3,.sec-head{break-after:avoid;page-break-after:avoid}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}
/* Utilidad aplicable también fuera de @media print (vistas exportables) */
.break-inside-avoid{break-inside:avoid;page-break-inside:avoid}