/* Colores y medidas de Rentasel (claro y oscuro). Lo comparten todas las entradas de pwa/.
   El tema oscuro sale del sistema salvo que la persona elija uno en el botón (atributo data-theme).
   tests/contraste.test.mjs comprueba el contraste AA de estos colores y que los dos bloques oscuros coinciden. */
:root {
  --fondo: #f4f7fc;
  --superficie: #ffffff;
  --texto: #0e1a2e;
  --texto-2: #4a5568;
  --linea: #dde4ef;
  --azul: #1f56a8;
  --azul-hondo: #143a75;
  --azul-suave: #e6eefa;
  --foco: #1f56a8;
  --btn-texto: #ffffff;
  /* semáforo: azul = bien, ámbar = vigilar, naranja = actuar, gris = sin datos */
  --bien: #1f56a8;      --bien-suave: #e6eefa;    --bien-texto: #143a75;
  --vigilar: #b87a10;   --vigilar-suave: #fbf0d9; --vigilar-texto: #7a4b08;
  --actuar: #ef6a3a;    --actuar-suave: #fde9df;  --actuar-texto: #a63c16;
  --nodatos: #8a94a6;   --nodatos-suave: #eef1f5; --nodatos-texto: #4a5568;
  --ejemplo: #7a4b08;   --ejemplo-suave: #fbf0d9;
  /* series del gráfico de tendencias (paleta validada para daltonismo) */
  --serie-zona: #1f56a8; --serie-tu: #b0457a;
  --sombra: 0 1px 2px rgba(14,26,46,.05), 0 12px 28px -18px rgba(14,26,46,.35);
  --letra: "Geist", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --r-s: 10px;
  --r-m: 16px;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --fondo: #0b1424; --superficie: #131f35; --texto: #eef2f8; --texto-2: #a9b4c6; --linea: #26354f;
    --azul: #6f9ee0; --azul-hondo: #b9d0f2; --azul-suave: #1a2c4b; --foco: #8fb5ec; --btn-texto: #0b1424;
    --bien: #6f9ee0;    --bien-suave: #1a2c4b;    --bien-texto: #c4d8f5;
    --vigilar: #e0a845; --vigilar-suave: #3a2c12; --vigilar-texto: #f3d59a;
    --actuar: #f2875e;  --actuar-suave: #42221a;  --actuar-texto: #ffc4ad;
    --nodatos: #7d889b; --nodatos-suave: #222d40; --nodatos-texto: #c3cad6;
    --ejemplo: #f3d59a; --ejemplo-suave: #3a2c12;
    --serie-zona: #5b8bd6; --serie-tu: #d0669a;
    --sombra: 0 1px 2px rgba(0,0,0,.3), 0 12px 28px -18px rgba(0,0,0,.7);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --fondo: #0b1424; --superficie: #131f35; --texto: #eef2f8; --texto-2: #a9b4c6; --linea: #26354f;
  --azul: #6f9ee0; --azul-hondo: #b9d0f2; --azul-suave: #1a2c4b; --foco: #8fb5ec; --btn-texto: #0b1424;
  --bien: #6f9ee0;    --bien-suave: #1a2c4b;    --bien-texto: #c4d8f5;
  --vigilar: #e0a845; --vigilar-suave: #3a2c12; --vigilar-texto: #f3d59a;
  --actuar: #f2875e;  --actuar-suave: #42221a;  --actuar-texto: #ffc4ad;
  --nodatos: #7d889b; --nodatos-suave: #222d40; --nodatos-texto: #c3cad6;
  --ejemplo: #f3d59a; --ejemplo-suave: #3a2c12;
  --serie-zona: #5b8bd6; --serie-tu: #d0669a;
  --sombra: 0 1px 2px rgba(0,0,0,.3), 0 12px 28px -18px rgba(0,0,0,.7);
  color-scheme: dark;
}
