/* themes.css — 4 theme variants + legacy class compatibility
 *
 * Day / Dawn / Evening / Night brightness levels.
 * `.theme-night` is the default.
 * Legacy block at bottom keeps pre-refactor class names working until
 * all views migrate to CSS variables directly.
 */

:root, .theme-night {
  --bg-primary: #040812;
  --bg-secondary: #080d19;
  --bg-tertiary: #0c1222;
  --text-primary: rgba(255,255,255,0.9);
  --text-secondary: rgba(255,255,255,0.5);
  --text-muted: rgba(255,255,255,0.4);
  --border-color: rgba(255,255,255,0.1);
  --grid-line: rgba(255,255,255,0.02);
  --accent-glow: rgba(249,115,22,0.1);
}

.theme-dawn {
  --bg-primary: #1a1510;
  --bg-secondary: #231c14;
  --bg-tertiary: #2d241a;
  --text-primary: rgba(255,245,230,0.9);
  --text-secondary: rgba(255,245,230,0.55);
  --text-muted: rgba(255,245,230,0.4);
  --border-color: rgba(255,200,150,0.12);
  --grid-line: rgba(255,200,150,0.03);
  --accent-glow: rgba(249,115,22,0.15);
}

.theme-evening {
  --bg-primary: #12131a;
  --bg-secondary: #1a1b24;
  --bg-tertiary: #22232e;
  --text-primary: rgba(230,235,255,0.85);
  --text-secondary: rgba(200,210,240,0.5);
  --text-muted: rgba(180,190,220,0.4);
  --border-color: rgba(150,160,200,0.1);
  --grid-line: rgba(150,160,200,0.025);
  --accent-glow: rgba(96,165,250,0.1);
}

.theme-day {
  --bg-primary: #ffffff;
  --bg-secondary: #f8fafc;
  --bg-tertiary: #f1f5f9;
  --text-primary: rgba(15,23,42,0.9);
  --text-secondary: rgba(15,23,42,0.6);
  --text-muted: rgba(15,23,42,0.4);
  --border-color: rgba(15,23,42,0.1);
  --grid-line: rgba(15,23,42,0.03);
  --accent-glow: rgba(249,115,22,0.08);
}

/* Legacy class compatibility — bridge pre-refactor class names to tokens.
 * Delete once all views use tokens directly (Phase 3+). */

.theme-day .bg-dark-950,
.theme-dawn .bg-dark-950,
.theme-evening .bg-dark-950 { background-color: var(--bg-primary); }

.theme-day .bg-dark-900,
.theme-dawn .bg-dark-900,
.theme-evening .bg-dark-900 { background-color: var(--bg-secondary); }

.theme-day .bg-dark-800,
.theme-dawn .bg-dark-800,
.theme-evening .bg-dark-800 { background-color: var(--bg-tertiary); }

.theme-day .text-white,
.theme-day .text-white\/90 { color: var(--text-primary); }
.theme-day .text-white\/85 { color: rgba(15,23,42,0.85); }
.theme-day .text-white\/80 { color: rgba(15,23,42,0.8); }
.theme-day .text-white\/70 { color: rgba(15,23,42,0.7); }
.theme-day .text-white\/60,
.theme-day .text-white\/50 { color: var(--text-secondary); }
.theme-day .text-white\/40 { color: var(--text-muted); }
.theme-day .text-white\/30 { color: rgba(15,23,42,0.3); }
.theme-day .text-white\/20 { color: rgba(15,23,42,0.2); }
.theme-day .border-white\/10 { border-color: var(--border-color); }
.theme-day .border-white\/20 { border-color: rgba(15,23,42,0.15); }
.theme-day .hover\:bg-white\/5:hover { background-color: rgba(15,23,42,0.05); }
.theme-day .hover\:text-white:hover { color: var(--text-primary); }

.theme-dawn .text-white,
.theme-dawn .text-white\/90,
.theme-evening .text-white,
.theme-evening .text-white\/90 { color: var(--text-primary); }

.theme-dawn .text-white\/50,
.theme-dawn .text-white\/40,
.theme-evening .text-white\/50,
.theme-evening .text-white\/40 { color: var(--text-secondary); }

.theme-dawn .border-white\/10,
.theme-evening .border-white\/10 { border-color: var(--border-color); }

.theme-day nav,
.theme-dawn nav,
.theme-evening nav { background-color: var(--bg-primary); }

.theme-day footer,
.theme-dawn footer,
.theme-evening footer { background-color: var(--bg-primary); }