/* Shared theme tokens + toggle button for every Taxy page.
   Dark is the default; [data-theme="light"] on <html> switches to light.
   theme.js sets that attribute before first paint from localStorage. */
:root {
  color-scheme: dark;
  --bg: #0b0c10;
  --text: #e9eef3;
  --text-soft: #c8d6e5;
  --prose: #c4cfdb;
  --strong: #fff;
  --card: #11151a;
  --border: #222a33;
  --input-bg: #0f1318;
  --input-border: #2a3340;
  --ro-bg: #0c1015;
  --ro-text: #bcd0e0;
  --divider: #233042;
  --muted: #a3b1c2;
  --pill-text: #b8c5d6;
  --kpi-bg: #0d131a;
  --panel: #0d1116;
  --panel-border: #223044;
  --disabled: #6f7b87;
  --dim: #575555;
  --note: #666;
  --faint: #6b7a8d;
  --subtle: #4b5a6b;
  --tab-line: #1e2530;
  --hover-bg: #0f141a;
  --deep: #0a0d12;
  --deep-border: #1e2d3d;
  --row-line: #1a2535;
  --vdivider: rgba(255,255,255,0.15);
  --accent: #4facfe;
  --danger: #f07a7a;
  --danger-border: #7a3f3f;
  --error-border: #d76969;
  --err-text: #f7a5a5;
  --red: #f87171;
  --green: #4ade80;
  --amber: #fbbf24;
  --orange: #fb923c;
  --sky: #38bdf8;
  --slate: #94a3b8;
  --ok-bg: #052e16;
  --ok-border: #14532d;
  --ok-soft: #86efac;
  --bad-bg: #2d0a0a;
  --bad-border: #7f1d1d;
  --unk-bg: #1a2030;
  --unk-border: #2a3a55;
  --warn-bg: #2d1600;
  --warn-border: #92400e;
  --clear-text: #fca5a5;
  --clear-hover-text: #fecaca;
  --save-text: #7dd3fc;
  --save-border: #2a4a6b;
  --save-hover-bg: #0d2035;
  --save-hover-text: #bae6fd;
  --gauge-track: #1e293b;
  --gauge-tick: #475569;
  --gauge-tick-label: #64748b;
  --gauge-good: #22c55e;
  --gauge-warn: #f59e0b;
  --gauge-over: #ef4444;
  --sankey-label: #e9eef3;
}

:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f1f5f9;
  --text: #0f172a;
  --text-soft: #1e293b;
  --prose: #334155;
  --strong: #020617;
  --card: #ffffff;
  --border: #cbd5e1;
  --input-bg: #ffffff;
  --input-border: #cbd5e1;
  --ro-bg: #f1f5f9;
  --ro-text: #334155;
  --divider: #e2e8f0;
  --muted: #475569;
  --pill-text: #475569;
  --kpi-bg: #f8fafc;
  --panel: #f8fafc;
  --panel-border: #e2e8f0;
  --disabled: #94a3b8;
  --dim: #94a3b8;
  --note: #64748b;
  --faint: #64748b;
  --subtle: #94a3b8;
  --tab-line: #cbd5e1;
  --hover-bg: #e2e8f0;
  --deep: #f1f5f9;
  --deep-border: #e2e8f0;
  --row-line: #e2e8f0;
  --vdivider: rgba(15,23,42,0.18);
  --accent: #0369a1;
  --danger: #dc2626;
  --danger-border: #fca5a5;
  --error-border: #dc2626;
  --err-text: #b91c1c;
  --red: #dc2626;
  --green: #15803d;
  --amber: #b45309;
  --orange: #c2410c;
  --sky: #0369a1;
  --slate: #475569;
  --ok-bg: #dcfce7;
  --ok-border: #86efac;
  --ok-soft: #166534;
  --bad-bg: #fee2e2;
  --bad-border: #fca5a5;
  --unk-bg: #e2e8f0;
  --unk-border: #cbd5e1;
  --warn-bg: #fef3c7;
  --warn-border: #fcd34d;
  --clear-text: #b91c1c;
  --clear-hover-text: #991b1b;
  --save-text: #0369a1;
  --save-border: #7dd3fc;
  --save-hover-bg: #e0f2fe;
  --save-hover-text: #075985;
  --gauge-track: #e2e8f0;
  --gauge-tick: #94a3b8;
  --gauge-tick-label: #64748b;
  --gauge-good: #15803d;
  --gauge-warn: #b45309;
  --gauge-over: #dc2626;
  --sankey-label: #0f172a;
}

.themeToggle {
  background: transparent;
  color: var(--muted);
  border: 1px solid var(--input-border);
  border-radius: 8px;
  font: inherit;
  font-size: 0.8rem;
  font-weight: 700;
  padding: 4px 12px;
  cursor: pointer;
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.themeToggle:hover { color: var(--text); border-color: var(--accent); }
.themeToggle:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* Standalone pages (privacy, 404) pin the toggle to the top-right corner */
.themeToggle.floating { position: fixed; top: 12px; right: 12px; z-index: 300; background: var(--card); }

/* Site-wide navigation bar, shared by every page. The theme toggle sits at its right. */
.siteNav {
  background: var(--card);
  border-bottom: 1px solid var(--border);
  margin-bottom: 16px;
}
.siteNavInner {
  max-width: calc(1120px + 48px);
  margin: 0 auto;
  padding: 0 24px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
}
.siteNavLinks { display: flex; flex-wrap: wrap; gap: 4px; flex: 1; }
.siteNavLinks a {
  color: var(--muted);
  text-decoration: none;
  font-size: 0.95rem;
  font-weight: 600;
  padding: 12px 14px;
  border-bottom: 3px solid transparent;
  margin-bottom: -1px;
}
.siteNavLinks a:hover { color: var(--text); text-decoration: none; }
.siteNavLinks a[aria-current="page"] { color: var(--accent); border-bottom-color: var(--accent); }
.siteNavLinks a:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }

/* Phones: links on one row, theme toggle on its own row below, right-aligned */
@media (max-width: 600px) {
  .siteNavInner { padding: 0 12px; }
  .siteNavLinks { flex: 1 1 100%; gap: 0; }
  .siteNavLinks a { padding: 12px 10px; font-size: 0.9rem; }
  .siteNav .themeToggle { margin: 0 0 8px auto; }
}
