/* Night appearance follows the Gateway palette and is screen-only; printing stays light. */
@media screen {
    html[data-theme="night"] {
        color-scheme: dark;
        --wam-canvas: #0b0e0a;
        --wam-surface: #141912;
        --wam-surface-subtle: #10150e;
        --wam-surface-selected: #202a1b;
        --wam-border: #69755f;
        --wam-border-strong: #77836d;
        --wam-text: #cbd2c4;
        --wam-text-subtle: #a4ae9c;
        --wam-primary: #b3c69f;
        --wam-primary-hover: #475d38;
        --wam-primary-subtle: #202a1b;
        --wam-accent: #c0a65b;
        --wam-accent-bright: #c0a65b;
        --wam-danger: #e0a59a;
        --wam-focus: #c0a65b;
        --wam-shadow: 0 0.5rem 1.5rem rgb(0 0 0 / 35%);
        --wam-shadow-lg: 0 1.25rem 3rem rgb(0 0 0 / 60%);
    }

    html[data-theme="night"] body {
        background: var(--wam-canvas);
        color: var(--wam-text);
    }

    html[data-theme="night"] :is(input, select, textarea, button) { color-scheme: dark; }
    html[data-theme="night"] ::placeholder { color: var(--wam-text-subtle); opacity: 1; }
    html[data-theme="night"] ::selection { color: var(--wam-text); background: #34442b; }
    html[data-theme="night"] :is(input[type="checkbox"], input[type="radio"]) { accent-color: var(--wam-primary); }
    html[data-theme="night"] :is(input, textarea):autofill {
        box-shadow: 0 0 0 1000px var(--wam-surface-selected) inset;
        -webkit-text-fill-color: var(--wam-text);
        caret-color: var(--wam-text);
    }

    html[data-theme="night"] :focus-visible,
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :focus-visible,
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) .dxbl-text-edit:focus-within { outline-color: var(--wam-focus); }
    html[data-theme="night"] .topbar {
        background: rgb(20 25 18 / 94%);
        border-color: var(--wam-border);
    }
    html[data-theme="night"] .sidebar { box-shadow: 3px 0 14px rgb(0 0 0 / 40%); }
    html[data-theme="night"] .unread-count {
        background-color: #34442b;
        color: var(--wam-text);
    }
    html[data-theme="night"] #blazor-error-ui {
        background: #2b2414;
        color: #e2cc86;
    }

    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(
        .agency-card, .agreement-panel, .credential-panel, .data-panel, .filter-panel,
        .help-search, .help-topic, .mapping-card, .password-card, .registration-card,
        .results-panel, .review-card, .search-card, .secret-card, .settings-card,
        .status-grid article, .status-grid .identity-status, .user-card, .csa-roles-card,
        .hero, .cleanup-panel, .csa-password-policy-card, .agency-document-settings-card,
        .fingerprint-response, .driver-photo, .work-section, .vulpix-card,
        .paper-agreement-panel, .login-card, .csa-options a, .adl-registration,
        .account-page > section, .fingerprint-page fieldset, .weapon-access-card
    ) {
        background-color: var(--wam-surface);
        border-color: var(--wam-border);
        color: var(--wam-text);
        box-shadow: var(--wam-shadow);
    }

    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(h1, h2, h3, h4, legend, label, dt, th) {
        color: var(--wam-text);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(p, small, .supporting-text, .page-heading p, .eyebrow,
        .topic-summary, .field-management, .reference-note, .help-footer, .empty-state,
        .updated-line, .date-help, .agency-context > span, .agency-list-identity small) {
        color: var(--wam-text-subtle);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) a { color: var(--wam-primary); }

    /* Read-only fields and nested cards also carry explicit light colors in scoped CSS. */
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(.password-section, .password-reset, .agency-memberships, .read-only-value,
        .verification-row, .audience, .csa-role-option, .permission-group, .usage-summary > div,
        .key-counts span, .empty-state, .preview-notice, .scope-chip, .optional-label,
        .secret-usage code, .agency-table-action) {
        background: var(--wam-surface-subtle);
        border-color: var(--wam-border);
        color: var(--wam-text);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) .csa-role-option:has(input:checked) {
        background: var(--wam-surface-selected);
        border-color: var(--wam-focus);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) .secret-card { background: var(--wam-surface); }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) .user-with-photo .user-edit-icon {
        color: var(--wam-primary);
        border-color: var(--wam-border-strong);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) .user-with-photo:hover .user-edit-icon { background: var(--wam-surface-selected); }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(code, .help-shell, .hidden-agency-badge,
        .temporary-credentials span, .csa-options span, .csa-role-user strong, .csa-role-user span,
        .csa-role-option strong, .csa-role-label, .settings-grid label span, .callback-panel span,
        .permission-choice strong, .usage-summary strong, .usage-summary span,
        .credentials-table td strong, .usage-table td, .agency-table-identity strong,
        .agency-active-label, .self-password-checklist li, .password-check) {
        color: var(--wam-text);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(.list-toolbar span, .pager span, caption,
        .panel-hint, .key-counts, .key-prefix, .api-credentials-page .page-heading p:last-child) {
        color: var(--wam-text-subtle);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(.self-password-checklist li.meets,
        .self-password-feedback.meets, .password-check.meets, .password-feedback.meets,
        .agency-indicator-mark) { color: var(--wam-primary); }

    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(input:not([type="checkbox"]):not([type="radio"]),
        select, textarea, .dxbl-text-edit-input, .dxbl-memo-input, .dxbl-spin-edit-input) {
        background-color: var(--wam-surface);
        border-color: var(--wam-border-strong);
        color: var(--wam-text);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(input, select, textarea, .dxbl-text-edit-input):focus-visible {
        outline-color: var(--wam-focus);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) input[type="file"]::file-selector-button {
        background: var(--wam-surface);
        border-color: var(--wam-border-strong);
        color: var(--wam-primary);
    }
    /* Keep the 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(--wam-text); background: var(--wam-surface); }

    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(table, th, td, fieldset, .agency-section,
        .agency-edit, .agency-table-wrap, .agency-weapon-access-options, .agency-editor,
        .agency-weapon-access-levels, .agency-weapon-access-preview, .agency-delete,
        .user-row, .agency-document-editor, .paper-agreement-accordion) {
        border-color: var(--wam-border);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(thead, .agency-table thead th, .cleanup-table th,
        .links-table th, .usage-table th, .table-wrap thead, .dashboard-task-card,
        .agency-detail-row > td, .agency-table-detail, .notes-panel, .callback-panel,
        .agency-weapon-access-options, .vulpix-summary) {
        background-color: var(--wam-surface-subtle);
        color: var(--wam-text);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) tbody tr:nth-child(even) { background-color: #10150e; }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(.agency-row-active, .agency-row-inactive) {
        background-color: var(--wam-surface-subtle);
        color: var(--wam-text);
    }

    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) button,
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) .dxbl-btn {
        background-color: var(--wam-surface);
        border-color: var(--wam-border-strong);
        color: var(--wam-primary);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(button, .dxbl-btn):hover:not(:disabled) {
        background-color: var(--wam-surface-selected);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(button, a, input[type="submit"])[class*="primary"],
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(.primary-action, .work-primary, .adl-primary,
        .paper-agreement-primary, .agency-details-primary, .dxbl-btn-primary,
        button[type="submit"]:not(.text-button, .user-edit-action)) {
        background-color: #34442b;
        border-color: var(--wam-border-strong);
        color: var(--wam-text);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(button, a, input[type="submit"])[class*="primary"]:hover:not(:disabled),
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(.primary-action, .work-primary, .adl-primary,
        .paper-agreement-primary, .agency-details-primary, .dxbl-btn-primary,
        button[type="submit"]:not(.text-button, .user-edit-action)):hover:not(:disabled) {
        background-color: #475d38;
        border-color: var(--wam-border-strong);
        color: var(--wam-text);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) button[aria-pressed="true"]:not([data-theme-toggle]) {
        background-color: var(--wam-surface-selected);
        border-color: var(--wam-focus);
        color: var(--wam-text);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) .announcement-tabs button.selected {
        background-color: #34442b;
        border-color: var(--wam-focus);
        box-shadow: inset 0 -3px var(--wam-focus);
        color: var(--wam-text);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(.danger-action, .danger-button, .agency-delete button,
        .remove-button, .adl-danger) {
        background-color: #2b1916;
        border-color: #a77165;
        color: #e0a59a;
    }

    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(.alert, .work-error, .adl-alert, .agency-details-alert,
        .validation-summary, .danger-zone, .error-message, .mapping-save-result.error,
        .announcement-error, .system-use-editor-error, .document-types-error, .outcome.failed) {
        background-color: #2b1916;
        border-color: #a77165;
        color: #e0a59a;
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) .system-use-unavailable {
        background-color: #2b1916;
        border-color: #a77165;
        color: #e0a59a;
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(.notice, .notice.success, .success-panel, .work-success,
        .transfer-success, .agency-details-notice, .document-types-status, .mapping-save-result.success,
        .csa-roles-message, .credential-alert:not(.schema-alert), .announcement-status,
        .system-use-editor-status, .outcome.succeeded) {
        background-color: #14221a;
        border-color: #4f6c50;
        color: #b3c69f;
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(.notice.error, .inline-warning, .work-warning,
        .access-pending, .task-indicator.required, .document-types-conflict, .schema-alert,
        .credential-alert.schema-alert, .agency-annual-review-warning, .review-callout,
        .temporary-credentials, .credentials, .blocking-badge, .conflict-panel, .inactive-agency-notice,
        .user-status-badge.pending) {
        background-color: #2b2414;
        border-color: #806d38;
        color: #e2cc86;
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(.temporary-credentials, .credentials) code {
        background-color: var(--wam-surface);
        color: var(--wam-text);
        border-color: var(--wam-border-strong);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(.validation-message, [id$="-error"], .incident-error:not(:empty),
        .system-use-unavailable) {
        color: #e0a59a;
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) .incident-error:not(:empty),
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) .alert {
        background-color: #2b1916;
        border-color: #a77165;
        color: #e0a59a;
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(.adl-notice, .csa-roles-message, .agency-details-notice,
        .incident-status:not(:empty)) {
        background-color: #14221a;
        border-color: #4f6c50;
        color: #b3c69f;
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) .incident-private {
        background-color: #202a1b;
        border-left-color: #77836d;
        color: var(--wam-text);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(.system-use-notice, .sign-in-progress:not(:empty),
        .incident-content-editor button) {
        background-color: var(--wam-surface-subtle);
        border-color: var(--wam-border);
        color: var(--wam-text);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(.system-use-copy, .password-setup p,
        .password-setup summary, .cancel-sign-in a, .sign-in-divider, .incident-content-editor small) {
        color: var(--wam-text);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) .incident-content-editor input:not([type="file"]) {
        background: var(--wam-surface);
        border-color: var(--wam-border-strong);
        color: var(--wam-text);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) .incident-content-editor button:hover:not(:disabled) {
        background: var(--wam-surface-selected);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) .incident-settings-dialog {
        background-color: var(--wam-surface);
        border-color: var(--wam-border-strong);
        color: var(--wam-text);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(.entra-sign-in, .password-setup a) {
        background-color: var(--wam-surface);
        border-color: var(--wam-border-strong);
        color: var(--wam-primary);
    }

    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(.status-pill, .agency-status-badge,
        .dashboard-user-badge, .agency-details-badge, .task-indicator, .queue-count,
        .document-types-badge, .agency-weapon-access-level-badge, .status-chip,
        .adl-badge.archived, .user-status-badge.inactive) {
        background-color: var(--wam-surface-selected);
        color: var(--wam-text);
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(.status-pill.enabled, .agency-status-badge.terminal,
        .agency-details-badge.active, .agency-details-badge.terminal, .dashboard-user-badge.active) {
        background-color: #14221a;
        color: #b3c69f;
    }
    html[data-theme="night"] body :is(.content, .adl-document-dialog-content) :is(.status-pill.disabled, .agency-details-badge.inactive,
        .agency-status-badge.archived) { background-color: var(--wam-surface-selected); color: var(--wam-text-subtle); }

    html[data-theme="night"] .account-links,
    html[data-theme="night"] .configuration-panel,
    html[data-theme="night"] .collapsed .nav-items > .nav-group > .nav-children,
    html[data-theme="night"] body .dxbl-popup,
    html[data-theme="night"] body .dxbl-popup-content,
    html[data-theme="night"] body .dxbl-popup-root,
    html[data-theme="night"] body .dxbl-dropdown,
    html[data-theme="night"] body .dxbl-dropdown-menu,
    html[data-theme="night"] body .dxbl-listbox,
    html[data-theme="night"] body .dxbl-grid,
    html[data-theme="night"] body .dxbl-grid-table,
    html[data-theme="night"] body dialog,
    html[data-theme="night"] #components-reconnect-modal {
        background-color: var(--wam-surface);
        border-color: var(--wam-border-strong);
        color: var(--wam-text);
        box-shadow: var(--wam-shadow-lg);
    }
    /* DevExpress renders modal content outside the layout and resolves its palette on the popup. */
    html[data-theme="night"] body .dxbl-popup {
        --dxbl-popup-bg: var(--wam-surface);
        --dxbl-popup-color: var(--wam-text);
        --dxbl-popup-border-color: var(--wam-border-strong);
        --dxbl-popup-header-color: var(--wam-text);
        --dxbl-popup-header-bg: var(--wam-surface-subtle);
    }
    html[data-theme="night"] #components-reconnect-modal button:not(#reconnect-reload),
    html[data-theme="night"] button#reconnect-open {
        background-color: #34442b;
        border-color: var(--wam-border-strong);
        color: var(--wam-text);
    }
    html[data-theme="night"] #components-reconnect-modal button:not(#reconnect-reload):hover:not(:disabled),
    html[data-theme="night"] button#reconnect-open:hover:not(:disabled) { background-color: #475d38; }
    html[data-theme="night"] body :is(.dxbl-popup, .dxbl-dropdown, .dxbl-listbox, .dxbl-grid) :is(th, td, label, p) {
        color: var(--wam-text);
    }

    html[data-theme="night"] .preview-indicator button {
        background-color: #2b2414;
        border-color: #806d38;
        color: #e2cc86;
    }
    html[data-theme="night"] .preview-indicator button:focus-visible,
    html[data-theme="night"] .login-shell a:focus-visible { outline-color: var(--wam-focus); }

    html[data-theme="night"] .blocking-announcements {
        background-color: #2b2414;
        border-color: #806d38;
        color: #e2cc86;
    }
    html[data-theme="night"] .blocking-announcements :is(h2, h3, p, a, .notice-deadline, .notice-agencies) {
        color: #e2cc86;
    }
    html[data-theme="night"] .blocking-notice { border-top-color: #806d38; }
}

.theme-toggle {
    align-items: center;
    background: var(--wam-surface);
    border: 1px solid var(--wam-border-strong);
    border-radius: .5rem;
    color: var(--wam-primary);
    display: inline-flex;
    flex: 0 0 48px;
    height: 48px;
    justify-content: center;
    min-height: 48px;
    min-width: 48px;
    padding: .5rem;
}
.theme-toggle:hover:not(:disabled) { background: var(--wam-surface-selected); }
.theme-toggle[aria-pressed="true"] { border-color: var(--wam-focus); }
.theme-toggle-icon { font-size: 1.5rem; line-height: 1; }
.message-theme-controls, .anonymous-theme-controls, .login-theme-controls {
    align-items: center;
    display: inline-flex;
    flex: none;
    gap: .65rem;
    min-width: 0;
}
.message-theme-controls { white-space: nowrap; }
.anonymous-theme-controls, .login-theme-controls { flex: 0 1 auto; flex-wrap: wrap; max-width: 100%; }
.login-theme-controls { margin-left: auto; }
.theme-status:not(.theme-save-error) {
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}
.theme-save-error {
    color: var(--wam-danger);
    flex-basis: 100%;
    font-size: .85rem;
    margin: .25rem 0;
    overflow-wrap: anywhere;
}
.theme-toggle-noscript { color: var(--wam-text-subtle); font-size: .8rem; }
.appearance-preference [data-theme-preference] { height: 24px; min-height: 24px; width: 24px; }
.appearance-preference label:has(> [data-theme-preference]) { min-height: 44px; }

@media (max-width: 600px) {
    .login-header { gap: .75rem; }
    .login-theme-controls { margin-left: 0; }
}

@media (forced-colors: active) {
    html[data-theme] { color-scheme: light dark; }
    .theme-toggle[aria-pressed="true"] { border: 2px solid Highlight; }
    .theme-toggle:focus-visible { outline-color: Highlight; }
    html[data-theme="night"] :is(input, textarea):autofill {
        box-shadow: none;
        -webkit-text-fill-color: CanvasText;
        caret-color: CanvasText;
    }
}