/* src/ui/estilos/tokens.css
 *
 * Sistema de tokens de diseño, portado de app-referencia.html (IA Law Digital Lawyers,
 * ver docs/ANALISIS_APP_REFERENCIA.md). Los valores de :root de las líneas 27-88 de esa
 * app se copian aquí verbatim; se añaden tokens nuevos para los ~40% de colores que en
 * la referencia estaban hardcodeados fuera del sistema de variables (documentado en el
 * análisis como una debilidad a corregir, no a repetir).
 *
 * Los semáforos y niveles de riesgo YA EXISTENTES de este proyecto (--color-critico,
 * --color-riesgo-alto, etc., usados por src/engine/*.js vía NOMBRE_SEMAFORO /
 * NOMBRE_NIVEL_RIESGO y por las clases .badge.* de componentes.css) se remapean sobre
 * la paleta de la referencia en vez de mantener dos paletas en paralelo.
 */
:root {
  /* ---- Paleta de marca (verbatim de app-referencia.html, líneas 29-38) ---- */
  --color-primary: #011ef4;        /* Electric Blue */
  --color-primary-light: #5c70fe;
  --color-primary-dark: #0016b5;
  --color-accent: #fbbb02;         /* Yellow */
  --color-accent-dark: #d69f02;
  --color-input-bg: #f7fafb;
  --color-input-border: #c8d6db;

  /* ---- Superficies y texto (verbatim, líneas 54-61) ---- */
  --color-bg: #ffffff;
  --color-bg-secondary: #ece7e2;   /* Warm Beige — fondo de tarjetas */
  --color-card: #ffffff;
  --color-text: #2a2a2a;
  --color-text-light: #787878;
  --color-border: #e0e0e0;

  /* ---- Semáforo de nivel (Alto/Medio/Bajo), verbatim líneas 39-46 ---- */
  --color-alto: #e74c3c;    --color-alto-bg: #fdedec;
  --color-medio: #f39c12;   --color-medio-bg: #fef5e7;
  --color-bajo: #27ae60;    --color-bajo-bg: #eafaf1;

  /* ---- Resultados sí/no/pendiente, verbatim líneas 47-52 ---- */
  --color-result-yes: #c6e0b4;       --color-result-yes-border: #7cb342;
  --color-result-no: #f8cbad;        --color-result-no-border: #e67c49;
  --color-result-pending: #fce4d6;   --color-result-pending-border: #d4a373;
  --color-warning-bg: #fff3cd;       --color-warning-border: #ffeaa7;

  /* ---- Colores frecuentes centralizados, verbatim líneas 71-80 ---- */
  --color-micro: #2980b9;
  --color-success: #2ecc71;
  --color-danger: #ff4d4d;
  --color-info: #2980b9;
  --color-muted: #95a5a6;
  --color-expired: #888888;
  --color-table-header-bg: #f8fafc;
  --color-aggravating-bg: #fff5f5;
  --color-mitigating-bg: #f0fff4;

  /* ---- Tokens nuevos: colores que en la referencia estaban hardcodeados ---- */
  --color-selected-bg: rgba(1, 30, 244, 0.06);   /* estado seleccionado — reemplaza el #E6F6F9 residual */
  --color-header-fill: #edf2f4;                  /* fondo de encabezados de acordeón */
  --color-header-fill-hover: #dee6ea;
  --color-divider: #f0f2f5;                      /* separador fino entre items */
  --color-track: #e0e4e8;                        /* riel de barras de progreso */
  --color-pill-idle: #f4f4f4;                    /* píldora de tab-nav inactiva */
  --color-pill-idle-hover: #e0e0e0;
  --color-toggle-off: #cbd5e0;
  --color-placeholder: #b0b8c1;
  --color-panel-subtle: #f8f9fa;
  --color-wa-green: rgb(45, 183, 66);       /* verde del widget de contacto (app-referencia.html ~L6217) */
  --color-wa-green-dark: rgb(30, 150, 50);
  --color-disclaimer-text: #7d6608;         /* copy de .disclaimer-screen-box, verbatim de la referencia */
  --color-disclaimer-title: #6b5900;
  --easing-spring: cubic-bezier(0.175, 0.885, 0.32, 1.275);  /* curva de .landing-card de la referencia */

  /* ---- Tipografía ---- */
  --font-primary: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

  /* ---- Sombras, verbatim líneas 64-67 ---- */
  --shadow-sm: 0 4px 6px rgba(0, 0, 0, 0.05);
  --shadow-md: 0 10px 25px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 20px 40px rgba(0, 0, 0, 0.12);

  /* ---- Radios, verbatim líneas 68-72 ---- */
  --radius-sm: 8px;
  --radius-md: 15px;
  --radius-lg: 30px;
  --radius-bubble: 60px;   /* forma insignia de la referencia: header/footer/landing-card */

  /* ---- Escala z-index formal, verbatim líneas 83-87 ---- */
  --z-dropdown: 10;
  --z-sticky: 100;
  --z-modal: 1000;
  --z-tooltip: 5000;
  --z-widget: 99999;

  /* ---- Espaciado (nuevo — la referencia usaba rem sueltos; se documenta la escala real) ---- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;

  /* ==================================================================
   * Semáforo de cumplimiento y niveles de riesgo del proyecto,
   * remapeados sobre la paleta de marca de arriba (no una paleta aparte).
   * ================================================================== */
  --color-critico: var(--color-alto);           --color-critico-bg: var(--color-alto-bg);
  --color-en-proceso: var(--color-medio);       --color-en-proceso-bg: var(--color-medio-bg);
  --color-conforme: var(--color-bajo);          --color-conforme-bg: var(--color-bajo-bg);
  --color-sin-evaluar: var(--color-muted);      --color-sin-evaluar-bg: var(--color-divider);

  --color-uso-indebido: var(--color-danger);        --color-uso-indebido-bg: #ffe8e8;
  --color-riesgo-alto: var(--color-medio);          --color-riesgo-alto-bg: var(--color-medio-bg);
  --color-riesgo-aceptable: var(--color-bajo);      --color-riesgo-aceptable-bg: var(--color-bajo-bg);
}