:root,
:root[data-theme="light"] {
    color-scheme: light;

    --dfms-primary: #667eea;
    --dfms-primary-hover: #5565d5;
    --dfms-accent: #764ba2;
    --dfms-secondary: #3b82f6;
    --dfms-page: #f4f6fb;
    --dfms-surface: #ffffff;
    --dfms-surface-muted: #f8fafc;
    --dfms-text: #1f2937;
    --dfms-text-muted: #64748b;
    --dfms-border: #e2e8f0;
    --dfms-muted: var(--dfms-text-muted);
    --dfms-primary-soft: #eef2ff;
    --dfms-sidebar: #111827;
    --dfms-success: #10b981;
    --dfms-warning: #d97706;
    --dfms-danger: #dc2626;

    /* Compatibility aliases for generic controls in app.css. */
    --primary: var(--dfms-primary);
    --primary-hover: var(--dfms-primary-hover);
    --primary-container: var(--dfms-primary-soft);
    --secondary: var(--dfms-secondary);
    --success: var(--dfms-success);
    --warning: var(--dfms-warning);
    --danger: var(--dfms-danger);
    --background: var(--dfms-page);
    --surface: var(--dfms-surface);
    --outline: var(--dfms-border);
    --text-primary: var(--dfms-text);
    --text-secondary: var(--dfms-text-muted);
    --text-muted: #94a3b8;
}

:root[data-theme="dark"] {
    color-scheme: dark;

    --dfms-primary: #93a4ff;
    --dfms-primary-hover: #b1bcff;
    --dfms-accent: #c49ae9;
    --dfms-secondary: #70b1ff;
    --dfms-page: #0f172a;
    --dfms-surface: #172033;
    --dfms-surface-muted: #202b40;
    --dfms-text: #edf2ff;
    --dfms-text-muted: #aebbd2;
    --dfms-border: #334155;
    --dfms-muted: var(--dfms-text-muted);
    --dfms-primary-soft: #252c5d;
    --dfms-sidebar: #0b1220;
    --dfms-success: #34d399;
    --dfms-warning: #fbbf24;
    --dfms-danger: #fb7185;

    --primary: var(--dfms-primary);
    --primary-hover: var(--dfms-primary-hover);
    --primary-container: var(--dfms-primary-soft);
    --secondary: var(--dfms-secondary);
    --success: var(--dfms-success);
    --warning: var(--dfms-warning);
    --danger: var(--dfms-danger);
    --background: var(--dfms-page);
    --surface: var(--dfms-surface);
    --outline: var(--dfms-border);
    --text-primary: var(--dfms-text);
    --text-secondary: var(--dfms-text-muted);
    --text-muted: #94a3b8;
}

:root[data-theme="dark"] body,
:root[data-theme="dark"] .page-container,
:root[data-theme="dark"] .first-user-page,
:root[data-theme="dark"] .access-denied,
:root[data-theme="dark"] .not-found {
    background: var(--dfms-page);
    color: var(--dfms-text);
}

/* Shared theme control. Contextual placement belongs to the page/layout CSS. */
.theme-toggle {
    z-index: 1;
    display: inline-grid;
    place-items: center;
    flex: 0 0 var(--dfms-icon-control-size, 2.25rem);
    width: var(--dfms-icon-control-size, 2.25rem);
    min-width: var(--dfms-icon-control-size, 2.25rem);
    height: var(--dfms-icon-control-size, 2.25rem);
    min-height: var(--dfms-icon-control-size, 2.25rem);
    padding: 0;
    border: 1px solid var(--dfms-border);
    border-radius: var(--dfms-control-radius, .75rem);
    color: var(--dfms-primary);
    background: var(--dfms-surface);
    box-shadow: var(--shadow-sm);
    font-size: .9rem;
    line-height: 1;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition:
        background-color var(--dfms-transition-fast, 160ms ease),
        border-color var(--dfms-transition-fast, 160ms ease),
        box-shadow var(--dfms-transition-fast, 160ms ease);
}

.theme-toggle:hover {
    background: var(--dfms-primary-soft);
    border-color: var(--dfms-primary);
    box-shadow: var(--shadow-sm);
}

.theme-toggle:focus-visible {
    outline: 2px solid var(--dfms-primary);
    outline-offset: 2px;
    box-shadow: var(--dfms-focus-ring, 0 0 0 .2rem rgb(102 126 234 / 20%));
}

.theme-toggle-moon {
    display: none;
}

:root[data-theme="dark"] .theme-toggle-sun {
    display: none;
}

:root[data-theme="dark"] .theme-toggle-moon {
    display: inline;
}

@media (prefers-reduced-motion: reduce) {
    .theme-toggle {
        transition: none;
    }
}