:root{
  color-scheme:dark;
  --bg-page:#121216;
  --bg-card:#1c1c22;
  --bg-surface:#26262e;
  --bg-hover:#22222a;        /* hover de filas y botones — antes hardcoded en varios CSS */
  --bd-1:rgba(255,255,255,0.10);
  --bd-2:rgba(255,255,255,0.18);
  --tx-1:#ECECEC;
  --tx-2:#A0A0A8;
  --tx-3:#83838C;   /* A3 — antes #6E6E76, no llegaba a AA sobre bg-card */
  --danger:#E24B4A;
  --danger-tx:#F09595;
  --danger-bg:rgba(226,75,74,0.16);
  --blood:#FF3844;          /* rojo sangre — urgencia máxima (A3: antes #FF1E2D, contraste corto sobre dark) */
  --warning:#BA7517;
  --warning-tx:#EF9F27;
  --warning-bg:rgba(186,117,23,0.18);
  --success:#1D9E75;
  --success-tx:#5DCAA5;
  --success-bg:rgba(29,158,117,0.16);
  --info:#378ADD;
  --info-tx:#85B7EB;
  --info-bg:rgba(55,138,221,0.16);
  --chart-grid:rgba(255,255,255,0.08);   /* grid de Chart.js — leído desde JS */
  --scrim-bg:rgba(0,0,0,0.55);           /* backdrops de modal/drawer */
  --radius:8px;
  /* Ancho máximo unificado para todas las vistas — el contenido no salta al
     cambiar de pestaña. Alineado con la vista más amplia (comparar). */
  --page-max-width:1280px;
  --page-padding-x:32px;
}

/* ─── Light theme ─────────────────────────────────────────────────────────
   Mantiene identidad cromática (rojos, ámbar, verde, azul) pero con
   versiones ligeramente desaturadas/oscurecidas para contraste AA sobre
   fondo claro. Texto sobre coloreado mantenido legible.
*/
:root[data-theme="light"]{
  color-scheme:light;
  /* Jerarquía invertida respecto a dark: en light la página es ligeramente
     gris y las cards/filas blancas para parecer "elevadas". `bg-surface`
     queda como un gris más marcado para KPI cards e inputs (recessed). */
  --bg-page:#F2F3F6;
  --bg-card:#FFFFFF;
  --bg-surface:#E5E7EC;
  --bg-hover:#DCDFE5;
  --bd-1:rgba(0,0,0,0.10);
  --bd-2:rgba(0,0,0,0.18);
  --tx-1:#16161B;
  --tx-2:#4A4A55;
  --tx-3:#70707B;   /* A3 — antes #7A7A85, no llegaba a AA sobre blanco */
  --danger:#D43838;
  --danger-tx:#B02525;
  --danger-bg:rgba(212,56,56,0.10);
  --blood:#DC0010;
  --warning:#B16811;
  --warning-tx:#8A4F08;
  --warning-bg:rgba(177,104,17,0.12);
  --success:#158A60;
  --success-tx:#0E6B47;
  --success-bg:rgba(21,138,96,0.12);
  --info:#2675C3;
  --info-tx:#1B5A99;
  --info-bg:rgba(38,117,195,0.10);
  --chart-grid:rgba(0,0,0,0.08);
  --scrim-bg:rgba(20,20,28,0.40);
}

/* Inputs nativos (date, select, search) — el color-scheme de :root cascada,
   pero algunos CSS antiguos forzaban color-scheme:dark inline. Aquí lo
   neutralizamos para que en light se vean correctamente. */
:root[data-theme="light"] input,
:root[data-theme="light"] select,
:root[data-theme="light"] textarea{ color-scheme:light }