/*
 * SIAB — Sistema de Identificación y Asistencia Biométrica.
 * © 2026 MindStorms.Lab — MindStorms Consultores S.A.S. de C.V.
 * Todos los derechos reservados. Tecnología y driver exclusivos de MindStorms.Lab.
 * Prohibida su reproducción, distribución o modificación sin autorización escrita.
 * SIAB-PROPIETARIO: aviso propietario; no retirar.
 */
/* ============================================================
   MDS Tokens · SIAB
   Única fuente de color y escala visual del producto.
   Ningún otro archivo de UI puede declarar valores de color.
   ============================================================ */
:root {
  color-scheme: light;

  /* ---------- Color · superficies ---------- */
  --mds-color-bg: #ffffff;
  --mds-color-bg-subtle: #f6f1ff;
  --mds-color-surface: rgba(255, 255, 255, 0.72);
  --mds-color-surface-strong: rgba(255, 255, 255, 0.9);
  --mds-color-surface-raised: #ffffff;
  --mds-color-surface-muted: rgba(255, 255, 255, 0.55);
  --mds-color-surface-translucent: rgba(255, 255, 255, 0.82);
  --mds-color-surface-hover: rgba(109, 40, 217, 0.08);
  --mds-color-surface-selected: rgba(109, 40, 217, 0.05);
  --mds-color-overlay: rgba(42, 23, 69, 0.42);

  /* ---------- Color · texto y bordes ---------- */
  --mds-color-text: #2a1745;
  --mds-color-text-muted: #6b5a8a;
  --mds-color-text-subtle: #7a689c;
  --mds-color-border: rgba(109, 40, 217, 0.14);
  --mds-color-border-strong: rgba(109, 40, 217, 0.3);
  --mds-color-field-border: rgba(109, 40, 217, 0.2);
  --mds-color-border-accent: rgba(139, 92, 246, 0.5);
  --mds-color-text-strong: #201a33;
  --mds-color-text-muted-strong: #6b647d;
  --mds-color-field-border-soft: #ddd6ea;
  --mds-color-accent-strong: #7c3aed;
  --mds-color-inverse-surface: #1b1530;
  --mds-color-on-inverse: #ffffff;
  --mds-color-inverse-border: rgba(255, 255, 255, 0.16);
  --mds-color-inverse-control: rgba(255, 255, 255, 0.13);
  --mds-color-inverse-warning: #fbbf24;
  --mds-color-overlay-strong: rgba(10, 6, 24, 0.55);
  --mds-color-focus: #6d28d9;

  /* ---------- Color · marca ---------- */
  --mds-color-accent: #6d28d9;
  --mds-color-accent-bright: #a855f7;
  --mds-color-accent-soft: rgba(124, 58, 237, 0.1);
  --mds-color-on-accent: #ffffff;
  --mds-color-brand-mark: rgba(124, 58, 237, 0.1);
  /* Matices cálidos del modo luz de pantalla y superficies de login. */
  --mds-color-warm-light: #fff8e7;
  --mds-color-warm-surface: #fffdfb;
  --mds-color-lilac-surface: #fbf7ff;
  --mds-color-lilac-border: #e9e2f2;
  --mds-color-ink: #1f2937;
  --mds-color-ink-strong: #111827;
  --mds-color-accent-deep: #5b21b6;
  --mds-color-text-muted-lilac: #8b7aa8;
  --mds-color-track: rgba(109, 40, 217, 0.16);

  /* ---------- Color · estados ---------- */
  --mds-color-success: #047857;
  --mds-color-success-soft: rgba(4, 120, 87, 0.1);
  --mds-color-success-border: rgba(4, 120, 87, 0.3);
  --mds-color-success-text: #065f46;
  --mds-color-warning: #b45309;
  --mds-color-warning-soft: rgba(180, 83, 9, 0.1);
  --mds-color-warning-border: rgba(180, 83, 9, 0.3);
  --mds-color-warning-text: #92400e;
  --mds-color-danger: #be123c;
  --mds-color-danger-soft: rgba(190, 18, 60, 0.08);
  --mds-color-danger-border: rgba(190, 18, 60, 0.28);
  --mds-color-danger-text: #9f1239;
  --mds-color-info: #2563eb;
  --mds-color-info-soft: rgba(37, 99, 235, 0.1);
  --mds-color-info-border: rgba(37, 99, 235, 0.3);
  --mds-color-info-text: #1e40af;

  /* ---------- Color · capas compuestas ---------- */
  --mds-gradient-card: linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.7));
  --mds-gradient-modal: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 244, 255, 0.98));
  --mds-color-topbar: rgba(255, 255, 255, 0.72);
  --mds-color-footer: rgba(255, 255, 255, 0.62);
  --mds-color-toast: rgba(255, 255, 255, 0.95);
  --mds-color-tabs: rgba(255, 255, 255, 0.55);
  --mds-color-button: rgba(255, 255, 255, 0.7);
  --mds-color-table-head: rgba(243, 238, 255, 0.88);
  --mds-color-list: rgba(255, 255, 255, 0.55);
  --mds-color-pill: rgba(109, 40, 217, 0.08);

  /* ---------- Tipografía ---------- */
  --mds-font-family-base: "Segoe UI", "Inter", system-ui, -apple-system, sans-serif;
  --mds-font-family-mono: ui-monospace, "Cascadia Code", "SFMono-Regular", Consolas, monospace;
  --mds-font-size-xs: 0.75rem;
  --mds-font-size-sm: 0.875rem;
  --mds-font-size-md: 1rem;
  --mds-font-size-lg: 1.125rem;
  --mds-font-size-xl: 1.35rem;
  --mds-font-size-2xl: 1.75rem;
  --mds-font-weight-regular: 400;
  --mds-font-weight-medium: 600;
  --mds-font-weight-bold: 700;
  --mds-line-height-tight: 1.2;
  --mds-line-height-normal: 1.5;

  /* ---------- Espacio ---------- */
  --mds-space-0: 0;
  --mds-space-1: 0.25rem;
  --mds-space-2: 0.5rem;
  --mds-space-3: 0.75rem;
  --mds-space-4: 1rem;
  --mds-space-5: 1.25rem;
  --mds-space-6: 1.5rem;
  --mds-space-8: 2rem;
  --mds-space-10: 2.5rem;
  --mds-space-12: 3rem;

  /* ---------- Radio ---------- */
  --mds-radius-xs: 6px;
  --mds-radius-sm: 10px;
  --mds-radius-md: 12px;
  --mds-radius-lg: 18px;
  --mds-radius-xl: 24px;
  --mds-radius-pill: 999px;

  /* ---------- Sombra ---------- */
  --mds-shadow-sm: 0 2px 8px rgba(76, 29, 149, 0.08);
  --mds-shadow-md: 0 12px 30px rgba(76, 29, 149, 0.14);
  --mds-shadow-lg: 0 24px 60px rgba(76, 29, 149, 0.16);
  --mds-shadow-overlay: 0 18px 45px rgba(76, 29, 149, 0.22);
  --mds-shadow-control: 0 8px 28px rgba(20, 10, 50, 0.18);
  --mds-shadow-bar: 0 8px 28px rgba(0, 0, 0, 0.3);
  --mds-shadow-modal-strong: 0 24px 80px rgba(0, 0, 0, 0.35);

  /* ---------- Gráficas ---------- */
  --mds-chart-violet: #8b5cf6;
  --mds-chart-teal: #2dd4bf;
  --mds-chart-amber: #fbbf24;
  --mds-chart-red: #fb7185;
  --mds-chart-blue: #60a5fa;
  --mds-chart-slate: #94a3b8;
  --mds-chart-grid: rgba(148, 163, 184, 0.14);
  --mds-chart-text: #cbd5e1;
  --mds-chart-tooltip-bg: #111827;
  --mds-chart-tooltip-border: #334155;
  --mds-chart-tooltip-text: #e2e8f0;
  --mds-chart-export-bg: #0b1424;

  /* ---------- Z-index ---------- */
  --mds-z-base: 1;
  --mds-z-sticky: 40;
  --mds-z-overlay: 1000;
  --mds-z-modal: 5000;
  --mds-z-toast: 6000;

  /* ---------- Movimiento ---------- */
  --mds-motion-fast: 120ms;
  --mds-motion-normal: 200ms;
  --mds-motion-ease: cubic-bezier(0.2, 0, 0, 1);
}

/* ---------- Modos de tema (fuente única de tokens) ---------- */
html[data-theme="nexo"] {
  color-scheme: dark;
  --overlay-bg: var(--panel);
  --overlay-bg-strong: var(--panel);
  --overlay-blur: blur(18px) saturate(1.2);
  --overlay-shadow: 0 18px 45px rgba(0, 0, 0, 0.55);
  --field-bg: rgba(12, 7, 24, 0.78);
  --field-border: rgba(196, 181, 253, 0.2);
  --list-bg: rgba(24, 13, 44, 0.6);
  --table-head: rgba(10, 6, 22, 0.8);
  --bg: #0a0616;
  --bg-soft: #120a24;
  --panel: #160e2a;
  --panel-2: #1e1238;
  --line: rgba(196, 181, 253, 0.16);
  --line-strong: rgba(196, 181, 253, 0.32);
  --text: #f5f3ff;
  --muted: #c4b5fd;
  --muted-2: #a78bfa;
  --accent: #c084fc;
  --accent-2: #f472b6;
  --accent-soft: rgba(192, 132, 252, 0.14);
  --ok: #4ade80;
  --warn: #fbbf24;
  --danger: #fb7185;
  --on-accent: #ffffff;
  --ok-text: #b9ffe2;
  --ok-bg: rgba(61, 220, 151, 0.12);
  --ok-border: rgba(61, 220, 151, 0.32);
  --warn-text: #ffe2ae;
  --warn-bg: rgba(255, 191, 95, 0.12);
  --warn-border: rgba(255, 191, 95, 0.32);
  --danger-text: #ffc7d1;
  --danger-bg: rgba(255, 107, 129, 0.12);
  --danger-border: rgba(255, 107, 129, 0.3);
  --card-bg: linear-gradient(180deg, rgba(32, 18, 62, 0.94), rgba(14, 8, 28, 0.96));
  --card-flat-bg: rgba(28, 16, 52, 0.72);
  --modal-bg: linear-gradient(180deg, rgba(32, 18, 62, 0.98), rgba(14, 8, 28, 0.98));
  --topbar-bg: rgba(10, 6, 22, 0.84);
  --footer-bg: linear-gradient(90deg, rgba(91, 33, 182, 0.42), rgba(10, 6, 22, 0.78));
  --toast-bg: rgba(24, 13, 44, 0.97);
  --tabs-bg: rgba(12, 7, 24, 0.6);
  --btn-bg: rgba(168, 85, 247, 0.09);
  --hover-bg: rgba(168, 85, 247, 0.12);
  --row-hover: rgba(168, 85, 247, 0.08);
  --pill-bg: rgba(168, 85, 247, 0.12);
  --brand-mark-bg: rgba(168, 85, 247, 0.16);
  --track: rgba(196, 181, 253, 0.2);
  --backdrop: rgba(3, 7, 14, 0.72);
  --shadow: 0 24px 60px rgba(76, 29, 149, 0.45);
}

html[data-theme="jam"] {
  color-scheme: light;
  --overlay-bg: var(--panel);
  --overlay-bg-strong: var(--panel);
  --overlay-blur: blur(18px) saturate(1.2);
  --overlay-shadow: 0 18px 45px rgba(190, 18, 60, 0.18);
  --field-bg: #fffaf7;
  --field-border: #fecdd3;
  --list-bg: #fff7f3;
  --table-head: #ffe4e6;
  --bg: #fff8f0;
  --bg-soft: #fff1e6;
  --panel: #ffffff;
  --panel-2: #fff3e9;
  --line: rgba(190, 18, 60, 0.14);
  --line-strong: rgba(190, 18, 60, 0.28);
  --text: #3b0a1e;
  --muted: #7c2d4a;
  --muted-2: #9f5b72;
  --accent: #be123c;
  --accent-2: #7c3aed;
  --accent-soft: rgba(190, 18, 60, 0.08);
  --ok: #15803d;
  --warn: #b45309;
  --danger: #dc2626;
  --on-accent: #ffffff;
  --ok-text: #166534;
  --ok-bg: #dcfce7;
  --ok-border: #86efac;
  --warn-text: #92400e;
  --warn-bg: #fef3c7;
  --warn-border: #fcd34d;
  --danger-text: #9f1239;
  --danger-bg: #ffe4e6;
  --danger-border: #fda4af;
  --card-bg: #ffffff;
  --card-flat-bg: #fff7f3;
  --modal-bg: #ffffff;
  --topbar-bg: rgba(255, 248, 240, 0.92);
  --footer-bg: #3b0a1e;
  --toast-bg: #ffffff;
  --tabs-bg: #fff7f3;
  --btn-bg: #ffffff;
  --hover-bg: #ffe4e6;
  --row-hover: #ffe4e6;
  --pill-bg: #ffe4e6;
  --brand-mark-bg: #3b0a1e;
  --track: rgba(190, 18, 60, 0.18);
  --backdrop: rgba(59, 10, 30, 0.45);
  --shadow: 0 20px 50px rgba(190, 18, 60, 0.14);
}