/*
 * CPQ — tokens.css · Fuente única de tokens de tema
 * Regla del proyecto: ningún color del portal se define fuera de este archivo.
 * Tema claro PREMIUM habilitado en el bloque [data-theme="light"].
 * Toda diferencia entre temas vive SOLO en este archivo.
 * Carga: @import desde cpq-shared.css (16 páginas del shell) + <link> directo
 * en login.html, recuperar-password.html y fuera-de-servicio.html (dark fijo).
 */
:root {
  --bg:#0d0f15; --surface:#171a24; --surface2:#1f2334; --surface-sunken:#13151c; --border:#2a3050;
  --chip-tint-soft:9%; --chip-bd-soft:22%; --chip-tint-strong:13%; --chip-bd-strong:30%;
  --chip-ink-mix:20%; /* entintado del TEXTO del chip de rol (.rol-chip) hacia --text: 20% en dark, 60% en light. Garantiza contraste AA del color de perfil (cpq_perfiles.color_hex) sobre el tinte del chip en ambos temas. Espejo conceptual de --nav-ink-mix. */
  --avatar-fill:38%; --avatar-ink:50%; /* avatar por perfil (.avatar / .sb-initials): relleno REFORZADO (más fuerte que el tinte del chip para que el disco de 32px lea claramente su color) + iniciales mezcladas hacia --text (AA verificado 4.5+ en los 8 perfiles). light sube ambos (55/65). */
  --filter-ink:15%; /* entintado del texto del filtro de bitácora tipificado (.filter-btn hover/activo) hacia --text. Valor ÚNICO: los colores del filtro son TOKENS de tema (ya calibrados por tema), así que 15% basta para AA en dark y light — sin él, 4 de 6 combinaciones caían bajo 4.5:1 (PND-062, medido 2026-07-20). NO se redefine en light. */
  --ptag-ink:15%; /* gemelo de --filter-ink para el TEXTO de los chips .ptag (tinte 15% vs 10% del filtro; por eso token propio, aunque hoy coincidan). Sin él, 8 de 14 chips caían bajo AA en light (peor: naranja 3.70) y el azul en dark (3.87); con 15% quedan light 4.59 / dark 4.66. Medido 2026-07-20. NO se redefine en light. */
  --nav-ink-mix:0%; /* entintado del color de producto en el nav (texto/borde del activo): 0% en dark = color puro; light lo sube para legibilidad de colores claros (caso amarillo, 2026-07-16). Se mezcla con --text (derivado canon), ver cpq.css .nav-l2.active[data-cat] */
  --accent:#4f7cff; --accent2:#19c9a4; --warn:#ffb547; --danger:#ff5f5f; --orange:#f5a64a; --lilac:#b8a3ff; --vencimiento:#ff1744;
  --nav-accent:var(--accent); /* acento del rail de navegación, unificado a azul en todo el portal (D4, 2026-07-08). Alias de --accent: auto-invierte entre temas, no se redefine en light */
  --emitida:#7a8cff; --emitida-text:#9aa8ff; --financiero:#a895d8; --financiero-text:#bfa9ee; --descartado:#9a5555;
  --shadow-color:#000; --scrim-color:#000;
  --scrim:color-mix(in srgb, var(--scrim-color) 70%, transparent); /* velo unificado de TODOS los modales (2026-07-03); ajustar por tema aquí, nunca en los CSS */
  --z-modal:1000; --z-modal-stack:1100; --z-toast:2000; --z-popover:9500; --z-top:10000; /* escala de apilado canónica (Tanda D-1, 2026-07-09): modal · confirmación sobre modal · toasts · popovers del footer · confirm supremo */
  --elev-1:0 1px 2px color-mix(in srgb, var(--shadow-color) 50%, transparent), 0 8px 20px -8px color-mix(in srgb, var(--shadow-color) 55%, transparent), inset 0 1px 0 color-mix(in srgb, var(--text) 6%, transparent);
  --elev-2:0 2px 4px color-mix(in srgb, var(--shadow-color) 50%, transparent), 0 18px 40px -14px color-mix(in srgb, var(--shadow-color) 65%, transparent), inset 0 1px 0 color-mix(in srgb, var(--text) 6%, transparent);
  --on-accent:#0f1117; --white:#fff;
  --text-soft:#c8cedf; --text-mid:#b0b8d0; --text-dim:#9aa3bc; --text-faint:#8e97b0; --disabled:#4a5070;
  --accent-hover:#6a91ff; --accent2-hover:#22d8b0; --warn-hover:#ffc96a; --danger-hover:#e04040;
  /* Tokens --cat-* retirados (acuerdo 2026-07-08): el color del nav es por PRODUCTO (Navegación → prod.color, viaja como --prod-c/--cat-c); las categorías usan el estándar azul */
  --text:#e8eaf0; --muted:#8b93b2; --tag-bg:#1e2540;
  --r:10px; --mono:'IBM Plex Mono',monospace; --sans:'IBM Plex Sans',sans-serif;
  /* Escala tipográfica — tamaños por rol. Theme-independent: NO se redefine en [data-theme="light"] (el tema nunca toca tamaños). Aprobada 2026-07-07, ver wiki/concepts/escala-tipografica-portal. */
  --fs-hero:30px; --fs-display:22px; --fs-section:18px; --fs-heading:16px; --fs-data:14px; --fs-body:13px; --fs-body-sm:12px; --fs-label:11px; --fs-chip:10px;
  --sidebar-w: 260px;
  --chart-grid:rgba(255,255,255,.05); /* rejilla de los charts del dashboard (COLORS.grid de cpq_dashboard) */
}

/* ═══ Tema claro PREMIUM — <html data-theme="light">.
   Misma identidad del dark, llevada a claro: neutros calmados, ámbar limpio,
   un solo acento pleno (azul = acción), y
   profundidad por sombra suave (--elev-*) en vez de borde duro. ═══ */
[data-theme="light"] {
  --bg:#dadfe9; --surface:#ffffff; --surface2:#eef1f7; --surface-sunken:#e2e6ee; --border:#c4cdda;
  --chip-tint-soft:17%; --chip-bd-soft:36%; --chip-tint-strong:23%; --chip-bd-strong:46%;
  --chip-ink-mix:60%; --avatar-fill:55%; --avatar-ink:65%; /* light sube el entintado: sobre fondo claro los colores de perfil necesitan más --text para AA (ver :root para el detalle). Verificado en maqueta 2026-07-19. */
  --nav-ink-mix:38%; /* colores claros de producto (amarillo) se entintan con --text para leerse sobre fondo claro (aprobado en maqueta 2026-07-16) */
  --accent:#2b57d9; --accent2:#0e7a5a; --warn:#b45309; --danger:#d23030; --orange:#c2570f; --lilac:#6e51d4; --vencimiento:#d50037;
  --emitida:#4152c9; --emitida-text:#3445b0; --financiero:#6d549e; --financiero-text:#5a4488; --descartado:#9a5555;
  --shadow-color:#202840; --scrim-color:#000;
  --scrim:color-mix(in srgb, var(--scrim-color) 50%, transparent); /* velo más suave en claro (Tanda D-1, 2026-07-09); dark conserva el 70% */
  --elev-1:0 1px 2px rgba(30,41,72,.09), 0 8px 22px -6px rgba(30,41,72,.18);
  --elev-2:0 2px 6px rgba(30,41,72,.12), 0 24px 46px -12px rgba(30,41,72,.30);
  --on-accent:#ffffff; --white:#fff;
  --text-soft:#2c3344; --text-mid:#3d4658; --text-dim:#5a6376; --text-faint:#727b8e; --disabled:#a6adbc;
  --accent-hover:#2348c0; --accent2-hover:#0a6147; --warn-hover:#92420a; --danger-hover:#b02020;
  --text:#161b26; --muted:#626878; --tag-bg:#edeff3;
  --chart-grid:rgba(28,34,51,.08);
}