/* Shared exclusively by the administrative pages. */
:root {
    color-scheme: light;
    --appearance-bg: #e8edef;
    --appearance-active: #fff;
    --appearance-text: #51636e;
    --appearance-selected: #17272f;
    --appearance-border: #cbd6dc;
}

.admin-theme-switch {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 4px;
    border: 1px solid var(--appearance-border);
    border-radius: 10px;
    background: var(--appearance-bg);
    white-space: nowrap;
}
.admin-theme-switch button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 34px;
    padding: 6px 10px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--appearance-text);
    font: 600 11px/1.4 system-ui, sans-serif;
    cursor: pointer;
}
.admin-theme-switch button:hover { color: var(--appearance-selected); background: var(--appearance-active); }
.admin-theme-switch button[aria-pressed="true"] {
    background: var(--appearance-active);
    color: var(--appearance-selected);
    box-shadow: 0 2px 6px #00000012;
}
.admin-theme-switch button:focus-visible { outline: 2px solid #43b9ad; outline-offset: 2px; }
.admin-theme-switch button span { font-size: 17px; line-height: 1; }
.admin-login-appearance { display: flex; justify-content: flex-end; margin-bottom: 22px; }
.admin-topbar-appearance { order: 2; flex-shrink: 0; }
.mail-appearance { display: flex; align-items: center; }

html[data-admin-theme="dark"] {
    color-scheme: dark;
    --admin-bg: #10171f;
    --admin-surface: #18232e;
    --admin-surface-soft: #1e2c39;
    --admin-sidebar: #111b24;
    --admin-sidebar-soft: #243544;
    --admin-text: #e3ebf2;
    --admin-muted: #9caebd;
    --admin-border: #304150;
    --admin-teal: #71d4c5;
    --admin-teal-dark: #8ee0d3;
    --admin-teal-soft: #193a39;
    --admin-amber: #efbd78;
    --admin-amber-soft: #3d3021;
    --admin-danger: #ff9aab;
    --admin-danger-soft: #402633;
    --admin-blue: #a1c8ee;
    --admin-blue-soft: #22384d;
    --admin-shadow: 0 12px 32px #00000026;
    --ink: var(--admin-text);
    --muted: var(--admin-muted);
    --border: var(--admin-border);
    --teal: var(--admin-teal);
    --appearance-bg: #101b25;
    --appearance-active: #2b4052;
    --appearance-text: #9caebd;
    --appearance-selected: #e3ebf2;
    --appearance-border: #354a5a;
    --bs-body-bg: var(--admin-bg);
    --bs-body-color: var(--admin-text);
    --bs-border-color: var(--admin-border);
    --bs-secondary-color: var(--admin-muted);
    --bs-tertiary-bg: var(--admin-surface-soft);
}

/* Surfaces and controls */
[data-admin-theme="dark"] .admin-login-shell {
    background: radial-gradient(ellipse at 15% 15%, #1c3e443d, transparent 55%),
        radial-gradient(ellipse at 90% 85%, #41305338, transparent 50%), var(--admin-bg);
}
[data-admin-theme="dark"] :is(.admin-login-panel, .admin-stat, .admin-panel, .admin-toolbar,
    .admin-table-shell, .admin-filter-panel, .admin-key-value-wrap, .admin-toast, .admin-modal) {
    background: var(--admin-surface);
    border-color: var(--admin-border);
}
[data-admin-theme="dark"] .admin-topbar { background: #18232ef2; }
[data-admin-theme="dark"] :is(.admin-access-model, .admin-key-result) {
    background: linear-gradient(120deg, #1a3339, var(--admin-surface) 80%);
    border-color: #365451;
}
[data-admin-theme="dark"] :is(.form-control, .form-select) {
    background-color: #111d28;
    color: var(--admin-text);
    border-color: #405362;
}
[data-admin-theme="dark"] :is(.form-control, .form-select):focus {
    border-color: var(--admin-teal);
    box-shadow: 0 0 0 3px #71d4c520;
}
[data-admin-theme="dark"] .form-control::placeholder { color: #8a9dac; }
[data-admin-theme="dark"] :is(.form-control:disabled, .form-select:disabled, .form-control[readonly]) { background-color: var(--admin-surface-soft); }
[data-admin-theme="dark"] :is(.admin-secondary-btn, .admin-icon-btn, .admin-row-action) {
    background: var(--admin-surface-soft);
    border-color: var(--admin-border);
    color: var(--admin-text);
}
[data-admin-theme="dark"] :is(.admin-secondary-btn, .admin-icon-btn, .admin-row-action):hover {
    background: #2b4052;
    border-color: #587082;
    color: #fff;
}
[data-admin-theme="dark"] .admin-danger-btn { background: #b5253d; border-color: #b5253d; color: #fff; }
[data-admin-theme="dark"] .admin-danger-btn:hover { background: #962039; }
[data-admin-theme="dark"] .admin-nav-item.active { background: #2b4052; color: #fff; }
[data-admin-theme="dark"] .admin-nav-item.active .admin-nav-count { color: #ff9aab; }
[data-admin-theme="dark"] :is(.admin-section-kicker, .admin-nav-item.active > i) { color: #ff8b9f; }
[data-admin-theme="dark"] :is(.admin-modal .modal-footer, .admin-user-active-toggle, .admin-detail-grid dt) { background: var(--admin-surface-soft); }
[data-admin-theme="dark"] :is(.admin-panel-header, .admin-activity-item, .admin-expiring-item,
    .admin-detail-grid dt, .admin-detail-grid dd) { border-color: var(--admin-border); }

/* Tables, captions and semantic status colors */
[data-admin-theme="dark"] .admin-table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--admin-text);
    --bs-table-border-color: var(--admin-border);
}
[data-admin-theme="dark"] .admin-table thead th { background: var(--admin-surface-soft); color: var(--admin-muted); border-color: var(--admin-border); }
[data-admin-theme="dark"] .admin-table tbody td { color: var(--admin-text); border-color: var(--admin-border); }
[data-admin-theme="dark"] .admin-table tbody tr:hover { background: #20313f; }
[data-admin-theme="dark"] :is(.form-label, .admin-table-stack strong, .admin-detail-grid dd, .admin-empty strong) { color: var(--admin-text); }
[data-admin-theme="dark"] :is(.admin-control-help, .admin-label-meta, .admin-access-model p,
    .admin-stat > span, .admin-stat > small, .admin-api-status, .admin-table-stack span,
    .admin-activity-copy span, .admin-expiring-copy span, .admin-activity-time,
    .admin-result-count, .admin-pagination, .admin-last-updated, .admin-key-result-heading span,
    .admin-key-result > p, .admin-user-active-toggle small, .admin-detail-grid dt,
    .admin-password-state, .admin-empty, .admin-list-empty) { color: var(--admin-muted); }
[data-admin-theme="dark"] :is(code, .admin-role-badge) { color: var(--admin-blue); }
[data-admin-theme="dark"] .admin-user-avatar { background: var(--admin-blue-soft); color: var(--admin-blue); }
[data-admin-theme="dark"] :is(.admin-access-model-icon, .admin-key-result-icon) { color: #12312e; }
[data-admin-theme="dark"] .admin-role-badge.is-admin { background: #342d4c; color: #ccb9f4; }
[data-admin-theme="dark"] :is(.admin-tier.is-free, .admin-tier.is-unknown) { background: var(--admin-surface-soft); color: var(--admin-muted); }
[data-admin-theme="dark"] :is(.admin-security-note, .admin-modal-note, .admin-audit-notice,
    .admin-form-error.is-success, .admin-row-action.is-primary) {
    background: var(--admin-teal-soft); color: var(--admin-teal); border-color: #365d57;
}
[data-admin-theme="dark"] :is(.admin-status-expired, .admin-expiring-days, .admin-tier.is-legacy,
    .admin-password-state.is-pending) { color: var(--admin-amber); }
[data-admin-theme="dark"] :is(.admin-form-error, .admin-row-action.is-danger) {
    background: var(--admin-danger-soft); color: var(--admin-danger); border-color: #69404d;
}
[data-admin-theme="dark"] :is(.admin-status-inactive, .admin-api-status.is-offline) { color: var(--admin-danger); }

/* Mailing uses its own stylesheet without Bootstrap. Email previews retain their authored colors. */
[data-admin-theme="dark"] .admin-mailing-page { background: var(--admin-bg); color: var(--admin-text); }
[data-admin-theme="dark"] .mail-header { background: var(--admin-sidebar); border-bottom: 1px solid var(--admin-border); }
[data-admin-theme="dark"] .admin-mailing-page :is(.panel, dialog) { background: var(--admin-surface); }
[data-admin-theme="dark"] .admin-mailing-page :is(input:not([type=checkbox]), textarea, select) {
    background: #111d28; color: var(--admin-text); border-color: #405362;
}
[data-admin-theme="dark"] .admin-mailing-page :is(input, textarea)::placeholder { color: #8a9dac; }
[data-admin-theme="dark"] .admin-mailing-page :is(button:not(.primary), .file-button) {
    background: var(--admin-surface-soft); color: var(--admin-text); border-color: var(--admin-border);
}
[data-admin-theme="dark"] .admin-mailing-page :is(button:not(.primary), .file-button):hover { background: #2b4052; }
[data-admin-theme="dark"] .admin-mailing-page :is(.mail-tabs button, .group-card > button, .chip button) { background: transparent; }
[data-admin-theme="dark"] .admin-mailing-page .mail-tabs [aria-current] { color: var(--admin-teal); border-bottom-color: var(--admin-teal); }
[data-admin-theme="dark"] .admin-mailing-page :is(th, td, .sender-source) { border-color: var(--admin-border); }
[data-admin-theme="dark"] .admin-mailing-page tr[draggable=true]:hover { background: var(--admin-surface-soft); }
[data-admin-theme="dark"] :is(.selection-bar, .sender-source, .group-card.active, .group-card.drag-over) { background: var(--admin-teal-soft); }
[data-admin-theme="dark"] .sender-card { background: linear-gradient(135deg, #1a3339, var(--admin-surface) 80%); border-color: #365451; }
[data-admin-theme="dark"] .sender-icon { background: var(--admin-teal-soft); }
[data-admin-theme="dark"] :is(.chip, .badge) { background: var(--admin-surface-soft); }
[data-admin-theme="dark"] :is(.badge.accepted, #mail-notice) { background: var(--admin-teal-soft); color: var(--admin-teal); border-color: #365d57; }
[data-admin-theme="dark"] :is(.badge.failed, #mail-notice.error, #mail-dialog-error, #mail-picker-error) { background: var(--admin-danger-soft); color: var(--admin-danger); border-color: #69404d; }
[data-admin-theme="dark"] :is(.badge.pending, .badge.unknown) { background: var(--admin-amber-soft); color: var(--admin-amber); }
[data-admin-theme="dark"] .admin-mailing-page button.danger { color: var(--admin-danger); border-color: #69404d; }
[data-admin-theme="dark"] .admin-mailing-page .admin-theme-switch button { background: transparent; color: var(--appearance-text); }
[data-admin-theme="dark"] .admin-mailing-page .admin-theme-switch button[aria-pressed="true"],
[data-admin-theme="dark"] .admin-mailing-page .admin-theme-switch button:hover { background: var(--appearance-active); color: var(--appearance-selected); }

@media (max-width: 720px) {
    .admin-topbar { flex-wrap: wrap; }
    .admin-topbar-appearance { display: flex; justify-content: flex-end; width: 100%; }
    .mail-header { flex-wrap: wrap; }
}