/* ═══════════════════════════════════════════════════════════════════
   Cuarenta 40 · Tokens del sistema de diseño (variables CSS). Índigo oscuro.
   ═══════════════════════════════════════════════════════════════════ */

/* ── Tokens ───────────────────────────────────────────────────────────────── */
:root {
  /* Superficies — índigo profundo con tinte azul-violeta (no negro) */
  --ink-900:        #0e1124;   /* fondo base de la app */
  --ink-850:        #12162e;   /* fondo del área de contenido */
  --ink-800:        #161a35;   /* superficie de cards */
  --ink-750:        #1b2040;   /* card hover / cabeceras de tabla */
  --ink-700:        #232a4d;   /* inputs, elementos elevados */
  --ink-650:        #2c345c;   /* bordes elevados, hover de filas */

  /* Acento primario — índigo vibrante (acciones, foco, links activos) */
  --indigo-600:     #4f46e5;
  --indigo-500:     #6366f1;
  --indigo-400:     #818cf8;
  --indigo-300:     #a5b4fc;
  --indigo-glow:    rgba(99, 102, 241, 0.22);
  --indigo-soft:    rgba(99, 102, 241, 0.12);

  /* Dorado — EXCLUSIVO de marca y premio (no es color de acción) */
  --gold:           #fbbf24;
  --gold-soft:      rgba(251, 191, 36, 0.14);

  /* Texto */
  --text:           #e7eaf6;   /* principal */
  --text-dim:       #aab1d4;   /* secundario */
  --text-muted:     #7882ad;   /* terciario / metadatos */
  --text-faint:     #4d5680;   /* deshabilitado, placeholders */

  /* Estados semánticos (tonos que viven bien sobre índigo) */
  --green:          #34d399;
  --green-soft:     rgba(52, 211, 153, 0.14);
  --amber:          #fbbf24;
  --amber-soft:     rgba(251, 191, 36, 0.14);
  --rose:           #fb7185;
  --rose-soft:      rgba(251, 113, 133, 0.14);
  --violet:         #a78bfa;
  --violet-soft:    rgba(167, 139, 250, 0.16);

  /* Líneas */
  --border:         rgba(129, 140, 248, 0.14);
  --border-strong:  rgba(129, 140, 248, 0.24);

  /* Tipografía */
  --font-body:      'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --font-display:   'Space Grotesk', var(--font-body);

  /* Radios */
  --r-sm: 8px;
  --r:    12px;
  --r-lg: 18px;
  --r-xl: 24px;

  /* Sombras (frías, con tinte índigo) */
  --shadow-sm:   0 1px 3px rgba(5, 7, 20, 0.4);
  --shadow:      0 8px 28px rgba(5, 7, 20, 0.45);
  --shadow-lg:   0 20px 50px rgba(5, 7, 20, 0.55);
  --shadow-glow: 0 0 0 1px var(--indigo-glow), 0 10px 30px rgba(79, 70, 229, 0.18);

  --sidebar-w: 256px;
}