/* chart-theme.css — Oyamori Chart token layer
 * Dark (default :root), Light ([data-theme="light"]), System ([data-theme="system"] + media query).
 * chart-widget.css consumes these via var(--cw-*). The JS reads chart-specific vars
 * (--cw-chart-bg, --cw-muted, --cw-grid-line) via getComputedStyle for the ECharts canvas.
 * Candle / EMA cloud / VWAP / S-R DATA colors are NOT defined here — they stay literal in JS. */

:root,
[data-theme="dark"] {
  --cw-bg:         #0a0a0a;
  --cw-surface:    #111111;
  --cw-border:     #222222;
  --cw-text:       #f0f0f0;
  --cw-muted:      #888888;
  --cw-subtle:     #444444;
  --cw-brand:      #D5477F;
  --cw-up:         #10b981;
  --cw-down:       #ef5350;
  --cw-watch:      #f59e0b;

  /* chart-specific (read by JS getComputedStyle) */
  --cw-chart-bg:   #0a0a0a;
  --cw-grid-line:  #222222;

  --cw-radius-card: 12px;
  --cw-radius-btn:  6px;

  --cw-font:  'Inter', system-ui, -apple-system, sans-serif;
  --cw-mono:  'JetBrains Mono', ui-monospace, monospace;
  --cw-doto:  'Doto', 'JetBrains Mono', monospace;
}

[data-theme="light"] {
  --cw-bg:         #f5f5f5;
  --cw-surface:    #ebebeb;
  --cw-border:     #d0d0d0;
  --cw-text:       #0a0a0a;
  --cw-muted:      #555555;
  --cw-subtle:     #b0b0b0;
  --cw-brand:      #D5477F;
  --cw-up:         #10b981;
  --cw-down:       #ef5350;
  --cw-watch:      #f59e0b;

  --cw-chart-bg:   #ffffff;
  --cw-grid-line:  #e2e2e2;
}

/* System: follow OS. Default block is dark (inherits :root); the media query
   overrides to light only when the OS prefers light. */
[data-theme="system"] {
  --cw-bg:         #0a0a0a;
  --cw-surface:    #111111;
  --cw-border:     #222222;
  --cw-text:       #f0f0f0;
  --cw-muted:      #888888;
  --cw-subtle:     #444444;
  --cw-chart-bg:   #0a0a0a;
  --cw-grid-line:  #222222;
}

@media (prefers-color-scheme: light) {
  [data-theme="system"] {
    --cw-bg:         #f5f5f5;
    --cw-surface:    #ebebeb;
    --cw-border:     #d0d0d0;
    --cw-text:       #0a0a0a;
    --cw-muted:      #555555;
    --cw-subtle:     #b0b0b0;
    --cw-chart-bg:   #ffffff;
    --cw-grid-line:  #e2e2e2;
  }
}