/* ARCAVOTE appearance layer: neutral, accessible, seasonal and deliberately non-neon.
   Keep the existing layout in app.css; theme colours and interactive states live here. */
:root {
  --surface-hover: #e9eef3;
  --link-hover: #184b7e;
  --action: #205aa0;
  --action-hover: #174778;
  --gold-action: #96601e;
  --gold-action-hover: #784b13;
}
html { color-scheme: light; }
html[data-theme="dark"] { color-scheme: dark; }
body.season-autumn {
  --surface-hover: #f2e6da;
  --link-hover: #7a371e;
  --action: #a04a2b;
  --action-hover: #79361e;
  --gold-action: #8a571f;
  --gold-action-hover: #694012;
}
body.season-winter { --action: #315d7e; --action-hover: #254963; }
body.season-spring { --action: #2b7051; --action-hover: #20543c; }
body.season-summer { --action: #27698b; --action-hover: #20546f; }

/* All button types must retain legible foreground/background on hover. */
body .btn:not(.btn-accent):not(.btn-gold):not(.btn-light):not(.btn-danger):hover {
  color: var(--text);
  background: var(--surface-hover);
  border-color: var(--line-3);
}
body .btn-accent, body.season-autumn .btn-accent {
  background: var(--action);
  color: var(--accent-ink);
}
body .btn-accent:hover, body.season-autumn .btn-accent:hover {
  background: var(--action-hover);
  color: var(--accent-ink);
  border-color: transparent;
}
body .btn-gold, body.season-autumn .btn-gold {
  background: var(--gold-action);
  color: var(--gold-ink);
}
body .btn-gold:hover, body.season-autumn .btn-gold:hover {
  background: var(--gold-action-hover);
  color: var(--gold-ink);
  border-color: transparent;
}
body .btn-light { background: var(--text); color: var(--bg); border-color: var(--text); }
body .btn-light:hover { background: var(--text-2); color: var(--bg); border-color: var(--text-2); }
body .btn-danger { color: var(--down); border-color: var(--down); background: transparent; }
body .btn-danger:hover { color: var(--down); background: var(--panel-2); border-color: var(--down); }
body a:not(.btn):hover { color: var(--link-hover); }
body .btn:focus-visible, body a:focus-visible, body button:focus-visible, body input:focus-visible {
  outline: 2px solid var(--accent); outline-offset: 3px;
}
body .btn[disabled], body .btn[disabled]:hover { opacity: .5; cursor: not-allowed; filter: none; }
body .theme-toggle {
  gap: 7px; min-width: 100px; height: 40px; padding: 0 12px;
  border: 1px solid var(--line-3); border-radius: var(--r-btn);
  background: var(--panel); color: var(--text);
}
body .theme-toggle:hover { color: var(--text); background: var(--surface-hover); border-color: var(--line-3); }
body .theme-toggle-icon { font-size: 18px; line-height: 1; }
body .theme-toggle-label { font-size: 13px; white-space: nowrap; }

/* Calm dark surfaces: ink, slate and a warm seasonal accent instead of sci-fi neon. */
html[data-theme="dark"] body {
  --bg: #161c23;
  --panel: #202832;
  --panel-2: #29333e;
  --line: #354350;
  --line-2: #455463;
  --line-3: #62758a;
  --text: #f1f4f8;
  --text-2: #d7e0e9;
  --muted: #becad6;
  --dim: #afbdcc;
  --faint: #a4b4c5;
  --accent: #a0c9eb;
  --accent-ink: #ffffff;
  --blue: #a0c9eb;
  --gold: #eac48c;
  --gold-ink: #ffffff;
  --gold-bg: #2e2a24;
  --gold-line: #62533e;
  --up: #9ed6b2;
  --down: #ffb0ad;
  --silver: #bfcad7;
  --bronze: #e0af8b;
  --surface-hover: #33404d;
  --link-hover: #c6e1fc;
  --action: #336c9b;
  --action-hover: #3d769f;
  --gold-action: #835622;
  --gold-action-hover: #98672c;
}
html[data-theme="dark"] body.season-autumn {
  --accent: #e8b18e;
  --link-hover: #f5c8a8;
  --action: #995137;
  --action-hover: #a85b40;
  --gold: #ebbe86;
}
html[data-theme="dark"] body.season-winter {
  --accent: #b3d3eb; --action: #396b8c; --action-hover: #477d96;
}
html[data-theme="dark"] body.season-spring {
  --accent: #a5d8b7; --action: #387654; --action-hover: #3e825d;
}
html[data-theme="dark"] body.season-summer {
  --accent: #afd6e9; --action: #357a99; --action-hover: #397b93;
}
html[data-theme="dark"] body,
html[data-theme="dark"] body .site-header,
html[data-theme="dark"] body .site-footer { background: var(--bg); color: var(--text); }
html[data-theme="dark"] body .site-header,
html[data-theme="dark"] body .site-footer { background: #1c242d; }
html[data-theme="dark"] body .hero { background: linear-gradient(180deg, #202933 0%, #171d25 100%); }
html[data-theme="dark"] body .countdown { box-shadow: 0 8px 28px rgba(0,0,0,.12); }
html[data-theme="dark"] body .panel-vote { background: var(--panel); border-color: var(--line-2); }
html[data-theme="dark"] body .flash-success { color: #bbf3d0; border-color: #356c54; background: #213d32; }
html[data-theme="dark"] body .flash-error { color: #ffcbc4; border-color: #98504a; background: #442927; }
html[data-theme="dark"] body .flash-info { color: #c8e5fc; border-color: #426583; background: #243847; }
html[data-theme="dark"] body .chip.on,
html[data-theme="dark"] body .seg .on { color: var(--accent); background: #334150; }
html[data-theme="dark"] body .entry:hover,
html[data-theme="dark"] body .catalog-card:hover { background: var(--panel-2); border-color: var(--line-3); }
html[data-theme="dark"] body .spot-empty { background: var(--panel); }
html[data-theme="dark"] body .tier.hot { background: var(--gold-bg); box-shadow: none; }
html[data-theme="dark"] body .week input:checked + span { background: #42382b; }
html[data-theme="dark"] body .week input:disabled + span { opacity: .55; }
html[data-theme="dark"] body .reward { background: #3b3125; color: #f2d5aa; border-color: var(--gold-line); }
html[data-theme="dark"] body .tag-new { border-color: #597c9c; }
html[data-theme="dark"] body .badge-hot { background: var(--gold-action); color: var(--gold-ink); }
html[data-theme="dark"] body .tag-founder { color: #dfc8f1; border-color: #816797; }
html[data-theme="dark"] body .table th,
html[data-theme="dark"] body .table td,
html[data-theme="dark"] body .kv dt,
html[data-theme="dark"] body .kv dd,
html[data-theme="dark"] body .list a { border-color: var(--line); }
html[data-theme="dark"] body .chart i { background: var(--line-3); }
html[data-theme="dark"] body .chart i.today { background: var(--accent); }
html[data-theme="dark"] body .input,
html[data-theme="dark"] body .textarea,
html[data-theme="dark"] body .select { background: var(--panel); border-color: var(--line-3); color: var(--text); }
html[data-theme="dark"] body input::placeholder,
html[data-theme="dark"] body textarea::placeholder { color: var(--faint); opacity: 1; }
html[data-theme="dark"] body .search,
html[data-theme="dark"] body .search input { background: var(--panel); color: var(--text); }
html[data-theme="dark"] body .search input { background: transparent; }
html[data-theme="dark"] body .btn-accent:hover { background: var(--action-hover); color: #fff; }
html[data-theme="dark"] body .btn-gold:hover { background: var(--gold-action-hover); color: #fff; }
html[data-theme="dark"] body .btn:not(.btn-accent):not(.btn-gold):not(.btn-light):not(.btn-danger):hover { background: var(--surface-hover); color: var(--text); }
html[data-theme="dark"] body a:not(.btn):hover { color: var(--link-hover); }
html[data-theme="dark"] body .btn-light:hover { color: var(--bg); background: var(--text-2); }
html[data-theme="dark"] body .theme-toggle:hover { background: var(--surface-hover); color: var(--text); }
@media (max-width: 540px) {
  body .theme-toggle { min-width: auto; padding: 0 10px; }
  body .theme-toggle-label { font-size: 12px; }
}
@media (prefers-reduced-motion: no-preference) {
  body .btn, body .theme-toggle, body .chip, body .entry {
    transition: color .15s ease, background-color .15s ease, border-color .15s ease;
  }
}
