/*
  BolsaHoy — Design tokens compartidos.
  Prefijo --bh-* deliberado para no colisionar con las variables locales
  (--blue, --green, --ink, etc.) que cada página ya declara en su propio
  <style> inline. Cada página remapea sus variables históricas hacia estas
  (--blue: var(--bh-blue);) en vez de reescribir su CSS existente.
*/

:root,
[data-theme="dark"] {
  /* Marca — constantes en ambos temas */
  --bh-blue: #1f80ff;
  --bh-blue-2: #0d54c8;
  --bh-green: #00c48c;
  --bh-red: #f04438;
  --bh-white: #ffffff;

  /* Superficies — tema oscuro (por defecto) */
  --bh-bg: #05070d;
  --bh-bg-elevated: #0d1420;
  --bh-panel: #0d1b35;
  --bh-panel-2: #0f2040;
  --bh-ink: #eef3fb;
  --bh-ink-muted: rgba(238, 243, 251, 0.62);
  --bh-line: rgba(255, 255, 255, 0.12);
  --bh-line-soft: rgba(255, 255, 255, 0.07);

  /* Radios y sombras */
  --bh-radius-sm: 8px;
  --bh-radius: 12px;
  --bh-radius-lg: 16px;
  --bh-shadow: 0 18px 42px rgba(0, 0, 0, 0.45);
  --bh-shadow-glow: 0 0 0 1px rgba(31, 128, 255, 0.25), 0 8px 30px rgba(31, 128, 255, 0.15);

  /* Tipografía */
  --bh-font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --bh-font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;

  /* Motion — unificado para hover/foco/cambios de estado en toda la web */
  --bh-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --bh-transition-fast: 150ms var(--bh-ease);
  --bh-transition: 200ms var(--bh-ease);
  --bh-lift: -2px;
}

[data-theme="light"] {
  --bh-bg: #f4f7fb;
  --bh-bg-elevated: #ffffff;
  --bh-panel: #ffffff;
  --bh-panel-2: #eef2f8;
  --bh-ink: #08090b;
  --bh-ink-muted: #647084;
  --bh-line: #dfe6f0;
  --bh-line-soft: #eef1f6;
  --bh-shadow: 0 18px 42px rgba(8, 9, 11, 0.12);
  --bh-shadow-glow: 0 0 0 1px rgba(31, 128, 255, 0.15), 0 8px 30px rgba(31, 128, 255, 0.08);
}

/* Semántico de mercado — igual en ambos temas por legibilidad de ganancias/pérdidas */
:root {
  --bh-up: var(--bh-green);
  --bh-down: var(--bh-red);
}