/* La paleta de la UJCE, compartida: la Plataforma de Vanguardia y las apps de la
   organización (img.ujce.es la enlaza desde https://vanguardia.ujce.es/static/asistencia/marca.css).
   La ruta no cambia: no hay hash en el nombre (config/settings.py, STORAGES).

   Claro y oscuro con `light-dark()`: cada color dice sus dos versiones en la misma línea
   y quien elige entre ellas es `color-scheme`. Cada variable va dos veces a propósito: la
   primera es el valor claro a secas, para el navegador que no entienda `light-dark()`; la
   segunda la pisa donde sí se entiende.

   El rojo se aclara sobre negro: el #db0625 de la marca vibra y cansa de leer. El resto
   son los mismos papeles y tintas dados la vuelta, no colores nuevos: el verde sigue
   queriendo decir «hecho» y el rojo «ojo» en los dos temas. */
:root {
  /* Declarar el tema es obligatorio. Sin esto, Chrome y Android le dan la vuelta a la
     web ellos solos con su modo oscuro automático y sale una cosa a medias. */
  color-scheme: light dark;
  --letra: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --rojo:#db0625;        --rojo:light-dark(#db0625, #ff4a5e);
  --rojo-hondo:#a4041b;  --rojo-hondo:light-dark(#a4041b, #c2001b);
  --tinta:#1a1a1a;       --tinta:light-dark(#1a1a1a, #ececec);
  --gris:#6b6b6b;        --gris:light-dark(#6b6b6b, #a0a0a0);
  --linea:#e0e0e0;       --linea:light-dark(#e0e0e0, #3a3a3a);
  --verde:#2e7d32;       --verde:light-dark(#2e7d32, #7bc47f);
  --ambar:#b26a00;       --ambar:light-dark(#b26a00, #e0a33a);
  --fondo:#fafafa;       --fondo:light-dark(#fafafa, #151515);
  --papel:#fff;          --papel:light-dark(#fff, #1f1f1f);
  --suave:#f2f2f2;       --suave:light-dark(#f2f2f2, #2a2a2a);
  --error:#b71c1c;       --error:light-dark(#b71c1c, #ff8a80);
  --avisofondo:#fff3f3;  --avisofondo:light-dark(#fff3f3, #2a1b1d);
  --okfondo:#f1f8f1;     --okfondo:light-dark(#f1f8f1, #1b2a1d);
  --ambarfondo:#fff8e8;  --ambarfondo:light-dark(#fff8e8, #2b2415);
  --etiqueta:#eceff1;    --etiqueta:light-dark(#eceff1, #2f3438);
  /* La cabecera y la portada se quedan con el rojo de la marca, más apagado de noche:
     son la marca y no un fondo cualquiera, y con el rojo aclarado se volverían rosas. */
  --marca:#db0625;       --marca:light-dark(#db0625, #a4041b);
  --portada:#db0625;     --portada:light-dark(#db0625, #8d0219);
  --portada-alto:#f0102f;--portada-alto:light-dark(#f0102f, #ab0620);
  --portada-hondo:#a4041b;--portada-hondo:light-dark(#a4041b, #660112);
}
/* El interruptor de tema: sin decir nada, el del aparato. Quien elige, manda
   (<html data-tema="claro|oscuro">). */
:root[data-tema=claro]  { color-scheme: only light; }
:root[data-tema=oscuro] { color-scheme: only dark; }
