/* Shared appearance tokens. Images and household colors keep their own identity. */
:root{--surface-raised:#fffdf8;--surface-soft:#f0eee8;--dock-bg:rgba(255,253,248,.95);--dock-active:#e8f3ee;--on-dark:#fffdf8}
html[data-theme=dark]{--paper:#111619;--white:#1c2428;--surface-raised:#263136;--surface-soft:#232e33;--navy:#25384b;--ink:#f3f3ef;--muted:#afb9c0;--coral:#ff8065;--coral-dark:#ff947c;--green:#82c8ad;--red:#ffab99;--line:rgba(226,234,241,.16);--shadow:0 22px 58px #0006;--dock-bg:rgba(31,40,45,.96);--dock-active:#29483e;--dock-shadow:0 12px 34px #0008;color-scheme:dark;background:var(--paper)}
html[data-theme=dark] body{background:var(--paper);color:var(--ink)}
html[data-theme=dark].mp-account-pending{background:var(--paper)}
html[data-theme=dark].mp-account-pending::after{color:var(--muted)}
html[data-theme=dark] :is(input:not([type=checkbox]):not([type=radio]),select,textarea){background-color:var(--white);color:var(--ink);border-color:var(--line);color-scheme:dark}
html[data-theme=dark] :is(input,textarea)::placeholder{color:#95a3b0;opacity:1}
html[data-theme=dark] :is(dialog,.account-popover,.settings-list,.settings-editor,.wallet-card,.fee-row,.credit-card,.points-program,.points-status-details,.notification-popover,.notification-panel,.auth-card,.auth-shell,.onboarding-choice,.onboarding-credit-group,.household-panel,.billing-card,.plan-card,.reauth-card,.mfa-card){background-color:var(--white);color:var(--ink);border-color:var(--line)}
html[data-theme=dark] .wallet-card{background-image:none}
html[data-theme=dark] :is(.account-menu-link,.account-menu-person strong,.settings-row-copy strong,.points-program-head h3,.points-amount strong,.wallet-card h2,.wallet-card h3,.status-form select){color:var(--ink)}
html[data-theme=dark] :is(.account-menu-person span,.account-menu-section-label,.account-signout,.settings-chevron,.status-sources,.points-status-empty){color:var(--muted)}
html[data-theme=dark] :is(.account-menu-head,.account-menu-divider,.points-status-details,.status-benefit-disclosure .status-benefits){border-color:var(--line)}
html[data-theme=dark] :is(.account-menu-link:hover,.account-settings-shortcut,.settings-icon,.credit-action,.points-program[open]>.points-program-head,.points-status-details,.status-card,.status-icon,.notification-item:hover,.settings-row:hover,.points-program-head:hover,.card-detail-section,.best-card-details[open]){background-color:var(--surface-soft)}
html[data-theme=dark] :is(.brand-mark,.button:not(.secondary):not(.danger),.edit-button.primary,.settings-page .button:not(.secondary):not(.danger),.best-card-launch,.category-button.active,.best-category[aria-pressed=true]){color:var(--on-dark)}
html[data-theme=dark] .settings-page .button:not(.secondary):not(.danger){background:var(--navy)}
html[data-theme=dark] .avatar{background:#b84e37;color:#fffdf8}
html[data-theme=dark] :is(.mp-summary,.mp-dashboard-summary,.dashboard-hero,.dashboard-stats>a,.mp-summary-main,.mp-summary-stats,.points-overview){color:var(--on-dark)!important}
html[data-theme=dark] .mp-summary :is(strong,a),html[data-theme=dark] .mp-dashboard-summary :is(strong,a){color:var(--on-dark)!important}
html[data-theme=dark] :is(.dashboard-attention,.expiry-alert,.setup-progress,.settings-plan.premium,.account-plan-chip,.account-premium-badge){background-color:#3b3222;color:#f3d28d;border-color:#786642}
html[data-theme=dark] .dashboard-attention>a{color:#f3d28d}
html[data-theme=dark] :is(.dash-calendar>span,.credit-status,.credit-deadline,.points-freshness.needs-update,.points-person .needs-update){color:#ffb194}
html[data-theme=dark] .dash-calendar>span{background:#442e28}
html[data-theme=dark] :is(.credit-auto,.bank-linked,.connection-badge,.review-suggestion,.account-activity-link){background:#253f38;color:#9dd8c1;border-color:#4c7568}
html[data-theme=dark] :is(.progress,.bar,.progress-track,.switch span){background-color:#394955}
html[data-theme=dark] .switch input:checked+span{background:#317c65}
html[data-theme=dark] :is(.credit,.credit-action,.dash-renewal,.fee-row,.wallet-body,.wallet-stat,.notification-item,.balance-row,.points-account,.program-benefit,.card-benefit){border-color:var(--line)}
html[data-theme=dark] :is(.app-nav,.topbar,footer){border-color:var(--line)}
html[data-theme=dark] .app-nav a{color:var(--muted)}
html[data-theme=dark] .app-nav a:is(.active,:hover){background:var(--surface-soft);color:var(--ink)}
html[data-theme=dark] .account-popover{box-shadow:0 22px 58px #0008}
html[data-theme=dark] :is(.program-logo,.elite-logo){background:#fffdf8}
html[data-theme=dark] :is(.program-logo-dark,.elite-logo.program-logo-dark){background:#182329}
html[data-theme=dark] :is(.program-logo-fallback,.elite-logo-fallback){background:var(--surface-soft);color:var(--muted)}
html[data-theme=dark] :is(.best-guide,.best-result,.category-button,.category-grid button){background-color:var(--white);border-color:var(--line);color:var(--ink)}
html[data-theme=dark] :is(.category-button[aria-pressed=true],.category-grid button[aria-pressed=true]){background:var(--navy);border-color:#829aaf;color:var(--on-dark)}
html[data-theme=dark] .best-result.is-top{border-color:#679f8c}
html[data-theme=dark] :is(.best-guide-title,.best-result-title,.best-guide-rate,.best-result-rate){color:var(--ink)}
html[data-theme=dark] .best-card-launch{border-color:var(--line);box-shadow:0 4px 12px #0002}
html[data-theme=dark] .toast{background:#e9eee8;color:#142132}
html[data-theme=dark] :is(.cloud-frame,.cloud-frame iframe,.guided-setup,.onboarding-flow,.lounge-page,.household-page,.billing-page,.security-page,.referral-page,.community-page,.mfa-shell){background:var(--paper);color:var(--ink)}
html[data-theme=dark] :is(.auth-card,.onboarding-choice,.onboarding-mode label,.onboarding-credit-group,.onboarding-value,.billing-panel,.referral-panel,.household-card,.mfa-panel,.lounge-card,.lounge-search,.lounge-results,.lounge-detail,.lounge-detail-panel){background-color:var(--white);color:var(--ink);border-color:var(--line)}
html[data-theme=dark] :is(.quiet-button,.onboarding-choice strong,.onboarding-top,.onboarding-inner h1,.auth-card h1,.household-page h1,.lounge-page h1){color:var(--ink)}
html[data-theme=dark] :is(.onboarding-intro,.onboarding-choice small,.onboarding-credit small,.onboarding-progress,.lounge-page p,.auth-card p){color:var(--muted)}
html[data-theme=dark] :is(.onboarding-mode label.selected,.onboarding-choice.selected){background:#263f38;border-color:#679f8c}
html[data-theme=dark] dialog::backdrop{background:#050a10b3;backdrop-filter:blur(5px)}
@media(min-width:1100px){html[data-theme=dark].has-desktop-workspace .app-nav{background:var(--paper)}html[data-theme=dark].has-desktop-workspace .topbar{background:var(--paper)}}
/* Appearance controls deliberately preview both palettes in either theme. */
.appearance-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;border:0;margin:0;padding:0}
.appearance-options legend{font-size:14px;font-weight:600;margin-bottom:14px}
.appearance-option{position:relative;display:flex;flex-direction:column;align-items:center;gap:11px;cursor:pointer;border:1px solid var(--line);border-radius:12px;padding:12px 8px;font-size:13px;color:var(--ink);background:var(--white)}
.appearance-option:has(input:checked){border-color:var(--green);box-shadow:0 0 0 1px var(--green)}
.appearance-option:has(input:focus-visible){outline:3px solid var(--coral);outline-offset:3px}
.appearance-option input{accent-color:var(--green);width:17px;height:17px;margin:0}
.appearance-preview{width:100%;max-width:96px;height:68px;border-radius:7px;border:1px solid #80808055;background:#f7f4ed;padding:10px;display:grid;gap:6px;overflow:hidden}
.appearance-preview::before,.appearance-preview::after{content:'';height:15px;border-radius:3px;background:#fffdf8;border:1px solid #14213222}
.appearance-preview.dark{background:#111619}.appearance-preview.dark::before,.appearance-preview.dark::after{background:#25384b;border-color:#ffffff20}
.appearance-preview.system{background:linear-gradient(90deg,#f7f4ed 50%,#111619 50%)}.appearance-preview.system::before,.appearance-preview.system::after{background:linear-gradient(90deg,#fffdf8 50%,#25384b 50%);border-color:#80808055}
/* Native account screens and shared popovers use the same palette as the tabs. */
html[data-theme=dark] :is(.notification-bell,.notification-swipe .notification-link,.notification-swipe .notification-link.unread,.notification-popover .small-button){background:var(--white);color:var(--ink);border-color:var(--line)}
html[data-theme=dark] :is(.notification-link h3,.notification-link strong,.notification-popover-head strong){color:var(--ink)}
html[data-theme=dark] :is(.notification-link p,.notification-link small,.notification-popover-head p){color:var(--muted)}
html[data-theme=dark] .button:not(.secondary):not(.danger){background:var(--coral);color:#101d2d}
html[data-theme=dark] .settings-page .button:not(.secondary):not(.danger),html[data-theme=dark] .elite-form-actions .button{background:var(--navy);color:var(--on-dark)}
html[data-theme=dark] :is(.billing-shell,.hh-shell,.security-shell,.onboarding-bottom){background:var(--paper);color:var(--ink);border-color:var(--line)}
html[data-theme=dark] :is(.billing-plan,.billing-notice,.hh-list,.hh-add-form,.hh-link,.security-card,.security-topbar,.onboarding-plan-card,.onboarding-credit,.tracking-panel){background:var(--white);color:var(--ink);border-color:var(--line)}
html[data-theme=dark] :is(.hh-shell h1,.hh-shell h2,.hh-person strong,.hh-topbar a,.hh-back,.billing-shell h1,.billing-shell h2,.billing-top a,.security-brand,.security-card h1,.security-card h2){color:var(--ink)!important}
html[data-theme=dark] :is(.hh-shell p,.hh-shell small,.hh-heading p,.billing-shell p,.billing-shell small,.security-card p,.security-kicker,.security-back,.security-card label){color:var(--muted)}
html[data-theme=dark] :is(.hh-status,.billing-cadence button,.tracking-panel button,.fee-tracking-pill.confirmed,.usage-mode.automatic,.award-date-button,.credit-complete:hover,.usage-button:hover){background:var(--surface-soft);color:var(--ink);border-color:var(--line)}
html[data-theme=dark] .lounge-shell{--l-paper:var(--paper);--l-white:var(--white);--l-ink:var(--ink);--l-muted:var(--muted);--l-green:var(--green);--l-line:var(--line)}
html[data-theme=dark] :is(.lounge-entry,.lounge-card-icon,.lounge-card-options,.lounge-hero-icon,.lounge-tabs,.lounge-tabs button span,.airport-search-popup li[aria-selected=true]){background:var(--surface-soft);border-color:var(--line)}
html[data-theme=dark] .lounge-results{background:transparent}
html[data-theme=dark] .best-card-page .category:hover{background:var(--surface-soft);border-color:var(--muted)}
html[data-theme=dark] .best-card-page .category.active{background:var(--navy);border-color:#829aaf;color:#fffdf8}
html[data-theme=dark] .best-card-page .result.winner{border-color:#679f8c}

html[data-theme=dark] .button.coral{color:#101d2d!important}

/* Status badges and household colors must remain legible on dark surfaces. */
html[data-theme=dark] body :is(.credit-auto,.bank-linked,.connection-badge,.usage-mode.automatic,.dash-activity-icon){background:#244138!important;color:#a6dfc7!important;border-color:#426b5b}
html[data-theme=dark] body :is(.owner-badge,.dash-owner,.points-owner,.credit-owner,.member-name-pill){background:color-mix(in srgb,var(--owner-text,#b43d25) 26%,var(--paper))!important;color:color-mix(in srgb,var(--owner-text,#b43d25) 32%,#fff)!important}
html[data-theme=dark] body :is(.credit-action,.voucher-value){border-left-color:var(--line)}
html[data-theme=dark] .dash-decision.keep{border-color:#527d6c}
html[data-theme=dark] .dash-decision.downgrade{color:#e3c482}
html[data-theme=dark] .dash-calendar>span{background:#3e2d28}
html[data-theme=dark] .mobile-app-nav{border-color:#ffffff24}
html[data-theme=dark] .mobile-app-nav a:focus-visible{outline-color:var(--green)}
