html[data-theme="light"] {
  background: #f3f0e7;
  color-scheme: light;
}

html[data-theme="light"] body {
  --surface: #ffffff;
  --surface-2: #f7f4ec;
  --surface-3: #ece8dc;
  --line: rgba(30, 27, 18, .12);
  --muted: #565249;
  --white: #171611;
  --shadow: 0 18px 52px rgba(65, 51, 10, .12);
  background:
    radial-gradient(circle at 86% -8%, rgba(249, 195, 0, .30), transparent 29rem),
    linear-gradient(180deg, #fffdf7 0%, #f3f0e7 100%);
  color: #171611;
}

html[data-theme="light"] body::before { opacity: .18; }

html[data-theme="light"] :is(.topbar, .desktop-rail, .bottom-nav, .drawer-panel, .notification-center) {
  background: rgba(255, 253, 247, .94);
  border-color: rgba(30, 27, 18, .11);
  color: #171611;
  box-shadow: 0 12px 34px rgba(65, 51, 10, .10);
}

html[data-theme="light"] .topbar {
  background: linear-gradient(180deg, rgba(255, 253, 247, .99) 60%, rgba(255, 253, 247, .88));
}

html[data-theme="light"] :is(
  .surface-card, .profile-card, .guest-login-card, .hero-card, .dispatch-card,
  .route-card, .fare-card, .ride-card, .empty-card, .loyalty-progress-card,
  .simple-offer-card, .reward-step, .reward-example, .reward-explainer,
  .reviews-hero, .review-card, .email-profile-box, .verify-phone-card,
  .driver-command-center, .driver-dispatch-recovery, .driver-offline-notice,
  .driver-profile-summary, .driver-map-card, .driver-queue-item, .driver-job-summary,
  .driver-hero, .telemetry-card, .driver-account-strip, .driver-settings-profile,
  .driver-diagnostics-panel, .quick-fare-ride, .ride-approach-card,
  .map-settings-panel, .address-card, .booking-form-card, .booking-summary,
  .discount-pass-card, .first-trip-route-promo, .ride-summary-card
) {
  background: rgba(255, 255, 255, .92);
  border-color: rgba(30, 27, 18, .11);
  color: #171611;
  box-shadow: 0 14px 38px rgba(65, 51, 10, .09);
}

html[data-theme="light"] :is(.modal, .sheet, .qco-sheet, .driver-quick-fare, .ride-status-sheet) {
  background: #fffdf8;
  border-color: rgba(30, 27, 18, .12);
  color: #171611;
  box-shadow: 0 26px 72px rgba(32, 25, 8, .22);
}

html[data-theme="light"] :is(input, textarea, select, .address-field, .rating-comment, .driver-fare-entry, .driver-job-toolbar input, .ride-coupon-input) {
  background: #f7f4ec;
  border-color: rgba(30, 27, 18, .14);
  color: #171611;
}

html[data-theme="light"] :is(input, textarea)::placeholder { color: #8c877c; opacity: 1; }

html[data-theme="light"] :is(
  .list-btn, .secondary-btn, .text-btn, .tiny-btn, .mini-btn,
  .driver-setting-action, .driver-settings-button, .driver-open-settings,
  .map-settings-btn, .sheet-close, .view-back, .back-btn,
  .notification-center-actions button, .reviews-filter button
) {
  background: #fff;
  border-color: rgba(30, 27, 18, .13);
  color: #171611;
  box-shadow: 0 7px 20px rgba(65, 51, 10, .07);
}

html[data-theme="light"] :is(.list-btn, .driver-setting-action):active { background: #f3efe4; }
html[data-theme="light"] .text-btn {
  color: #5b4a12;
}

html[data-theme="light"] :is(.bottom-nav button, .rail-btn, .brand-copy strong, .view-title, h1, h2, h3, b, strong) { color: #171611; }
html[data-theme="light"] :is(p, small, .version, .notification-help, .brand-copy span) { color: #565249; }
html[data-theme="light"] :is(.primary-btn.yellow, .yellow, .qco-primary, .driver-work-tab.active) { color: #090909; }

html[data-theme="light"] .driver-work-tabs {
  background: #eeeadd;
  border-color: rgba(30, 27, 18, .11);
}

html[data-theme="light"] .modal-layer { background: rgba(50, 43, 25, .38); }

html[data-theme="light"] .map-wrap,
html[data-theme="light"] .qco-map,
html[data-theme="light"] #driverMiniMap {
  border-color: rgba(30, 27, 18, .14);
  box-shadow: 0 16px 42px rgba(65, 51, 10, .12);
}

html[data-theme="light"] .toast { background: var(--surface); color: var(--white); }

html[data-theme="light"] body.driver-session {
  background:
    radial-gradient(circle at 12% -5%, rgba(249, 195, 0, .24), transparent 27rem),
    linear-gradient(180deg, #fffdf7 0%, #f1eee5 100%);
}

html[data-theme="light"] body.driver-session :is(.driver-page-header, .driver-page-title p) { color: #171611; }

html[data-theme="light"] :is(.customer-ride-mini, .edge-active-trip, .driver-incoming-call-bubble) {
  box-shadow: 0 16px 38px rgba(65, 51, 10, .18);
}

/* Light mode uses warm, high-contrast surfaces without changing component geometry. */
html[data-theme="light"] :is(.quick-card, .vehicle-card, .surface-card) {
  background: linear-gradient(145deg, rgba(255, 255, 255, .98), rgba(249, 246, 237, .98));
  border-color: rgba(55, 45, 17, .12);
  color: #171611;
  box-shadow: 0 15px 38px rgba(65, 51, 10, .10);
}

html[data-theme="light"] .quick-card {
  background: linear-gradient(155deg, #ffffff, #f6f1e4);
}

html[data-theme="light"] .quick-icon {
  background: linear-gradient(145deg, #ffe476, #f9c300);
  color: #17130a;
  box-shadow: 0 8px 20px rgba(249, 195, 0, .18);
}

html[data-theme="light"] .vehicle-visual {
  background: linear-gradient(145deg, rgba(255, 224, 89, .58), rgba(249, 195, 0, .13));
  border-color: rgba(177, 132, 0, .20);
}

html[data-theme="light"] .install-promo {
  background: linear-gradient(135deg, #fff7d4, #fffdf8 58%, #f5efe0);
  border-color: rgba(191, 145, 0, .20);
  box-shadow: 0 15px 38px rgba(65, 51, 10, .10);
}

html[data-theme="light"] :is(.quick-card, .install-promo, .vehicle-card) :is(b, strong) { color: #171611; }
html[data-theme="light"] :is(.quick-card, .install-promo, .vehicle-card) :is(small, span) { color: #565249; }
html[data-theme="light"] .status-badge { color: #087a43; background: #e4f7ec; }
html[data-theme="light"] .status-badge.off { color: #706b60; background: #eeeae0; }

/* Booking flow */
html[data-theme="light"] .tbv2-avatar { background: #fff7d7; border-color: rgba(177, 132, 0, .25); }
html[data-theme="light"] .tbv2-title { color: #171611; }
html[data-theme="light"] .tbv2-live { color: #087a43; }
html[data-theme="light"] .tbv2-address-box {
  background: rgba(255, 255, 255, .97);
  border-color: rgba(55, 45, 17, .12);
  box-shadow: 0 18px 44px rgba(65, 51, 10, .10), inset 0 1px 0 rgba(255, 255, 255, .8);
}
html[data-theme="light"] .tbv2-input-box label { color: #716b5e; }
html[data-theme="light"] .tbv2-input-box input,
html[data-theme="light"] .tbv2-promo-row input {
  background: #f7f4eb;
  border-color: rgba(55, 45, 17, .14);
  color: #171611;
}
html[data-theme="light"] .tbv2-input-box input:focus,
html[data-theme="light"] .tbv2-promo-row input:focus {
  background: #fffdf8;
  border-color: rgba(177, 132, 0, .55);
  box-shadow: 0 0 0 3px rgba(249, 195, 0, .14);
}
html[data-theme="light"] .tbv2-input-box input::placeholder,
html[data-theme="light"] .tbv2-promo-row input::placeholder { color: #777166; }
html[data-theme="light"] .tbv2-input-action {
  background: #ece7db;
  color: #4c483e;
}
html[data-theme="light"] .tbv2-later {
  border-color: rgba(55, 45, 17, .16);
  color: #676156;
  background: #fbf9f3;
}
html[data-theme="light"] .tbv2-quick-btn {
  background: #fff;
  border-color: rgba(55, 45, 17, .13);
  color: #302e29;
  box-shadow: 0 7px 18px rgba(65, 51, 10, .06);
}
html[data-theme="light"] .tbv2-route-strip {
  background: linear-gradient(135deg, #fff7d2, #fffdf6);
  border-color: rgba(191, 145, 0, .20);
}
html[data-theme="light"] .tbv2-route-cell b { color: #171611; }
html[data-theme="light"] .tbv2-route-cell span { color: #514d45; }
html[data-theme="light"] .tbv2-waiting,
html[data-theme="light"] .tbv2-info-box {
  background: #fff;
  border-color: rgba(55, 45, 17, .12);
}
html[data-theme="light"] .tbv2-waiting-text b,
html[data-theme="light"] .tbv2-stepper b,
html[data-theme="light"] .tbv2-info-box b { color: #171611; }
html[data-theme="light"] .tbv2-waiting-text span,
html[data-theme="light"] .tbv2-info-box span { color: #565149; }
html[data-theme="light"] .tbv2-stepper button {
  background: #f3efe4;
  border-color: rgba(55, 45, 17, .13);
  color: #171611;
}
html[data-theme="light"] .tbv2-fare-card {
  background: #fff;
  border-color: rgba(55, 45, 17, .12);
  box-shadow: 0 18px 44px rgba(65, 51, 10, .11);
}
html[data-theme="light"] .tbv2-meter {
  background: linear-gradient(135deg, #fff9df, #f7f1e3);
  border-bottom-color: rgba(55, 45, 17, .09);
}
html[data-theme="light"] .tbv2-meter-display b,
html[data-theme="light"] .tbv2-fare-line b,
html[data-theme="light"] .tbv2-fare-line.total span { color: #171611; }
html[data-theme="light"] .tbv2-meter-meta,
html[data-theme="light"] .tbv2-fare-line span,
html[data-theme="light"] .tbv2-fare-note { color: #565149; }
html[data-theme="light"] .tbv2-meter-meta i { color: #b3ac9d; }
html[data-theme="light"] .tbv2-fare-line { border-bottom-color: rgba(55, 45, 17, .07); }
html[data-theme="light"] .tbv2-fare-line.dim span,
html[data-theme="light"] .tbv2-fare-line.dim b { color: #8c8679; }
html[data-theme="light"] .tbv2-fare-line.total { border-top-color: rgba(55, 45, 17, .11); }
html[data-theme="light"] .tbv2-promo-label { color: #655f53; }
html[data-theme="light"] .tbv2-promo-row button {
  background: #ebe6da;
  color: #312e27;
}
html[data-theme="light"] .tbv2-offer {
  background: #edfaf3;
  border-color: rgba(8, 122, 67, .20);
}
html[data-theme="light"] .tbv2-offer-text b { color: #153524; }
html[data-theme="light"] .tbv2-offer-text small { color: #577163; }
html[data-theme="light"] .offer-toggle-btn[aria-pressed="true"] {
  background: #fff1ef;
  color: #a22c23;
}
html[data-theme="light"] .offer-toggle-btn:disabled {
  background: #ebe7dc;
  border-color: rgba(55, 45, 17, .09);
  color: #918b7e;
}
html[data-theme="light"] .tbv2-cta:disabled { background: #ded9ce; color: #807a6e; }
html[data-theme="light"] .tbv2-disclaimer { color: #5d584f; }
html[data-theme="light"] #view-book .booking-panel-expand {
  background: rgba(255, 253, 248, .96) !important;
  border-color: rgba(55, 45, 17, .14) !important;
  color: #171611 !important;
  box-shadow: 0 14px 36px rgba(65, 51, 10, .16) !important;
}
html[data-theme="light"] #view-book .map-chip {
  background: rgba(255, 253, 248, .92);
  border-color: rgba(55, 45, 17, .14);
  color: #171611;
}
html[data-theme="light"] #view-book .booking-card.taxi-booking-v2 {
  background: rgba(255, 253, 248, .98) !important;
  border-color: rgba(55, 45, 17, .12) !important;
  color: #171611;
}
html[data-theme="light"] #view-book .booking-sheet-handle span { background: #aaa396; }

/* Native iOS has a denser booking skin; keep its layout but replace dark-only paint. */
html[data-theme="light"].native-ios body:not(.map-pick-active) #view-book .taxi-booking-v2 {
  background: linear-gradient(165deg, rgba(255, 253, 248, .99), rgba(246, 242, 232, .99) 62%) !important;
  border-color: rgba(55, 45, 17, .12) !important;
  box-shadow: 0 24px 70px rgba(65, 51, 10, .16), inset 0 1px rgba(255, 255, 255, .9) !important;
}
html[data-theme="light"].native-ios body:not(.map-pick-active) #view-book .tbv2-address-box {
  background: linear-gradient(145deg, rgba(255, 255, 255, .98), rgba(249, 246, 237, .98)) !important;
  border-color: rgba(177, 132, 0, .20) !important;
  box-shadow: 0 18px 46px rgba(65, 51, 10, .11), inset 0 1px rgba(255, 255, 255, .9) !important;
}
html[data-theme="light"].native-ios body #view-book .tbv2-input-box input {
  background: #f7f4eb !important;
  border-color: rgba(55, 45, 17, .14) !important;
  color: #171611 !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .7) !important;
}
html[data-theme="light"].native-ios body #view-book .tbv2-input-box input:focus {
  background: #fffdf8 !important;
  border-color: rgba(177, 132, 0, .58) !important;
  box-shadow: 0 0 0 3px rgba(249, 195, 0, .14) !important;
}
html[data-theme="light"].native-ios body #view-book .tbv2-input-box .tbv2-input-action {
  background: #ece7db !important;
  border-color: rgba(55, 45, 17, .13) !important;
  color: #4c483e !important;
}
html[data-theme="light"].native-ios body:not(.map-pick-active) #view-book .tbv2-quick-btn {
  background: linear-gradient(145deg, #ffffff, #f4f0e6) !important;
  border-color: rgba(55, 45, 17, .13) !important;
  color: #302e29 !important;
  box-shadow: 0 8px 20px rgba(65, 51, 10, .07) !important;
}
html[data-theme="light"].native-ios body:not(.map-pick-active) #view-book .tbv2-route-strip {
  background: linear-gradient(130deg, #fff2b8, #fffaf0 68%) !important;
  border-color: rgba(177, 132, 0, .24) !important;
  box-shadow: 0 16px 38px rgba(65, 51, 10, .09) !important;
}
html[data-theme="light"].native-ios body:not(.map-pick-active) #view-book .tbv2-route-cell {
  background: rgba(255, 255, 255, .72) !important;
  border-color: rgba(55, 45, 17, .10) !important;
}
html[data-theme="light"].native-ios body:not(.map-pick-active) #view-book .tbv2-route-cell:nth-child(1) b,
html[data-theme="light"].native-ios body:not(.map-pick-active) #view-book .tbv2-route-cell:nth-child(2) b,
html[data-theme="light"].native-ios body:not(.map-pick-active) #view-book .tbv2-route-cell:nth-child(3) b { color: #171611 !important; }
html[data-theme="light"].native-ios body:not(.map-pick-active) #view-book .tbv2-waiting {
  background: linear-gradient(145deg, #ffffff, #f5f1e7) !important;
  border-color: rgba(55, 45, 17, .12) !important;
  box-shadow: 0 12px 30px rgba(65, 51, 10, .08) !important;
}
html[data-theme="light"].native-ios body:not(.map-pick-active) #view-book .tbv2-stepper button {
  background: linear-gradient(145deg, #fff, #ece7db) !important;
  border-color: rgba(177, 132, 0, .20) !important;
  color: #171611 !important;
  box-shadow: 0 7px 17px rgba(65, 51, 10, .08) !important;
}
html[data-theme="light"].native-ios body:not(.map-pick-active) #view-book .tbv2-fare-card {
  background: #fff !important;
  border-color: rgba(177, 132, 0, .18) !important;
  box-shadow: 0 20px 52px rgba(65, 51, 10, .12) !important;
}
html[data-theme="light"].native-ios body:not(.map-pick-active) #view-book .tbv2-meter {
  background: radial-gradient(circle at 12% 18%, rgba(255, 210, 55, .26), transparent 34%), linear-gradient(125deg, #fff9df, #f6f0e2 62%, #fffdf8) !important;
}
html[data-theme="light"].native-ios body:not(.map-pick-active) #view-book .tbv2-meter-display b {
  color: #171611 !important;
  text-shadow: none !important;
}
html[data-theme="light"].native-ios body:not(.map-pick-active) #view-book .tbv2-fare-line.total {
  background: #fff8d9 !important;
}
html[data-theme="light"].native-ios body:not(.map-pick-active) #view-book .tbv2-promo-row input,
html[data-theme="light"].native-ios body:not(.map-pick-active) #view-book .tbv2-promo-row button {
  background: linear-gradient(145deg, #fff, #f1ede3) !important;
  border-color: rgba(55, 45, 17, .13) !important;
  color: #171611 !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .8) !important;
}
html[data-theme="light"].native-ios body:not(.map-pick-active) #view-book .tbv2-cta:disabled {
  background: linear-gradient(145deg, #e5e0d5, #d8d2c6) !important;
  border-color: rgba(55, 45, 17, .08) !important;
  color: #777064 !important;
  box-shadow: none !important;
}

/* Ride and modal surfaces */
html[data-theme="light"] :is(.t39-summary, .ride-status-sheet, .ride-summary-card) {
  background: #fffdf8;
  color: #171611;
}
html[data-theme="light"] :is(.t39-summary, .ride-status-sheet, .ride-summary-card) :is(h1, h2, h3, b, strong) { color: #171611; }
html[data-theme="light"] :is(.t39-summary, .ride-status-sheet, .ride-summary-card) :is(p, small) { color: #565149; }
html[data-theme="light"] :is(.t39-summary-head, .t39-summary-route, .t39-stat-pill, .t39-summary-discount) {
  background: #fff;
  border-color: rgba(55, 45, 17, .12);
}
html[data-theme="light"] .t39-summary-fare {
  background: linear-gradient(135deg, #fff8d8, #f7f2e6);
  border-color: rgba(177, 132, 0, .20);
}
html[data-theme="light"] :is(.t39-summary-back, .t39-summary-close, .t39-secondary-btn, .t39-summary-promo-btn) {
  background: #f1ede3;
  border-color: rgba(55, 45, 17, .13);
  color: #302e29;
}
html[data-theme="light"] .t39-summary-promo-input {
  background: #f7f4eb;
  border-color: rgba(55, 45, 17, .14);
  color: #171611;
}
html[data-theme="light"] .t39-summary-promo-input::placeholder { color: #777166; }
html[data-theme="light"] .t39-summary-offer { background: #edfaf3; border-color: rgba(8, 122, 67, .20); }
html[data-theme="light"] .t39-offer-text b { color: #153524; }
html[data-theme="light"] .t39-offer-text small { color: #536c5d; }
html[data-theme="light"] .t39-route-dot.destination { background: #292720; box-shadow: 0 0 0 4px rgba(41, 39, 32, .10); }

/* Secondary customer controls retain the same geometry with light paint. */
html[data-theme="light"] .loyalty-track { background: #ddd8cc; }
html[data-theme="light"] .activity {
  background: #fff;
  border-color: rgba(55, 45, 17, .12);
  color: #171611;
}
html[data-theme="light"] .reviews-score { background: rgba(255, 255, 255, .56); }
html[data-theme="light"] .reviews-filter button {
  background: #fff;
  border-color: rgba(55, 45, 17, .13);
  color: #403d36;
}
html[data-theme="light"] .reviews-filter button.active { background: var(--yellow); color: #111; border-color: var(--yellow); }
html[data-theme="light"] :is(.photo-select-button, .email-profile-btn, .review-admin button) {
  background: linear-gradient(145deg, #fff9df, #f1ede3);
  border-color: rgba(177, 132, 0, .22);
  color: #302e29;
}
html[data-theme="light"] :is(.photo-select-button, .email-profile-btn, .review-admin button):hover { background: #fff4c3; }
html[data-theme="light"] :is(.review-edit-box select, .review-edit-box textarea) {
  background: #f7f4eb;
  border-color: rgba(55, 45, 17, .14);
  color: #171611;
}

/* Driver center */
html[data-theme="light"] body.driver-session {
  --driver-panel: #fffdf8;
  --driver-line: rgba(55, 45, 17, .12);
}
html[data-theme="light"] body.driver-session .driver-settings-button {
  background: #fff;
  border-color: rgba(55, 45, 17, .13);
  box-shadow: 0 9px 24px rgba(65, 51, 10, .10);
}
html[data-theme="light"] body.driver-session .driver-command-center {
  background: linear-gradient(135deg, #edfaf3, #fffdf8 58%, #fff7d7);
  border-color: rgba(8, 122, 67, .18);
}
html[data-theme="light"] body.driver-session .driver-command-main b { color: #153524; }
html[data-theme="light"] body.driver-session .driver-command-main small { color: #657268; }
html[data-theme="light"] body.driver-session .driver-command-chips span {
  background: rgba(255, 255, 255, .72);
  border-color: rgba(55, 45, 17, .11);
  color: #4f5e53;
}
html[data-theme="light"] body.driver-session .driver-work-tabs {
  background: rgba(255, 255, 255, .95);
  border-color: rgba(55, 45, 17, .12);
  box-shadow: 0 12px 32px rgba(65, 51, 10, .10);
}
html[data-theme="light"] body.driver-session .driver-work-tab { color: #514d45; }
html[data-theme="light"] body.driver-session .driver-work-tab b { background: #eee9dd; color: #4c483f; }
html[data-theme="light"] body.driver-session :is(
  .driver-account-strip, .driver-hero, .driver-map-card, .dispatch-card,
  .driver-queue-card, .management-card, .driver-stat, .telemetry-card,
  .driver-dispatch-recovery, .driver-offline-notice
) {
  background: linear-gradient(145deg, #ffffff, #f7f3e9) !important;
  border-color: rgba(55, 45, 17, .12) !important;
  color: #171611;
  box-shadow: 0 16px 40px rgba(65, 51, 10, .09);
}
html[data-theme="light"] body.driver-session :is(
  .driver-account-strip, .driver-hero, .driver-map-card, .dispatch-card,
  .driver-queue-card, .management-card, .driver-stat, .telemetry-card
) :is(h1, h2, h3, b, strong) { color: #171611; }
html[data-theme="light"] body.driver-session :is(
  .driver-account-strip, .driver-hero, .driver-map-card, .dispatch-card,
  .driver-queue-card, .management-card, .driver-stat, .telemetry-card
) :is(p, small, span) { color: #565149; }
html[data-theme="light"] body.driver-session .driver-map-legend span {
  background: #f3efe5;
  color: #625d52;
}
html[data-theme="light"] body.driver-session .driver-map-legend b,
html[data-theme="light"] body.driver-session .driver-map-foot b { color: #554f45; }
html[data-theme="light"] body.driver-session .driver-toggle { background: #e8e3d8; color: #302e29; }
html[data-theme="light"] body.driver-session .driver-toggle.online { background: var(--green); color: #05210f; }
html[data-theme="light"] body.driver-session .driver-live-empty {
  background: rgba(255, 255, 255, .72);
  border-color: rgba(55, 45, 17, .10);
  color: #565149;
}

/* Long Turkish addresses and labels must never widen an iOS view. */
html[data-theme="light"] :is(
  .tbv2-header-text, .tbv2-input-box, .tbv2-waiting-text, .tbv2-expensive-copy,
  .tbv2-offer-text, .install-promo-copy, .vehicle-copy, .driver-command-main,
  .driver-page-title, .driver-customer-head, .dispatch-route, .section-head
) { min-width: 0; }
html[data-theme="light"] :is(
  .tbv2-title, .tbv2-info-box, .tbv2-offer-text, .install-promo-copy,
  .driver-command-main, .driver-page-title, .driver-customer-head, .dispatch-route
) :is(b, strong, span, small, p, h1, h2, h3) { overflow-wrap: anywhere; }

@media (max-width: 759px) {
  html[data-theme="light"] .mobile-shell { background: transparent; }
}

/* iOS rendering: keep the same visual design while moving recurring effects to composited properties. */
html.native-ios :is(.topbar, .bottom-nav, .customer-ride-mini, .edge-active-trip) {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transform: translateZ(0);
}

html.native-ios .desktop-rail {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  will-change: transform;
}

@media (max-width: 1099px) {
  html.native-ios body:not(.menu-open) .desktop-rail {
    transform: translate3d(-105%, 0, 0) !important;
    visibility: hidden;
    pointer-events: none !important;
  }

  html.native-ios body.menu-open .desktop-rail {
    transform: translate3d(0, 0, 0) !important;
    visibility: visible;
    pointer-events: auto !important;
  }

  html.native-ios body:not(.menu-open) .drawer-backdrop {
    opacity: 0 !important;
    visibility: hidden;
    pointer-events: none !important;
  }

  html.native-ios body.menu-open .drawer-backdrop {
    visibility: visible;
  }
}

html.native-ios :is(.active-ride-pill, .driver-incoming-pulse, .driver-instant-banner, .customer-ride-mini-dot) {
  will-change: transform, opacity;
}

html.native-ios .active-ride-pill {
  animation: t39IosSoftPulse 2s ease-in-out infinite;
}

html.native-ios .driver-incoming-pulse {
  animation: t39IosCallPulse 1.55s ease-in-out infinite;
}

html.native-ios .driver-instant-banner {
  animation: t39IosAttention 1.8s ease-in-out infinite;
}

html.native-ios .customer-ride-mini-dot {
  animation: t39IosDotPulse 1.6s ease-in-out infinite;
}

html.native-ios :is(.leaflet-map-pane, .leaflet-tile-pane, .leaflet-marker-pane, .leaflet-overlay-pane) {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

@keyframes t39IosSoftPulse {
  0%, 100% { opacity: 1; transform: translateZ(0) scale(1); }
  50% { opacity: .92; transform: translateZ(0) scale(1.012); }
}

@keyframes t39IosCallPulse {
  0%, 100% { opacity: 1; transform: translateZ(0) scale(1); }
  55% { opacity: .88; transform: translateZ(0) scale(1.045); }
}

@keyframes t39IosAttention {
  0%, 100% { opacity: 1; transform: translateZ(0); }
  50% { opacity: .9; transform: translate3d(0, -1px, 0); }
}

@keyframes t39IosDotPulse {
  0%, 100% { opacity: 1; transform: translateZ(0) scale(1); }
  50% { opacity: .72; transform: translateZ(0) scale(1.16); }
}

@media (prefers-reduced-motion: reduce) {
  html.native-ios :is(.active-ride-pill, .driver-incoming-pulse, .driver-instant-banner, .customer-ride-mini-dot) {
    animation: none !important;
    will-change: auto;
  }
}

/* v9.6.70: complete the light-theme paint layer without changing component geometry. */
html[data-theme="light"].native-ios body:not(.menu-open):not(:has(#view-book.active)) .topbar {
  background: linear-gradient(180deg, #fffdf8 62%, rgba(255, 253, 248, .97)) !important;
  border-color: rgba(55, 45, 17, .12) !important;
  color: #171611 !important;
  box-shadow: 0 10px 30px rgba(65, 51, 10, .09) !important;
}

html[data-theme="light"] .topbar .brand-copy strong,
html[data-theme="light"] .topbar .brand-copy .flag-inline {
  color: #171611 !important;
  text-shadow: none !important;
}

html[data-theme="light"] .topbar .brand-copy > span { color: #5d584f !important; }

html[data-theme="light"] :is(.app-menu-button, .notification-center-button, .top-profile-button) {
  background: #fff !important;
  border-color: rgba(55, 45, 17, .15) !important;
  color: #171611 !important;
  box-shadow: 0 8px 22px rgba(65, 51, 10, .10) !important;
}

html[data-theme="light"] .notification-center-button > i {
  border-color: #fffdf8 !important;
  color: #171611 !important;
}

html[data-theme="light"].native-ios body #view-book.active {
  background: #f3f0e7 !important;
}

html[data-theme="light"].native-ios body #view-book.active > .page-header,
html[data-theme="light"].native-ios body.map-pick-active #view-book.active > .page-header {
  background: rgba(255, 253, 248, .99) !important;
  border-bottom-color: rgba(55, 45, 17, .12) !important;
  color: #171611 !important;
  box-shadow: 0 8px 24px rgba(65, 51, 10, .08) !important;
}

html[data-theme="light"].native-ios body #view-book.active > .page-header :is(h1, .book-kicker) {
  color: #171611 !important;
  text-shadow: none !important;
}

html[data-theme="light"].native-ios body #view-book.active > .page-header .back-btn {
  background: #fff !important;
  border-color: rgba(55, 45, 17, .15) !important;
  color: #171611 !important;
  box-shadow: 0 8px 22px rgba(65, 51, 10, .11) !important;
}

html[data-theme="light"].native-ios body:not(.map-pick-active) #view-book .booking-layout {
  background:
    radial-gradient(circle at 50% 0, rgba(249, 195, 0, .14), transparent 34%),
    linear-gradient(rgba(55, 45, 17, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(55, 45, 17, .02) 1px, transparent 1px),
    #f3f0e7 !important;
  background-size: auto, 38px 38px, 38px 38px, auto !important;
  scrollbar-color: rgba(177, 132, 0, .58) rgba(55, 45, 17, .05) !important;
}

html[data-theme="light"].native-ios body:not(.map-pick-active) #view-book .booking-layout::-webkit-scrollbar-track {
  background: rgba(55, 45, 17, .04) !important;
}

html[data-theme="light"].native-ios body:not(.map-pick-active) #view-book .booking-layout::-webkit-scrollbar-thumb {
  border-color: #f3f0e7 !important;
}

html[data-theme="light"].native-ios body:not(.map-pick-active) #view-book .tbv2-cta:disabled {
  color: #514c43 !important;
  opacity: 1 !important;
}

html[data-theme="light"] #profileModal .auth-mode-btn { color: #6b5000 !important; }
html[data-theme="light"] #profileModal .forgot-whatsapp { color: #4f4a42 !important; }

html.native-ios #profileInstallButton { display: none !important; }

html[data-theme="light"] body.driver-session .driver-settings-premium {
  background: linear-gradient(145deg, #fffdf8, #f3efe5) !important;
  border-color: rgba(55, 45, 17, .15) !important;
  color: #171611 !important;
  box-shadow: 0 32px 90px rgba(65, 51, 10, .24) !important;
}

html[data-theme="light"] body.driver-session .driver-settings-profile.premium {
  background:
    radial-gradient(circle at 8% 10%, rgba(249, 195, 0, .24), transparent 38%),
    linear-gradient(145deg, #fffdf8, #f5f0e3) !important;
  border-color: rgba(177, 132, 0, .28) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .9), 0 18px 42px rgba(65, 51, 10, .11) !important;
}

html[data-theme="light"] body.driver-session .driver-settings-identity :is(b, strong) { color: #171611 !important; }
html[data-theme="light"] body.driver-session .driver-settings-identity :is(span, small) { color: #5c574e !important; }

html[data-theme="light"] body.driver-session .driver-settings-metrics div {
  background: rgba(255, 255, 255, .86) !important;
  border: 1px solid rgba(55, 45, 17, .10) !important;
}

html[data-theme="light"] body.driver-session .driver-settings-metrics b { color: #171611 !important; }
html[data-theme="light"] body.driver-session .driver-settings-metrics span { color: #676156 !important; }

html[data-theme="light"] body.driver-session .premium-grid .driver-setting-action {
  background: linear-gradient(145deg, #fff, #f6f2e8) !important;
  border-color: rgba(55, 45, 17, .13) !important;
  color: #171611 !important;
  box-shadow: 0 8px 22px rgba(65, 51, 10, .07) !important;
}

html[data-theme="light"] body.driver-session .premium-grid .driver-setting-action:hover {
  background: #fff8dc !important;
  border-color: rgba(177, 132, 0, .32) !important;
}

html[data-theme="light"] body.driver-session .premium-grid .driver-setting-action > i {
  background: #fff3bc !important;
  color: #755700 !important;
}

html[data-theme="light"] body.driver-session .premium-grid .driver-setting-action b { color: #171611 !important; }
html[data-theme="light"] body.driver-session .premium-grid .driver-setting-action small { color: #5f5a51 !important; }

html[data-theme="light"] body.driver-session .premium-grid .select-action select {
  background: #f7f4ec !important;
  border-color: rgba(55, 45, 17, .15) !important;
  color: #171611 !important;
  color-scheme: light !important;
}

html[data-theme="light"] body.driver-session .driver-diagnostics-panel {
  background: #eef9f2 !important;
  border-color: rgba(8, 122, 67, .20) !important;
  color: #194d31 !important;
}

html[data-theme="light"] body.driver-session .driver-diagnostics-panel :is(dt, dd) { color: #365f47 !important; }

html[data-theme="light"] body.driver-session .professional-member-card {
  background:
    radial-gradient(circle at 100% 0, rgba(249, 195, 0, .13), transparent 38%),
    linear-gradient(145deg, #fff, #f6f2e8) !important;
  border-color: rgba(55, 45, 17, .13) !important;
  color: #171611 !important;
  box-shadow: 0 16px 38px rgba(65, 51, 10, .10) !important;
}

html[data-theme="light"] body.driver-session .professional-member-identity b { color: #171611 !important; }
html[data-theme="light"] body.driver-session .professional-member-identity a { color: #4f5f55 !important; }

html[data-theme="light"] body.driver-session .professional-member-stats div,
html[data-theme="light"] body.driver-session .professional-member-location {
  background: rgba(255, 255, 255, .82) !important;
  border: 1px solid rgba(55, 45, 17, .09) !important;
}

html[data-theme="light"] body.driver-session .professional-member-stats b,
html[data-theme="light"] body.driver-session .professional-member-location b { color: #171611 !important; }
html[data-theme="light"] body.driver-session .professional-member-stats span,
html[data-theme="light"] body.driver-session .professional-member-location { color: #5d584f !important; }
html[data-theme="light"] body.driver-session .member-status.pending { background: #fff0b3 !important; color: #654a00 !important; }
html[data-theme="light"] body.driver-session .member-status.verified { background: #dff5e8 !important; color: #086b3a !important; }
html[data-theme="light"] body.driver-session .member-status.blocked { background: #ffe7e3 !important; color: #9a2d24 !important; }

html[data-theme="light"] body.driver-session .driver-job-toolbar button {
  background: #fff !important;
  border-color: rgba(55, 45, 17, .14) !important;
  color: #302e29 !important;
  box-shadow: 0 7px 18px rgba(65, 51, 10, .07) !important;
}

html[data-theme="light"] body.driver-session .driver-job-toolbar input { color-scheme: light !important; }

html[data-theme="light"] body.driver-session .driver-job-filters button {
  background: #f2eee4 !important;
  border-color: rgba(55, 45, 17, .12) !important;
  color: #4d4941 !important;
}

html[data-theme="light"] body.driver-session .driver-job-filters button.active {
  background: #f9c300 !important;
  border-color: #d5a700 !important;
  color: #17130a !important;
}

html[data-theme="light"] body.driver-session .driver-job-summary > div {
  background: #fff !important;
  border-color: rgba(55, 45, 17, .12) !important;
  box-shadow: 0 8px 20px rgba(65, 51, 10, .06) !important;
}

html[data-theme="light"] body.driver-session .driver-job-summary b { color: #171611 !important; }
html[data-theme="light"] body.driver-session .driver-job-summary span { color: #5d584f !important; }

/* Keep scrolled driver content out of the native iOS status-bar hit area. */
html[data-theme="light"].native-ios body.driver-session #view-driver.active::before {
  content: "";
  position: fixed;
  z-index: 85;
  top: 0;
  left: 0;
  right: 0;
  height: max(44px, env(safe-area-inset-top, 0px));
  background: rgba(255, 253, 248, .98);
  pointer-events: none;
}

/* v9.6.71: typography-only contrast pass for light mode. */
html[data-theme="light"] body {
  --muted: #49453e;
  color: #14130f;
  font-weight: 500;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

html[data-theme="light"] :is(
  h1, h2, h3, .view-title, .section-head h2, .management-head h2,
  .driver-page-title h1, .tbv2-title, .profile-card h2, .modal > h2
) {
  color: #11100d !important;
  font-weight: 850 !important;
  text-shadow: none !important;
}

html[data-theme="light"] :is(
  .brand-copy strong, .quick-card b, .vehicle-copy b, .profile-actions .list-btn,
  .tbv2-input-box input, .tbv2-quick-btn, .tbv2-later, .tbv2-route-cell b,
  .driver-account-strip b, .driver-work-tab, .driver-setting-action b,
  .professional-member-card b, .driver-job-summary b, .driver-job-filters button
) {
  color: #171611 !important;
  font-weight: 750 !important;
  text-shadow: none !important;
}

html[data-theme="light"] :is(
  .form-label, .tbv2-input-box label, .tbv2-promo-label, .eyebrow,
  .booking-card label, .driver-fare-entry label, .switch-copy b
) {
  color: #3f3b34 !important;
  font-weight: 800 !important;
  text-shadow: none !important;
}

html[data-theme="light"] :is(
  .page-header p, .section-head p, .management-head p, .profile-card p,
  .modal > p, .notification-help, .fine-print, .photo-upload-hint,
  .tbv2-waiting-text span, .tbv2-info-box span, .tbv2-fare-note,
  .vehicle-copy span, .vehicle-meta span, .driver-command-main small,
  .driver-page-title p, .professional-member-stats span,
  .driver-settings-identity span, .driver-settings-identity small,
  .driver-settings-metrics span, .driver-setting-action small,
  .driver-job-summary span, .version
) {
  color: #49453e !important;
  font-weight: 550 !important;
  text-shadow: none !important;
}

html[data-theme="light"] :is(input, textarea, select, .form-input) {
  color: #171611 !important;
  font-weight: 600 !important;
  caret-color: #171611;
}

html[data-theme="light"] :is(input, textarea)::placeholder {
  color: #686258 !important;
  font-weight: 500 !important;
  opacity: 1 !important;
}

html[data-theme="light"] :is(
  .list-btn, .secondary-btn, .compact-action, .mini-btn,
  .driver-job-toolbar button, .driver-settings-button,
  .app-menu-button, .notification-center-button, .sheet-close,
  .view-back, .back-btn
) {
  font-weight: 750 !important;
  text-shadow: none !important;
}

html[data-theme="light"] :is(.primary-btn.yellow, .tbv2-cta, .qco-primary, .driver-work-tab.active) {
  color: #0d0c09 !important;
  font-weight: 850 !important;
  text-shadow: none !important;
}

html[data-theme="light"] :is(.auth-mode-btn, .text-btn, .link-btn) {
  color: #684d00 !important;
  font-weight: 750 !important;
  text-shadow: none !important;
}

html[data-theme="light"] :is(.form-error, .account-delete-button, .danger) {
  font-weight: 750 !important;
}

/* Dispatch sheets share the light palette; v9b has dark !important backgrounds. */
html[data-theme="light"] :is(.sheet, .modal, .driver-reject-sheet, .driver-passwords-modal) {
  background: #fffdf8 !important;
  color: #171611 !important;
  border-color: #d8d2c5 !important;
  box-shadow: 0 20px 60px rgba(55, 44, 18, .20) !important;
}
html[data-theme="light"] :is(.dispatch-route, .driver-customer-note, .ride-chat-panel, .quick-fare-ride) {
  background: #f7f4ec !important;
  color: #302d26 !important;
  border-color: #ded7c9 !important;
}
html[data-theme="light"] :is(.dispatch-route, .driver-customer-note) :is(b, strong, span, div) {
  color: #302d26 !important;
  text-shadow: none !important;
}
html[data-theme="light"] .driver-reject-sheet :is(h2, b, label) { color: #171611 !important; }
html[data-theme="light"] .driver-reject-sheet :is(p, .eyebrow) { color: #514b40 !important; }
html[data-theme="light"] .driver-reject-reasons button {
  background: #ffffff !important;
  border-color: #d8d2c5 !important;
  color: #171611 !important;
  box-shadow: none !important;
}
html[data-theme="light"] .driver-reject-reasons button > span {
  background: #f1ede3 !important;
  color: #302d26 !important;
}
html[data-theme="light"] .driver-reject-reasons button.active {
  background: #fff0a8 !important;
  border-color: #957000 !important;
  box-shadow: inset 0 0 0 1px #957000 !important;
}
html[data-theme="light"] .driver-reject-reasons button.active > span { background: #f9c300 !important; }
html[data-theme="light"] .driver-reject-sheet .drag-handle { background: #b4ad9e !important; }
html[data-theme="light"] .driver-reject-layer { background: rgba(35, 31, 23, .40) !important; }
html[data-theme="light"] #driverCallCustomer { color: #174d70 !important; text-decoration: underline; }

/* Secondary and dynamically created panels must not inherit legacy dark surfaces. */
html[data-theme="light"] {
  --t39-v9-sheet: #fffdf8;
  --t39-v9-line: #ded7c9;
}
html[data-theme="light"] :is(
  .driver-approved-map-screen, .driver-approved-map-card, .bottom-nav,
  .t39-v9-dialog, .t39-v9-dialog-head, .t39-v9-driver-strip, .location-prompt,
  .pwa-update-toast, .t39-apk-banner
) {
  background: #fffdf8 !important;
  color: #171611 !important;
  border-color: #d8d2c5 !important;
}
html[data-theme="light"] :is(
  .driver-job-summary > div, .ride-confirm-route, .ride-confirm-grid > div,
  .special-offer-status, .avatar-upload-debug, .t39-v9-item,
  .profile-verification:not(.ok), .driver-customer-photo
) {
  background: #f7f4ec !important;
  color: #302d26 !important;
  border-color: #ded7c9 !important;
}
html[data-theme="light"] :is(
  .driver-job-filters button, .driver-job-toolbar button,
  .photo-source-tab, .placement-pill span, .rating-star,
  .t39-v9-tabs button, .t39-v9-close,
  .t39-v9-action:not(.primary):not(.green):not(.danger),
  .t39-v9-item-actions button, .t39-v9-suggestions button,
  .ride-chat-photo, .qco-btn, .t39-apk-btn:not(.primary)
) {
  background: #ffffff !important;
  color: #302d26 !important;
  border-color: #d8d2c5 !important;
}
html[data-theme="light"] :is(
  .driver-job-filters button.active, .photo-source-tab.active,
  .placement-pill input:checked + span, .rating-star.active,
  .t39-v9-tabs button.active
) {
  background: #fff0a8 !important;
  color: #4f3b00 !important;
  border-color: #957000 !important;
}
html[data-theme="light"] :is(
  .driver-approved-map-card, .ride-confirm-route, .ride-confirm-grid,
  .t39-v9-dialog, .t39-v9-item, .location-prompt, .pwa-update-toast,
  .t39-apk-copy
) :is(b, strong, label) {
  color: #171611 !important;
  text-shadow: none !important;
}
html[data-theme="light"] :is(
  .driver-approved-map-card, .ride-confirm-route, .ride-confirm-grid,
  .t39-v9-item, .t39-v9-field, .t39-v9-suggestions, .location-prompt,
  .pwa-update-toast, .t39-apk-copy
) :is(small, p, span),
html[data-theme="light"] :is(.t39-v9-empty, .t39-v9-location-state) {
  color: #514b40 !important;
}
html[data-theme="light"] .t39-v9-action.green { background: #e4f5eb !important; color: #14623b !important; }
html[data-theme="light"] .t39-v9-action.danger { background: #fff0ee !important; color: #972f24 !important; }
html[data-theme="light"] .t39-v9-alert { color: #972f24 !important; }
html[data-theme="light"] .t39-v9-alert.warning { color: #684d00 !important; }
html[data-theme="light"] .t39-v9-alert.success { color: #14623b !important; }

/* Extend the existing palette; data-theme is the resolved light/dark preference. */
html[data-theme="dark"] { color-scheme: dark; background: #101518; }
html[data-theme] body {
  --bg: #101518;
  --surface: #1a2227;
  --surface-2: #222d33;
  --surface-3: #2e3b42;
  --white: #f3f6f7;
  --muted: #bdc8ce;
  --line: #46555d;
  --accent-text: #ffe17a;
  --accent-surface: #39351f;
  --success-text: #8ce8b6;
  --success-surface: #173a2c;
  --danger-text: #ffb8b4;
  --danger-surface: #42272a;
  --input-bg: #151e23;
  --overlay: rgba(4, 10, 14, .66);
  --shadow: 0 12px 36px rgba(0, 0, 0, .22);
}
html[data-theme="light"] body {
  --bg: #f7f5ef;
  --surface: #fffefa;
  --surface-2: #f4f2e9;
  --surface-3: #e8e5d9;
  --white: #191d20;
  --muted: #505b63;
  --line: #cccfc9;
  --accent-text: #634b00;
  --accent-surface: #fff2bc;
  --success-text: #14603c;
  --success-surface: #e2f4e9;
  --danger-text: #942d29;
  --danger-surface: #ffedeb;
  --input-bg: #ffffff;
  --overlay: rgba(34, 43, 47, .28);
  --shadow: 0 12px 36px rgba(45, 49, 34, .10);
}
html[data-theme="dark"] body { background: var(--bg); color: var(--white); }

/* Hide only the repeated large UI banner, not the ride state or mini re-entry control. */
html body #customerActiveRideTab { display: none !important; }
body.ride-sheet-open #customerRideMini { display: none !important; }

html[data-theme] body #rideSheet {
  top: var(--visual-top, 0px);
  bottom: auto;
  height: var(--visual-height, 100dvh);
  max-height: var(--visual-height, 100dvh);
  padding: max(12px, env(safe-area-inset-top, 0px)) max(10px, env(safe-area-inset-right, 0px)) max(12px, env(safe-area-inset-bottom, 0px)) max(10px, env(safe-area-inset-left, 0px)) !important;
  background: var(--overlay) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  overflow: hidden;
  place-items: center !important;
}
html[data-theme] body #rideSheet > .ride-status-sheet {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: min(100%, 640px) !important;
  min-height: 0;
  max-height: 100% !important;
  padding: 12px 16px 20px !important;
  background: var(--surface) !important;
  color: var(--white) !important;
  border: 1px solid var(--line) !important;
  box-shadow: var(--shadow) !important;
  border-radius: 24px !important;
  overflow: auto !important;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scroll-padding: 62px 0 16px;
  touch-action: pan-y;
}
#rideSheet > .ride-status-sheet > * { flex-shrink: 0; min-width: 0; }
html[data-theme] body #rideSheet .drag-handle { display: none; }
html[data-theme] body #rideSheet #closeRideSheet {
  position: sticky !important;
  align-self: flex-end;
  flex-shrink: 0;
  top: 0 !important;
  right: 0 !important;
  margin: 0 0 -56px;
  width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  min-width: 44px !important;
  background: var(--surface-2) !important;
  color: var(--white) !important;
  border: 1px solid var(--line) !important;
  box-shadow: var(--shadow) !important;
  z-index: 5 !important;
}
html[data-theme] body #rideSheet .status-head { order: 0; padding: 0 54px 0 0 !important; text-align: left; }
html[data-theme] body #rideSheet .status-head-top { min-height: 44px; flex-wrap: wrap; justify-content: flex-start; margin: 0; }
html[data-theme] body #rideSheet .status-kicker { color: var(--muted); font-size: 11px; letter-spacing: .05em; }
html[data-theme] body #rideSheet .status-orbit { display: none !important; }
html[data-theme] body #rideSheet #rideStatusTitle { font-size: 21px !important; color: var(--white) !important; margin: 6px 0; line-height: 1.3; }
html[data-theme] body #rideSheet #rideStatusText { font-size: 14px !important; color: var(--muted) !important; max-width: none; margin: 0; }
html[data-theme] body #rideSheet .status-live-badge { background: var(--success-surface); color: var(--success-text); border-color: var(--line); font-size: 11px; }
html[data-theme] body #rideSheet #assignedDriverCard { order: 1; margin: 0; }
html[data-theme] body #rideSheet #rideApproachCard { order: 2; margin: 0; }
#rideSheet .ride-status-route { order: 3; }
#rideSheet .ride-status-meta { order: 4; }
#rideSheet #openLiveRideMap { order: 5; }
#rideSheet #customerRideChat { order: 6; }
#rideSheet .timeline { order: 7; }
#rideSheet .status-actions { order: 8; }
#rideSheet #rideSheetHomeButton, #rideSheet #showDiscountPass { order: 9; }
#rideSheet #rideCouponState, #rideSheet #customerLocationShareNote, #rideSheet #completeRideButton { order: 10; }
html[data-theme] body #rideSheet :is(.ride-status-route, .ride-status-meta > div, .driver-card, .ride-approach-card, .timeline) {
  background: var(--surface-2) !important;
  color: var(--white) !important;
  border: 1px solid var(--line) !important;
  box-shadow: none !important;
}
html[data-theme] body #rideSheet :is(.ride-status-route, .ride-status-meta, .timeline) { margin: 0; }
html[data-theme] body #rideSheet :is(b, strong, h2, h3) { color: var(--white) !important; text-shadow: none !important; }
html[data-theme] body #rideSheet :is(p, small, .driver-copy > span, .timeline-step, .location-sharing-note) { color: var(--muted) !important; font-size: 12px !important; opacity: 1; }
html[data-theme] body #rideSheet .ride-status-route-point b { white-space: normal; overflow-wrap: anywhere; font-size: 14px; line-height: 1.5; }
html[data-theme] body #rideSheet .ride-status-meta b { white-space: normal; overflow-wrap: anywhere; font-size: 14px; }
html[data-theme] body #rideSheet .driver-copy { min-width: 0; overflow-wrap: anywhere; }
html[data-theme] body #rideSheet .driver-copy b { font-size: 16px !important; line-height: 1.35; }
html[data-theme] body #rideSheet .driver-eta { min-width: 52px; }
html[data-theme] body #rideSheet .timeline-step { min-width: 0; overflow-wrap: anywhere; }
html[data-theme] body #rideSheet .timeline-step::before { background: var(--surface); border-color: var(--line); }
html[data-theme] body #rideSheet .timeline-step.active::before, html[data-theme] body #rideSheet .timeline-step.done::before { background: var(--yellow); border-color: var(--accent-text); }
html[data-theme] body #rideSheet .timeline-step::after { background: var(--line); }
html[data-theme] body #rideSheet #openLiveRideMap { margin: 0 !important; background: var(--yellow) !important; border-color: var(--yellow-dark) !important; box-shadow: none !important; }
html[data-theme] body #rideSheet #openLiveRideMap :is(b, small) { color: #191d20 !important; }
html[data-theme] body #rideSheet :is(.status-actions > *, .ride-sheet-home, .discount-pass-trigger) {
  min-height: 48px;
  padding: 10px;
  background: var(--surface-2) !important;
  color: var(--white) !important;
  border: 1px solid var(--line) !important;
  font-size: 14px !important;
  border-radius: 14px;
  margin: 0;
}
html[data-theme] body #rideSheet .status-actions .danger { color: var(--danger-text) !important; background: var(--danger-surface) !important; }
html[data-theme] body #rideSheet .location-sharing-note.is-live { color: var(--success-text) !important; }

/* Shared customer/driver chat, including dynamically rendered bubbles. */
html[data-theme] body .ride-chat-panel {
  background: var(--surface-2) !important; color: var(--white) !important;
  border-color: var(--line) !important; margin: 0; overflow: hidden;
}
html[data-theme] body .ride-chat-panel > summary { min-height: 52px; padding: 10px 12px; flex-wrap: wrap; color: var(--white); border-color: var(--line); }
html[data-theme] body .ride-chat-panel > summary span { color: var(--white); font-size: 14px; }
html[data-theme] body .ride-chat-panel > summary small { color: var(--success-text) !important; font-size: 12px !important; }
html[data-theme] body .ride-chat-bubble { background: var(--surface); color: var(--white); border-color: var(--line); font-size: 14px; }
html[data-theme] body .ride-chat-bubble span { color: inherit !important; }
html[data-theme] body .ride-chat-message.mine .ride-chat-bubble { background: var(--success-surface); color: var(--white); border-color: var(--line); }
html[data-theme] body .ride-chat-panel :is(.ride-chat-message small, .ride-chat-empty, .ride-chat-expired, .ride-chat-retention) { color: var(--muted) !important; font-size: 12px !important; }
/* Reserve image space before lazy loading; WebKit otherwise collapses this grid item. */
html[data-theme] body .ride-chat-bubble.has-photo { width: 232px; max-width: 100%; }
html[data-theme] body .ride-chat-image { width: 100%; aspect-ratio: 4 / 3; background: var(--surface-3); }
html[data-theme] body .ride-chat-quick { flex-wrap: wrap; overflow: visible; }
html[data-theme] body .ride-chat-quick button { min-height: 44px; color: var(--accent-text); background: var(--accent-surface); border-color: var(--line); white-space: normal; font-family: inherit; font-weight: 700; font-size: 13px; }
html[data-theme] body .ride-chat-compose { grid-template-columns: minmax(0, 1fr) 44px; }
html[data-theme] body .ride-chat-compose input {
  background: var(--input-bg) !important; color: var(--white) !important; border-color: var(--line);
  height: 48px; font-size: 16px !important; caret-color: var(--white);
}
html[data-theme] body .ride-chat-compose input::placeholder { color: var(--muted) !important; opacity: 1; }
html[data-theme] body .ride-chat-compose input:focus { border-color: var(--success-text); outline: 2px solid var(--success-text); outline-offset: 1px; }
html[data-theme] body .ride-chat-photo { min-width: 44px; height: 48px; background: var(--surface) !important; color: var(--white) !important; border: 1px solid var(--line); }
html[data-theme] body .ride-chat-photo[aria-busy="true"] { font-size: 0; cursor: wait; }
html[data-theme] body .ride-chat-photo[aria-busy="true"]::after { content: "..."; font-size: 16px; }
html[data-theme] body .ride-chat-compose button { grid-column: 1 / -1; min-height: 48px; width: 100%; color: #191d20; background: var(--yellow); font-size: 14px; }
html[data-theme] body .ride-chat-compose button:disabled { background: var(--surface-3); color: var(--muted); opacity: 1; cursor: wait; }
html[data-theme] body .ride-chat-panel[aria-busy="true"] .ride-chat-quick { pointer-events: none; }

/* Resolve remaining live/driver surfaces through the same palette. */
html[data-theme] body :is(.live-map-status-bubble, .live-map-footer, .ride-chat-launcher, .dispatch-route, .driver-instant-alert, .driver-reject-sheet, .driver-reject-reasons button, .driver-customer-note, .notification-item, .ride-approach-metrics > div) {
  background: var(--surface-2) !important; border-color: var(--line) !important; color: var(--white) !important; box-shadow: none !important;
}
html[data-theme] body :is(.live-map-status-bubble, .ride-chat-launcher, .dispatch-route, .driver-instant-alert, .driver-reject-sheet, .notification-item) :is(b, strong, h2, span:not(.eyebrow)) { color: var(--white) !important; }
html[data-theme] body :is(.live-map-status-bubble, .ride-chat-launcher, .driver-instant-alert, .driver-reject-sheet, .notification-item) :is(p, small, time, .eyebrow) { color: var(--muted) !important; }
html[data-theme] body .driver-instant-alert { background: var(--danger-surface) !important; }
html[data-theme] body .driver-reject-reasons button.active { background: var(--accent-surface) !important; border-color: var(--accent-text) !important; }
html[data-theme] body .driver-reject-reasons button > span { background: var(--surface-3) !important; }
html[data-theme] body .ride-chat-launcher { background: var(--success-surface) !important; }
html[data-theme] body .modal, html[data-theme] body .sheet { background: var(--surface) !important; color: var(--white) !important; border-color: var(--line) !important; }

/* Non-interactive toast stays below notch and above content without stealing taps. */
html[data-theme] body #toast {
  top: calc(var(--visual-top, 0px) + max(12px, env(safe-area-inset-top, 0px)));
  bottom: auto !important;
  left: 50%;
  width: min(420px, calc(100% - 32px));
  max-height: min(104px, 24dvh);
  overflow: hidden;
  font-size: 14px;
  line-height: 1.4;
  background: var(--surface) !important;
  color: var(--white) !important;
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  transform: translate(-50%, -12px);
  z-index: 4000;
  pointer-events: none;
}
html[data-theme] body #toast.show { transform: translate(-50%, 0); }
html.keyboard-open body #rideSheet { padding-bottom: 8px !important; }
html.keyboard-open body #rideSheet .ride-chat-messages { max-height: 120px; }
@media (max-width: 370px) {
  html[data-theme] body #rideSheet .status-actions { grid-template-columns: 1fr; }
  html[data-theme] body #rideSheet .driver-card { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
  html[data-theme] body #rideSheet *, html[data-theme] body #toast { animation: none !important; transition: none !important; scroll-behavior: auto; }
}

/* 2026-09-06: final light-mode contrast pass for the driver workflow. */
html[data-theme="light"] body {
  color-scheme: light;
}

html[data-theme="light"] body :is(
  .dispatch-route, .driver-command-center, .driver-dispatch-recovery,
  .driver-offline-notice, .driver-profile-summary, .driver-map-card,
  .driver-approved-map-card, .driver-queue-item, .driver-queue-card,
  .driver-job-summary, .driver-hero, .telemetry-card, .driver-account-strip,
  .driver-settings-profile, .driver-diagnostics-panel, .management-card,
  .driver-rail-card, .driver-rail-panel, .driver-quick-fare,
  .quick-fare-ride, .driver-reject-sheet, .driver-settings-modal,
  .driver-passwords-modal, .driver-profiles-modal
) {
  background: #fffdf8 !important;
  color: #171611 !important;
  border-color: #d8d2c5 !important;
  box-shadow: 0 12px 30px rgba(65, 51, 10, .10) !important;
  text-shadow: none !important;
}

html[data-theme="light"] body :is(
  .dispatch-route, .driver-command-center, .driver-dispatch-recovery,
  .driver-offline-notice, .driver-profile-summary, .driver-map-card,
  .driver-approved-map-card, .driver-queue-item, .driver-queue-card,
  .driver-job-summary, .driver-hero, .telemetry-card, .driver-account-strip,
  .driver-settings-profile, .driver-diagnostics-panel, .management-card,
  .driver-rail-card, .driver-rail-panel, .driver-quick-fare,
  .quick-fare-ride, .driver-reject-sheet, .driver-settings-modal,
  .driver-passwords-modal, .driver-profiles-modal
) :is(b, strong, h1, h2, h3, h4, label, div, span, p, small, a, time) {
  color: #302d26 !important;
  text-shadow: none !important;
}

html[data-theme="light"] body :is(
  .dispatch-route, .driver-queue-item, .driver-queue-card,
  .driver-job-summary, .driver-hero, .driver-account-strip,
  .driver-command-center
) :is(b, strong, h1, h2, h3) {
  color: #171611 !important;
}

html[data-theme="light"] body .driver-instant-banner,
html[data-theme="light"] body .driver-instant-alert {
  background: #fff0ee !important;
  color: #7a201d !important;
  border-color: #e6a09c !important;
  box-shadow: 0 8px 22px rgba(122, 32, 29, .10) !important;
}

html[data-theme="light"] body :is(.driver-instant-banner, .driver-instant-alert) :is(b, strong, h1, h2, h3, span, p, small, div) {
  color: #7a201d !important;
}

html[data-theme="light"] body .driver-customer-note {
  background: #fff8d6 !important;
  color: #4b3a00 !important;
  border-color: #e8c83d !important;
}

html[data-theme="light"] body .driver-customer-note :is(b, strong, span, p, small, div) {
  color: #4b3a00 !important;
}

html[data-theme="light"] body .driver-work-tabs {
  background: #fffdf8 !important;
  border-color: #d8d2c5 !important;
}

html[data-theme="light"] body .driver-work-tab {
  background: #ffffff !important;
  color: #514d45 !important;
  border-color: #d8d2c5 !important;
}

html[data-theme="light"] body .driver-work-tab.active,
html[data-theme="light"] body .driver-job-filters button.active,
html[data-theme="light"] body .driver-reject-reasons button.active {
  background: #f9c300 !important;
  color: #171611 !important;
  border-color: #c69b00 !important;
}

html[data-theme="light"] body :is(
  .driver-job-toolbar button, .driver-job-filters button,
  .driver-settings-button, .driver-open-settings, .driver-setting-action,
  .driver-dispatch-recovery-actions button, .driver-header-actions button
) {
  background: #ffffff !important;
  color: #171611 !important;
  border-color: #d8d2c5 !important;
  text-shadow: none !important;
}

html[data-theme="light"] body :is(
  .driver-job-toolbar input, .driver-fare-entry input,
  .driver-fare-entry select, .driver-settings-premium select,
  .driver-password-input-row input, .driver-profile-form input,
  .driver-profile-form textarea, .driver-profile-form select
) {
  background: #f7f4ec !important;
  color: #171611 !important;
  border-color: #d8d2c5 !important;
  color-scheme: light !important;
}

html[data-theme="light"] body :is(.driver-queue-status, .driver-discount-badge) {
  background: #fff4bd !important;
  color: #5a4300 !important;
  border-color: #e8c83d !important;
}

/* Keep the old cached markup from resurfacing the removed automatic-offer box. */
#automaticOfferBox { display: none !important; }
