/* Shared semantic palette. Day values retain the established Gateway colors. */
:root {
    color-scheme: light;
    --text: #293123;
    --canvas: #f5f7f2;
    --surface: #fff;
    --surface-muted: #f8faf6;
    --surface-hover: #eef2e8;
    --subtle: #53604c;
    --primary: #47503b;
    --border: #cbd5c2;
    --control-border: #75826a;
    --selected: #e8edde;
    --focus: #996f00;
    --focus-strong: #736016;
    --button-background: #47503b;
    --button-border: #47503b;
    --button-hover: #353d2c;
    --on-button: #fff;
    --danger-border: #bd7069;
    --danger-surface: #fff2f0;
    --danger-text: #7a251c;
    --success-text: #35442a;
    --warning-surface: #fff7df;
    --nav-active: #e1e8d8;
    --nav-active-border: #ccd7c0;
    --brand-accent: #607545;
    --brand-rule: #806000;
    --decor-border: #bdcab0;
    --decor-surface: #dce5d0;
    --decor-inner-border: #aeba9f;
    --icon-surface: #f1f4ec;
    --message-selected: #e8e5d7;
    --message-active-border: #636444;
    --message-border: #ccc9bb;
    --message-surface: #f3f2ed;
    --badge-background: #545638;
    --table-border: #c6c3b6;
    --overlay-border: #77745e;
    --overlay-text: #24251e;
    --tag-text: #41482d;
    --query-control-border: #7d876c;
    --tag-border: #b6b49c;
    --tag-surface: #f8f7f0;
    --backdrop: rgb(30 32 22 / 35%);
    --shadow-soft: #29312308;
    --shadow-menu: #29312318;
    --shadow-dropdown: #29312320;
    --shadow-toast: #29312326;
}

/* Screen-only overrides also keep printed output in the day palette. */
@media screen {
    html[data-theme="night"] {
        color-scheme: dark;
        --text: #cbd2c4;
        --canvas: #0b0e0a;
        --surface: #141912;
        --surface-muted: #10150e;
        --surface-hover: #1c2419;
        --subtle: #a4ae9c;
        --primary: #b3c69f;
        --border: #69755f;
        --control-border: #77836d;
        --selected: #202a1b;
        --focus: #c0a65b;
        --focus-strong: var(--focus);
        --button-background: #34442b;
        --button-border: #77836d;
        --button-hover: #475d38;
        --on-button: #cbd2c4;
        --danger-border: #a77165;
        --danger-surface: #2b1916;
        --danger-text: #e0a59a;
        --success-text: #b3c69f;
        --warning-surface: #2b2414;
        --nav-active: #293323;
        --nav-active-border: #77836d;
        --brand-accent: #a3b78d;
        --brand-rule: #c0a65b;
        --decor-border: var(--border);
        --decor-surface: var(--selected);
        --decor-inner-border: var(--border);
        --icon-surface: var(--selected);
        --message-selected: var(--selected);
        --message-active-border: #c0a65b;
        --message-border: var(--border);
        --message-surface: #10150e;
        --badge-background: var(--button-background);
        --table-border: var(--border);
        --overlay-border: var(--control-border);
        --overlay-text: var(--text);
        --tag-text: #b3c69f;
        --query-control-border: var(--control-border);
        --tag-border: var(--border);
        --tag-surface: var(--selected);
        --backdrop: rgb(0 0 0 / 70%);
        --shadow-soft: #00000033;
        --shadow-menu: #00000066;
        --shadow-dropdown: #00000066;
        --shadow-toast: #00000066;
    }

    html[data-theme="night"] :is(input, select, textarea, button) {
        color-scheme: dark;
    }
    html[data-theme="night"] :is(input, select, textarea) {
        background-color: var(--surface);
        color: var(--text);
        border-color: var(--control-border);
    }
    /* Keep the existing accessible ORI overlay above the native agency picker. */
    html[data-theme="night"] .agency-select-display.enhanced select { color: transparent; }
    html[data-theme="night"] option { color: var(--text); background: var(--surface); }
    html[data-theme="night"] ::placeholder { color: var(--subtle); opacity: 1; }
    html[data-theme="night"] :is(input[type="checkbox"], input[type="radio"]) { accent-color: var(--primary); }
    html[data-theme="night"] :is(button:not([class]), .text-button),
    html[data-theme="night"] ::file-selector-button {
        background: var(--surface);
        color: var(--primary);
        border: 1px solid var(--control-border);
        border-radius: .4rem;
    }
    html[data-theme="night"] :is(button:not([class]), .text-button):hover { background: var(--selected); }
    html[data-theme="night"] ::selection { color: var(--text); background: #34442b; }
    html[data-theme="night"] :is(input, textarea):autofill {
        box-shadow: 0 0 0 1000px var(--selected) inset;
        -webkit-text-fill-color: var(--text);
        caret-color: var(--text);
    }
}

.theme-toggle {
    display: inline-flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 48px;
    min-height: 48px;
    min-width: 48px;
    max-width: 100%;
    padding: .5rem;
    border: 1px solid var(--control-border);
    border-radius: .5rem;
    background: var(--surface);
    color: var(--primary);
    font-size: .8rem;
    font-weight: 650;
}
.theme-toggle:hover { background: var(--selected); }
.message-theme-controls { display: inline-flex; flex: none; align-items: center; gap: inherit; }
.account-summary:has(.theme-save-error) { flex-wrap: wrap; }
.theme-toggle-icon { font-size: 1.5rem; line-height: 1; }
.theme-toggle[aria-pressed="true"] { border-color: var(--focus); }
.theme-toggle-noscript { font-size: .8rem; color: var(--subtle); }
.login-header { flex-wrap: wrap; gap: 1rem; }
.login-header > .gateway-brand { flex-basis: 100%; }
.theme-status:not(.theme-save-error) {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;
}
.theme-save-error { flex-basis: 100%; font-size: .8rem; margin: .25rem 0; color: var(--danger-text); }
[data-theme-preference] { min-height: 24px; height: 24px; width: 24px; }
label:has(> [data-theme-preference]) { min-height: 44px; }

@media (forced-colors: active) {
    html[data-theme] { color-scheme: light dark; }
    .theme-toggle[aria-pressed="true"] { border: 2px solid Highlight; }
    html[data-theme="night"] :is(input, textarea):autofill {
        box-shadow: none; -webkit-text-fill-color: CanvasText; caret-color: CanvasText;
    }
}
