/* ============================================================
   lessawork — design tokens (modo claro) · v1.1.0
   Concepto: Acero y ladrillo.
   Base: brand/tokens.css v1.0 (2026-10-17) con el parche de
   auditoria/parche-tokens.css YA FUSIONADO y el bloque
   automático de tema oscuro del SO ELIMINADO (hallazgo H1):
   traía 6 pares sin verificar que fallaban 4.5:1 y se activaba
   solo, en cualquier equipo con tema oscuro del SO.
   El producto es claro-primero (brand book §8). Si algún día
   existe tema oscuro, se diseña con ratios verificados y se
   activa OPT-IN por clase (.lw-theme-dark), nunca por media query.
   Uso: @import o pegar en :root. Listo para el perfil dev.
   ============================================================ */
:root {
  /* ---- Primario (acero): acciones, enlaces, foco ---- */
  --lw-primary-50:  #EEF4FA;
  --lw-primary-100: #D9E6F4;
  --lw-primary-200: #B3CDE8;
  --lw-primary-300: #86AFD8;
  --lw-primary-400: #5B90C6;
  --lw-primary-500: #3B73AF;
  --lw-primary-600: #2D5E94;  /* principal */
  --lw-primary-700: #254C77;
  --lw-primary-800: #1D3A5B;
  --lw-primary-900: #14293F;

  /* ---- Acento (ladrillo): identidad, hitos, KPIs ---- */
  --lw-accent:        #B64A1A;
  --lw-accent-strong: #8F3A15;
  --lw-accent-soft:   #FBE9DF;

  /* ---- Acento sobre acero (v1.1): SOLO donde el acento va
         encima del azul (icono de app, badges en cabecera).
         El ladrillo de marca no cambia: sigue siendo --lw-accent. ---- */
  --lw-accent-on-steel: #E08A57;

  /* ---- Superficies ---- */
  --lw-bg:        #F7F5F2;   /* fondo de app */
  --lw-surface:   #FFFFFF;   /* tarjeta */
  --lw-surface-alt: #F1EEE8; /* fila alterna de tabla */

  /* ---- Texto ---- */
  --lw-text:          #201D19;  /* 16.78:1 sobre surface */
  --lw-text-secondary:#56524C;  /* 7.76:1 sobre surface */
  --lw-text-disabled: #A09B93;  /* exento (inactivo) */
  --lw-text-on-primary:#FFFFFF; /* 6.69:1 sobre primary-600 */
  --lw-text-on-accent: #FFFFFF; /* 5.27:1 sobre accent */

  /* ---- Bordes ---- */
  --lw-border:  #76726B;  /* controles interactivos, 4.78:1 sobre surface */
  --lw-divider: #E5E1DA;  /* separadores decorativos (no interactivo) */

  /* ---- Semánticos (siempre con icono + etiqueta) ---- */
  --lw-success:      #1F7A43;
  --lw-success-soft: #E6F4EC;
  --lw-warning:      #946200;
  --lw-warning-soft: #FBF0D6;
  --lw-error:        #B42318;
  --lw-error-soft:   #FDECEA;
  --lw-info:         #2D5E94;  /* ES el primario-600, a propósito: no duplicar */
  --lw-info-soft:    #EAF1F8;

  /* ---- Serie de datos (deuteranopía-safe; SOLO sobre blanco) ---- */
  --lw-data-blue:   #1F5C99;
  --lw-data-azure:  #4A90C9;
  --lw-data-green:  #4C9E5A;
  --lw-data-red:    #8C1F1A;
  --lw-data-amber:  #B87614;
  --lw-data-slate:  #6E6A64;

  /* ---- Estados del primario y del acento (v1.1, fusión del parche) ----
         Regla cerrada: hover MÁS OSCURO que reposo (600 → 700 → 800).
         En obra, a pleno sol, un oscurecimiento se percibe mejor que
         un aclarado; el one-pager que decía "500 hover" está corregido. */
  --lw-primary-hover:  #254C77;  /* blanco sobre él: 8.83:1 */
  --lw-primary-active: #1D3A5B;  /* blanco sobre él: 11.61:1 */
  --lw-accent-hover:   #8F3A15;  /* blanco sobre él: 7.54:1 (= accent-strong) */

  /* ---- Interacción de tabla, foco y capas (v1.1, fusión del parche) ---- */
  --lw-focus:         #2D5E94;  /* outline/foco: 6.69:1 blanco, 6.15:1 bg, 5.78:1 alterna */
  --lw-row-hover:     #EAE7E0;  /* fila al pasar el mouse: texto 13.59:1, enlace 5.42:1 */
  --lw-row-selected:  #D9E6F4;  /* fila seleccionada (= primary-100): texto 13.25:1, enlace 5.28:1 */
  --lw-row-selected-border: #2D5E94; /* borde izquierdo de selección: 5.28:1 */
  --lw-overlay:       rgba(32,29,25,0.55); /* velo para modales (sin texto directo encima) */
  --lw-tooltip-bg:    #201D19;
  --lw-tooltip-text:  #FFFFFF;  /* 16.78:1 */
  --lw-disabled-bg:   #F1EEE8;  /* botón deshabilitado; texto = --lw-text-disabled (exento WCAG 1.4.3) */
}

/* Nota de coherencia: el semántico "info" (#2D5E94) ES el primario-600,
   a propósito: un banner de información usa el azul de marca. Documentado
   aquí para que nadie lo "corrija" duplicando tokens. */

/* Tema oscuro: NO EXISTE (claro primero). Si algún día se diseña,
   va aquí, con ratios verificados, activado OPT-IN por clase —
   nunca de forma automática por el sistema: */
.lw-theme-dark {
  /* VACÍO por decisión de marca: claro primero. No llenar sin verificar. */
}
