/* Design tokens — EUR/USD Command Center (ver docs/PRODUCT_DESIGN.md §5).
   Nenhum valor visual solto em componentes: sempre via um destes tokens.
   Dark mode é o padrão (seção 4); light mode é uma alternativa completa,
   não um afterthought. */

:root {
  /* -- dark (padrão) -- */
  --bg-primary: #0a0e14;
  --bg-secondary: #0f151d;
  --surface: #131a24;
  --surface-elevated: #1a2330;
  --border: #232d3b;
  --border-strong: #3a4a5f;
  --text-primary: #e6edf5;
  --text-secondary: #a7b4c4;
  --text-muted: #6b7889;

  --positive: #35d68f;
  --positive-bg: rgba(53, 214, 143, 0.12);
  --negative: #ef5a6f;
  --negative-bg: rgba(239, 90, 111, 0.12);
  --warning: #e8a23a;
  --warning-bg: rgba(232, 162, 58, 0.12);
  --critical: #ff3b52;
  --critical-bg: rgba(255, 59, 82, 0.16);
  --info: #4f9dde;
  --info-bg: rgba(79, 157, 222, 0.12);
  --neutral: #7b8797;
  --neutral-bg: rgba(123, 135, 151, 0.12);
  --accent: #4f9dde;
  --accent-bg: rgba(79, 157, 222, 0.14);

  --font-mono: "SFMono-Regular", ui-monospace, "Cascadia Code", Consolas, monospace;
  --font-sans:
    -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, sans-serif;

  --font-size-xs: 0.6875rem;
  --font-size-sm: 0.8125rem;
  --font-size-md: 0.9375rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: 1.5rem;
  --font-size-2xl: 2rem;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;

  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 10px;

  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-2: 0 4px 12px rgba(0, 0, 0, 0.45);
  --shadow-3: 0 12px 32px rgba(0, 0, 0, 0.55);

  --header-height: 52px;
  --sidebar-width: 220px;
  --sidebar-width-collapsed: 56px;

  color-scheme: dark;
}

/* -- light: alternativa completa, não um "esqueci de fazer dark" -- */
:root[data-theme="light"] {
  --bg-primary: #f5f7fa;
  --bg-secondary: #eef1f5;
  --surface: #ffffff;
  --surface-elevated: #ffffff;
  --border: #dbe1e8;
  --border-strong: #b7c1cd;
  --text-primary: #10151c;
  --text-secondary: #4b5866;
  --text-muted: #7c8896;

  --positive: #1a9d63;
  --positive-bg: rgba(26, 157, 99, 0.1);
  --negative: #cf2a42;
  --negative-bg: rgba(207, 42, 66, 0.1);
  --warning: #b3760a;
  --warning-bg: rgba(179, 118, 10, 0.1);
  --critical: #d61035;
  --critical-bg: rgba(214, 16, 53, 0.12);
  --info: #1c6fb0;
  --info-bg: rgba(28, 111, 176, 0.1);
  --neutral: #5c6774;
  --neutral-bg: rgba(92, 103, 116, 0.1);
  --accent: #1c6fb0;
  --accent-bg: rgba(28, 111, 176, 0.1);

  --shadow-1: 0 1px 2px rgba(16, 21, 28, 0.08);
  --shadow-2: 0 4px 12px rgba(16, 21, 28, 0.1);
  --shadow-3: 0 12px 32px rgba(16, 21, 28, 0.14);

  color-scheme: light;
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    --bg-primary: #f5f7fa;
    --bg-secondary: #eef1f5;
    --surface: #ffffff;
    --surface-elevated: #ffffff;
    --border: #dbe1e8;
    --border-strong: #b7c1cd;
    --text-primary: #10151c;
    --text-secondary: #4b5866;
    --text-muted: #7c8896;

    --positive: #1a9d63;
    --positive-bg: rgba(26, 157, 99, 0.1);
    --negative: #cf2a42;
    --negative-bg: rgba(207, 42, 66, 0.1);
    --warning: #b3760a;
    --warning-bg: rgba(179, 118, 10, 0.1);
    --critical: #d61035;
    --critical-bg: rgba(214, 16, 53, 0.12);
    --info: #1c6fb0;
    --info-bg: rgba(28, 111, 176, 0.1);
    --neutral: #5c6774;
    --neutral-bg: rgba(92, 103, 116, 0.1);
    --accent: #1c6fb0;
    --accent-bg: rgba(28, 111, 176, 0.1);

    --shadow-1: 0 1px 2px rgba(16, 21, 28, 0.08);
    --shadow-2: 0 4px 12px rgba(16, 21, 28, 0.1);
    --shadow-3: 0 12px 32px rgba(16, 21, 28, 0.14);

    color-scheme: light;
  }
}