/* =============================================================================
 * RIZOMA MAUX · Tokens de diseño (variables)
 * -----------------------------------------------------------------------------
 * Cambiar aquí los colores, tipografías, radios y sombras cambia toda la app.
 * Tema claro por defecto; tema oscuro automático (prefers-color-scheme) o
 * forzado con <html data-theme="dark|light">.
 * Paleta institucional: azul mariano + dorado + tierra (herencia franciscana).
 * ========================================================================== */
:root {
  /* Marca */
  --marca: #1e3a8a;          /* azul mariano */
  --marca-2: #2563eb;
  --oro: #f59e0b;
  --tierra: #92400e;

  /* Mesetas */
  --m-ambiental: #16a34a;
  --m-economica: #d97706;
  --m-politica: #dc2626;
  --m-cultural: #7c3aed;
  --m-social: #0284c7;

  /* Superficies y texto (claro) */
  --bg: #f4f6fb;
  --bg-2: #eaeef7;
  --surface: rgba(255, 255, 255, 0.78);
  --surface-solid: #ffffff;
  --surface-2: #f8fafc;
  --borde: rgba(15, 23, 42, 0.10);
  --borde-2: rgba(15, 23, 42, 0.18);
  --texto: #0f172a;
  --texto-2: #475569;
  --texto-3: #94a3b8;
  --enlace: #1d4ed8;
  --ok: #16a34a; --warn: #d97706; --error: #dc2626;

  /* Aurora de fondo */
  --aurora-1: rgba(37, 99, 235, 0.16);
  --aurora-2: rgba(245, 158, 11, 0.13);
  --aurora-3: rgba(124, 58, 237, 0.12);
  --aurora-4: rgba(22, 163, 74, 0.10);

  /* Tipografía */
  --font: 'Plus Jakarta Sans', 'Segoe UI', system-ui, -apple-system, Roboto, Arial, sans-serif;
  --font-display: 'Fraunces', 'Georgia', serif;
  --font-mono: 'JetBrains Mono', Consolas, 'Courier New', monospace;
  --fs-base: 15px;

  /* Forma */
  --r-sm: 8px; --r: 14px; --r-lg: 20px; --r-xl: 28px;
  --sombra: 0 1px 2px rgba(15, 23, 42, .05), 0 8px 24px rgba(15, 23, 42, .07);
  --sombra-2: 0 2px 6px rgba(15, 23, 42, .08), 0 18px 48px rgba(15, 23, 42, .14);
  --blur: saturate(160%) blur(14px);

  --sidebar: 264px;
  --topbar: 64px;
  --t: .22s cubic-bezier(.4, 0, .2, 1);
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0b1020; --bg-2: #111832;
    --surface: rgba(20, 27, 52, 0.72); --surface-solid: #141b34; --surface-2: #1a2342;
    --borde: rgba(148, 163, 184, 0.14); --borde-2: rgba(148, 163, 184, 0.26);
    --texto: #e7ecf7; --texto-2: #a6b3cf; --texto-3: #64748b; --enlace: #93c5fd;
    --marca: #93b4ff; --marca-2: #60a5fa;
    --aurora-1: rgba(59, 130, 246, 0.22); --aurora-2: rgba(245, 158, 11, 0.12);
    --aurora-3: rgba(139, 92, 246, 0.20); --aurora-4: rgba(34, 197, 94, 0.10);
    --sombra: 0 1px 2px rgba(0,0,0,.4), 0 8px 24px rgba(0,0,0,.35);
    --sombra-2: 0 2px 6px rgba(0,0,0,.5), 0 18px 48px rgba(0,0,0,.5);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #0b1020; --bg-2: #111832;
  --surface: rgba(20, 27, 52, 0.72); --surface-solid: #141b34; --surface-2: #1a2342;
  --borde: rgba(148, 163, 184, 0.14); --borde-2: rgba(148, 163, 184, 0.26);
  --texto: #e7ecf7; --texto-2: #a6b3cf; --texto-3: #64748b; --enlace: #93c5fd;
  --marca: #93b4ff; --marca-2: #60a5fa;
  --aurora-1: rgba(59, 130, 246, 0.22); --aurora-2: rgba(245, 158, 11, 0.12);
  --aurora-3: rgba(139, 92, 246, 0.20); --aurora-4: rgba(34, 197, 94, 0.10);
  --sombra: 0 1px 2px rgba(0,0,0,.4), 0 8px 24px rgba(0,0,0,.35);
  --sombra-2: 0 2px 6px rgba(0,0,0,.5), 0 18px 48px rgba(0,0,0,.5);
  color-scheme: dark;
}