/* ===== Premium Dark Mode System ===== */

html.dark-mode,
body.dark-mode {
  --blue: #f1f5f9; /* originally dark blue text, now light gray text */
  --blue-dark: #f8fafc; /* originally very dark blue headings, now white headings */
  --blue-light: #38bdf8; /* originally lighter dark blue, now accent color */
  --blue-subtle: #0f172a; /* originally very light gray-blue background, now dark slate */
  
  --white: #0a0f1d; /* originally white background, now deep black-blue background */
  --gray-50: #0e1626; /* originally off-white section background, now deep slate section background */
  --gray-100: #070d18; /* originally light gray body background, now very dark blue body background */
  --gray-200: #1e293b; /* originally light border, now slate border */
  --gray-300: #334155; /* originally medium-light border/text, now darker slate */
  --gray-400: #94a3b8; /* originally muted text, stays light slate gray */
  --gray-600: #cbd5e1; /* originally dark gray text, now light gray text */
  
  /* Accent adjustments */
  --accent: #38bdf8;
  --accent-glow: rgba(56, 189, 248, 0.15);
  
  /* Glassmorphism overrides */
  --glass-bg: rgba(15, 22, 38, 0.8);
  --glass-border: rgba(255, 255, 255, 0.08);
  --glass-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.4);
  
  background-color: #070d18;
  color: #cbd5e1;
}

/* Specific component overrides for perfect visual excellence in dark mode */

/* Header / Navbar */
html.dark-mode .site-header {
  background: rgba(7, 13, 24, 0.85);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

html.dark-mode .nav-dropdown__content {
  background: #0f172a;
  border: 1px solid #1e293b;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4);
}

html.dark-mode .nav-dropdown__content a {
  color: #cbd5e1;
}

html.dark-mode .nav-dropdown__content a:hover {
  background: #1e293b;
  color: #ffffff;
}

/* Booking Card inside Hero */
html.dark-mode .booking-card--home {
  background: #0e1626 !important;
  border-color: #1e293b !important;
  box-shadow: 0 20px 40px rgba(0,0,0,0.5) !important;
}

html.dark-mode .booking-form input,
html.dark-mode .booking-form select {
  background: #070d18 !important;
  color: #ffffff !important;
  border-color: #1e293b !important;
}

html.dark-mode .booking-form label span {
  color: #94a3b8 !important;
}

html.dark-mode .trip-type-option {
  color: #94a3b8;
}

html.dark-mode .trip-type-option--active {
  color: #ffffff !important;
  background: var(--blue-light) !important;
}

html.dark-mode .phone-input-wrapper {
  border-color: #1e293b !important;
}

html.dark-mode .country-code-trigger {
  color: #ffffff !important;
  background: #0f172a !important;
}

html.dark-mode .country-code-popover {
  background: #0e1626 !important;
  border-color: #1e293b !important;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.3) !important;
}

html.dark-mode .country-code-option {
  color: #cbd5e1 !important;
}

html.dark-mode .country-code-option:hover {
  background: #1e293b !important;
}

html.dark-mode .promo-row input {
  color: #ffffff !important;
}

html.dark-mode .fare-card {
  background: rgba(15, 22, 38, 0.8) !important;
  border-color: #1e293b !important;
}

/* FAQ accordion / items */
html.dark-mode .faq__items article,
html.dark-mode .faq-item {
  background: #0e1626 !important;
  border-color: #1e293b !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
}

/* Trust cards */
html.dark-mode .trust-card {
  background: #0e1626 !important;
  border-color: #1e293b !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
}

html.dark-mode .trust-card div {
  background: #070d18 !important;
}

/* Route cards */
html.dark-mode .route-card {
  background: #0e1626 !important;
  border: 1px solid #1e293b !important;
  color: #ffffff !important;
}

html.dark-mode .route-card:hover {
  border-color: var(--accent) !important;
  background: #121e36 !important;
  box-shadow: 0 8px 20px rgba(56, 189, 248, 0.15) !important;
}

html.dark-mode .route-card__text small {
  color: #94a3b8 !important;
}

/* City about section */
html.dark-mode .city-about-section {
  background: #0e1626 !important;
  border-color: #1e293b !important;
}

/* Vehicle Grid on homepage/city pages */
html.dark-mode .vehicle-card {
  background: #0e1626 !important;
  border-color: #1e293b !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !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;
}

/* Footer overrides */
html.dark-mode .site-footer {
  background: #040810;
  border-top: 1px solid #0f172a;
}

html.dark-mode .footer__divider {
  border-color: #0f172a;
}

html.dark-mode .footer__brand-hit {
  background: #0f172a;
  color: #94a3b8;
}

html.dark-mode .footer__theme-link {
  background: #0e1626;
  border-color: #1e293b;
  color: #94a3b8;
}

html.dark-mode .footer__theme-link:hover {
  color: #ffffff;
  background: #1e293b;
}

/* Quote Modal */
html.dark-mode .quote-modal__card {
  background: #0a0f1d !important;
  border-color: #1e293b !important;
}

/* Theme Switcher */
html.dark-mode .theme-switcher {
  background: #0e1626;
  border-color: #1e293b;
}

html.dark-mode .theme-switcher__btn {
  color: #94a3b8;
}

html.dark-mode .theme-switcher__btn:hover {
  background: #1e293b;
  color: #ffffff;
}