/* TrackTake 1.2.0 — a real, persistent dark theme across every public/account view. */
:root{--surface:#fff;--surface-raised:#f8f9fc;--surface-input:#fff;--body-text:#344054;--subtle:#667085;--accent:#5b40d6;--action:#5b40d6;--action-hover:#4930b9;--accent-soft:#eee8ff;--control-line:#c8d0dc}
html[data-theme="dark"],html[data-theme="dark"] .app-shell,.showcase[data-theme="dark"],.shipment-example[data-theme="dark"]{--ink:#f5f5f7;--muted:#b0b0bf;--body-text:#d5d5df;--subtle:#a0a0af;--line:#2b2b35;--bg:#09090b;--surface:#111115;--surface-raised:#19191f;--surface-input:#0d0d11;--purple:#b3a4ff;--purple-dark:#c9beff;--purple-soft:#242034;--accent:#b3a4ff;--action:#7356db;--action-hover:#6446cc;--accent-soft:#242034;--control-line:#42424f;--shadow:0 4px 20px #0000001a;color-scheme:dark;color:var(--ink)}
html[data-theme="dark"] body{background:var(--bg);color:var(--ink)}
.appearance-toggle{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:38px;min-width:39px;padding:8px 11px;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--body-text);font-size:11px;font-weight:650;white-space:nowrap}
.appearance-toggle:hover{border-color:var(--accent);color:var(--accent)}
.appearance-toggle>span{display:inline-flex;align-items:center;justify-content:center}
.appearance-toggle .icon{width:17px;height:17px}
.brand-icon{background:var(--action)}
.appearance-moon{display:none!important}
html[data-theme="light"] .appearance-sun{display:none!important}
html[data-theme="light"] .appearance-moon{display:inline-flex!important}
.auth-topline{display:flex;align-items:center;justify-content:space-between;gap:15px}
.auth-topline .auth-back{margin:0}
.overview-action>.btn{min-height:48px;font-size:13px;padding:13px 22px}
.workspace-updates{margin-top:38px;padding-top:28px;border-top:1px solid var(--line)}
.updates-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:20px}
.updates-heading .eyebrow{font-size:9px;margin-bottom:9px;letter-spacing:1.1px}
.updates-heading h2{font-size:24px;font-weight:800}
.updates-list{display:flex;flex-direction:column;gap:13px}
.update-card{display:flex;gap:17px;border:1px solid var(--line);background:var(--surface);border-radius:12px;padding:22px}
.update-card>div{min-width:0;flex:1}
.update-icon{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:10px;background:var(--accent-soft);color:var(--accent);flex-shrink:0}
.update-icon>.icon{width:18px;height:18px}
.update-meta{display:flex;align-items:center;gap:13px;font-size:10px;margin-bottom:9px;color:var(--subtle)}
.update-type{font-weight:750;color:var(--accent)}
.update-card h3{font-size:16px;letter-spacing:-.2px;font-weight:750;line-height:1.5}
.update-card p{white-space:pre-line;overflow-wrap:anywhere;font-size:13px;line-height:1.8;margin-top:8px;color:var(--muted)}
.update-issue .update-icon{background:#fff1db;color:#985500}.update-issue .update-type{color:#985500}
.update-fixed .update-icon,.update-resolved .update-icon{background:#e8f5eb;color:#217843}.update-fixed .update-type,.update-resolved .update-type{color:#217843}
.update-maintenance .update-icon{background:#eaf1ff;color:#275aa8}.update-maintenance .update-type{color:#275aa8}
/* Shared black surfaces. The marketing demo uses the same table/button selectors. */
html[data-theme="dark"] :is(.site-header,.sidebar,.app-topbar,.panel,.stat-card,.plan-card,.search-panel,.help-card,.auth-main,.modal,.checkout-page .woocommerce){background:var(--surface);border-color:var(--line)}
html[data-theme="dark"] :is(.app-shell,.public-content,.legal-page,.auth-layout){background:var(--bg)}
html[data-theme="dark"] .app-shell :is(h1,h2,h3),html[data-theme="dark"] :is(.modal h2,.auth-main h2,.plan-title,.plan-price,.plan-credits strong,.setting-row strong,.payment-row b,.profile-heading h2){color:var(--ink)}
html[data-theme="dark"] :is(.brand,.app-topbar strong,.credit-wallet strong,.sidebar-user strong,.recent-row strong){color:var(--ink)}
html[data-theme="dark"] :is(.app-shell .page-heading p,.app-shell .quick-search p,.app-shell .panel-heading p,.app-shell .empty-state p,.app-shell .stat-card>span:not(.stat-icon),.app-shell .table-dates,.app-shell .table-dates>small,.app-shell .under-table-note,.panel-heading p,.under-table-note){color:var(--muted)!important}
html[data-theme="dark"] :is(.stat-card>strong,.stat-card .stat-plan,.dashboard-view .quick-search h2,.amount-input>span,.amount-input>input,.deposit-recap>strong,.detail-modal .detail-info strong,.detail-modal .detail-route h3,.detail-modal .timeline-title){color:var(--ink)}
html[data-theme="dark"] :is(p,.desktop-nav,.sidebar-user small,.nav-section,.breadcrumb,.breadcrumb>.icon,.secure-label,.app-footer,.stat-card>small,.stat-card>a,.snapshot-label,.recent-row div>span,.table-carrier small,.table-route small,.plan-price>span,.plan-credits,.plan-card .unit-price,.plan-features li,.plans-grid .plan-features li,.plan-summary,.plan-bottom,.plan-payments,.plan-payments>span,.payment-choice small,.payment-safe,.payment-row small,.referral-code,.referral-link-card p,.referral-explainer p,.help-card p,.profile-heading p,.setting-row,.referral-code,.detail-modal .detail-route p,.detail-modal .detail-info span,.detail-modal .timeline-item span,.detail-modal .timeline-item small,.detail-modal .detail-footer,.search-secondary>span,.calendar-navigation>span,.calendar-weekdays>span,.date-popover-header p,.date-popover-footer>span,.date-range-preview>div>span,.date-preview-arrow){color:var(--muted)}
html[data-theme="dark"] :is(label,.field-label,.app-shell label,.app-shell .field-label,.app-shell .search-primary label,.app-shell .search-primary .field-label,.app-shell .payment-label,.app-shell .deposit-panel label){color:var(--body-text)!important}
html[data-theme="dark"] :is(input:not([type="hidden"]),select,textarea,.app-shell input:not([type="hidden"]),.app-shell select){background-color:var(--surface-input);border-color:var(--control-line);color:var(--ink)}
html[data-theme="dark"] input::placeholder{color:var(--subtle);opacity:1}
html[data-theme="dark"] :is(.input-icon>.icon,.app-shell .input-icon>.icon,.search-primary .input-icon>.icon,.input-suffix,.app-shell .search-primary .input-suffix,.table-dates .icon,.app-shell .table-dates .icon,.side-link>.icon,.app-shell .side-link>.icon,.credit-wallet .icon,.icon-btn,.app-shell .icon-btn){color:var(--subtle)}
html[data-theme="dark"] :is(.btn-primary,.app-shell .btn-primary){background:var(--action);border-color:var(--action);color:#fff;box-shadow:0 4px 15px #0002}
html[data-theme="dark"] :is(.btn-primary:hover,.app-shell .btn-primary:hover){background:var(--action-hover);border-color:var(--action-hover);color:#fff}
html[data-theme="dark"] :is(.btn-primary .icon,.app-shell .btn-primary .icon,.app-shell .credit-wallet>.btn .icon){color:#fff}
html[data-theme="dark"] :is(.btn-outline,.app-shell .btn-outline){background:var(--surface-raised);border-color:var(--control-line);color:var(--ink)}
html[data-theme="dark"] :is(.btn-outline:hover,.app-shell .btn-outline:hover,.icon-btn:hover){background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}
html[data-theme="dark"] :is(.app-shell .text-button,.app-shell .panel-heading>a,.app-shell .small-referral>a,.app-shell .app-footer>a,.app-shell .stat-card>a,.auth-form-wrap a,.form-options>a,.resend-form>button,.auth-back,.plan-features .icon,.app-shell .plan-features .icon,.pricing-foot a,.text-arrow){color:var(--accent)}
html[data-theme="dark"] :is(.eyebrow,.app-shell .page-heading .eyebrow,.referral-link-card .eyebrow,.auth-main .eyebrow,.modal .eyebrow){color:var(--accent)}
html[data-theme="dark"] .app-shell .nav-section{color:var(--subtle)}
html[data-theme="dark"] .app-shell .side-link{color:var(--muted)}
html[data-theme="dark"] .app-shell .side-link.active{background:var(--accent-soft);color:#d5caff}
html[data-theme="dark"] .app-shell .side-link.active>.icon{color:#c5b6ff}
html[data-theme="dark"] .app-shell .side-link:hover{background:var(--surface-raised)}
html[data-theme="dark"] .app-shell .side-link.active:hover{background:#2c2540}
html[data-theme="dark"] :is(.credit-wallet,.app-shell .credit-wallet,.topbar-credits,.app-shell .topbar-credits,.carrier-tabs,.app-shell .carrier-tabs,.page-chip,.app-shell .page-chip,.count-chip,.app-shell .count-chip,.plan-summary,.app-shell .plan-summary,.referral-copy,.referral-explainer article>span,.app-shell .referral-explainer article>span){background:var(--surface-raised);border-color:var(--line);color:var(--body-text)}
html[data-theme="dark"] :is(.credit-wallet span,.app-shell .credit-wallet span){color:var(--muted)}
html[data-theme="dark"] :is(.topbar-credits b,.app-shell .topbar-credits b,.topbar-credits>.icon,.app-shell .topbar-credits>.icon){color:var(--accent)}
html[data-theme="dark"] :is(.avatar,.app-shell .avatar,.stat-icon.purple,.app-shell .stat-icon.purple,.empty-state>span,.app-shell .empty-state>span,.payment-row-icon,.app-shell .payment-row-icon){color:#c6b8ff;background:#2b233f;border-color:#423555}
html[data-theme="dark"] .app-shell .stat-icon.green{color:#8cd2a7;background:#14291e}
html[data-theme="dark"] .app-shell .stat-icon.blue{color:#9abfff;background:#19283f}
html[data-theme="dark"] .app-shell .stat-icon.amber{color:#e8c077;background:#302516}
html[data-theme="dark"] :is(.dashboard-view .quick-search,.app-shell .small-referral,.referral-banner,.referral-link-card,.app-shell .referral-link-card){background:linear-gradient(105deg,#1a1628,#131318);border-color:#393046}
html[data-theme="dark"] .dashboard-view .quick-search-icon{background:#302543;color:var(--accent)}
html[data-theme="dark"] :is(.dashboard-rule,.dashboard-rule>.icon,.app-shell .small-referral,.app-shell .small-referral>span>.icon){color:var(--muted)}
html[data-theme="dark"] :is(.panel-heading,.app-shell .panel-heading,.search-secondary,.app-shell .search-secondary,.advanced-filters,.app-shell .advanced-filters,.plan-features,.app-shell .plan-features,.recent-row,.app-shell .recent-row,.payment-row,.deposit-recap,.setting-row,.pagination,.app-shell .pagination,.app-footer,.app-shell .app-footer){border-color:var(--line)}
html[data-theme="dark"] :is(.carrier-tabs>button,.app-shell .carrier-tabs>button){color:var(--muted)}
html[data-theme="dark"] :is(.carrier-tabs>button.selected,.app-shell .carrier-tabs>button.selected){color:#d5caff;background:#2b243d;border-color:#53426d}
html[data-theme="dark"] :is(.table-head,.app-shell .table-head){background:#17171d;border-color:var(--line);color:var(--subtle)}
html[data-theme="dark"] :is(.tracking-row,.app-shell .tracking-row){background:var(--surface);border-color:var(--line)}
html[data-theme="dark"] :is(.table-carrier>span:not(.carrier-logo),.app-shell .table-carrier>span:not(.carrier-logo),.table-route>div,.app-shell .table-route>div,.table-route strong,.app-shell .table-route strong){color:var(--body-text)}
html[data-theme="dark"] .table-route>div:first-child:before{border-color:#51515c}
html[data-theme="dark"] :is(.route-point,.app-shell .route-point){background:#71717e;border-color:#71717e}
html[data-theme="dark"] :is(.route-point.destination,.app-shell .route-point.destination){background:#a994ed;border-color:#a994ed}
html[data-theme="dark"] :is(.table-unlock,.app-shell .table-unlock){border-color:var(--line)}
html[data-theme="dark"] :is(.status.transit,.app-shell .status.transit),.showcase[data-theme="dark"] .status.transit,.shipment-example[data-theme="dark"] .status.transit{color:#a8caff;background:#19283e;border-color:#2b4161}
html[data-theme="dark"] :is(.status.delivered,.app-shell .status.delivered),.showcase[data-theme="dark"] .status.delivered{color:#91d9ac;background:#162b20;border-color:#2a4834}
html[data-theme="dark"] :is(.status.pre_transit,.app-shell .status.pre_transit){color:#ccaff2;background:#2b203b;border-color:#4a345f}
html[data-theme="dark"] :is(.status.exception,.app-shell .status.exception){color:#e9c17e;background:#302616;border-color:#574423}
html[data-theme="dark"] :is(.btn-unlock,.app-shell .btn-unlock),.showcase[data-theme="dark"] .btn-unlock{background:#2b233f;border-color:#54446d;color:#ddcfff}
html[data-theme="dark"] :is(.btn-unlock>span,.app-shell .btn-unlock>span),.showcase[data-theme="dark"] .btn-unlock>span{color:#cbbce5;border-color:#625077}
html[data-theme="dark"] :is(.btn-unlock .icon,.app-shell .btn-unlock .icon){color:#ddcfff}
html[data-theme="dark"] :is(.revealed-number,.app-shell .revealed-number),.showcase[data-theme="dark"] .revealed-number{color:#d9caff;background:#252033;border-color:#50435f}
html[data-theme="dark"] :is(.free-reopen,.app-shell .free-reopen,.success-text,.app-shell .success-text){color:#91d9ac!important}
html[data-theme="dark"] :is(.plan-card.featured,.app-shell .plan-card.featured){border-color:#a68be9;box-shadow:0 0 0 1px #a68be9,0 8px 35px #7356db16}
html[data-theme="dark"] .popular-label{background:var(--action);color:white}
html[data-theme="dark"] :is(.plan-payments b,.app-shell .plan-payments b,.referral-copy code,.app-shell .referral-copy code,.payment-choice strong,.app-shell .payment-choice strong,.modal .payment-choice strong,.payment-row strong,.app-shell .payment-row strong,.referral-explainer h3,.app-shell .referral-explainer h3){color:var(--body-text)}
html[data-theme="dark"] :is(.payment-choice,.app-shell .payment-choice,.payment-icon,.app-shell .payment-icon,.amount-input,.app-shell .amount-input,.amount-presets button,.app-shell .amount-presets button){background:var(--surface-input);border-color:var(--control-line);color:var(--body-text)}
html[data-theme="dark"] :is(.payment-choice:has(input:checked),.app-shell .payment-choice:has(input:checked),.amount-presets button.selected,.app-shell .amount-presets button.selected){background:var(--accent-soft);border-color:#8666b0;color:var(--accent)}
html[data-theme="dark"] :is(.paypal-text,.payment-icon.paypal-text,.app-shell .payment-icon.paypal-text){color:#a0c5ff}
html[data-theme="dark"] :is(.balance-card,.app-shell .balance-card){background:#1a1527;border-color:#393046}
html[data-theme="dark"] :is(.referral-gift,.gift-art){background:#2b233c;border-color:#4c3b61;color:#ccaff2;transform:none}
html[data-theme="dark"] :is(.notice,.purchase-summary,.detail-route,.number-copy){background:var(--surface-raised);border-color:var(--line);color:var(--body-text)}
html[data-theme="dark"] .notice.error{background:#301b21;border-color:#62303f;color:#ffc2c4}
html[data-theme="dark"] .demo-bar{background:#1c2918;color:#d5e9c2}
html[data-theme="dark"] .modal-backdrop{background:#000a}
html[data-theme="dark"] :is(.modal .purchase-summary strong,.modal .purchase-summary>b,.detail-modal .number-copy){color:#d1bcff}
html[data-theme="dark"] .detail-modal .timeline-item strong{color:var(--body-text)}
html[data-theme="dark"] .detail-modal .timeline-item:before{background:var(--line)}
html[data-theme="dark"] .detail-modal .timeline-item>i{background:#6d5d81}
html[data-theme="dark"] .detail-modal .timeline-item.current>i{background:#b09be2;box-shadow:0 0 0 4px #2d223d}
html[data-theme="dark"] .detail-modal .detail-footer>span{color:#91d9ac}
html[data-theme="dark"] :is(.date-range-trigger,.date-popover,.calendar-icon-button,.calendar-day){background:var(--surface);color:var(--body-text);border-color:var(--control-line)}
html[data-theme="dark"] :is(.date-range-trigger:hover,.calendar-icon-button:hover,.calendar-shortcuts>button:hover,.calendar-day:hover){background:var(--accent-soft);color:#ddcfff;border-color:#745b99}
html[data-theme="dark"] :is(.date-popover-header h3,.calendar-month h4,.date-range-preview strong){color:var(--ink)}
html[data-theme="dark"] :is(.date-range-preview>div,.calendar-shortcuts>button){background:var(--surface-raised);border-color:var(--line);color:var(--muted)}
html[data-theme="dark"] .date-range-preview>div.current{border-color:#8c6cb5;background:#272035}
html[data-theme="dark"] .calendar-day.in-range{background:#332640;color:#e0cfff}
html[data-theme="dark"] .calendar-day.is-today:not(.range-start):not(.range-end){color:#d7bfff;box-shadow:inset 0 0 0 1px #9b82d1}
html[data-theme="dark"] :is(.calendar-day.range-start,.calendar-day.range-end){background:var(--action);color:#fff}
html[data-theme="dark"] .calendar-clear{color:var(--accent)}
html[data-theme="dark"] .date-popover-footer{border-color:var(--line)}
html[data-theme="dark"] :is(.toast,.skip-link){background:#25202f;color:#f5f2fb;border:1px solid #544567}
html[data-theme="dark"] .update-issue :is(.update-icon,.update-type){color:#e9c17e}.update-issue .update-icon{border:1px solid transparent}
html[data-theme="dark"] .update-issue .update-icon{background:#302616}
html[data-theme="dark"] :is(.update-fixed,.update-resolved) :is(.update-icon,.update-type){color:#91d9ac}
html[data-theme="dark"] :is(.update-fixed,.update-resolved) .update-icon{background:#162b20}
html[data-theme="dark"] .update-maintenance :is(.update-icon,.update-type){color:#a8caff}html[data-theme="dark"] .update-maintenance .update-icon{background:#19283e}
@media(max-width:760px){.appearance-toggle{min-height:36px;padding:7px 9px}.appearance-label{display:none!important}.topbar-right{gap:10px}.overview-action>.btn{width:100%;min-height:46px}.updates-heading h2{font-size:22px}.update-card{padding:18px 15px;gap:13px}.update-card h3{font-size:15px}.update-card p{font-size:12px}.workspace-updates{margin-top:28px}.update-icon{width:31px;height:32px}.overview-action .quick-search-icon{flex-shrink:0}.auth-topline{margin-bottom:25px}}
