/* shared/css/tokens.css — los colores, las formas y las fuentes del sistema.
 *
 * DE DÓNDE SALEN: tablero de rediseño, opción "Campo serio" (pantalla
 * "B afinada — Campo serio"), aprobada el 24/10/2026. Los valores son esos,
 * tal cual. Un cambio de color del sistema se hace ACÁ, en un solo lugar.
 *
 * QUIÉN LO PUEDE ENLAZAR: SOLO las tres páginas de la oficina
 * (dashboard/index.html, dashboard/clientes.html, dashboard/login.html).
 * NINGÚN MÓDULO, todavía, y tampoco shared/css/contexto-tarea.css (que sí
 * cargan los módulos), ni por @import desde un archivo que carguen ellos.
 * Motivo: shared/js/pdf.js (pdfDeInforme, _estilosParaDocumentoPdf) arma el
 * documento del PDF copiando TODAS las hojas enlazadas de la página, salvo
 * que se le pase opciones.estilos. Iluminación no se lo pasa: una hoja
 * nueva enlazada desde un módulo cambia sus informes (HALLAZGOS.md #180).
 * Lo cuida tests/navegador/tokens-contenidos.js.
 *
 * LOS ESTADOS NUNCA SE DISTINGUEN SOLO POR EL COLOR. La palabra está
 * escrita siempre; el color y el TRATAMIENTO la acompañan:
 *   - una o dos palabras de estado → chip, con el tratamiento de su estado:
 *       en fecha / vigente   relleno suave   --hs-ok-bg + --hs-ok-ink
 *       próximo a vencer     contorno 1,5px  --hs-warn-line + --hs-warn-ink
 *                                            sobre --hs-surface
 *       vencido / anulado    relleno sólido  --hs-danger-bg + --hs-danger-ink
 *   - una frase ("Vencida: venció el …", un error de formulario) → texto en
 *     el color de su estado sobre blanco, sin relleno. Por eso
 *     --hs-danger-bg también se usa como COLOR DE TEXTO: es el rojo del
 *     sistema y no hay dos.
 *   - un aviso de ancho completo lleva su propio texto, así que puede ir con
 *     fondo tintado (--hs-warn-bg) sin ambigüedad. Un chip en línea dentro
 *     de una tabla, en cambio, va con contorno: un relleno ámbar se
 *     confundiría con la fila de al lado. Componentes distintos, misma regla.
 *
 * FUENTES: las del sistema, a propósito. La app tiene que verse igual sin
 * señal (hay cola de subida offline): una webfont que no baja es una
 * pantalla que cambia de aspecto en el campo. La mono es para fechas, kilos
 * y números de informe (alinea columnas sin bajar nada).
 *
 * Los contrastes de cada par de texto los mide
 * tests/navegador/contraste-tokens.js leyendo ESTE archivo; un token de
 * color nuevo tiene que entrar en un par o declararse decorativo ahí.
 */
:root {
  /* Superficies y texto */
  --hs-ground:        #F6F5F1;   /* fondo de página */
  --hs-surface:       #FFFFFF;   /* tarjetas, barra superior */
  --hs-ink:           #1C1B18;   /* texto */
  --hs-muted:         #63605A;   /* texto secundario */
  --hs-line:          #E2E0D9;   /* bordes y separadores */

  /* Acento */
  --hs-accent:        #0B5A4E;
  --hs-accent-hover:  #073F37;
  --hs-accent-ink:    #FFFFFF;   /* texto sobre acento */
  --hs-accent-bg:     #D2E4DF;   /* información y "seleccionado" (lejos de --hs-ok-bg a propósito) */

  /* Barra lateral (oscura) */
  --hs-side-bg:       #22211E;
  --hs-side-text:     #CBC8C0;
  --hs-side-muted:    #918D84;
  --hs-side-active:   #2E2D28;
  --hs-side-mark:     #3E9484;   /* la barrita del ítem activo y el foco */

  /* Estados (relleno suave / contorno / relleno sólido) */
  --hs-ok-bg:         #E8EFE8;
  --hs-ok-ink:        #14603A;
  --hs-warn-line:     #AC5F0C;   /* contorno 1.5px sobre blanco */
  --hs-warn-ink:      #85490A;
  --hs-warn-bg:       #FBF0E0;   /* solo avisos de ancho completo */
  --hs-danger-bg:     #9E241B;   /* relleno sólido; también el rojo de texto */
  --hs-danger-ink:    #FFFFFF;
  --hs-danger-line:   #EBC9C4;

  /* Velo y sombras: el box-shadow entero, no solo el color */
  --hs-velo:             rgba(28, 27, 24, 0.55);
  --hs-sombra-flotante:  4px 0 18px rgba(28, 27, 24, 0.22);
  --hs-sombra-modal:     0 10px 40px rgba(28, 27, 24, 0.25);

  /* Formas */
  --hs-radio-tarjeta: 8px;
  --hs-radio-control: 6px;
  --hs-alto-toque:    44px;

  /* Tipografía */
  --hs-fuente: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --hs-fuente-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
