/* Palette 34. Layout, direction colours and authored cell styles are not changed.
   Text accents and filled actions are separate: orange buttons need dark text. */
:root, html[data-theme="dark"] {
  --bg: #1c1712;
  --sidebar-bg: #312619;
  --surface: #2b231c;
  --surface-soft: #433324;
  --surface-hover: #493728;
  --ink: #fff5e9;
  --label: #dccab7;
  --muted: #c3b19c;
  --line: #4b433b;
  --control-line: #88735d;
  --accent: #f2a85c;
  --accent-dark: #f4b873;
  --action: #f2a85c;
  --action-hover: #f4b873;
  --on-accent: #1c1712;
  --on-success: #1c1712;
  --teal: var(--accent);
  --primary: var(--accent);
  --accent-soft: #433324;
  --toggle-track: #88735d;
  --toggle-knob: #fff5e9;
  --tooltip-bg: #433324;
  --tooltip-ink: #fff5e9;
  --login-glow: #48321f;
  --focus-glow: #f2a85c2a;
  --selection-bg: #5d4229;
  --overlay-bg: #1c1712b8;
  --shadow: 0 8px 26px #120c081f;
}
html[data-theme="light"] {
  --bg: #fff5ea;
  --sidebar-bg: #f7e8d8;
  --surface: #f1f1ef;
  --surface-soft: #ece6e0;
  --surface-hover: #efeae4;
  --ink: #472d18;
  --label: #67503b;
  --muted: #79624c;
  --line: #d1ccc6;
  --control-line: #94806c;
  --accent: #a14e08;
  --accent-dark: #873e06;
  --action: #d17924;
  --action-hover: #dc8732;
  --on-accent: #1c1712;
  --on-success: #ffffff;
  --teal: var(--accent);
  --primary: var(--accent);
  --accent-soft: #ece6e0;
  --chart-blue: #146d7a;
  --chart-previous: #72539b;
  --toggle-track: #94806c;
  --toggle-knob: #f1f1ef;
  --tooltip-bg: #ece6e0;
  --tooltip-ink: #472d18;
  --login-glow: #f2e2d2;
  --focus-glow: #a14e0822;
  --selection-bg: #eed5b9;
  --overlay-bg: #472d186b;
  --shadow: 0 8px 26px #472d180f;
}

html[data-theme] body { background: var(--bg); }
html[data-theme] ::selection { color: var(--ink); background: var(--selection-bg); }
html[data-theme] .sidebar { scrollbar-color: var(--control-line) transparent; }
html[data-theme] .sidebar {
  --nav-heading-bg: #3b2c20;
  --nav-heading-hover: #483425;
  --nav-heading-line: #6e5137;
  --nav-heading-ink: #f2a85c;
}
html[data-theme="light"] .sidebar {
  --nav-heading-bg: #eee4d7;
  --nav-heading-hover: #e9ded0;
  --nav-heading-line: #cfc0b0;
  --nav-heading-ink: #875022;
}
html[data-theme] .nav-list a.active,
html[data-theme] .nav-group summary.active { background: var(--action); color: var(--on-accent); }
html[data-theme] .nav-list a.active:hover,
html[data-theme] .nav-group summary.active:hover { background: var(--action-hover); color: var(--on-accent); }
html[data-theme] .theme-switch[aria-checked="true"] .theme-switch-track,
html[data-theme] .nav-expand-switch[aria-checked="true"] .nav-expand-track { background: var(--action); }
html[data-theme] .theme-switch[aria-checked="true"] .theme-switch-track > span,
html[data-theme] .nav-expand-switch[aria-checked="true"] .nav-expand-track > span { background: var(--on-accent); }

html[data-theme] .button.primary,
html[data-theme] :is(.cash-add-plus, .amount-increment-form button, .polozhnyak-edge-button),
html[data-theme] .analysis-insight-filters button.active span,
html[data-theme] .ov-week-shortcut.selected {
  color: var(--on-accent); background: var(--action); border-color: var(--action); box-shadow: none;
}
html[data-theme] .button.primary:hover,
html[data-theme] :is(.amount-increment-form button, .polozhnyak-edge-button):hover,
html[data-theme] .ov-week-shortcut.selected:hover { color: var(--on-accent); background: var(--action-hover); }
html[data-theme] .button.secondary { border-color: var(--control-line); }
html[data-theme] .button.secondary:hover { background: var(--surface-hover); }
html[data-theme] :is(input, select, textarea):focus,
html[data-theme] .account-picker summary:focus { outline-color: var(--focus-glow); box-shadow: 0 0 0 3px var(--focus-glow); }
html[data-theme] .sidebar-toggle:focus-visible { outline-color: var(--accent); }
html[data-theme] :is(.crm-source-form, .kc-debt-entry-panel, .expense-input-panel).editing {
  border-color: var(--accent); box-shadow: 0 0 0 2px var(--focus-glow);
}
html[data-theme] .amount-increment-form input[type="number"]:focus { outline-color: var(--focus-glow); }
html[data-theme] .account-option input:checked,
html[data-theme] .cash-checkbox-field input:checked,
html[data-theme] .notification-toggle-input:checked + span { background: var(--action); border-color: var(--action); }
html[data-theme] input:is([type="checkbox"], [type="radio"]) { accent-color: var(--action); }
html[data-theme] .cash-highlight-toggle.is-active { color: var(--on-success); }
html[data-theme] .real-banner { color: var(--info-ink); border-color: var(--info-line); background: var(--info-bg); }
html[data-theme] .cash-account-card.is-selected { border-color: var(--accent); background: var(--surface); box-shadow: 0 0 0 2px var(--focus-glow); }
html[data-theme] .analysis-summary-card:nth-child(3) { border-color: var(--control-line); background: var(--surface); }
html[data-theme] .analysis-cause-notes { background: var(--surface-soft); }
html[data-theme] .analysis-week-dot.neutral { background: var(--muted); }
html[data-theme] .analysis-week-dot.missing { border-color: var(--control-line); }
html[data-theme] .ov-cash-card { background: var(--surface); }
html[data-theme] .login-card { box-shadow: var(--shadow); }

/* Primary charts are orange; green/gold/blue series retain their own meanings. */
html[data-theme] .analysis-ranking-bar { background: var(--action); }
html[data-theme] .analysis-funnel-bar { background: linear-gradient(90deg, var(--action), var(--chart-blue)); }
html[data-theme] .daily-metric { --daily-color: var(--action); }
html[data-theme] .daily-metric-green { --daily-color: var(--success); }
html[data-theme] .daily-metric-gold { --daily-color: var(--warning); }
html[data-theme] .daily-metric-blue { --daily-color: var(--chart-blue); }
/* Telephony/proxy success labels must not accidentally turn orange on green. */
html[data-theme] .tel-status.success,
html[data-theme] .proxy-status.success { color: var(--success); }
html[data-theme] .ov-direction-icon.rk_lm { color: var(--success); background: var(--success-bg); }

/* Theme all amount-detail dialogs and standalone pages, also in dark mode. */
html[data-theme] .amount-detail-link { border-bottom-color: var(--control-line); }
html[data-theme] .amount-detail-link:hover,
html[data-theme] .amount-detail-link:focus-visible { color: var(--accent); border-color: currentColor; }
html[data-theme] .amount-details-dialog { border-color: var(--control-line); background: var(--surface); color: var(--ink); }
html[data-theme] :is(.amount-details-dialog, .sites-dialog, .cash-receipt-week-dialog, .dv-dialog)::backdrop { background: var(--overlay-bg); }
html[data-theme] .amount-details-toolbar { border-color: var(--line); background: var(--surface-soft); }
html[data-theme] .amount-details-toolbar button { color: var(--ink); border-color: var(--control-line); }
html[data-theme] .amount-details-total { border-color: var(--line); }
html[data-theme] .amount-details-total strong { color: var(--accent); }
html[data-theme] .amount-details-warning { color: var(--warning-ink); background: var(--warning-bg); border-color: var(--warning-line); }
html[data-theme] .amount-details-table :is(th, td) { border-color: var(--line); }
html[data-theme] .amount-details-table th { color: var(--muted); background: var(--surface-soft); }
html[data-theme] .amount-details-table td.amount-details-number.negative { color: var(--danger); }
html[data-theme] .amount-details-table a { color: var(--accent); }

/* Sites stylesheet is inserted within content: scoped selectors win there too. */
html[data-theme] .sites-page { --sites-mint: var(--accent); --sites-purple: var(--chart-previous); }
html[data-theme] .sites-notice { background: var(--info-bg); border-color: var(--info-line); }
html[data-theme] .sites-kpis > div { border-top-color: var(--accent); }
html[data-theme] .sites-kpis > div:nth-child(3) { border-top-color: var(--chart-previous); }
html[data-theme] .sites-tabs a.selected { box-shadow: inset 0 0 0 1px var(--control-line); }
html[data-theme] .sites-amount { border-bottom-color: var(--control-line); }
html[data-theme] .sites-expanded > td { background: var(--surface-soft); }
html[data-theme] .sites-chart { --bar-color: var(--action); }
html[data-theme] .sites-chart.blue { --bar-color: var(--chart-blue); }
html[data-theme] .sites-chart.gold { --bar-color: var(--warning); }
html[data-theme] .sites-point > span { color: var(--accent); }
html[data-theme] .sites-chart.blue .sites-point > span { color: var(--chart-blue); }
html[data-theme] .sites-chart.gold .sites-point > span { color: var(--warning); }
html[data-theme] .sites-bar-slot { background: repeating-linear-gradient(to top, transparent 0, transparent 27px, var(--line) 28px, transparent 29px); }
html[data-theme] .sites-bar-slot i { background: linear-gradient(to bottom, var(--bar-color), color-mix(in srgb, var(--bar-color) 72%, var(--surface))); }
html[data-theme] .sites-source.purple { color: var(--violet-ink); background: var(--violet-bg); }
html[data-theme] .sites-campaign-option:has(input:checked) { background: var(--info-bg); }