/* ============================================================
   tokens.css — Los tokens de diseño de TODO el producto
   ControlHorario.digital

   FUENTE ÚNICA de color, tipografía y retícula. La cargan las dos mitades:

     · La web pública, antes de sistema.css
     · La aplicación (paneles de empresa y admin), antes de panel.css

   Estaban solo en sistema.css, que la app no carga, así que la app tenía su
   propia paleta parecida-pero-no-igual: otro gris de fondo, otro azul, otros
   radios. De un lado a otro se notaba el salto. Con esto, cambiar un color de
   marca es tocar un archivo y que cambie en el producto entero.

   Este archivo SOLO declara variables. Ni una regla que pinte nada: así se
   puede cargar en cualquier página sin miedo a que pise a Bootstrap.
   ============================================================ */

:root {
  /* Superficies */
  --paper:        #edeee9;   /* crudo cálido: domina las secciones informativas */
  --paper-alt:    #f6f6f3;
  --paper-deep:   #e3e5de;

  /* Tinta */
  --ink:          #101518;   /* titulares */
  --ink-soft:     #455a64;   /* marca: texto de interfaz y botones */
  --ink-muted:    rgb(16 21 24 / 68%);
  --line:         rgb(16 21 24 / 22%);
  --line-strong:  rgb(16 21 24 / 62%);

  /* Marca */
  --mint:         #bcdecd;   /* fondo de marca: sección de respiro */
  --accent:       #e3dc6d;   /* auxiliar de marca: bloque intenso y marcas */
  --action:       #047857;   /* verde de conversión ya existente: no se toca */
  --action-dark:  #036249;
  --focus:        #0e7c86;   /* señal breve de foco, nunca segundo tema */

  /* Tipografía */
  --font-display: "Archivo", "Arial Black", system-ui, sans-serif;
  --font-body:    "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono:    "IBM Plex Mono", ui-monospace, SFMono-Regular, Consolas, monospace;

  --text-display:  clamp(2.1rem, 5.6vw, 4.3rem);   /* bajado a peticion: el brief pedia mas, pero ocupaba media pantalla */
  --text-section:  clamp(2.1rem, 5.4vw, 4rem);
  --text-lead:     clamp(1.05rem, 1.5vw, 1.3rem);
  --text-body:     clamp(1rem, 1.1vw, 1.0625rem);
  --text-micro:    clamp(0.6875rem, 0.85vw, 0.78rem);

  /* Retícula */
  --max:          1440px;
  --gutter:       clamp(16px, 2.2vw, 32px);

  /* Movimiento */
  --ease:         cubic-bezier(.22, 1, .36, 1);
  --dur:          .55s;

  /* Alias heredados: el marcado antiguo aun usa --ch-brand y --ch-accent en
     estilos en linea. Se mapean a los tokens nuevos para no dejar colores
     sueltos fuera del sistema. */
  --ch-brand:  var(--ink-soft);
  --ch-accent: var(--mint);
  --brand:     var(--ink-soft);
  --accent-legacy: var(--mint);
}