/* ============================================================
   LA APP DEL GUARDIA, EN ORVIK
   16 de octubre de 2026


   Tiene razón y por eso esto es UN PUENTE, no una app nueva. La app
   existe, funciona y tiene lo caro resuelto: biometría facial, GPS,
   cámara, base local y sincronización sin red. Lo que no tiene es la
   marca correcta.

   CÓMO FUNCIONA, Y ES LO MISMO QUE SE HIZO EN EL PANEL
   La app pinta con sus propias variables --`--lyk-yellow`, `--lyk-navy`--
   y aquí se redefinen. Son 20 usos del amarillo y 11 del navy: 31
   reglas cambian de color sin tocar ni una de las 21 vistas.

   LA REGLA DE LA BANDA, de la mesa «App Orvik · Guardia»:
   «la banda de marca es la única zona que cambia con la empresa». Por
   eso el navy pasa a ser la BANDA de la empresa y el amarillo su
   ACENTO: los dos entran por la tabla `marcas`, como en la consola.

   LO QUE ESTO NO ARREGLA, Y HAY QUE SABERLO
   Quedan 86 colores escritos a mano dentro del `<style>` de
   `index.html` que ninguna variable alcanza. Se cambian uno por uno, y
   es trabajo aparte.
   ============================================================ */

:root {
  /* Los dos canales de la empresa. Sin empresa, Orvik. */
  --lyk-navy:        var(--marca-banda, #070F1E);
  --lyk-navy-light:  var(--marca-banda-2, #0E1A2E);
  --lyk-yellow:      var(--marca-principal, #4ECDC4);
  /* El respaldo era #0B7C75 y NO PASABA: medido, 2.61:1 contra el
     acento #4ECDC4, cuando el minimo para texto grande es 3:1. Se usa
     justo en la pantalla de bienvenida, antes de que entre la marca.

     #062A27 es el `color_contraste` REAL de Orvik en la tabla
     `marcas`: 7.93:1. Ya no es un valor inventado para el respaldo,
     es el mismo que usaria la marca si estuviera cargada. */
  --lyk-yellow-dark: var(--marca-principal-texto, #062A27);

  /* El fondo de la app es claro: se usa a pleno sol, en la calle.
     Se deja el que ya tenía, que es correcto. */
  --lyk-text-primary: #070F1E;
}

/* El pánico NO toma el color de la marca. Es la regla del lienzo y aquí
   se blinda, porque la app lo pinta con su propia variable y una
   empresa con acento rojo lo volvería invisible. */
.s-panico, .v-panico, [data-panico] {
  background: #DC2626 !important;
  color: #FFFFFF !important;
}