/* Light declarations retain their original colors through var() fallbacks.
   Dark values are shared by pages, generated content, and SVG charts. */
:root {
    color-scheme: light;
    --ribbon-blue-ink: #000; /* Small text on steel-blue needs stronger contrast than white. */
    /* Shared Innovanta data-series palette; independent of status semantics. */
    --innovanta-series-blue: #3478b8;
    --innovanta-series-purple: #6657b5;
    --innovanta-series-teal: #2f7d87;
    --innovanta-series-indigo: #526fd0;
    --innovanta-series-plum: #654b9a;
    --appointment-series-blue: #1769aa;
    --appointment-series-orange: #b45309;
    --appointment-series-green: #22743b;
    --appointment-series-purple: #7945b5;
    --appointment-series-pink: #bb2766;
    --appointment-series-cyan: #007c83;
    --appointment-series-yellow: #827000;
    --appointment-series-gray: #596579;
    --page-background: #fff;
    --page-foreground: #1f2a3a;
    --ink-muted: #4f5d70;
}

:root[data-theme="dark"] {
    color-scheme: dark;
    --ribbon-blue-ink: #e6edf5;
    --page-background: #111923;
    --page-foreground: #e6edf5;
    --surface: #1b2735;
    --surface-subtle: #202e3e;
    --surface-heading: #2b3c50;
    --surface-hover: #30465f;
    --border: #4c6179;
    --border-subtle: #394b60;
    --ink: #e6edf5;
    --ink-muted: #b6c5d7;
    --ink-faint: #9aaec5;
    --link: #92c8ff;
    --link-visited: #d2b5ff;
    --focus: #9bcbff;
    --success-surface: #234536;
    --success-ink: #b0edc7;
    --success-border: #5b9b72;
    --warning-surface: #514426;
    --warning-hover: #65532b;
    --warning-ink: #ffe2a3;
    --warning-border: #aa9050;
    --danger-surface: #522d37;
    --danger-hover: #673543;
    --danger-ink: #ffb9bf;
    --danger-border: #b06877;
    --info-surface: #233d56;
    --info-ink: #b8dcff;
    --selected-surface: #315f59;
    --selected-border: #78a99d;
    --action-primary: #315f86;
    --innovanta-series-blue: #79b9ec;
    --innovanta-series-purple: #c39be0;
    --innovanta-series-teal: #8bc6ce;
    --innovanta-series-indigo: #91b1f3;
    --innovanta-series-plum: #d2b5ff;
    --appointment-series-blue: #62b5ff;
    --appointment-series-orange: #ffad55;
    --appointment-series-green: #6bdb83;
    --appointment-series-purple: #bb94ff;
    --appointment-series-pink: #ff80ad;
    --appointment-series-cyan: #55d8df;
    --appointment-series-yellow: #e6d65c;
    --appointment-series-gray: #ced5df;
    --chart-blue: #79b9ec;
    --chart-green: #8bc69b;
    --chart-gold: #d6bb75;
    --chart-purple: #c39be0;
    --chart-rose: #e6969b;
    --chart-indigo: #91b1f3;
    --chart-slate: #a5b8cb;
    --chart-brown: #ccad86;
    --ribbon-peach: #334c68;
    --ribbon-pink: #28515b;
    --ribbon-blue: #315e80;
    --ribbon-coral: #3c568a;
    --ribbon-mint: #514789;
    --ribbon-green: #4a417a;
    --ribbon-lavender: #433965;
    --ribbon-slate: #522d6a;
}

html, body { background: var(--page-background); color: var(--page-foreground); }
html[data-theme="dark"] a:not([class]) { color: var(--link); }
html[data-theme="dark"] a:not([class]):visited { color: var(--link-visited); }
:where(html[data-theme="dark"] :is(input, select, textarea, button)) { color: var(--ink); }
:where(html[data-theme="dark"] :is(input, select, textarea, dialog)) { background-color: var(--surface); border-color: var(--border); }
:where(html[data-theme="dark"] button) { background-color: var(--surface-heading); border-color: var(--border); }
html[data-theme="dark"] :is(input, textarea)::placeholder { color: var(--ink-faint); opacity: 1; }
html[data-theme="dark"] :focus-visible { outline-color: var(--focus); }

.account-actions { --account-control-height: calc(16px + .6rem); display: flex; align-items: center; gap: 8px; }
.account-actions form { margin: 0; }
.theme-switch {
    box-sizing: border-box;
    position: relative;
    flex: 0 0 54px;
    width: 54px;
    height: var(--account-control-height);
    padding: 2px;
    border: 1px solid #c8d3e1;
    border-radius: 999px;
    background: #dce4f0;
    box-shadow: inset 3px 3px 6px #8c9eaf, inset -2px -2px 5px #fff;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}
.theme-switch__knob {
    box-sizing: border-box;
    display: grid;
    place-items: center;
    width: calc(var(--account-control-height) - 6px);
    height: calc(var(--account-control-height) - 6px);
    border: 1px solid #d1dce9;
    border-radius: 50%;
    background: linear-gradient(145deg, #f1f5fc, #c5d2e5);
    box-shadow: 1px 2px 4px #687d91, inset 1px 1px 2px #fff;
    transform: translateX(0);
    transition: transform 180ms ease;
}
.theme-switch__knob svg { width: 14px; height: 14px; fill: none; stroke: #fff; stroke-width: 3; stroke-linecap: round; }
html[data-theme="dark"] .theme-switch {
    background: #6e879d;
    border-color: #506a81;
    box-shadow: inset 3px 3px 6px #142d3a, inset -1px -1px 3px #b8c9d9;
}
html[data-theme="dark"] .theme-switch__knob { transform: translateX(calc(54px - var(--account-control-height))); }
html[data-theme="dark"] .theme-switch__knob svg { stroke: #6b8499; }
.theme-switch:focus-visible { outline: 3px solid var(--focus, #225fad); outline-offset: 4px; }
.theme-switch:hover { filter: brightness(1.06); }
@media (prefers-reduced-motion: reduce) { .theme-switch__knob { transition: none; } }
@media (max-width: 600px) {
    .topbar { flex-wrap: wrap; }
    .topbar-title { order: 1; flex-basis: 100%; margin-left: 0; }
}
@media (forced-colors: active) {
    .theme-switch, html[data-theme="dark"] .theme-switch { border: 2px solid ButtonText; background: Canvas; box-shadow: none; }
    .theme-switch__knob { background: ButtonFace; border: 1px solid ButtonText; box-shadow: none; }
    .theme-switch__knob svg, html[data-theme="dark"] .theme-switch__knob svg { stroke: ButtonText; }
}
