/* Tokens de tema — sistema de diseño "Glass Command Center".
   Toda la app referencia estas variables, así que el look global se controla aquí. */
:root {
  /* Fondos / superficies */
  --bg: #0A0E1A;
  --surface: #121a2e;
  --card: #141d33;
  --card2: #0e1626;
  --text: #EEF2F9;
  --text-strong: #FFFFFF;
  --muted: #A9B4CB;
  --dim: #6B7899;
  --border: rgba(255,255,255,0.08);
  --border-strong: rgba(120,160,255,0.22);
  --hover: rgba(120,160,255,0.06);

  /* Cristal (glassmorphism) */
  --glass: rgba(18,26,46,0.6);
  --glass-2: rgba(255,255,255,0.04);   /* highlight interior */
  --glass-border: rgba(120,180,255,0.18);

  /* Acentos */
  --green: #10E0A0;
  --green-bg: rgba(16,224,160,0.14);
  --red: #FF5C7A;
  --red-bg: rgba(255,92,122,0.14);
  --orange: #FFA23A;
  --orange-bg: rgba(255,162,58,0.14);
  --accent: #3B82F6;
  --accent-bg: rgba(59,130,246,0.15);
  --cyan: #22D3EE;
  --cyan-bg: rgba(34,211,238,0.14);

  /* Estrategias — Zonas naranja · Liquidez violeta · Nasdaq azul.
     Trío muy separado en la rueda de color: nunca se confunden entre sí, y el
     verde/rojo quedan libres solo para P&L.
     Ojo: este naranja es más saturado que --orange (#FFA23A, el de avisos) a
     propósito, para que "estrategia Zonas" y "aviso" no se lean igual. */
  --zonas: #F97316;
  --zonas-bg: rgba(249,115,22,0.15);
  --liquidez: #A855F7;
  --liquidez-bg: rgba(168,85,247,0.15);
  --nasdaq: #4D9AFF;
  --nasdaq-bg: rgba(77,154,255,0.15);

  --pos: #10E0A0;
  --neu: #FFA23A;
  --neg: #FF5C7A;

  /* Donuts TP/SL (extremos del degradado del aro) y pares de la tabla de
     rachas. Por tema: los pasteles del oscuro se lavan sobre tarjeta blanca. */
  --donut-tp-1: #7DF3C4;
  --donut-tp-2: #2FB889;
  --donut-sl-1: #FF9DB4;
  --donut-sl-2: #DE4A6E;
  --pair-gbp: #C084FC;
  --pair-eur: #60A5FA;
  --pair-gold: #FBBF24;

  /* Glows / elevación */
  --glow-accent: 0 0 26px -6px rgba(34,211,238,0.5);
  --glow-soft: 0 12px 34px -16px rgba(0,0,0,0.7);
  --glow-card: 0 1px 0 var(--glass-2) inset, 0 10px 30px -18px rgba(0,0,0,0.65);

  /* Tipografía */
  --font: 'Inter', system-ui, -apple-system, sans-serif;
  --font-display: 'Space Grotesk', 'Inter', system-ui, sans-serif;
  --mono: 'DM Mono', ui-monospace, monospace;

  /* Radios */
  --radius: 14px;
  --radius-sm: 9px;
  --radius-lg: 18px;

  /* Movimiento */
  --ease: cubic-bezier(.22,.61,.36,1);
  --dur: .18s;

  --sidebar-w: 248px;
}

:root[data-theme="light"] {
  --bg: #EEF2FB;
  --surface: #FFFFFF;
  --card: #FFFFFF;
  --card2: #F3F6FC;
  --text: #0F1826;
  --text-strong: #060A14;
  --muted: #495570;
  --dim: #8592AE;
  --border: rgba(15,23,42,0.09);
  --border-strong: rgba(40,90,200,0.22);
  --hover: rgba(40,90,200,0.05);

  --glass: rgba(255,255,255,0.72);
  --glass-2: rgba(255,255,255,0.6);
  --glass-border: rgba(40,90,200,0.16);

  --green: #07A877;
  --green-bg: rgba(7,168,119,0.12);
  --red: #E23150;
  --red-bg: rgba(226,49,80,0.12);
  --orange: #D97A06;
  --orange-bg: rgba(217,122,6,0.12);
  --accent: #2563EB;
  --accent-bg: rgba(37,99,235,0.12);
  --cyan: #0891B2;
  --cyan-bg: rgba(8,145,178,0.12);

  /* Estrategias en claro: mismos tonos, más oscuros para contrastar sobre blanco.
     (Antes --zonas no se redefinía aquí y heredaba el del tema oscuro.) */
  --zonas: #EA580C;
  --zonas-bg: rgba(234,88,12,0.12);
  --liquidez: #9333EA;
  --liquidez-bg: rgba(147,51,234,0.12);
  --nasdaq: #2563EB;
  --nasdaq-bg: rgba(37,99,235,0.12);

  --donut-tp-1: #2FBE96;
  --donut-tp-2: #067A57;
  --donut-sl-1: #F2637F;
  --donut-sl-2: #C01F3F;
  --pair-gbp: #9333EA;
  --pair-eur: #2563EB;
  --pair-gold: #B45309;

  --glow-accent: 0 0 22px -8px rgba(37,99,235,0.35);
  --glow-soft: 0 12px 30px -18px rgba(30,50,90,0.25);
  --glow-card: 0 1px 0 rgba(255,255,255,0.7) inset, 0 8px 24px -18px rgba(30,50,90,0.3);
}
