/* ==========================================================================
   REV TORQ Customer PWA — Build 178 dark mode
   Active only when <html data-theme="dark"> (set by js/theme.js before first paint).
   Loaded last. Step 1 flips the design tokens (most Build 167+ styles use them);
   the rest overrides older surfaces/text that hard-code light colours.
   ========================================================================== */

html[data-theme="dark"],
html[data-theme="dark"] body,
html[data-theme="dark"] .app.rt-light,
html[data-theme="dark"] #modal{
  /* names used by the older layers (customer-v2.css defines them on .app.rt-light) */
  --rt-text:#f4f0ef;
  --rt-card:#1d191a;
  --rt-card-2:#252022;
  --rt-border:#3a3335;
  --rt-accent-soft:rgba(236,77,96,.13);
  --rt-ink:#f4f0ef;
  --rt-ink-2:#d9d1d0;
  --rt-muted:#a39a9c;
  --rt-muted-2:#8a8184;
  --rt-line:#3a3335;
  --rt-line-2:#2c2628;
  --rt-surface:#1d191a;
  --rt-surface-2:#252022;
  --rt-bg:#100d0e;
  --rt-red-50:rgba(236,77,96,.13);
  --rt-red-100:rgba(236,77,96,.22);
  --rt-red-200:rgba(236,77,96,.4);
  --rt-red-600:#ec4d60;
  --rt-red-700:#ff7385;
  --rt-green-50:rgba(64,200,128,.14);
  --rt-green-600:#5ad08f;
  --rt-gold-50:rgba(240,185,74,.14);
  --rt-gold-600:#f1bf55;
  --rt-shadow-sm:0 1px 2px rgba(0,0,0,.45);
  --rt-shadow-md:0 10px 26px rgba(0,0,0,.45);
  color-scheme:dark;
}

/* ---------- page ---------- */
html[data-theme="dark"],
html[data-theme="dark"] body,
html[data-theme="dark"] body.rt-light-theme,
html[data-theme="dark"] .app.rt-light{background:var(--rt-bg)!important;color:var(--rt-ink)!important}
html[data-theme="dark"] .app.rt-light .screen{background:transparent!important}

/* ---------- text ---------- */
html[data-theme="dark"] .app.rt-light .screen>:is(h1,h2,h3),
html[data-theme="dark"] .app.rt-light :is(.section-title,.rt-service-head,.rt-booking-head,.rt-account-section-head,.rt-simple-section-head,.rt-rv2-head,.rt-step-head) :is(h1,h2,h3),
html[data-theme="dark"] .sheet :is(h1,h2,h3,h4,label){color:var(--rt-ink)!important}
html[data-theme="dark"] .app.rt-light :is(li,dd,dt){color:var(--rt-ink-2)!important}
html[data-theme="dark"] .app.rt-light .muted,
html[data-theme="dark"] .sheet .muted{color:var(--rt-muted)!important}

/* ---------- surfaces: every card-like block ---------- */
html[data-theme="dark"] .app.rt-light :is(
  .card,.rt-prime-quick-grid>button,.rt-prime-service-card,.rt-prime-checkin-card,.rt-prime-bike-card,
  .rt-smart-home,.rt-booking-panel,.rt-service-current,.rt-next-service,.rt-service-log-card,
  .rt-notification-card,.rt-promo-hero,.rt-push-status,.rt-push-prefs,.rt-reward-summary,
  .rt-acct-card,.rt-account-menu,.rt-account-bike-row,.rt-account-help-grid button,.rt-account-more,
  .rt-onboarding,.rt-service-tiles button,.rt-slot-grid button,.rt-vehicle-choice button,
  .rt-booking-summary,.rt-social-chip,.rt-booking-history-row,.rt-active-booking,.rt-dyno-shortcut,
  .rt-rv2-catalog-card,.rt-rv2-my-card,.rt-rv2-balance,.rt-rv2-stat,.rt-simple-more,
  .rt-referral-code-card,.rt-referral-stats article,.rt-referral-how li,
  .rt-food-rider-benefits article,.rt-food-rider-profile-card,.rt-feedback-prompt,
  .rt-acct-stats>*,.rt-acct-edit,.empty,.rt-slot-empty,.rt-booking-warning-check
){
  background:var(--rt-surface)!important;
  border-color:var(--rt-line-2)!important;
  color:var(--rt-ink)!important;
  box-shadow:var(--rt-shadow-sm)!important;
}
html[data-theme="dark"] .app.rt-light :is(
  .card,.rt-prime-quick-grid>button,.rt-prime-service-card,.rt-smart-home,.rt-booking-panel,.rt-service-current,
  .rt-next-service,.rt-service-log-card,.rt-notification-card,.rt-account-menu,.rt-account-bike-row,.rt-account-help-grid button,
  .rt-account-more,.rt-onboarding,.rt-service-tiles button,.rt-vehicle-choice button,.rt-booking-summary,.rt-booking-history-row,
  .rt-rv2-catalog-card,.rt-rv2-my-card,.rt-referral-code-card,.rt-referral-how li,.rt-food-rider-benefits article,
  .rt-fun-ranking-row,.rt-service-note,.rt-step-done,.rt-acct-stats>*
) :is(strong,b,h2,h3,h4,label){color:var(--rt-ink)!important}
html[data-theme="dark"] .app.rt-light .rt-account-more>div>button,
html[data-theme="dark"] .app.rt-light .rt-account-more>div{background:transparent!important;border-color:var(--rt-line-2)!important}
html[data-theme="dark"] .app.rt-light :is(.rt-fun-ranking-row,.rt-step-done,.rt-service-note,.rt-rv2-reward-copy,.rt-rv2-reward-main,.rt-rv2-reward-foot,.rt-rv2-tabs,.rt-rv2-tabs button,.rt-simple-more-body,.rt-simple-more summary){
  background:var(--rt-surface)!important;border-color:var(--rt-line-2)!important;color:var(--rt-ink)!important;
}
html[data-theme="dark"] .app.rt-light .rt-fun-ranking-row.rt-fun-ranking-me{background:#2a1a1d!important}
html[data-theme="dark"] .app.rt-light .rt-rv2-tabs button.active{color:var(--rt-ink)!important}
html[data-theme="dark"] .app.rt-light .rt-rv2-tabs button:not(.active){color:var(--rt-muted)!important}
html[data-theme="dark"] .app.rt-light .rt-booking-warning{background:rgba(240,185,74,.1)!important;border-color:rgba(240,185,74,.35)!important}
html[data-theme="dark"] .app.rt-light .rt-booking-warning :is(strong,p){color:#f1d08a!important}
html[data-theme="dark"] .app.rt-light .rt-auth-v2 .rt-forgot-link{color:var(--rt-red-700)!important}
html[data-theme="dark"] .app.rt-light .rt-auth-v2 .rt-register-box>span{color:var(--rt-muted)!important}
html[data-theme="dark"] .app.rt-light :is(.rt-smart-cta,.link-btn,.rt-guide-link){color:var(--rt-red-700)!important}
html[data-theme="dark"] .app.rt-light :is(.rt-notification-card.unread,.rt-service-tiles button.selected,.rt-vehicle-choice button.selected,.rt-prime-checkin-days button.current){
  background:#2a1a1d!important;
}
html[data-theme="dark"] .app.rt-light .rt-account-menu>button,
html[data-theme="dark"] .app.rt-light .rt-booking-summary>div,
html[data-theme="dark"] .app.rt-light .list-item,
html[data-theme="dark"] .app.rt-light .history-row{border-color:var(--rt-line-2)!important;background:transparent!important}
html[data-theme="dark"] .app.rt-light .rt-prime-checkin-days button{background:var(--rt-surface-2)!important;border-color:var(--rt-line)!important}
html[data-theme="dark"] .app.rt-light .rt-prime-checkin-days button.claimed{background:var(--rt-red-50)!important;border-color:var(--rt-red-100)!important}
html[data-theme="dark"] .app.rt-light .rt-prime-checkin-days button.bonus{background:var(--rt-gold-50)!important;border-color:rgba(240,185,74,.3)!important}
html[data-theme="dark"] .app.rt-light .rt-slot-grid button:disabled,
html[data-theme="dark"] .app.rt-light .rt-slot-grid button.full{background:#151213!important;opacity:.7}

/* icon chips keep their tint */
html[data-theme="dark"] .app.rt-light :is(.rt-prime-quick-icon,.rt-prime-service-icon,.rt-prime-checkin-icon,.rt-account-menu-icon,.rt-prime-bike-art,.rt-service-bike-icon,.rt-booking-history-icon){
  background:var(--rt-red-50)!important;box-shadow:inset 0 0 0 1px var(--rt-red-100)!important;color:var(--rt-red-700)!important;
}

/* ---------- section titles & misc ---------- */
html[data-theme="dark"] .app.rt-light .rt-home-block-head b,
html[data-theme="dark"] .app.rt-light .section-title h2,
html[data-theme="dark"] .app.rt-light .rt-home-member-welcome .rt-welcome-name{color:var(--rt-ink)!important}
html[data-theme="dark"] .app.rt-light .rt-home-member-welcome{color:var(--rt-muted)!important}
html[data-theme="dark"] .app.rt-light .rt-prime-mileage-button{background:var(--rt-red-50)!important;border-color:var(--rt-red-100)!important;color:var(--rt-red-700)!important}
html[data-theme="dark"] .app.rt-light .rt-plate{background:var(--rt-surface-2)!important;color:var(--rt-ink)!important;border-color:var(--rt-line)!important}

/* ---------- buttons ---------- */
html[data-theme="dark"] .app.rt-light .btn.outline,
html[data-theme="dark"] .sheet .btn.outline,
html[data-theme="dark"] .app.rt-light .pill-btn:not(.primary){
  background:var(--rt-surface-2)!important;color:var(--rt-ink)!important;box-shadow:inset 0 0 0 1px var(--rt-line)!important;
}
html[data-theme="dark"] .app.rt-light .btn:disabled,
html[data-theme="dark"] .app.rt-light .pill-btn:disabled,
html[data-theme="dark"] .sheet .btn:disabled{background:#2a2527!important;color:#6f6668!important}
html[data-theme="dark"] .app.rt-light .btn.rt-account-logout{background:transparent!important;color:var(--rt-red-700)!important}

/* ---------- inputs ---------- */
html[data-theme="dark"] :is(.app.rt-light,.sheet) :is(.input,.select,.textarea,input:not([type="checkbox"]):not([type="radio"]),select,textarea){
  background:#151213!important;color:var(--rt-ink)!important;border-color:var(--rt-line)!important;
}
html[data-theme="dark"] :is(.app.rt-light,.sheet) :is(input,textarea)::placeholder{color:#6f6668!important}

/* ---------- chips / status ---------- */
html[data-theme="dark"] .app.rt-light .screen .status,
html[data-theme="dark"] .sheet .status{background:var(--rt-red-50)!important;color:var(--rt-red-700)!important;box-shadow:inset 0 0 0 1px var(--rt-red-100)!important}
html[data-theme="dark"] .app.rt-light .screen .status.green,
html[data-theme="dark"] .sheet .status.green{background:var(--rt-green-50)!important;color:var(--rt-green-600)!important;box-shadow:inset 0 0 0 1px rgba(90,208,143,.3)!important}
html[data-theme="dark"] .app.rt-light :is(.rt-promo-tabs button,.rt-rv2-filter button,.rt-food-rider-platforms span,.rt-platform-badge){background:var(--rt-surface-2)!important;color:var(--rt-ink-2)!important;border-color:var(--rt-line)!important}
html[data-theme="dark"] .app.rt-light .rt-promo-tabs button.active{background:var(--rt-red-600)!important;color:#fff!important}

/* ---------- bottom nav + install bar ---------- */
html[data-theme="dark"] .app.rt-light .bottom-nav{background:rgba(24,20,21,.9)!important;border-color:rgba(255,255,255,.08)!important;box-shadow:0 14px 34px -10px rgba(0,0,0,.7)!important}
html[data-theme="dark"] .app.rt-light .bottom-nav .nav small,
html[data-theme="dark"] .app.rt-light .bottom-nav .nav .nav-icon{color:#9b9294!important}
html[data-theme="dark"] .app.rt-light .bottom-nav .nav.active small,
html[data-theme="dark"] .app.rt-light .bottom-nav .nav.active .nav-icon{color:var(--rt-red-700)!important}
/* the active tab carries a white 1px glass edge that is invisible on the light nav but draws a box on dark */
html[data-theme="dark"] .app.rt-light .bottom-nav .nav{border-color:transparent!important}
html[data-theme="dark"] .rt-install-bar-inner{background:rgba(29,25,26,.95)!important;border-color:rgba(255,255,255,.08)!important}
html[data-theme="dark"] .rt-install-bar-copy strong{color:var(--rt-ink)!important}
html[data-theme="dark"] .rt-install-bar-copy small{color:var(--rt-muted)!important}

/* ---------- sheets ---------- */
html[data-theme="dark"] body.rt-light-theme .sheet{background:#1b1718!important;color:var(--rt-ink)!important;box-shadow:0 -18px 50px rgba(0,0,0,.6)!important}
html[data-theme="dark"] body.rt-light-theme .sheet::before{background:#3a3335}
html[data-theme="dark"] body.rt-light-theme .sheet-close{background:#2a2527!important;color:var(--rt-ink)!important}
html[data-theme="dark"] body.rt-light-theme .sheet .card{background:var(--rt-surface-2)!important;border-color:var(--rt-line-2)!important}
html[data-theme="dark"] #modal .rt-rv2-code{background:#151213!important;border-color:var(--rt-red-200)!important}
html[data-theme="dark"] .modal-backdrop{background:rgba(0,0,0,.72)!important}

/* ---------- login form sheet ---------- */
html[data-theme="dark"] .app.rt-light .rt-auth-v2 .rt-auth-card-clean{background:#1b1718!important;box-shadow:0 -14px 40px rgba(0,0,0,.6)!important}
html[data-theme="dark"] .app.rt-light .rt-auth-v2 .rt-auth-card-clean::before{background:#3a3335}
html[data-theme="dark"] .app.rt-light .rt-auth-v2 .rt-register-box{background:var(--rt-surface-2)!important}
html[data-theme="dark"] .app.rt-light .rt-auth-v2 .rt-register-btn{background:transparent!important;color:var(--rt-red-700)!important}
html[data-theme="dark"] .app.rt-light .rt-auth-v2 .rt-auth-card-clean .input{background:#151213!important}

/* ---------- toast ---------- */
html[data-theme="dark"] .toast{background:#2a2527!important;color:var(--rt-ink)!important;box-shadow:0 12px 35px rgba(0,0,0,.6)!important}

/* ---------- skeleton ---------- */
html[data-theme="dark"] .rt-skel{background:#241f21}
html[data-theme="dark"] .rt-skel::after{background:linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent)}

/* ---------- second audit pass: older hard-coded colours ---------- */
/* dark reds used as text -> readable red */
html[data-theme="dark"] .app.rt-light :is(
  .rt-notification-heading-actions>button,.rt-account-section-head button,.section-title button,
  .rt-acct-card small,.rt-lucky-spin-copy small,.rt-food-rider-section-head span,.rt-account-bike-row span,
  .rt-referral-code-card>span,.promo-mini-body>span,.rt-smart-status,.rt-referral-my>span,.rt-rv2-head .rt-eyebrow
){color:var(--rt-red-700)!important}
/* greys that were tuned for white cards */
html[data-theme="dark"] .app.rt-light :is(.rt-prime-service-card em,.rt-notification-card p,.rt-acct-card p,.rt-account-more summary,.rt-smart-meta,.rt-smart-copy>b){color:var(--rt-muted)!important}
/* near-black headings left on dark */
html[data-theme="dark"] .app.rt-light :is(.rt-promo-hero h1,.rt-simple-section-head h2,.rt-account-invoice-list strong,.rt-acct-card h1,.rt-acct-card h2){color:var(--rt-ink)!important}
html[data-theme="dark"] .sheet :is(.rt-account-invoice-list strong,.history-row strong){color:var(--rt-ink)!important}
/* check-in day chips */
html[data-theme="dark"] .app.rt-light .rt-prime-checkin-days :is(b,small){color:var(--rt-ink-2)!important}
html[data-theme="dark"] .app.rt-light .rt-prime-checkin-days button.current b{color:var(--rt-red-700)!important}
/* disabled buttons: still clearly disabled, but readable */
html[data-theme="dark"] .app.rt-light :is(.btn,.pill-btn,.rt-rv2-reward-foot button):disabled{background:#2a2527!important;color:#9a9194!important}
/* code boxes in popups */
html[data-theme="dark"] .sheet .voucher-code{background:#151213!important;color:var(--rt-ink)!important;border-color:var(--rt-red-200)!important}
/* Rewards page: check-in day pills + section heads */
html[data-theme="dark"] .app.rt-light .rt-v2-days :is(button,b){background:var(--rt-surface-2)!important;border-color:var(--rt-line)!important;color:var(--rt-ink-2)!important}
html[data-theme="dark"] .app.rt-light .rt-v2-days button.current :is(b){background:var(--rt-red-50)!important;color:var(--rt-red-700)!important}
html[data-theme="dark"] .app.rt-light .rt-v2-days button.claimed :is(b){background:var(--rt-red-100)!important;color:var(--rt-ink)!important}
html[data-theme="dark"] .app.rt-light .rt-v2-checkin-head>button{background:var(--rt-red-50)!important;border-color:var(--rt-red-100)!important;color:var(--rt-red-700)!important}
html[data-theme="dark"] .app.rt-light .rt-rv2-section-head h2{color:var(--rt-ink)!important}
html[data-theme="dark"] .app.rt-light .rt-rv2-section-head span{color:var(--rt-red-700)!important}
/* third pass (visual review) */
html[data-theme="dark"] .app.rt-light .rt-notification-icon.tone-neutral{background:var(--rt-surface-2)!important;color:var(--rt-ink-2)!important;box-shadow:inset 0 0 0 1px var(--rt-line)!important}
html[data-theme="dark"] .app.rt-light .rt-account-bike-actions button{background:var(--rt-surface-2)!important;color:var(--rt-ink)!important;border-color:var(--rt-line)!important}
html[data-theme="dark"] .app.rt-light .rt-prime-quick-grid>button.whatsapp .rt-prime-quick-icon{background:rgba(64,200,128,.14)!important;box-shadow:inset 0 0 0 1px rgba(64,200,128,.3)!important;color:#5ad08f!important}
html[data-theme="dark"] .app.rt-light .rt-social-chip.google .rt-social-chip-ic{background:#fff}

/* Fourth pass — surfaces the text audit can't see: icon boxes, step dots, tabs, menus, the date field */
html[data-theme="dark"] .app.rt-light .rt-smart-icon{background:var(--rt-surface-2)!important;color:var(--rt-ink-2)!important}
html[data-theme="dark"] .app.rt-light .rt-smart-home.red .rt-smart-icon{background:var(--rt-red-50)!important;color:var(--rt-red-700)!important}
html[data-theme="dark"] .app.rt-light .rt-smart-home.amber .rt-smart-icon{background:var(--rt-gold-50)!important;color:var(--rt-gold-600)!important}
html[data-theme="dark"] .app.rt-light .rt-smart-home.service{border-left-color:var(--rt-line)!important}
html[data-theme="dark"] .app.rt-light .rt-smart-home.service.amber{border-left-color:var(--rt-gold-600)!important}
html[data-theme="dark"] .app.rt-light .rt-smart-home.booking.urgent{border-color:var(--rt-red-200)!important}
html[data-theme="dark"] .app.rt-light .rt-service-progress span{background:var(--rt-surface-2)!important}
html[data-theme="dark"] .app.rt-light .rt-service-progress .done:not(.active) span{background:linear-gradient(180deg,var(--rt-red-500),var(--rt-red-700))!important}
html[data-theme="dark"] .app.rt-light .rt-service-progress .active span{background:var(--rt-surface)!important;color:var(--rt-red-700)!important;border-color:var(--rt-red-600)!important}
html[data-theme="dark"] .app.rt-light .rt-account-bike-icon{background:var(--rt-red-50)!important;color:var(--rt-red-700)!important}
html[data-theme="dark"] .app.rt-light .rt-rv2-tabs span{background:var(--rt-red-100)!important;color:var(--rt-red-700)!important}
html[data-theme="dark"] .app.rt-light .rt-simple-checkin-card .rt-v2-checkin-head>div>span{background:var(--rt-red-50)!important;color:var(--rt-red-700)!important}
html[data-theme="dark"] .app.rt-light .rt-fun-rank-no{background:var(--rt-surface-2)!important;color:var(--rt-ink-2)!important}
html[data-theme="dark"] .app.rt-light .rt-fun-rank-no.rank-1{background:rgba(241,191,85,.2)!important;color:#f1cf7a!important}
html[data-theme="dark"] .app.rt-light .rt-fun-rank-no.rank-2{background:rgba(200,210,218,.16)!important;color:#d3dbe1!important}
html[data-theme="dark"] .app.rt-light .rt-fun-rank-no.rank-3{background:rgba(214,140,92,.2)!important;color:#e7a77f!important}
html[data-theme="dark"] .app.rt-light .rt-fun-ranking-me{border-top-color:var(--rt-line)!important;color:var(--rt-muted)!important}
html[data-theme="dark"] .app.rt-light .rt-fun-ranking-me strong{color:var(--rt-red-700)!important}
html[data-theme="dark"] .app.rt-light .rt-membership-tabs{background:transparent!important;border-bottom-color:var(--rt-line)!important}
html[data-theme="dark"] .app.rt-light .rt-membership-tabs button{background:transparent!important;color:var(--rt-muted)!important}
html[data-theme="dark"] .app.rt-light .rt-membership-tabs button.active{color:var(--rt-red-700)!important;border-bottom-color:var(--rt-red-600)!important}
html[data-theme="dark"] .app.rt-light .rt-notification-menu-wrap>.rt-notification-menu-btn{background:var(--rt-surface-2)!important;border-color:var(--rt-line)!important;color:var(--rt-ink)!important}
html[data-theme="dark"] .app.rt-light .rt-notification-menu{background:var(--rt-surface-2)!important;border-color:var(--rt-line)!important;box-shadow:0 14px 32px rgba(0,0,0,.5)!important}
html[data-theme="dark"] .app.rt-light .rt-notification-menu-wrap .rt-notification-menu button{color:var(--rt-ink)!important}
html[data-theme="dark"] .app.rt-light .rt-notification-menu-wrap .rt-notification-menu button.danger{color:var(--rt-red-700)!important}
html[data-theme="dark"] .app.rt-light .rt-notification-menu-wrap .rt-notification-menu button:active{background:var(--rt-line-2)!important}
html[data-theme="dark"] .app.rt-light .rt-food-rider-cta{background:rgba(29,25,26,.94)!important}
html[data-theme="dark"] .app.rt-light #wizardDate{background:var(--rt-surface-2)!important;border-color:var(--rt-line)!important;color:var(--rt-ink)!important;-webkit-text-fill-color:var(--rt-ink)!important}
html[data-theme="dark"] .app.rt-light #wizardDate::-webkit-date-and-time-value{color:var(--rt-ink)}
html[data-theme="dark"] .app.rt-light #wizardDate::-webkit-calendar-picker-indicator{filter:invert(1)}
html[data-theme="dark"] .app.rt-light .rt-service-log-actions,
html[data-theme="dark"] .app.rt-light .history-row{border-color:var(--rt-line)!important}
html[data-theme="dark"] body.rt-light-theme .sheet .rt-guide-tab:not(.active){background:var(--rt-surface-2)!important;border-color:var(--rt-line)!important;color:var(--rt-ink-2)!important;-webkit-text-fill-color:var(--rt-ink-2)!important}
html[data-theme="dark"] .app.rt-light .rt-book-progress span:not(.on){background:var(--rt-line)}
html[data-theme="dark"] .app.rt-light .rt-book-progress span.on{background:var(--rt-red-600)}