/* SyncTV customer portal light/dark theme. Loaded last so every portal workspace, modal and wizard follows one preference. */
:root{color-scheme:light}
html[data-synctv-theme="dark"]{color-scheme:dark;--ink:#edf4ff;--muted:#aab7cc;--line:#2c3a53;--bg:#0b1220;--card:#141d2d;--good:#42d79b;--bad:#ff7188}

.synctv-theme-toggle{position:fixed;top:14px;right:14px;z-index:9000;display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:9px 13px;border:1px solid rgba(128,145,176,.28);border-radius:999px;background:rgba(255,255,255,.9);color:#33415f;box-shadow:0 8px 24px rgba(26,39,64,.14);backdrop-filter:blur(12px);font:900 12px "Nunito",sans-serif;cursor:pointer;transition:transform .18s ease,background .18s ease,color .18s ease,border-color .18s ease}
.synctv-theme-toggle:hover{transform:translateY(-1px)}
.synctv-theme-toggle:focus-visible{outline:3px solid rgba(34,189,236,.35);outline-offset:2px}
.synctv-theme-toggle .synctv-theme-icon{font-size:16px;line-height:1}

html[data-synctv-theme="dark"] body{background:radial-gradient(circle at top right,#1a1834 0,#0f1728 34%,#09111d 100%)!important;color:#edf4ff!important}
html[data-synctv-theme="dark"] .synctv-theme-toggle{background:rgba(20,29,45,.94);color:#edf4ff;border-color:#33435f;box-shadow:0 8px 26px rgba(0,0,0,.35)}
html[data-synctv-theme="dark"] .brand-lockup span,
html[data-synctv-theme="dark"] .muted,
html[data-synctv-theme="dark"] .hero p,
html[data-synctv-theme="dark"] .login-card p,
html[data-synctv-theme="dark"] .metric span,
html[data-synctv-theme="dark"] .metric small,
html[data-synctv-theme="dark"] .balance span,
html[data-synctv-theme="dark"] .balance small,
html[data-synctv-theme="dark"] .detail-list span,
html[data-synctv-theme="dark"] .stream-row small,
html[data-synctv-theme="dark"] .stream-cell span,
html[data-synctv-theme="dark"] .workspace-panel p,
html[data-synctv-theme="dark"] .addon-card p,
html[data-synctv-theme="dark"] .addon-privacy,
html[data-synctv-theme="dark"] .support-summary-line,
html[data-synctv-theme="dark"] .transaction-main span,
html[data-synctv-theme="dark"] .transaction-meta span{color:#aab7cc!important}

html[data-synctv-theme="dark"] .side{background:linear-gradient(180deg,rgba(17,25,40,.97),rgba(11,18,31,.96))!important;box-shadow:2px 0 24px rgba(0,0,0,.22)!important}
html[data-synctv-theme="dark"] .side nav a{color:#b7c2d6!important}
html[data-synctv-theme="dark"] .side nav a:hover{background:#19253a!important;color:#f4f8ff!important}
html[data-synctv-theme="dark"] .side nav a.active{color:#fff!important;background:linear-gradient(135deg,#22bdec,#7657e6)!important}
html[data-synctv-theme="dark"] .top{background:linear-gradient(180deg,rgba(13,21,35,.94),rgba(13,21,35,.78))!important;box-shadow:0 1px 0 rgba(92,113,148,.22)!important}

html[data-synctv-theme="dark"] .login-card,
html[data-synctv-theme="dark"] .metric,
html[data-synctv-theme="dark"] .panel,
html[data-synctv-theme="dark"] .workspace-panel,
html[data-synctv-theme="dark"] .addon-card,
html[data-synctv-theme="dark"] .addon-tool,
html[data-synctv-theme="dark"] .addon-provisioning-panel,
html[data-synctv-theme="dark"] .transaction-row,
html[data-synctv-theme="dark"] .transactions-shell,
html[data-synctv-theme="dark"] .support-box,
html[data-synctv-theme="dark"] .support-create,
html[data-synctv-theme="dark"] .support-ticket,
html[data-synctv-theme="dark"] .request-card,
html[data-synctv-theme="dark"] .security-card,
html[data-synctv-theme="dark"] .plan-card,
html[data-synctv-theme="dark"] .bundle-card,
html[data-synctv-theme="dark"] .detail-list,
html[data-synctv-theme="dark"] .detail-list>div,
html[data-synctv-theme="dark"] .stream-row,
html[data-synctv-theme="dark"] .synctv-media-summary{background:#141d2d!important;border-color:#2c3a53!important;color:#edf4ff!important;box-shadow:0 10px 28px rgba(0,0,0,.18)!important}

html[data-synctv-theme="dark"] .hero{background:linear-gradient(125deg,#182338,#211b3d)!important;border-color:#392f64!important;color:#edf4ff!important;box-shadow:0 16px 36px rgba(0,0,0,.22)!important}
html[data-synctv-theme="dark"] .soft-panel,
html[data-synctv-theme="dark"] .balance{background:linear-gradient(135deg,#13263a,#211a3a)!important;border-color:#2c3a53!important;color:#edf4ff!important}
html[data-synctv-theme="dark"] .notice{background:#251f43!important;color:#cbbcff!important}
html[data-synctv-theme="dark"] .chip{background:#1b2940!important;color:#c6d3e9!important}
html[data-synctv-theme="dark"] .chip.good{background:#15392f!important;color:#6be0b1!important}
html[data-synctv-theme="dark"] .chip.bad{background:#44202b!important;color:#ff9baa!important}

html[data-synctv-theme="dark"] .ghost-btn,
html[data-synctv-theme="dark"] .logout,
html[data-synctv-theme="dark"] button.secondary,
html[data-synctv-theme="dark"] .addon-action.secondary{background:#19253a!important;color:#e1e9f6!important;border-color:#33435f!important;box-shadow:none!important}
html[data-synctv-theme="dark"] .ghost-btn:hover,
html[data-synctv-theme="dark"] .logout:hover,
html[data-synctv-theme="dark"] button.secondary:hover,
html[data-synctv-theme="dark"] .addon-action.secondary:hover{background:#22304a!important}

html[data-synctv-theme="dark"] input,
html[data-synctv-theme="dark"] select,
html[data-synctv-theme="dark"] textarea,
html[data-synctv-theme="dark"] .addon-form input,
html[data-synctv-theme="dark"] .addon-form select,
html[data-synctv-theme="dark"] .addon-form textarea,
html[data-synctv-theme="dark"] .addon-provisioning-form input,
html[data-synctv-theme="dark"] .support-create input,
html[data-synctv-theme="dark"] .support-create select,
html[data-synctv-theme="dark"] .support-create textarea{background:#0d1625!important;color:#edf4ff!important;border-color:#34445f!important;box-shadow:none!important}
html[data-synctv-theme="dark"] input::placeholder,
html[data-synctv-theme="dark"] textarea::placeholder{color:#7f8da6!important}
html[data-synctv-theme="dark"] input[readonly]{background:#192338!important;color:#b8c5d9!important}

/* Guided setup follows the same portal theme in dark mode. */
html[data-synctv-theme="dark"] .synctv-setup-overlay{background:rgba(3,8,18,.82)!important}
html[data-synctv-theme="dark"] .synctv-setup-dialog{background:#121b2b!important;color:#edf4ff!important;box-shadow:0 30px 90px rgba(0,0,0,.58)!important}
html[data-synctv-theme="dark"] .synctv-setup-hero{background:linear-gradient(125deg,#22bdec,#7657e6 58%,#ff6b5e)!important}
html[data-synctv-theme="dark"] .synctv-setup-body p{color:#aab7cc!important}
html[data-synctv-theme="dark"] .synctv-setup-form label{color:#c0ccdf!important}
html[data-synctv-theme="dark"] .synctv-setup-form input{background:#0c1523!important;color:#edf4ff!important;border-color:#34445f!important}
html[data-synctv-theme="dark"] .synctv-setup-form input[readonly]{background:#1b263a!important;color:#bac6da!important}
html[data-synctv-theme="dark"] .synctv-setup-callout{background:#15283a!important;color:#a9d7f1!important}
html[data-synctv-theme="dark"] .synctv-setup-callout.good{background:#12372e!important;color:#78e4ba!important}
html[data-synctv-theme="dark"] .synctv-setup-callout.warn{background:#3a2f16!important;color:#f1d68d!important}
html[data-synctv-theme="dark"] .synctv-setup-actions .secondary{background:#1b263a!important;color:#d5deec!important}

/* Dynamic portal workspaces and onboarding overlays. */
html[data-synctv-theme="dark"] [class*="workspace"],
html[data-synctv-theme="dark"] [class*="transaction"]:not(.transaction-status),
html[data-synctv-theme="dark"] [class*="support-"]:not(.support-status-line),
html[data-synctv-theme="dark"] [class*="request-"]:not(.request-status),
html[data-synctv-theme="dark"] [class*="security-"]:not(.security-hero),
html[data-synctv-theme="dark"] [class*="addon-"]:not(.addon-badge):not(.addon-status):not(.addon-action),
html[data-synctv-theme="dark"] [class*="onboarding-"]{border-color:#2c3a53}
html[data-synctv-theme="dark"] .portal-tour-card,
html[data-synctv-theme="dark"] .onboarding-card,
html[data-synctv-theme="dark"] .onboarding-panel{background:#141d2d!important;color:#edf4ff!important;border-color:#33435f!important}

/* Broadcast Control is a separate customer page and follows the same saved theme. */
html[data-synctv-theme="dark"] .app-body{background:linear-gradient(180deg,#0b1321 0%,#080e19 100%)!important;color:#edf4ff!important}
html[data-synctv-theme="dark"] .topbar{background:rgba(18,27,43,.9)!important;border-color:#2d3c56!important;box-shadow:0 12px 34px rgba(0,0,0,.25)!important}
html[data-synctv-theme="dark"] .top-pill{background:#19263a!important;border-color:#30415c!important;color:#c4d0e2!important}
html[data-synctv-theme="dark"] .panel{background:#141d2d!important;border-color:#2c3a53!important}
html[data-synctv-theme="dark"] .setup-block,
html[data-synctv-theme="dark"] .technical-details{border-color:#2a3850!important}
html[data-synctv-theme="dark"] .helper,
html[data-synctv-theme="dark"] .technical-details summary,
html[data-synctv-theme="dark"] .connection-guidance,
html[data-synctv-theme="dark"] .tip-card p{color:#aab7cc!important}
html[data-synctv-theme="dark"] .status-chip{background:#2b244a!important;color:#cbbcff!important}
html[data-synctv-theme="dark"] .preview-badge{background:#153149!important;color:#9fd7ff!important}
html[data-synctv-theme="dark"] .mini-card,
html[data-synctv-theme="dark"] .connection-check-card,
html[data-synctv-theme="dark"] .connection-reading{background:#101a2a!important;border-color:#2d3c56!important;color:#edf4ff!important}
html[data-synctv-theme="dark"] .mini-card span,
html[data-synctv-theme="dark"] .connection-reading span{color:#9eacc1!important}
html[data-synctv-theme="dark"] .code{background:#0a1220!important;border-color:#2d3c56!important;color:#d8e3f2!important}
html[data-synctv-theme="dark"] .tip-card{background:linear-gradient(135deg,#211d3b,#321d31)!important;border-color:#45355a!important;color:#edf4ff!important}
html[data-synctv-theme="dark"] .button.secondary{background:#1b293e!important;color:#d8e2f0!important}
html[data-synctv-theme="dark"] .button.danger{background:#42202b!important;color:#ff9bac!important}

/* The User Manual was originally dark-only; these overrides let it honor the same saved Light/Dark choice. */
html[data-synctv-theme="light"]{--bg:#f5f8fe;--card:#ffffff;--soft:#eef3fb;--line:#dfe7f2;--text:#1a2740;--muted:#65738b;--cyan:#168fc0;--blue:#4d6fe8;--green:#16865e;--amber:#9b6818;--red:#c7435d}
html[data-synctv-theme="light"] body:has(.wrap){background:radial-gradient(circle at 20% 0,#edf3ff 0,transparent 34rem),var(--bg)!important;color:var(--text)!important}
html[data-synctv-theme="light"] .wrap .top{background:rgba(255,255,255,.92)!important;border-color:var(--line)!important;color:var(--text)!important}
html[data-synctv-theme="light"] .wrap .top a{color:var(--text)!important}
html[data-synctv-theme="light"] .wrap .hero{background:linear-gradient(135deg,rgba(77,111,232,.10),rgba(22,143,192,.04))!important;border-color:var(--line)!important;color:var(--text)!important}
html[data-synctv-theme="light"] .wrap .toc,
html[data-synctv-theme="light"] .wrap main section{background:var(--card)!important;border-color:var(--line)!important;color:var(--text)!important}
html[data-synctv-theme="light"] .wrap .steps li,
html[data-synctv-theme="light"] .wrap .pill{background:var(--soft)!important;border-color:var(--line)!important;color:var(--text)!important}
html[data-synctv-theme="light"] .wrap code{background:#f1f5fb!important;color:#24324a!important;border-color:var(--line)!important}

@media(max-width:700px){.synctv-theme-toggle{top:auto;right:12px;bottom:12px;min-height:42px;padding:10px 13px}}