/* ══════════════════════════════════════════
   DROP CARS – THEME SYSTEM
   Light = default (no class)
   Dark  = html.dark-mode
══════════════════════════════════════════ */

/* ── Toggle pill ── */
.theme-toggle {
  width: 40px; height: 22px;
  background: linear-gradient(90deg, #0ea5e9, #6366f1);
  border-radius: 99px; position: relative;
  cursor: pointer; border: none; flex-shrink: 0;
  transition: background 0.35s;
}
.theme-toggle::after {
  content: ''; position: absolute;
  right: 3px; top: 3px;
  width: 16px; height: 16px;
  background: #fff; border-radius: 50%;
  transition: right 0.3s, left 0.3s;
  box-shadow: 0 1px 4px rgba(0,0,0,.25);
}
html.dark-mode .theme-toggle { background: #1e293b; border: 1px solid rgba(255,255,255,.12); }
html.dark-mode .theme-toggle::after { right: auto; left: 3px; background: #f5b800; box-shadow: 0 0 6px rgba(245,184,0,.45); }

/* ── Global transition ── */
body, .site-header, .booking-card, .field, input, select, textarea,
.seo-card, .service-card, .city-card, .trust-card, .faq-item, .faq__items article,
.route-card, section, footer { transition: background-color 0.3s, color 0.3s, border-color 0.3s; }

/* ══════════════════════════════════════════
   DARK MODE OVERRIDES
══════════════════════════════════════════ */

/* ── Body ── */
html.dark-mode body { background: #060d1e !important; color: #cbd5e1 !important; }
html.dark-mode h1, html.dark-mode h2, html.dark-mode h3, html.dark-mode h4 { color: #ffffff !important; }
html.dark-mode p { color: rgba(226,240,255,0.75); }

/* ── Navbar ── */
html.dark-mode .site-header { background-color: rgba(7,13,24,0.95) !important; border-bottom: 1px solid rgba(255,255,255,0.06) !important; backdrop-filter: blur(12px) !important; -webkit-backdrop-filter: blur(12px) !important; }
html.dark-mode .logo__text { background: rgba(255,255,255,0.08) !important; color: #ffffff !important; border-color: rgba(255,255,255,0.12) !important; }
html.dark-mode .logo__mark { background: #f5b800 !important; color: #0a0f1d !important; }
html.dark-mode .nav-dropdown__content { background: #0f172a !important; border: 1px solid #1e293b !important; box-shadow: 0 10px 25px rgba(0,0,0,.4) !important; }
html.dark-mode .nav-dropdown__content a { color: #cbd5e1 !important; }
html.dark-mode .nav-dropdown__content a:hover { background: #1e293b !important; color: #ffffff !important; }
/* ── Slide-out menu panel ── */
html.dark-mode .menu-panel { background: #0b1424 !important; color: #e2f0ff !important; border-left: 1px solid rgba(255,255,255,0.08) !important; box-shadow: -12px 0 40px rgba(0,0,0,0.5) !important; }
html.dark-mode .menu-panel a,
html.dark-mode .menu-panel button:not(.menu-panel__cta-btn--primary):not(.menu-panel__close),
html.dark-mode .menu-panel__section,
html.dark-mode .menu-panel__section > a,
html.dark-mode .menu-panel__section > button { color: #e2f0ff !important; }
html.dark-mode .menu-panel__section { border-color: rgba(255,255,255,0.08) !important; border-bottom: 1px solid rgba(255,255,255,0.06) !important; background: transparent !important; }
html.dark-mode .menu-panel__section:hover { background: rgba(255,255,255,0.04) !important; }
html.dark-mode .menu-panel__dropdown { background: rgba(255,255,255,0.03) !important; border-color: rgba(255,255,255,0.08) !important; }
html.dark-mode .menu-panel__dropdown > summary,
html.dark-mode .menu-panel summary { color: #e2f0ff !important; }
html.dark-mode .menu-panel__dropdown > summary::-webkit-details-marker { color: #e2f0ff !important; }
html.dark-mode .menu-panel__dropdown-links a { color: rgba(226,240,255,0.78) !important; background: rgba(255,255,255,0.05) !important; border-color: rgba(255,255,255,0.08) !important; }
html.dark-mode .menu-panel__dropdown-links a:hover { color: #38bdf8 !important; background: rgba(56,189,248,0.08) !important; }
/* CTA buttons (Login, Track Ride, Admin Login) */
html.dark-mode .menu-panel__cta-btn,
html.dark-mode .menu-panel__cta-btn--secondary,
html.dark-mode .menu-panel__cta-btn--admin { background: rgba(255,255,255,0.06) !important; color: #e2f0ff !important; border: 1px solid rgba(255,255,255,0.12) !important; }
html.dark-mode .menu-panel__cta-btn--primary { background: linear-gradient(135deg,#38bdf8 0%,#0ea5e9 100%) !important; color: #070d18 !important; border-color: #38bdf8 !important; }
html.dark-mode .menu-panel__cta-btn svg, html.dark-mode .menu-panel__cta-btn svg path { stroke: currentColor !important; }
html.dark-mode .menu-panel__admin-foot { border-color: rgba(255,255,255,0.08) !important; }
/* Close button — keep dark bar */
html.dark-mode .menu-panel__close { background: #060d1e !important; color: #e2f0ff !important; border-top: 1px solid rgba(255,255,255,0.08) !important; }
html.dark-mode .menu-panel__close:hover { background: #111d33 !important; }
/* chevron / plus icons */
html.dark-mode .menu-panel__section--accordion::after,
html.dark-mode .menu-panel__section .menu-panel__toggle-icon { color: #e2f0ff !important; }
/* Hamburger menu button */
html.dark-mode .menu-button { background: rgba(255,255,255,0.06) !important; border: 1px solid rgba(255,255,255,0.12) !important; color: #e2f0ff !important; }
html.dark-mode .menu-button:hover { background: rgba(255,255,255,0.12) !important; border-color: rgba(56,189,248,0.4) !important; }
html.dark-mode .menu-button svg { stroke: #e2f0ff !important; color: #e2f0ff !important; }
html.dark-mode .menu-button svg path { stroke: #e2f0ff !important; }

/* ── Hero (homepage) ── */
html.dark-mode .hero { background: linear-gradient(135deg, #020817 0%, #0a1628 35%, #0f172a 65%, #1a0f3c 100%) !important; }
html.dark-mode .hero::after { background: linear-gradient(130deg, rgba(2,8,23,0.92) 0%, rgba(10,22,40,0.88) 50%, rgba(8,10,24,0.95) 100%) !important; }
html.dark-mode .hero__copy h1 { color: #ffffff !important; text-shadow: 0 2px 12px rgba(0,0,0,.45) !important; }
html.dark-mode .hero__copy .hero__sub { color: rgba(226,240,255,0.7) !important; }
html.dark-mode .hero__eyebrow { color: #7dd3fc !important; background: rgba(56,189,248,0.10) !important; border-color: rgba(125,211,252,0.30) !important; }
html.dark-mode .hero__microcopy span { color: #7dd3fc !important; background: rgba(56,189,248,0.10) !important; border-color: rgba(125,211,252,0.22) !important; }
html.dark-mode .hero__rating { color: rgba(226,240,255,0.7) !important; }

/* ── Hero (city page) ── */
html.dark-mode .city-hero { background: linear-gradient(135deg, #020817 0%, #0a1628 35%, #0f172a 65%, #1a0f3c 100%) !important; color: #ffffff !important; }
html.dark-mode .city-hero::before { background: linear-gradient(135deg, rgba(2,8,23,0.5) 0%, rgba(8,10,18,0.3) 100%) !important; }
html.dark-mode .city-hero h1, html.dark-mode .city-hero .hero__copy h1 { color: #ffffff !important; text-shadow: 0 2px 12px rgba(0,0,0,.45) !important; }
html.dark-mode .city-hero p, html.dark-mode .city-hero .hero__copy p { color: rgba(226,240,255,0.78) !important; }
html.dark-mode .city-hero .hero__eyebrow { color: #7dd3fc !important; background: rgba(56,189,248,0.10) !important; border-color: rgba(125,211,252,0.28) !important; }
html.dark-mode .breadcrumbs a { color: rgba(125,211,252,0.90) !important; }
html.dark-mode .breadcrumbs span { color: rgba(255,255,255,0.40) !important; }

/* ── Hero (route page) ── */
html.dark-mode .route-hero { background: linear-gradient(135deg, #020817 0%, #0a1628 35%, #0f172a 65%, #1a0f3c 100%) !important; color: #ffffff !important; }
html.dark-mode .route-hero::before { background: linear-gradient(135deg, rgba(2,8,23,0.5) 0%, rgba(8,10,18,0.3) 100%) !important; }
html.dark-mode .route-hero h1 { color: #ffffff !important; text-shadow: 0 2px 12px rgba(0,0,0,.45) !important; }
html.dark-mode .route-hero p { color: rgba(226,240,255,0.75) !important; }
html.dark-mode .trust-line, html.dark-mode .trust-line span { color: rgba(226,240,255,0.70) !important; }

/* ── Stats strip ── */
html.dark-mode .d1t-stat-block { background: rgba(14,26,50,0.75) !important; border-color: rgba(255,255,255,0.09) !important; box-shadow: none !important; }
html.dark-mode .d1t-stat-block__num { color: #f5b800 !important; }
html.dark-mode .d1t-stat-block__label { color: rgba(255,255,255,0.42) !important; }

/* ══════════════════════════════════════════
   Booking card — EXACT mirror of city/route page
   styling (body.city-page/.route-page .booking-card--home
   in booking-form.css). Same values, same specificity.
══════════════════════════════════════════ */
html.dark-mode .booking-card--home {
  background: rgba(15, 23, 42, 0.55) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3) !important;
}
html.dark-mode .booking-card--home .booking-card__header,
html.dark-mode .booking-card--home .field,
html.dark-mode .booking-card--home .wa-check-label,
html.dark-mode .booking-card--home .promo-row__text,
html.dark-mode .booking-card--home .fare-toggle > span { color: #ffffff !important; }

/* Fields */
html.dark-mode .booking-card--home .field input,
html.dark-mode .booking-card--home .field select {
  background: rgba(15, 23, 42, 0.45) !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  color: #ffffff !important;
  color-scheme: dark !important;
}
html.dark-mode .booking-card--home .field input::placeholder { color: rgba(255, 255, 255, 0.4) !important; }
html.dark-mode .booking-card--home .field input:focus,
html.dark-mode .booking-card--home .field select:focus {
  background: rgba(15, 23, 42, 0.6) !important;
  border-color: #38bdf8 !important;
  box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.25) !important;
}
html.dark-mode .booking-card--home input[type="date"]::-webkit-calendar-picker-indicator,
html.dark-mode .booking-card--home input[type="time"]::-webkit-calendar-picker-indicator { filter: invert(1) brightness(1.6); opacity: 0.75; }
/* Native date/time value digits — force readable light text */
html.dark-mode .booking-card--home input[type="date"]::-webkit-datetime-edit,
html.dark-mode .booking-card--home input[type="time"]::-webkit-datetime-edit,
html.dark-mode .booking-card--home input[type="date"]::-webkit-datetime-edit-text,
html.dark-mode .booking-card--home input[type="time"]::-webkit-datetime-edit-text,
html.dark-mode .booking-card--home input[type="date"]::-webkit-datetime-edit-fields-wrapper,
html.dark-mode .booking-card--home input[type="time"]::-webkit-datetime-edit-fields-wrapper,
html.dark-mode .booking-card--home input[type="date"]::-webkit-datetime-edit-month-field,
html.dark-mode .booking-card--home input[type="date"]::-webkit-datetime-edit-day-field,
html.dark-mode .booking-card--home input[type="date"]::-webkit-datetime-edit-year-field,
html.dark-mode .booking-card--home input[type="time"]::-webkit-datetime-edit-hour-field,
html.dark-mode .booking-card--home input[type="time"]::-webkit-datetime-edit-minute-field,
html.dark-mode .booking-card--home input[type="time"]::-webkit-datetime-edit-ampm-field { color: #ffffff !important; opacity: 1 !important; }

/* Trip tabs & fare toggle */
html.dark-mode .booking-card--home .trip-type-options,
html.dark-mode .booking-card--home .oneway-subtypes,
html.dark-mode .booking-card--home .fare-toggle__switch {
  background: rgba(15, 23, 42, 0.4) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
}
html.dark-mode .booking-card--home .oneway-subtypes { border-top: none !important; margin-top: -1px !important; }
html.dark-mode .booking-card--home .trip-type-option,
html.dark-mode .booking-card--home .oneway-subtypes label,
html.dark-mode .booking-card--home .fare-toggle__switch label { color: rgba(255, 255, 255, 0.7) !important; }
html.dark-mode .booking-card--home .trip-type-option:hover,
html.dark-mode .booking-card--home .oneway-subtypes label:hover,
html.dark-mode .booking-card--home .fare-toggle__switch label:hover { background: rgba(255, 255, 255, 0.05) !important; color: #ffffff !important; }
html.dark-mode .booking-card--home .trip-type-option.trip-type-option--active,
html.dark-mode .booking-card--home .trip-type-option.active,
html.dark-mode .booking-card--home .oneway-subtypes input:checked + label,
html.dark-mode .booking-card--home .oneway-subtypes label.active,
html.dark-mode .booking-card--home .fare-toggle__switch input:checked + label {
  background: linear-gradient(135deg, #38bdf8 0%, #0ea5e9 100%) !important;
  color: #070d18 !important;
  border-color: #38bdf8 !important;
  box-shadow: 0 4px 12px rgba(56, 189, 248, 0.3) !important;
}
/* Toll-tax toggle — clear selected vs unselected (like vehicle cards) */
html.dark-mode .booking-card--home .fare-toggle__switch label { color: rgba(255,255,255,0.55) !important; }
html.dark-mode .booking-card--home .fare-toggle__switch input:checked + label {
  background: rgba(56,189,248,0.22) !important;
  color: #ffffff !important;
  border: 1.5px solid #38bdf8 !important;
  box-shadow: 0 0 14px rgba(56,189,248,0.45) !important;
  text-shadow: none !important;
  font-weight: 700 !important;
}
html.dark-mode .booking-card--home .fare-toggle__switch { background: rgba(8,15,30,0.55) !important; }

/* ── CHECK FARE NOW — matches selected vehicle card (cyan glass + glow) ── */
html.dark-mode .booking-card--home .btn-primary {
  background: rgba(56,189,248,0.16) !important;
  color: #ffffff !important;
  border: 1px solid #38bdf8 !important;
  box-shadow: 0 0 12px rgba(56,189,248,0.30) !important;
  letter-spacing: 0.04em !important;
  text-shadow: none !important;
  transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease !important;
  position: relative !important;
  overflow: hidden !important;
}
html.dark-mode .booking-card--home .btn-primary:hover {
  background: rgba(56,189,248,0.26) !important;
  box-shadow: 0 0 20px rgba(56,189,248,0.45) !important;
  transform: translateY(-2px) !important;
}
html.dark-mode .booking-card--home .btn-primary:active { transform: translateY(0) !important; }
/* glossy sheen sweep */
html.dark-mode .booking-card--home .btn-primary::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important; left: -60% !important; width: 45% !important; height: 100% !important;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,0.35), transparent) !important;
  transform: skewX(-18deg) !important;
  transition: left 0.6s ease !important;
  pointer-events: none !important;
}
html.dark-mode .booking-card--home .btn-primary:hover::after { left: 130% !important; }

/* Vehicle selector cards */
html.dark-mode .booking-card--home .vehicle-selector-card {
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
  color: #ffffff !important;
}
html.dark-mode .booking-card--home .vehicle-selector-card:hover { background: rgba(255, 255, 255, 0.12) !important; border-color: #38bdf8 !important; }
html.dark-mode .booking-card--home .vehicle-selector-card.vehicle-selector-card--active,
html.dark-mode .booking-card--home .vehicle-selector-card.active {
  background: rgba(56, 189, 248, 0.16) !important;
  border-color: #38bdf8 !important;
  box-shadow: 0 0 12px rgba(56, 189, 248, 0.3) !important;
}
html.dark-mode .booking-card--home .vehicle-selector-card__name { color: #ffffff !important; }
html.dark-mode .booking-card--home .vehicle-selector-card__price { color: #38bdf8 !important; }

/* Promo apply & hints */
html.dark-mode .booking-card--home .btn-promo-apply {
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  background: rgba(255, 255, 255, 0.1) !important;
  color: #ffffff !important;
}
html.dark-mode .booking-card--home .btn-promo-apply:hover { background: rgba(255, 255, 255, 0.18) !important; border-color: #38bdf8 !important; }
html.dark-mode .booking-card--home .field-hint { color: rgba(255, 255, 255, 0.5) !important; }

/* Phone input wrapper */
html.dark-mode .booking-card--home .phone-input-wrapper {
  background: rgba(15, 23, 42, 0.45) !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
}
html.dark-mode .booking-card--home .phone-input-wrapper:focus-within {
  background: rgba(15, 23, 42, 0.6) !important;
  border-color: #38bdf8 !important;
  box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.25) !important;
}
html.dark-mode .booking-card--home .country-code-trigger { color: #ffffff !important; background: transparent !important; }
html.dark-mode .booking-card--home .country-code-popover { background: #0f1c2e !important; border-color: rgba(255,255,255,0.16) !important; }
html.dark-mode .booking-card--home .country-code-option { color: #ffffff !important; }
html.dark-mode .booking-card--home .country-code-option:hover { background: rgba(255,255,255,0.12) !important; }
html.dark-mode .booking-card--home .promo-row input { background: rgba(15, 23, 42, 0.45) !important; border: 1px solid rgba(255,255,255,0.16) !important; color: #ffffff !important; }

/* Optional stops control (Round Trip / Multi-city) — mirror city/route */
html.dark-mode .booking-card--home .stops-control { background: rgba(15, 23, 42, 0.45) !important; border: 1px solid rgba(255, 255, 255, 0.12) !important; }
html.dark-mode .booking-card--home .stops-control__header p { color: #ffffff !important; }
html.dark-mode .booking-card--home .btn-chips { background: rgba(255, 255, 255, 0.08) !important; border: 1px solid rgba(255, 255, 255, 0.2) !important; color: #ffffff !important; }
html.dark-mode .booking-card--home .btn-chips:hover { background: rgba(255, 255, 255, 0.15) !important; border-color: #38bdf8 !important; }
html.dark-mode .booking-card--home .stops-limit { color: rgba(255, 255, 255, 0.5) !important; }
html.dark-mode .booking-card--home .stop-item { background: rgba(15, 23, 42, 0.55) !important; border: 1px solid rgba(255, 255, 255, 0.16) !important; color: #ffffff !important; }
html.dark-mode .booking-card--home .stop-item input { color: #ffffff !important; }
html.dark-mode .booking-card--home .stop-item__drag { color: rgba(255, 255, 255, 0.6) !important; }
html.dark-mode .booking-card--home .stop-item__actions button { background: rgba(255, 255, 255, 0.08) !important; color: #ffffff !important; }
html.dark-mode .booking-card--home .stop-item__actions button:hover:not(:disabled) { background: #38bdf8 !important; color: #070d18 !important; }
html.dark-mode .booking-card--home .stop-item__actions button:disabled { opacity: 0.25 !important; background: rgba(255, 255, 255, 0.03) !important; color: rgba(255, 255, 255, 0.3) !important; }

/* ── Google Places autocomplete dropdown (appended to <body>) ── */
html.dark-mode .pac-container {
  background: #0f1c2e !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.55) !important;
  border-radius: 0 !important;
}
html.dark-mode .pac-item {
  background: transparent !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: rgba(255, 255, 255, 0.6) !important;
}
html.dark-mode .pac-item:hover,
html.dark-mode .pac-item-selected,
html.dark-mode .pac-item.pac-item-selected { background: rgba(56, 189, 248, 0.14) !important; }
html.dark-mode .pac-item-query { color: #ffffff !important; }
html.dark-mode .pac-matched { color: #38bdf8 !important; }
html.dark-mode .pac-icon { filter: invert(1) brightness(1.4); opacity: 0.7; }
html.dark-mode .pac-logo::after { filter: invert(0.9) brightness(1.2); opacity: 0.7; }

/* ── Vehicle selector (booking form) ── */
html.dark-mode .vehicle-btn, html.dark-mode .vehicle-option, html.dark-mode .vehicle-selector-grid > * { background: rgba(255,255,255,0.06) !important; border-color: rgba(255,255,255,0.12) !important; color: #e2f0ff !important; }
html.dark-mode .vehicle-btn.active, html.dark-mode .vehicle-option.active { border-color: #38bdf8 !important; background: rgba(56,189,248,0.15) !important; }

/* ── Popular Routes city filter chips (.city-tab) ── */
html.dark-mode .city-tabs .city-tab,
html.dark-mode .city-tab { background: rgba(255,255,255,0.06) !important; border: 1px solid rgba(255,255,255,0.14) !important; color: rgba(226,240,255,0.82) !important; }
html.dark-mode .city-tabs .city-tab:hover,
html.dark-mode .city-tab:hover { border-color: #38bdf8 !important; color: #ffffff !important; background: rgba(56,189,248,0.12) !important; }
html.dark-mode .city-tabs .city-tab.active,
html.dark-mode .city-tab.active { background: linear-gradient(135deg, #38bdf8 0%, #0ea5e9 100%) !important; color: #070d18 !important; border-color: #38bdf8 !important; box-shadow: 0 4px 12px rgba(56,189,248,0.3) !important; }

/* ── "View All Cities" toggle button & expand panel ── */
html.dark-mode .city-toggle-btn { color: #7dd3fc !important; border-color: #38bdf8 !important; background: rgba(56,189,248,0.08) !important; }
html.dark-mode .city-toggle-btn:hover { background: rgba(56,189,248,0.18) !important; color: #ffffff !important; }
html.dark-mode .city-collapse { background: transparent !important; border-color: rgba(255,255,255,0.08) !important; }

/* ── Section backgrounds ── */
html.dark-mode section:not(.hero):not(.city-hero):not(.route-hero) { background: inherit; }
html.dark-mode .services-section { background: #060d1e !important; }
html.dark-mode .section-light, html.dark-mode .bg-white, html.dark-mode .bg-light { background: #060d1e !important; }

/* ── Cards ── */
html.dark-mode .seo-card, html.dark-mode .service-card, html.dark-mode .city-card { background: #0e1626 !important; border-color: #1e293b !important; color: #e2f0ff !important; }
html.dark-mode .service-card__highlight { background: rgba(56,189,248,0.12) !important; border: 1px solid rgba(56,189,248,0.35) !important; color: #7dd3fc !important; }
html.dark-mode .trust-card, html.dark-mode .trust__item, html.dark-mode .trust-badges__item { background: #0e1626 !important; border-color: #1e293b !important; }
html.dark-mode .faq-item, html.dark-mode .faq__items article, html.dark-mode .faq__item { background: #0e1626 !important; border-color: #1e293b !important; }
html.dark-mode .faq__item summary, html.dark-mode .faq__item p, html.dark-mode .faq__question, html.dark-mode .faq__answer { color: #e2f0ff !important; }
html.dark-mode .route-card { background: #0e1626 !important; border-color: #1e293b !important; color: #e2f0ff !important; }
html.dark-mode .route-card:hover { border-color: #38bdf8 !important; background: #121e36 !important; }
html.dark-mode .vehicle-card { background: #0e1626 !important; border-color: #1e293b !important; }
html.dark-mode .vehicle-card__name, html.dark-mode .vehicle-card__price-val { color: #ffffff !important; }
html.dark-mode .vehicle-card__price-sub { color: #94a3b8 !important; }
html.dark-mode .routes__category { background: #0e1626 !important; border-color: #1e293b !important; }
html.dark-mode .city-about-section { background: #0e1626 !important; border-color: #1e293b !important; }
html.dark-mode .fare-card { background: rgba(15,22,38,0.8) !important; border-color: #1e293b !important; }
html.dark-mode .feature-card { background: #0e1626 !important; border-color: #1e293b !important; }
html.dark-mode .feature-card__icon { background: rgba(255,255,255,0.06) !important; }
/* ── Fleet showcase cards — premium dark treatment ── */
html.dark-mode .fleet-showcase__card {
  background: linear-gradient(180deg, #101d33 0%, #0b1424 100%) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  box-shadow: 0 18px 40px rgba(0,0,0,0.45) !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease !important;
}
html.dark-mode .fleet-showcase__card:hover {
  transform: translateY(-4px) !important;
  border-color: rgba(56,189,248,0.45) !important;
  box-shadow: 0 24px 54px rgba(0,0,0,0.55), 0 0 24px rgba(56,189,248,0.12) !important;
}
/* Image area — spotlight glow so the car pops */
html.dark-mode .fleet-showcase__img {
  background:
    radial-gradient(120% 90% at 50% 28%, rgba(56,189,248,0.16) 0%, rgba(56,189,248,0.04) 45%, transparent 72%),
    linear-gradient(180deg, #16243d 0%, #0d1828 100%) !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}
/* Kill the light "floor reflection" gradient under the car */
html.dark-mode .fleet-showcase__img::after {
  background: linear-gradient(to top, rgba(13,24,40,0.95) 0%, rgba(13,24,40,0.4) 40%, transparent 100%) !important;
}
html.dark-mode .fleet-showcase__name { color: #ffffff !important; }
html.dark-mode .fleet-showcase__category { color: rgba(226,240,255,0.62) !important; }
html.dark-mode .fleet-showcase__price, html.dark-mode .fleet-showcase__rate { color: #38bdf8 !important; }
html.dark-mode .fleet-showcase__spec, html.dark-mode .fleet-showcase__feature { color: rgba(226,240,255,0.80) !important; }
html.dark-mode .fleet-showcase__spec svg, html.dark-mode .fleet-showcase__feature svg { opacity: 0.95 !important; }
html.dark-mode .fleet-showcase__divider, html.dark-mode .fleet-showcase__content hr { border-color: rgba(255,255,255,0.08) !important; }
html.dark-mode .fleet-filter__btn { background: rgba(255,255,255,0.05) !important; border-color: rgba(255,255,255,0.1) !important; color: #e2f0ff !important; }
html.dark-mode .fleet-filter__btn.active { background: rgba(56,189,248,0.18) !important; border-color: #38bdf8 !important; color: #7dd3fc !important; }
html.dark-mode .seo-card__image { background: rgba(255,255,255,0.04) !important; }

/* ── Testimonials ── */
html.dark-mode .testimonial-card { background: #0e1626 !important; border-color: #1e293b !important; }
html.dark-mode .testimonial-text, html.dark-mode .testimonial-card p { color: rgba(226,240,255,0.78) !important; }
html.dark-mode .testimonial-user, html.dark-mode .testimonial-meta,
html.dark-mode .testimonial-user strong, html.dark-mode .testimonial-user b,
html.dark-mode .testimonial-card strong, html.dark-mode .testimonial-author { color: #ffffff !important; }
html.dark-mode .testimonial-user small, html.dark-mode .testimonial-meta small, html.dark-mode .testimonial-user span { color: rgba(226,240,255,0.6) !important; }
html.dark-mode .testimonials-view-more a, html.dark-mode .testimonials-view-more button { background: transparent !important; border-color: rgba(255,255,255,0.2) !important; color: #e2f0ff !important; }

/* ── Rate Us / Review form ── */
html.dark-mode .rate-us-box { background: #0e1626 !important; border-color: #1e293b !important; color: #e2f0ff !important; }
html.dark-mode .rate-us-box h2, html.dark-mode .rate-us-box h3, html.dark-mode .rate-us-box p { color: #e2f0ff !important; }
html.dark-mode .rate-us-box textarea, html.dark-mode .rate-us-box input { background: rgba(255,255,255,0.05) !important; border-color: rgba(255,255,255,0.12) !important; color: #e2f0ff !important; }
html.dark-mode .rate-us-box textarea::placeholder, html.dark-mode .rate-us-box input::placeholder { color: rgba(255,255,255,0.3) !important; }
html.dark-mode .rate-us-box label { color: rgba(255,255,255,0.55) !important; }

/* ── Quote modal & fare cards (matches city/route inline styles exactly) ── */
html.dark-mode .quote-modal__card { background: #0f1c2e !important; border: 1px solid rgba(255,255,255,0.16) !important; color: #fff !important; }
html.dark-mode .quote-modal__close { background: rgba(255,255,255,0.14) !important; color: #fff !important; }
html.dark-mode .quote-modal--estimate-mode .quote-modal__meta { background: rgba(255,255,255,0.08) !important; border-color: rgba(255,255,255,0.2) !important; }
html.dark-mode .fare-list-header { background: rgba(255,255,255,0.08) !important; border-color: rgba(255,255,255,0.2) !important; }
html.dark-mode .fare-list-header__title, html.dark-mode .fare-list-header__route, html.dark-mode .fare-list-header__time,
html.dark-mode .quote-fare-type-title, html.dark-mode .quote-modal__meta, html.dark-mode #quote-route, html.dark-mode #quote-fare { color: #fff !important; }
html.dark-mode .quote-fare-type-toggle { background: rgba(255,255,255,0.1) !important; border-color: rgba(255,255,255,0.2) !important; color: #fff !important; }
html.dark-mode .quote-fare-type-toggle__option { color: rgba(255,255,255,0.8) !important; }
html.dark-mode .vehicle-card--fare-option { background: rgba(255,255,255,0.08) !important; border-color: rgba(255,255,255,0.22) !important; }
html.dark-mode .vehicle-card--fare-option.active { background: linear-gradient(180deg, #143761 0%, #0c2a4f 100%) !important; border-color: #2bc4ff !important; box-shadow: 0 8px 16px rgba(4,18,37,0.46) !important; }
html.dark-mode .vehicle-card__title-line, html.dark-mode .vehicle-card__title-line small,
html.dark-mode .vehicle-card__meta, html.dark-mode .vehicle-card__distance, html.dark-mode .vehicle-card__price { color: #fff !important; }
html.dark-mode .selected-fare-card { background: rgba(255,255,255,0.08) !important; border-color: rgba(255,255,255,0.2) !important; }
html.dark-mode .selected-fare-card__fare-title, html.dark-mode .selected-fare-card__details h4,
html.dark-mode .selected-fare-card__meta, html.dark-mode .selected-fare-card__distance, html.dark-mode .selected-fare-card__amount { color: #fff !important; }
html.dark-mode .selected-fare-card__toggle { background: rgba(255,255,255,0.1) !important; border-color: rgba(255,255,255,0.2) !important; color: #fff !important; }
html.dark-mode .selected-fare-card__option { color: rgba(255,255,255,0.85) !important; }
html.dark-mode .quote-modal__actions .btn-outline { background: transparent !important; color: #fff !important; border: 2px solid rgba(255,255,255,0.6) !important; }
html.dark-mode .quote-modal__actions .btn-primary,
html.dark-mode .quote-modal .quote-btn--confirm { background: linear-gradient(120deg, #0f1c2e, #152a45) !important; color: #fff !important; border: 2px solid #2eb5ff !important; box-shadow: 0 4px 16px rgba(46,181,255,0.25) !important; }

/* ── Fare drawer panels (GST toggle, timeline, inclusions accordion) ── */
html.dark-mode .drawer-vehicle-tab { background: rgba(255,255,255,0.06) !important; border-color: rgba(255,255,255,0.16) !important; }
html.dark-mode .drawer-vehicle-tab.active { background: rgba(56,189,248,0.16) !important; border-color: #38bdf8 !important; box-shadow: 0 0 12px rgba(56,189,248,0.3) !important; }
html.dark-mode .drawer-vehicle-tab__name { color: #ffffff !important; }
html.dark-mode .drawer-vehicle-tab__price { color: rgba(255,255,255,0.7) !important; }
html.dark-mode .drawer-vehicle-tab.active .drawer-vehicle-tab__price { color: #38bdf8 !important; }
/* GST / Toll toggle bar */
html.dark-mode .drawer-toggles-container { background: rgba(15,23,42,0.45) !important; border: 1px solid rgba(255,255,255,0.12) !important; color: #ffffff !important; }
html.dark-mode .drawer-toggles-container .drawer-switch-label,
html.dark-mode .drawer-toggles-container .drawer-switch-control { color: #ffffff !important; }
/* iOS-style toggle track + active fill */
html.dark-mode .drawer-switch-knob { background: rgba(255,255,255,0.2) !important; }
html.dark-mode .drawer-switch-control input[type="checkbox"]:checked + .drawer-switch-knob { background: #38bdf8 !important; }
/* Pickup / Drop timeline card */
html.dark-mode .drawer-timeline { background: rgba(15,23,42,0.45) !important; border: 1px solid rgba(255,255,255,0.12) !important; }
html.dark-mode .drawer-timeline-label { color: rgba(255,255,255,0.55) !important; }
html.dark-mode .drawer-timeline-value { color: #ffffff !important; }
/* Inclusions / Exclusions accordion */
html.dark-mode .drawer-acc { background: rgba(15,23,42,0.45) !important; border: 1px solid rgba(255,255,255,0.12) !important; }
html.dark-mode .drawer-acc__label { color: #4ade80 !important; }
html.dark-mode .drawer-acc__chev { border-color: rgba(255,255,255,0.6) !important; }
html.dark-mode .drawer-acc .drawer-list,
html.dark-mode .drawer-acc li,
html.dark-mode .drawer-acc p { color: rgba(255,255,255,0.85) !important; }
/* Outline buttons inside the drawer */
html.dark-mode .drawer-body .btn-outline,
html.dark-mode .drawer-footer .btn-outline { background: rgba(255,255,255,0.06) !important; color: #ffffff !important; border: 1.5px solid rgba(255,255,255,0.45) !important; }
html.dark-mode .drawer-footer .btn-outline:hover { background: rgba(255,255,255,0.14) !important; border-color: #38bdf8 !important; }
/* Drawer footer bar */
html.dark-mode .drawer-footer { background: transparent !important; border-top: 1px solid rgba(255,255,255,0.08) !important; }
html.dark-mode .drawer-footer .drawer-fare-label, html.dark-mode .drawer-footer__label { color: rgba(255,255,255,0.55) !important; }
html.dark-mode .drawer-footer .drawer-fare-amount, html.dark-mode .drawer-footer__amount { color: #38bdf8 !important; }

/* ══════════════════════════════════════════
   Cities hub page (/drop-cars/cities)
══════════════════════════════════════════ */
html.dark-mode .cities-hub-section { background: #060d1e !important; border-top-color: rgba(255,255,255,0.08) !important; }
html.dark-mode .cities-hub-title h2 { color: #ffffff !important; }
html.dark-mode .cities-hub-title p { color: rgba(226,240,255,0.6) !important; }
/* City accordion cards */
html.dark-mode .city-accordion-card { background: #0e1626 !important; border-color: #1e293b !important; box-shadow: 0 4px 12px rgba(0,0,0,0.4) !important; }
html.dark-mode .city-accordion-card:hover { border-color: #38bdf8 !important; }
html.dark-mode .city-accordion-header { background: #0e1626 !important; }
html.dark-mode .city-accordion-header:hover { background: #121e36 !important; }
html.dark-mode .city-accordion-title h3 { color: #ffffff !important; }
html.dark-mode .city-route-badge { background: rgba(56,189,248,0.16) !important; color: #38bdf8 !important; }
html.dark-mode .city-accordion-icon { background: rgba(255,255,255,0.08) !important; color: #e2f0ff !important; }
html.dark-mode .city-accordion-card.active .city-accordion-icon { background: #38bdf8 !important; color: #070d18 !important; }
html.dark-mode .city-accordion-content { background: #0b1424 !important; }
html.dark-mode .city-accordion-card.active .city-accordion-content { border-top-color: rgba(255,255,255,0.08) !important; }
/* Route links inside accordions */
html.dark-mode .city-route-link { background: rgba(255,255,255,0.04) !important; border-color: rgba(255,255,255,0.08) !important; color: rgba(226,240,255,0.78) !important; }
html.dark-mode .city-route-link:hover { background: rgba(56,189,248,0.10) !important; border-color: rgba(56,189,248,0.3) !important; color: #38bdf8 !important; }
html.dark-mode .city-route-link svg { color: rgba(255,255,255,0.4) !important; }
html.dark-mode .city-route-link:hover svg { color: #38bdf8 !important; }
/* Trust benefits section (inline-styled cards) */
html.dark-mode .trust-benefits-section { background: #060d1e !important; }
html.dark-mode .trust-benefits-section h2,
html.dark-mode .trust-benefits-section h3 { color: #ffffff !important; }
html.dark-mode .trust-benefits-section p { color: rgba(226,240,255,0.65) !important; }
html.dark-mode .trust-benefits-section [style*="border-radius: 16px"] { background: #0e1626 !important; border-color: #1e293b !important; }

/* ── Light-mode accent: darker blue instead of skyblue for eyebrows ── */
html:not(.dark-mode) .eyebrow,
html:not(.dark-mode) .section-eyebrow,
html:not(.dark-mode) .section-title-center .eyebrow { color: #0369a1 !important; }
/* keep skyblue accent in dark mode */
html.dark-mode .eyebrow,
html.dark-mode .section-eyebrow { color: #38bdf8 !important; }

/* ── Footer – light default ── */
.site-footer { background: #f1f5f9 !important; color: #1e293b !important; border-top: 1px solid #e2e8f0 !important; }
.site-footer .footer__description { color: #475569 !important; }
.site-footer .footer__engage-title { color: #0f172a !important; }
.site-footer .footer__contact-details,
.site-footer .footer__contact-details li,
.site-footer .footer__coverage { color: #334155 !important; }
.site-footer .footer__contact-details a { color: #0369a1 !important; }
/* Copyright / attribution bar */
.site-footer .footer__copyright,
.site-footer .footer__copyright span,
.site-footer .footer__bottom-bar,
.site-footer .footer__attribution { color: #64748b !important; }
.site-footer .footer__attribution a { color: #0369a1 !important; }
.site-footer a { color: #0369a1 !important; }
.site-footer .newsletter-form { background: rgba(3,105,161,0.07) !important; border-color: rgba(3,105,161,0.18) !important; }
.site-footer .newsletter-form input { color: #0f172a !important; }
.site-footer .newsletter-form input::placeholder { color: #94a3b8 !important; }
.footer__divider { border-color: #e2e8f0 !important; }
.footer__brand-hit { background: #e2e8f0 !important; color: #475569 !important; }
.footer__theme-link { background: #e2e8f0 !important; border-color: #cbd5e1 !important; color: #475569 !important; }
.footer__theme-link:hover { background: #cbd5e1 !important; color: #0f172a !important; }
.site-footer .logo__text { background: #e2e8f0 !important; color: #0f172a !important; border-color: #cbd5e1 !important; }
.site-footer .logo__mark { background: #0369a1 !important; color: #fff !important; }

/* ── Footer – dark ── */
html.dark-mode .site-footer { background: #040810 !important; color: rgba(226,240,255,0.65) !important; border-top: 1px solid #0f172a !important; }
html.dark-mode .site-footer .footer__description { color: rgba(226,240,255,0.55) !important; }
html.dark-mode .site-footer .footer__engage-title { color: #ffffff !important; }
html.dark-mode .site-footer a { color: #7dd3fc !important; }
html.dark-mode .site-footer .newsletter-form { background: rgba(255,255,255,0.05) !important; border-color: rgba(255,255,255,0.12) !important; }
html.dark-mode .site-footer .newsletter-form input { color: #e2f0ff !important; }
html.dark-mode .site-footer .newsletter-form input::placeholder { color: rgba(255,255,255,0.35) !important; }
html.dark-mode .footer__divider { border-color: #0f172a !important; }
html.dark-mode .footer__brand-hit { background: #0f172a !important; color: #94a3b8 !important; }
html.dark-mode .footer__theme-link { background: #0e1626 !important; border-color: #1e293b !important; color: #94a3b8 !important; }
html.dark-mode .footer__theme-link:hover { color: #ffffff !important; background: #1e293b !important; }
html.dark-mode .site-footer .logo__text { background: rgba(255,255,255,0.08) !important; color: #fff !important; border-color: rgba(255,255,255,0.12) !important; }
html.dark-mode .site-footer .logo__mark { background: #f5b800 !important; color: #0a0f1d !important; }

/* ── Section dividers ── */
html.dark-mode hr, html.dark-mode .divider, html.dark-mode [class*="divider"] { border-color: rgba(255,255,255,0.08) !important; background: rgba(255,255,255,0.08) !important; }

/* ── Inline Style Overrides & Contrast Fixes ── */
html.dark-mode .city-about-section,
html.dark-mode section.trust,
html.dark-mode section.routes-section,
html.dark-mode section.testimonials-section,
html.dark-mode section.faq {
    background: #060d1e !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
}

html.dark-mode .trust .container > div[style*="background: var(--white)"],
html.dark-mode .trust .container > div[style*="background:var(--white)"] {
    background: #0e1626 !important;
    border-color: #1e293b !important;
}

html.dark-mode h1,
html.dark-mode h2,
html.dark-mode h3,
html.dark-mode h4,
html.dark-mode [style*="color: var(--blue-dark)"],
html.dark-mode [style*="color:var(--blue-dark)"],
html.dark-mode [style*="color: var(--blue)"],
html.dark-mode [style*="color:var(--blue)"] {
    color: #ffffff !important;
}

html.dark-mode p,
html.dark-mode li,
html.dark-mode [style*="color: var(--gray-600)"],
html.dark-mode [style*="color:var(--gray-600)"],
html.dark-mode [style*="color: var(--text)"],
html.dark-mode [style*="color:var(--text)"] {
    color: rgba(226, 240, 255, 0.75) !important;
}

html.dark-mode .wa-check-label,
html.dark-mode .wa-label-icon svg,
html.dark-mode [style*="color: var(--wa-green)"] {
    color: #25D366 !important;
}

html.dark-mode .eyebrow,
html.dark-mode .section-eyebrow,
html.dark-mode [style*="color: var(--accent)"] {
    color: #38bdf8 !important;
}

/* ── Legal & Policy Pages ── */
html.dark-mode .legal-page { background: #060d1e !important; }
html.dark-mode .legal-hero h1 { color: #ffffff !important; }
html.dark-mode .legal-hero p { color: #94a3b8 !important; }
html.dark-mode .legal-card { background: #0e1626 !important; border-color: #1e293b !important; }
html.dark-mode .legal-section h2 { color: #ffffff !important; }
html.dark-mode .legal-section p, html.dark-mode .legal-section li { color: #cbd5e1 !important; }
html.dark-mode .policy-badge { background: rgba(56,189,248,0.12) !important; color: #38bdf8 !important; }