/**
 * Light Theme – Premium Elevation
 * Tata Call Taxi – Premium intercity taxi
 *
 * Applied when html does NOT have .dark-mode
 * Replaces plain white/grey with polished
 * glass-card aesthetics & soft sky-blue tones.
 */

/* ── Navbar — frosted glass in light mode ── */
html:not(.dark-mode) .site-header {
  background: rgba(255, 255, 255, 0.85) !important;
  backdrop-filter: blur(14px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(160%) !important;
  border-bottom: 1px solid rgba(186, 230, 253, 0.45) !important;
  box-shadow: 0 2px 16px rgba(15, 28, 60, 0.07) !important;
  border-top: none !important;
}

/* ── Cards — premium light glass ── */
html:not(.dark-mode) .seo-card,
html:not(.dark-mode) .service-card,
html:not(.dark-mode) .city-card,
html:not(.dark-mode) .trust-card,
html:not(.dark-mode) .route-card,
html:not(.dark-mode) .testimonial-card,
html:not(.dark-mode) .vehicle-card,
html:not(.dark-mode) .feature-card,
html:not(.dark-mode) .fare-card,
html:not(.dark-mode) .city-accordion-card {
  background: rgba(255, 255, 255, 0.82) !important;
  backdrop-filter: blur(10px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(10px) saturate(140%) !important;
  border: 1px solid rgba(186, 230, 253, 0.55) !important;
  box-shadow: 0 4px 20px rgba(15, 28, 60, 0.08), 0 1px 4px rgba(15, 28, 60, 0.05) !important;
  transition: box-shadow 0.25s ease, transform 0.25s ease, border-color 0.25s ease !important;
}

html:not(.dark-mode) .seo-card:hover,
html:not(.dark-mode) .service-card:hover,
html:not(.dark-mode) .city-card:hover,
html:not(.dark-mode) .route-card:hover,
html:not(.dark-mode) .testimonial-card:hover,
html:not(.dark-mode) .vehicle-card:hover,
html:not(.dark-mode) .feature-card:hover {
  box-shadow: 0 12px 36px rgba(15, 28, 60, 0.15), 0 2px 8px rgba(15, 28, 60, 0.08) !important;
  border-color: rgba(56, 189, 248, 0.4) !important;
  transform: translateY(-2px);
}

/* ── Booking form fields — subtle blue tint ── */
html:not(.dark-mode) .field input,
html:not(.dark-mode) .field select {
  background: rgba(248, 252, 255, 0.92) !important;
  border: 1px solid rgba(148, 196, 220, 0.65) !important;
}

html:not(.dark-mode) .field input:focus,
html:not(.dark-mode) .field select:focus {
  background: #ffffff !important;
  border-color: #38bdf8 !important;
  box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.18) !important;
}

/* ── Trip type tabs — light blue active state ── */
html:not(.dark-mode) .fare-toggle__switch input:checked + label,
html:not(.dark-mode) .fare-toggle__switch .trip-type-option--active {
  background: linear-gradient(135deg, #0369a1 0%, #0284c7 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 2px 8px rgba(3, 105, 161, 0.35) !important;
}

/* ── FAQ items — elevated glass ── */
html:not(.dark-mode) .faq-item,
html:not(.dark-mode) .faq__items article,
html:not(.dark-mode) .faq__item {
  background: rgba(255, 255, 255, 0.82) !important;
  border: 1px solid rgba(186, 230, 253, 0.5) !important;
  box-shadow: 0 2px 10px rgba(15, 28, 60, 0.06) !important;
}

/* ── Stats strip ── */
html:not(.dark-mode) .d1t-stat-block {
  background: rgba(255, 255, 255, 0.55) !important;
  backdrop-filter: blur(14px) saturate(150%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(150%) !important;
  border: 1.5px solid rgba(15, 28, 46, 0.15) !important;
  border-radius: 8px !important;
  box-shadow: 
    0 10px 30px rgba(15, 28, 60, 0.04),
    inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

html:not(.dark-mode) .d1t-stat-block:hover {
  transform: translateY(-4px) !important;
  background: rgba(255, 255, 255, 0.8) !important;
  border-color: #0284c7 !important;
  box-shadow: 
    0 18px 40px rgba(2, 132, 199, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}

html:not(.dark-mode) .d1t-stat-block__num { 
  color: #0369a1 !important; 
  text-shadow: none !important;
}

html:not(.dark-mode) .d1t-stat-block__label { 
  color: #475569 !important; 
  font-size: 0.62rem !important;
  letter-spacing: 0.01em !important;
}

/* ── Vehicle selector cards ── */
html:not(.dark-mode) .vehicle-selector-card {
  background: rgba(255, 255, 255, 0.6) !important;
  border: 1.5px solid rgba(15, 28, 46, 0.12) !important;
  box-shadow: 0 2px 8px rgba(15, 28, 60, 0.02) !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* ── Hero booking card — premium white glass (light) ── */
html:not(.dark-mode) .booking-card--home {
  background: rgba(255, 255, 255, 0.88) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  border: 1px solid rgba(255, 255, 255, 0.6) !important;
  box-shadow:
    0 25px 50px -12px rgba(15, 23, 42, 0.12),
    0 4px 12px rgba(15, 23, 42, 0.03),
    0 0 0 1px rgba(15, 23, 42, 0.02),
    inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
  border-radius: 24px !important;
}

/* ── Trip type & Oneway Subtypes tab row design (light mode) ── */
html:not(.dark-mode) .trip-type-options,
html:not(.dark-mode) .oneway-subtypes,
html:not(.dark-mode) .fare-toggle__switch {
  background: #f1f5f9 !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 99px !important;
  padding: 4px !important;
  box-shadow: inset 0 2px 4px rgba(15, 23, 42, 0.03) !important;
  gap: 4px !important;
  margin-bottom: 0.5rem !important;
}

html:not(.dark-mode) .trip-type-options .trip-type-option,
html:not(.dark-mode) .oneway-subtypes label,
html:not(.dark-mode) .fare-toggle__switch label {
  border-radius: 99px !important;
  border: none !important;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
  color: #475569 !important;
  font-weight: 600 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 8px 14px !important;
  font-size: 0.85rem !important;
  cursor: pointer !important;
}

html:not(.dark-mode) .oneway-subtypes label {
  font-size: 0.78rem !important;
  padding: 6px 12px !important;
}

html:not(.dark-mode) .trip-type-options .trip-type-option:hover,
html:not(.dark-mode) .oneway-subtypes label:hover,
html:not(.dark-mode) .fare-toggle__switch label:hover {
  color: #0ea5e9 !important;
  background: rgba(15, 23, 42, 0.04) !important;
}

html:not(.dark-mode) .trip-type-options .trip-type-option.trip-type-option--active,
html:not(.dark-mode) .trip-type-options .trip-type-option.active,
html:not(.dark-mode) .oneway-subtypes input:checked+label,
html:not(.dark-mode) .oneway-subtypes label.active {
  background: linear-gradient(135deg, #0ea5e9 0%, #0284c7 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(14, 165, 233, 0.25) !important;
  font-weight: 700 !important;
}

/* ── Label typography enhancement in light mode for the booking form ── */
html:not(.dark-mode) .booking-form label.field > span:not(.field-hint),
html:not(.dark-mode) .booking-form .field > span:not(.field-hint),
html:not(.dark-mode) .booking-form .field__label-row > span:not(.field-hint) {
  color: #1e293b !important;
  font-weight: 700 !important;
  font-size: 0.75rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  display: block !important;
  margin-bottom: 0.35rem !important;
}

/* ── Inputs & Fields styling in light mode ── */
html:not(.dark-mode) .field input,
html:not(.dark-mode) .field select,
html:not(.dark-mode) .promo-row input {
  background: #ffffff !important;
  border: 1.5px solid #e2e8f0 !important;
  border-radius: 10px !important;
  font-size: 0.95rem !important;
  color: #0f172a !important;
  padding: 0.7rem 0.9rem !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.01) !important;
  transition: all 0.2s ease-in-out !important;
}

html:not(.dark-mode) .field input:focus,
html:not(.dark-mode) .field select:focus,
html:not(.dark-mode) .promo-row input:focus {
  border-color: #0ea5e9 !important;
  box-shadow: 0 0 0 3px rgba(14, 165, 233, 0.12) !important;
  background: #ffffff !important;
  outline: none !important;
}

/* ── Promo apply button ── */
html:not(.dark-mode) .btn-promo-apply {
  background: rgba(248, 252, 255, 0.95) !important;
  border: 1px solid rgba(148, 196, 220, 0.65) !important;
  color: #0369a1 !important;
  border-radius: 8px !important;
}
html:not(.dark-mode) .btn-promo-apply:hover {
  background: rgba(224, 242, 254, 0.95) !important;
  border-color: #38bdf8 !important;
}

/* ── Section backgrounds in light mode ── */
html:not(.dark-mode) section:not(.hero):not(.city-hero):not(.route-hero):not(.dev-hero) {
  background: transparent;
}
/* Keep dev-hero dark charcoal even in light mode */
html:not(.dark-mode) .dev-hero {
  background: linear-gradient(135deg, #111111 0%, #1e1e1e 55%, #1a1a1a 100%) !important;
}

/* ── Upgraded Hero Overlay & Text for Light Mode ──
   tct-redesign.css handles the main hero background.
   This overlay is intentionally cleared to avoid blue tint bleed. */
html:not(.dark-mode) .hero::after,
html:not(.dark-mode) .city-hero::before,
html:not(.dark-mode) .route-hero::before,
html:not(.dark-mode) .cities-hero::before {
  background: none !important;
}

/* Eyebrow glow pulsing animation */
html:not(.dark-mode) .hero__copy .hero__eyebrow {
  background: rgba(0, 0, 0, 0.55) !important;
  border: 1px solid rgba(249, 115, 22, 0.65) !important;
  color: #ffedd5 !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.35) !important;
  animation: none !important;
}

/* Heading clean modern contrast - White for dark hero backdrop */
html:not(.dark-mode) .hero__copy h1,
html:not(.dark-mode) .city-hero h1,
html:not(.dark-mode) .route-hero h1,
html:not(.dark-mode) .cities-hero h1 {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.9), 0 1px 4px rgba(0, 0, 0, 0.8) !important;
}

html:not(.dark-mode) .hero__copy .hero__sub,
html:not(.dark-mode) .city-hero p,
html:not(.dark-mode) .route-hero p,
html:not(.dark-mode) .cities-hero p {
  color: rgba(255, 255, 255, 0.95) !important;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.85) !important;
}

/* Focus glow for text input fields */
html:not(.dark-mode) .field input:focus,
html:not(.dark-mode) .field select:focus,
html:not(.dark-mode) .field textarea:focus,
html:not(.dark-mode) .promo-row input:focus {
  background: #ffffff !important;
  border-color: #f97316 !important;
  box-shadow: 0 0 0 4px rgba(249, 115, 22, 0.15) !important;
  transform: translateY(-1px);
}

/* ── Light Mode Partner Pages Overrides ── */
html:not(.dark-mode) .partner-form-card {
  background: rgba(255, 255, 255, 0.82) !important;
  backdrop-filter: blur(10px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(10px) saturate(140%) !important;
  border: 1px solid rgba(186, 230, 253, 0.55) !important;
  box-shadow: 0 4px 20px rgba(15, 28, 60, 0.08), 0 1px 4px rgba(15, 28, 60, 0.05) !important;
}

html:not(.dark-mode) .form-field label {
  color: #0f1c2e !important;
}

html:not(.dark-mode) .form-field input,
html:not(.dark-mode) .form-field select,
html:not(.dark-mode) .form-field textarea {
  background: rgba(255, 255, 255, 0.88) !important;
  border: 1.5px solid rgba(15, 28, 46, 0.16) !important;
  color: #0f172a !important;
}

html:not(.dark-mode) .form-field input:focus,
html:not(.dark-mode) .form-field select:focus,
html:not(.dark-mode) .form-field textarea:focus {
  background: #ffffff !important;
  border-color: #f97316 !important;
  box-shadow: 0 0 0 4px rgba(249, 115, 22, 0.15) !important;
}

html:not(.dark-mode) .btn-submit {
  background: linear-gradient(135deg, #f97316 0%, #ea580c 100%) !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 4px 12px rgba(249, 115, 22, 0.28) !important;
}

html:not(.dark-mode) .btn-submit:hover {
  background: linear-gradient(135deg, #fb923c 0%, #f97316 100%) !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(249, 115, 22, 0.38) !important;
}

html:not(.dark-mode) .btn-submit:active {
  transform: translateY(0);
}

html:not(.dark-mode) .benefit-icon {
  background: rgba(249, 115, 22, 0.08) !important;
  color: #ea580c !important;
}

html:not(.dark-mode) .benefit-content h4 {
  color: #0f1c2e !important;
}

html:not(.dark-mode) .benefit-content p {
  color: #475569 !important;
}

html:not(.dark-mode) .partner-hero p {
  color: #475569 !important;
}

/* ── Stats Strip Upgrades (light mode) ── */
html:not(.dark-mode) .d1t-stat-block {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: 0 10px 25px -5px rgba(15, 23, 42, 0.05) !important;
  border-radius: 8px !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
html:not(.dark-mode) .d1t-stat-block:hover {
  border-color: #f97316 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 15px 30px -5px rgba(249, 115, 22, 0.12) !important;
}

/* ── Cities page accordion transparency overrides in light mode ── */
html:not(.dark-mode) .city-accordion-header,
html:not(.dark-mode) .city-accordion-content {
  background: transparent !important;
}
html:not(.dark-mode) .city-accordion-header:hover {
  background: rgba(15, 28, 60, 0.03) !important;
}