/* CloudPortal TV — light / dark theme tokens and toggle */

:root,
[data-theme="dark"] {
    color-scheme: dark;
    --accent: var(--brand);
    --border: var(--line);
    --link: #a9beff;
    --link-hover: #d4e0ff;
    --nav-text: #c9d4ff;
    --nav-hover-border: #3a4a7d;
    --nav-hover-bg: #151f3e;
    --sidebar-bg: linear-gradient(180deg, #0f1630 0%, #0a1126 100%);
    --body-bg: radial-gradient(circle at top right, #18234a 0%, var(--bg) 35%);
    --toolbar-bg: rgba(11, 16, 32, 0.94);
    --input-bg: #101836;
    --input-border: #31406e;
    --btn-secondary-bg: #1a2548;
    --btn-secondary-border: #31406e;
    --btn-secondary-text: var(--text);
    --card-bg-end: #111933;
    --table-row-border: #243057;
    --badge-bg: #111936;
    --bell-text: #c9d4ff;
    --bell-hover-border: #3a4a7d;
    --bell-hover-bg: #151f3e;
    --bell-hover-text: #e7eeff;
    --select-text: #dce6ff;
    --select-border: #3a5f8a;
    --select-bg: rgba(79, 124, 255, 0.14);
    --select-chevron: #8fa8e8;
    --call-text: #9bf4dd;
    --call-text-hover: #c8fff0;
    --call-border: #2f8f75;
    --call-bg: rgba(32, 201, 151, 0.12);
    --call-bg-hover: rgba(32, 201, 151, 0.22);
    --backdrop: rgba(3, 6, 17, 0.65);
    --ok-badge-text: #9bf4dd;
    --ok-badge-border: #2f8f75;
    --ok-badge-bg: rgba(32, 201, 151, 0.1);
    --err-badge-text: #ffc4c4;
    --err-badge-border: #8c3f55;
    --err-badge-bg: rgba(255, 107, 107, 0.1);
    --warn-badge-text: #c9b88a;
    --warn-badge-border: #5c5238;
    --warn-badge-bg: rgba(120, 100, 62, 0.1);
    --surface-inset: #0f1528;
    --surface-inset-hover: #121c36;
    --surface-inset-active: #152245;
    --surface-inset-active-end: #101a35;
    --surface-inset-accent: #1a2750;
    --surface-inset-chip: #10182e;
    --surface-inset-chip-active-start: #1a2a55;
    --surface-inset-chip-active-end: #152040;
    --surface-inset-pill: #1a2340;
    --surface-inset-logo: #0d142b;
    --surface-inset-text: #e8ecff;
    --surface-inset-text-muted: #96a9d8;
    --surface-inset-border-hover: #4a5f9a;
    --theme-track: #1a2548;
    --theme-track-border: #31406e;
    --theme-thumb: #4f7cff;
    --theme-icon: #e8ecff;
    --online-ring-text: #9bf4dd;
    --online-ring-border: rgba(32, 201, 151, 0.35);
    --online-ring-bg: rgba(32, 201, 151, 0.15);
}

[data-theme="light"] {
    color-scheme: light;
    --bg: #e8edf5;
    --panel: #ffffff;
    --panel-2: #f4f7fb;
    --line: #c5d0e0;
    --text: #0f172a;
    --muted: #64748b;
    --brand: #2563eb;
    --brand-2: #4f46e5;
    --shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
    --link: #1d4ed8;
    --link-hover: #1e40af;
    --nav-text: #334155;
    --nav-hover-border: #94b4e8;
    --nav-hover-bg: #e3ebf8;
    --sidebar-bg: linear-gradient(180deg, #ffffff 0%, #f1f5f9 100%);
    --body-bg: radial-gradient(circle at top right, #dbeafe 0%, var(--bg) 48%);
    --toolbar-bg: rgba(255, 255, 255, 0.94);
    --input-bg: #ffffff;
    --input-border: #cbd5e1;
    --btn-secondary-bg: #f1f5f9;
    --btn-secondary-border: #cbd5e1;
    --btn-secondary-text: #334155;
    --card-bg-end: #f8fafc;
    --table-row-border: #e2e8f0;
    --badge-bg: #f1f5f9;
    --bell-text: #475569;
    --bell-hover-border: #94b4e8;
    --bell-hover-bg: #e3ebf8;
    --bell-hover-text: #0f172a;
    --select-text: #0f172a;
    --select-border: #94a3b8;
    --select-bg: rgba(37, 99, 235, 0.08);
    --select-chevron: #64748b;
    --call-text: #047857;
    --call-text-hover: #065f46;
    --call-border: #34d399;
    --call-bg: rgba(16, 185, 129, 0.12);
    --call-bg-hover: rgba(16, 185, 129, 0.2);
    --backdrop: rgba(15, 23, 42, 0.45);
    --ok-badge-text: #047857;
    --ok-badge-border: #6ee7b7;
    --ok-badge-bg: rgba(16, 185, 129, 0.12);
    --err-badge-text: #b91c1c;
    --err-badge-border: #fca5a5;
    --err-badge-bg: rgba(220, 38, 38, 0.08);
    --warn-badge-text: #92400e;
    --warn-badge-border: #fcd34d;
    --warn-badge-bg: rgba(245, 158, 11, 0.12);
    --surface-inset: #1e293b;
    --surface-inset-hover: #243044;
    --surface-inset-active: #334155;
    --surface-inset-active-end: #1e293b;
    --surface-inset-accent: #475569;
    --surface-inset-chip: #1e293b;
    --surface-inset-chip-active-start: #334155;
    --surface-inset-chip-active-end: #1e293b;
    --surface-inset-pill: #334155;
    --surface-inset-logo: #0f172a;
    --surface-inset-text: #f1f5f9;
    --surface-inset-text-muted: #cbd5e1;
    --surface-inset-border-hover: #64748b;
    --theme-track: #e2e8f0;
    --theme-track-border: #cbd5e1;
    --theme-thumb: #2563eb;
    --theme-icon: #ffffff;
    --online-ring-text: #047857;
    --online-ring-border: #34d399;
    --online-ring-bg: rgba(16, 185, 129, 0.14);
}

[data-theme="light"] a {
    color: var(--link);
}

[data-theme="light"] a:hover {
    color: var(--link-hover);
}

[data-theme="light"] body {
    background: var(--body-bg);
    color: var(--text);
}

[data-theme="light"] .sidebar {
    background: var(--sidebar-bg);
    box-shadow: 1px 0 0 var(--line);
}

[data-theme="light"] .nav-link {
    color: var(--nav-text);
}

[data-theme="light"] .nav-link.active,
[data-theme="light"] .nav-link:hover,
[data-theme="light"] .nav-group-toggle:hover,
[data-theme="light"] .nav-group-toggle.is-active,
[data-theme="light"] .nav-group--expandable.is-open > .nav-group-toggle {
    border-color: var(--nav-hover-border);
    background: var(--nav-hover-bg);
    color: var(--text);
}

[data-theme="light"] .nav-group-toggle {
    color: var(--nav-text);
}

[data-theme="light"] .app-toolbar {
    background: var(--toolbar-bg);
    border-bottom-color: var(--line);
}

[data-theme="light"] input,
[data-theme="light"] select,
[data-theme="light"] textarea {
    background: var(--input-bg);
    border-color: var(--input-border);
    color: var(--text);
}

[data-theme="light"] button.secondary {
    background: var(--btn-secondary-bg);
    border-color: var(--btn-secondary-border);
    color: var(--btn-secondary-text);
}

[data-theme="light"] .card {
    background: linear-gradient(180deg, var(--panel) 0%, var(--card-bg-end) 100%);
}

[data-theme="light"] th,
[data-theme="light"] td {
    border-bottom-color: var(--table-row-border);
}

[data-theme="light"] .badge {
    background: var(--badge-bg);
    color: var(--muted);
}

[data-theme="light"] .badge.ok {
    color: var(--ok-badge-text);
    border-color: var(--ok-badge-border);
    background: var(--ok-badge-bg);
}

[data-theme="light"] .badge.err {
    color: var(--err-badge-text);
    border-color: var(--err-badge-border);
    background: var(--err-badge-bg);
}

[data-theme="light"] .badge.warn {
    color: var(--warn-badge-text);
    border-color: var(--warn-badge-border);
    background: var(--warn-badge-bg);
}

[data-theme="light"] .toolbar-property-switcher__field::after {
    border-right-color: var(--select-chevron);
    border-bottom-color: var(--select-chevron);
}

[data-theme="light"] .toolbar-property-switcher__select {
    border-color: var(--select-border);
    background: var(--select-bg);
    color: var(--select-text);
}

[data-theme="light"] .support-call-btn {
    border-color: var(--call-border);
    background: var(--call-bg);
    color: var(--call-text);
}

[data-theme="light"] .support-call-btn:hover {
    background: var(--call-bg-hover);
    color: var(--call-text-hover);
}

[data-theme="light"] .notifications-bell {
    color: var(--bell-text);
}

[data-theme="light"] .notifications-bell:hover,
[data-theme="light"] .notifications-bell[aria-expanded="true"] {
    border-color: var(--bell-hover-border);
    background: var(--bell-hover-bg);
    color: var(--bell-hover-text);
}

[data-theme="light"] .alarm-dialog::backdrop,
[data-theme="light"] .notifications-dialog::backdrop {
    background: var(--backdrop);
}

[data-theme="light"] body.admin-cms {
    background: radial-gradient(circle at 12% -8%, rgba(37, 99, 235, 0.12) 0%, transparent 42%),
        radial-gradient(circle at 88% 0%, rgba(255, 45, 32, 0.05) 0%, transparent 36%),
        var(--bg);
}

[data-theme="light"] body.admin-cms .sidebar {
    background: var(--sidebar-bg);
}

[data-theme="light"] body.admin-cms a {
    color: var(--link);
}

[data-theme="light"] body.admin-cms a:hover {
    color: var(--link-hover);
}

[data-theme="light"] body.admin-cms .admin-brand-mark {
    color: #dc2626;
    border-color: rgba(15, 23, 42, 0.08);
}

[data-theme="light"] body.admin-cms .admin-brand-pill {
    color: #1e40af;
    background: rgba(37, 99, 235, 0.1);
    border-color: rgba(37, 99, 235, 0.25);
}

[data-theme="light"] body.admin-cms .admin-subnav__link {
    color: var(--nav-text);
}

[data-theme="light"] body.admin-cms .admin-subnav__link.is-active,
[data-theme="light"] body.admin-cms .admin-subnav__link:hover {
    color: var(--text);
    background: var(--nav-hover-bg);
    border-color: var(--nav-hover-border);
}

[data-theme="light"] body.admin-cms .admin-table th,
[data-theme="light"] body.admin-cms .admin-table td {
    border-color: var(--table-row-border);
}

[data-theme="light"] body.admin-cms .admin-section,
[data-theme="light"] body.admin-cms .admin-stat-card,
[data-theme="light"] body.admin-cms .admin-form-panel {
    background: var(--panel);
    border-color: var(--line);
}

[data-theme="light"] .docs-sidebar {
    background: var(--panel);
    border-color: var(--line);
}

[data-theme="light"] .docs-card {
    background: var(--panel);
    border-color: var(--line);
}

[data-theme="light"] .docs-card:hover {
    border-color: var(--brand);
    box-shadow: var(--shadow);
}

[data-theme="light"] .docs-nav__link {
    color: var(--nav-text);
}

[data-theme="light"] .docs-nav__link.is-active,
[data-theme="light"] .docs-nav__link:hover {
    background: var(--nav-hover-bg);
    color: var(--text);
}

[data-theme="light"] .docs-prose code {
    background: var(--panel-2);
    color: #1e3a8a;
}

[data-theme="light"] .docs-prose th,
[data-theme="light"] .docs-prose td {
    border-color: var(--line);
}

[data-theme="light"] .docs-prose table th {
    background: var(--panel-2);
}

[data-theme="light"] .notifications-item__card {
    color: var(--surface-inset-text);
}

[data-theme="light"] .notifications-item__meta {
    color: var(--surface-inset-text-muted);
}

[data-theme="light"] .notifications-item__title {
    color: var(--surface-inset-text);
}

[data-theme="light"] .notifications-dialog__close {
    color: var(--nav-text);
}

[data-theme="light"] .notifications-dialog__close:hover {
    background: var(--nav-hover-bg);
    color: var(--text);
}

[data-theme="light"] .dashboard-breakdown__row {
    background: #1e293b;
    color: #f8fafc;
}

[data-theme="light"] .dashboard-breakdown__name {
    color: #ffffff;
}

[data-theme="light"] .dashboard-breakdown__meta {
    color: #e2e8f0;
}

[data-theme="light"] .dashboard-online-ring {
    background: var(--online-ring-bg);
    color: var(--online-ring-text);
    border-color: var(--online-ring-border);
}

[data-theme="light"] .support-subnav__link.is-active {
    color: var(--text);
    background: var(--nav-hover-bg);
}

[data-theme="light"] .alert.ok {
    background: var(--ok-badge-bg);
    border-color: var(--ok-badge-border);
    color: var(--ok-badge-text);
}

[data-theme="light"] .alert.err {
    background: var(--err-badge-bg);
    border-color: var(--err-badge-border);
    color: var(--err-badge-text);
}

[data-theme="light"] .docs-sidebar__switch {
    border-top-color: var(--line);
}

[data-theme="light"] .docs-sidebar__switch-link {
    color: var(--link);
}

[data-theme="light"] .support-page__lead,
[data-theme="light"] .support-ticket-card__title {
    color: var(--text);
}

[data-theme="light"] .support-status--open {
    color: #b45309;
}

[data-theme="light"] .support-status--progress {
    color: #1d4ed8;
}

[data-theme="light"] .support-status--resolved {
    color: #047857;
}

[data-theme="light"] .support-ticket-card__meta {
    color: var(--muted);
}

/* Theme toggle — topbar, beside Call us */
.theme-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: auto;
    padding: 4px;
    border: 1px solid var(--theme-track-border);
    border-radius: 999px;
    background: var(--panel);
    color: var(--text);
    cursor: pointer;
    flex-shrink: 0;
    transition: border-color 0.15s, background 0.15s;
    -webkit-tap-highlight-color: transparent;
}

.theme-toggle:hover {
    border-color: var(--brand);
}

.theme-toggle__track {
    display: block;
    width: 44px;
    height: 24px;
    border-radius: 999px;
    background: var(--theme-track);
    position: relative;
    transition: background 0.2s ease;
}

.theme-toggle__thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--theme-thumb);
    color: var(--theme-icon);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s ease, background 0.2s ease;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
}

.theme-toggle.is-light .theme-toggle__thumb {
    transform: translateX(20px);
}

.theme-toggle__icon {
    position: absolute;
    width: 14px;
    height: 14px;
}

.theme-toggle__icon--sun {
    opacity: 0;
    transform: scale(0.6);
    transition: opacity 0.15s, transform 0.15s;
}

.theme-toggle__icon--moon {
    opacity: 1;
    transition: opacity 0.15s, transform 0.15s;
}

.theme-toggle.is-light .theme-toggle__icon--sun {
    opacity: 1;
    transform: scale(1);
}

.theme-toggle.is-light .theme-toggle__icon--moon {
    opacity: 0;
    transform: scale(0.6);
}

.theme-toggle__text {
    font-size: 13px;
    font-weight: 600;
    padding-right: 8px;
    color: var(--muted);
}

.login-theme-toggle {
    position: fixed;
    top: max(12px, env(safe-area-inset-top));
    right: max(12px, env(safe-area-inset-right));
    z-index: 20;
}

@media (max-width: 640px) {
    .theme-toggle__text {
        display: none;
    }

    .theme-toggle {
        padding: 4px;
    }
}