/* CarHireBaku light theme. Loaded after style.css and responsive.css. */

html[data-theme="light"] {
    --primary: #FDCB01;
    --primary-dark: #D49D00;
    --ui-accent: #C89100;
    --gold-text: #986E00;

    --bg-dark: #F3F5F8;
    --bg-surface: #FFFFFF;
    --bg-card: #FFFFFF;
    --bg-card-hover: #F8FAFC;
    --border-subtle: rgba(20, 25, 38, 0.10);
    --border-primary: rgba(216, 162, 0, 0.44);
    --text-white: #151923;
    --text-secondary: #565D6D;
    --text-muted: #8B93A3;

    --bg-color-2: #EEF1F5;
    --bg-color-3: #FFF8D8;
    --bg-color-7: #FFFFFF;
    --bg-color-11: rgba(20, 25, 38, 0.05);
    --text-color-1: #151923;
    --text-color-2: #986E00;
    --text-color-3: #565D6D;

    color-scheme: light;
}

html[data-theme="light"],
html[data-theme="light"] body,
html[data-theme="light"] body.bg-\[\#08090F\] {
    background:
        radial-gradient(circle at 18% 0%, rgba(253, 203, 1, 0.12), transparent 30%),
        linear-gradient(180deg, #FAFBFD 0%, #F2F5F8 46%, #ECEFF4 100%) !important;
    color: #151923 !important;
}

html[data-theme="light"] .text-white,
html[data-theme="light"] .name-auto,
html[data-theme="light"] .rent-text span,
html[data-theme="light"] .blog-text span,
html[data-theme="light"] .about-we .title,
html[data-theme="light"] .name-clicked-car,
html[data-theme="light"] .cnt-form-heading,
html[data-theme="light"] .pi-form-heading,
html[data-theme="light"] .packet-card-title,
html[data-theme="light"] .count-title p:first-child,
html[data-theme="light"] .review-name {
    color: #151923 !important;
}

html[data-theme="light"] .text-muted,
html[data-theme="light"] .auto-description > p,
html[data-theme="light"] .res-views,
html[data-theme="light"] .footer-desc,
html[data-theme="light"] .review-text,
html[data-theme="light"] .count-title p:last-child,
html[data-theme="light"] .accordion-content p {
    color: #5D6574 !important;
}

html[data-theme="light"] header .header-img,
html[data-theme="light"] .header-img,
html[data-theme="light"] .other-header {
    background-color: #08090F !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-attachment: fixed !important;
}

html[data-theme="light"] .other-header {
    background-attachment: scroll !important;
}

html[data-theme="light"] .header-overlay {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.54) 0%, rgba(246, 248, 251, 0.36) 42%, rgba(243, 245, 248, 0.68) 100%),
        radial-gradient(circle at 50% 0%, rgba(253, 203, 1, 0.18), transparent 55%) !important;
}

html[data-theme="light"] .header-row,
html[data-theme="light"] .navbars .header-row {
    background: rgba(255, 255, 255, 0.88) !important;
    border: 1px solid rgba(20, 25, 38, 0.09) !important;
    box-shadow: 0 18px 45px rgba(20, 25, 38, 0.11) !important;
    backdrop-filter: blur(18px) saturate(135%) !important;
}


html[data-theme="light"] .car-logo,
html[data-theme="light"] .footer-logo.car-logo,
html[data-theme="light"] .scroll-menu-row .logo a,
html[data-theme="light"] .scroll-menu-row .logo .sm-text {
    color: #151923 !important;
}


html[data-theme="light"] .logo-rest {
    color: #13141f !important;
}



html[data-theme="light"] .footer-logo.car-logo .logo-rest {
    color: #13141f !important;
}

html[data-theme="light"] .car-logo::before {
    background: #FDCB01 !important;
    color: #151923 !important;
    box-shadow: 0 8px 20px rgba(216, 162, 0, 0.23) !important;
}

html[data-theme="light"] .contact a,
html[data-theme="light"] .phone-num a,
html[data-theme="light"] .mail a,
html[data-theme="light"] .num,
html[data-theme="light"] .navbar ul li a,
html[data-theme="light"] .nav-items a,
html[data-theme="light"] .mobile-ul > li > a,
html[data-theme="light"] .footer-nav-item,
html[data-theme="light"] .foot-ul a,
html[data-theme="light"] .footer-contact-link {
    color: #242A36 !important;
}

html[data-theme="light"] .contact a,
html[data-theme="light"] .navbar ul li a {
    background: rgba(244, 247, 250, 0.82) !important;
    border-color: rgba(20, 25, 38, 0.08) !important;
}

html[data-theme="light"] .contact a:hover,
html[data-theme="light"] .navbar ul li a:hover,
html[data-theme="light"] .navbar ul li a.nav-active,
html[data-theme="light"] .nav-items a:hover,
html[data-theme="light"] .footer-nav-item:hover,
html[data-theme="light"] .foot-ul a:hover,
html[data-theme="light"] .footer-contact-link:hover {
    background: rgba(253, 203, 1, 0.16) !important;
    color: #8A6200 !important;
}

html[data-theme="light"] .navbar,
html[data-theme="light"] .mobile-menu-header,
html[data-theme="light"] .mobile-footer,
html[data-theme="light"] .footer-logo-col,
html[data-theme="light"] .company {
    border-color: rgba(20, 25, 38, 0.09) !important;
}


html[data-theme="light"] .lang span,
html[data-theme="light"] .contact .lang span,
html[data-theme="light"] .mobile-lang span {
    color: #5D6574 !important;
}
/* Active language must stay clearly highlighted in light mode too */
html[data-theme="light"] .lang span.lan-active,
html[data-theme="light"] .contact .lang span.lan-active,
html[data-theme="light"] .mobile-lang span.lan-active {
    color: #1A1205 !important;
    background: var(--primary, #FDCB01) !important;
    border-color: var(--primary, #FDCB01) !important;
    font-weight: 700 !important;
    box-shadow: 0 2px 10px rgba(216, 162, 0, 0.30) !important;
}

html[data-theme="light"] .navbar .search-section form,
html[data-theme="light"] .navbar ul li input,
html[data-theme="light"] .search-section input,
html[data-theme="light"] .mob-search-form input {
    background: #F4F7FA !important;
    border-color: rgba(20, 25, 38, 0.12) !important;
    color: #151923 !important;
}

html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder {
    color: rgba(56, 64, 78, 0.48) !important;
}

html[data-theme="light"] .burger-lines span {
    background: #151923 !important;
}

html[data-theme="light"] .site-description p,
html[data-theme="light"] .mobile-site-descripton p {
    color: #FFFFFF !important;
    text-shadow: 0 3px 22px rgba(0, 0, 0, 0.74), 0 1px 0 rgba(0, 0, 0, 0.45) !important;
}

html[data-theme="light"] .site-description p span,
html[data-theme="light"] .site-description p span:first-child {
    color: #FFFFFF !important;
}

html[data-theme="light"] .bottom-line,
html[data-theme="light"] .line-clicked {
    background: linear-gradient(90deg, transparent, rgba(184, 133, 0, 0.78), transparent) !important;
}

html[data-theme="light"] .model1,
html[data-theme="light"] .model-1,
html[data-theme="light"] .img-rent,
html[data-theme="light"] .circle-models .model-1,
html[data-theme="light"] .count-img,
html[data-theme="light"] .cnt-info-icon,
html[data-theme="light"] .footer-socials a {
    background: #FFFFFF !important;
    border: 1px solid rgba(20, 25, 38, 0.11) !important;
    box-shadow: 0 8px 24px rgba(20, 25, 38, 0.08) !important;
    color: #38404E !important;
}

html[data-theme="light"] .model-sec:hover .model1,
html[data-theme="light"] .model-1:hover,
html[data-theme="light"] .img-rent:hover,
html[data-theme="light"] .type.active .img-rent,
html[data-theme="light"] .type:hover .img-rent {
    background: #FFF7D8 !important;
    border-color: rgba(216, 162, 0, 0.62) !important;
    box-shadow: 0 14px 30px rgba(216, 162, 0, 0.18) !important;
}



html[data-theme="light"] .model-sec span,
html[data-theme="light"] .filter-row-1 label,
html[data-theme="light"] .type-model-car label,
html[data-theme="light"] .types-rent .type span {
    color: #38404E !important;
}

/* The hero/header is light now, so the class labels (Premium, Ekonom,
   Sport, SUV…) must be dark to be readable. */
html[data-theme="light"] header .model-sec span,
html[data-theme="light"] header .model-sec label {
    color: #2A3140 !important;
    text-shadow: none !important;
}

/* Theme-toggle icon — darker gold so the moon is visible on light bg */
html[data-theme="light"] .theme-toggle {
    color: #D49D00 !important;
}

/* Filter dropdown chevron — darker gold, clearly visible on the light card */
html[data-theme="light"] .filter-s2-wrap .select2-selection__arrow b {
    border-right-color: #C8920A !important;
    border-bottom-color: #C8920A !important;
}

html[data-theme="light"] .filters .filter-row,
html[data-theme="light"] .filter-row-2,
html[data-theme="light"] .wrap-row,
html[data-theme="light"] .content-1,
html[data-theme="light"] .cart-auto,
html[data-theme="light"] .property-col,
html[data-theme="light"] .network-col1,
html[data-theme="light"] .res-meta,
html[data-theme="light"] .checkout_fixed,
html[data-theme="light"] .sidebar-empty-state,
html[data-theme="light"] .extra-cart,
html[data-theme="light"] .packet-card,
html[data-theme="light"] .cnt-info-card,
html[data-theme="light"] .cnt-form-card,
html[data-theme="light"] .pi-form-card,
html[data-theme="light"] .pi-summary,
html[data-theme="light"] .basket-card,
html[data-theme="light"] .faq-item,
html[data-theme="light"] .stoplights,
html[data-theme="light"] .review-card,
html[data-theme="light"] .count,
html[data-theme="light"] .accordion,
html[data-theme="light"] .accordion-content,
html[data-theme="light"] .service,
html[data-theme="light"] .frame {
    background: rgba(255, 255, 255, 0.94) !important;
    border: 1px solid rgba(20, 25, 38, 0.10) !important;
    box-shadow: 0 14px 36px rgba(20, 25, 38, 0.08) !important;
}

html[data-theme="light"] .filters .filter-row {
    border-color: rgba(216, 162, 0, 0.45) !important;
    box-shadow: 0 20px 50px rgba(20, 25, 38, 0.14), 0 0 0 1px rgba(253, 203, 1, 0.18) inset !important;
}

html[data-theme="light"] .all-model,
html[data-theme="light"] .min-price,
html[data-theme="light"] .max-price,
html[data-theme="light"] .filters .filter-row .min-price input,
html[data-theme="light"] .filters .filter-row .max-price input,
html[data-theme="light"] .filter-row-2 input,
html[data-theme="light"] .min-price input,
html[data-theme="light"] .max-price input,
html[data-theme="light"] .giving-item input,
html[data-theme="light"] .giving-title,
html[data-theme="light"] .cnt-input,
html[data-theme="light"] .pi-input {
    color: #151923 !important;
}

html[data-theme="light"] .filters .filter-row .price-row-mob {
    background: #FFFFFF !important;
}

html[data-theme="light"] .filters .filter-row .min-price,
html[data-theme="light"] .filters .filter-row .max-price {
    background: #FFFFFF !important;
}

html[data-theme="light"] .filters .filter-row .min-price input,
html[data-theme="light"] .filters .filter-row .max-price input {
    background: transparent !important;
    border: 0 !important;
    color: #151923 !important;
    opacity: 1 !important;
}

html[data-theme="light"] .filters .filter-row .min-price input::placeholder,
html[data-theme="light"] .filters .filter-row .max-price input::placeholder {
    color: rgba(56, 64, 78, 0.54) !important;
    opacity: 1 !important;
}

html[data-theme="light"] .all-model,
html[data-theme="light"] .filters .filter-row .min-price,
html[data-theme="light"] .filters .filter-row .max-price {
    border-right-color: rgba(20, 25, 38, 0.10) !important;
}

html[data-theme="light"] .all-model:hover,
html[data-theme="light"] .button:hover,
html[data-theme="light"] .accordion:hover,
html[data-theme="light"] .frame:hover {
    background: #FFF8DE !important;
    border-color: rgba(216, 162, 0, 0.42) !important;
}

/* ══════════════════════════════════════════════════════════════════
   Filter panel in LIGHT mode — same structure as the dark bar, only
   light colours. Desktop: one light bar with transparent fields divided
   by thin lines. Mobile: filled field cards (handled in the media query
   at the bottom of this block).
   ══════════════════════════════════════════════════════════════════ */

/* The bar itself → light surface + gold border (mirrors the dark bar) */
html[data-theme="light"] .filters .filter-row {
    background: #FFFFFF !important;
    border: 1.5px solid rgba(216, 162, 0, 0.42) !important;
    box-shadow: 0 20px 50px rgba(20, 25, 38, 0.16) !important;
}

/* Fields → soft champagne fill (white + gold combo) so each field is
   clearly distinct on the white bar, like the dark fields on the dark bar */
html[data-theme="light"] .filters .filter-row .car-model,
html[data-theme="light"] .filters .filter-row .car-mark,
html[data-theme="light"] .filters .filter-row .all-model,
html[data-theme="light"] .filters .filter-row .min-price,
html[data-theme="light"] .filters .filter-row .max-price {
    background: #F7F2E6 !important;
    border: none !important;
    border-right: 1px solid rgba(216, 162, 0, 0.18) !important;
}
html[data-theme="light"] .filters .filter-row .price-row-mob {
    background: transparent !important;
}

/* Hover tint */
html[data-theme="light"] .filters .filter-row .all-model:hover,
html[data-theme="light"] .filters .filter-row .car-model:hover,
html[data-theme="light"] .filters .filter-row .car-mark:hover,
html[data-theme="light"] .filters .filter-row .min-price:hover,
html[data-theme="light"] .filters .filter-row .max-price:hover {
    background: rgba(253, 203, 1, 0.08) !important;
}

/* Chevron, field text and placeholders → dark / readable */
html[data-theme="light"] .filters .filter-row .car-model::after,
html[data-theme="light"] .filters .filter-row .car-mark::after {
    border-right-color: #C8920A !important;
    border-bottom-color: #C8920A !important;
}
html[data-theme="light"] .filters .filter-row .select2-selection__rendered,
html[data-theme="light"] .filters .filter-row .hero-s2 {
    color: #2A3140 !important;
}
html[data-theme="light"] .filters .filter-row .min-price input,
html[data-theme="light"] .filters .filter-row .max-price input {
    background: transparent !important;
    color: #151923 !important;
}
html[data-theme="light"] .filters .filter-row .min-price input::placeholder,
html[data-theme="light"] .filters .filter-row .max-price input::placeholder {
    color: rgba(42, 49, 64, 0.55) !important;
}

/* Mobile (≤768px) → fields become separate filled cards, like dark mobile */
@media (max-width: 768px) {
    html[data-theme="light"] .filters .filter-row .car-model,
    html[data-theme="light"] .filters .filter-row .car-mark,
    html[data-theme="light"] .filters .filter-row .min-price,
    html[data-theme="light"] .filters .filter-row .max-price {
        background: #EEF2F8 !important;
        border: 1.5px solid rgba(20, 25, 38, 0.12) !important;
    }
    html[data-theme="light"] .filters .filter-row .car-model:focus-within,
    html[data-theme="light"] .filters .filter-row .car-mark:focus-within,
    html[data-theme="light"] .filters .filter-row .min-price:focus-within,
    html[data-theme="light"] .filters .filter-row .max-price:focus-within {
        border-color: rgba(216, 162, 0, 0.6) !important;
        box-shadow: 0 0 0 3px rgba(253, 203, 1, 0.14) !important;
    }
}

/* ── Mobile theme switch — light mode appearance ── */
html[data-theme="light"] .theme-switch {
    background: #F6F7FB !important;
    border: 1px solid rgba(20, 25, 38, 0.09) !important;
}
html[data-theme="light"] .theme-switch:hover {
    background: #FFFDF4 !important;
    border-color: rgba(216, 162, 0, 0.4) !important;
}
html[data-theme="light"] .theme-switch-ic {
    background: rgba(253, 203, 1, 0.22) !important;
    color: #D49D00 !important;
}
html[data-theme="light"] .theme-switch-title {
    color: #1A1F2B !important;
}
html[data-theme="light"] .theme-switch-sub {
    color: #8B93A3 !important;
}
html[data-theme="light"] .theme-switch-knob {
    box-shadow: 0 2px 6px rgba(20, 25, 38, 0.22) !important;
}

html[data-theme="light"] .car-model-2,
html[data-theme="light"] .ilmin,
html[data-theme="light"] .car-min-price,
html[data-theme="light"] .car-max-price,
html[data-theme="light"] .tip,
html[data-theme="light"] .giving-item,
html[data-theme="light"] .cnt-input,
html[data-theme="light"] .pi-input,
html[data-theme="light"] .extra-btn,
html[data-theme="light"] .auto-bottom span,
html[data-theme="light"] .auto-bottom button,
html[data-theme="light"] .bron-btn {
    background: #F5F7FA !important;
    border: 1px solid rgba(20, 25, 38, 0.11) !important;
    color: #38404E !important;
}

html[data-theme="light"] #mySp,
html[data-theme="light"] .model-submenu-2 .myp,
html[data-theme="light"] .model-submenu-2 label,
html[data-theme="light"] .tip label,
html[data-theme="light"] .tip.tip-active label,
html[data-theme="light"] .tip input:checked + label {
    color: #38404E !important;
}

html[data-theme="light"] .model-submenu-2 {
    background: #FFFFFF !important;
    border-color: rgba(20, 25, 38, 0.12) !important;
    box-shadow: 0 18px 42px rgba(20, 25, 38, 0.14) !important;
}

html[data-theme="light"] .tip.tip-active,
html[data-theme="light"] .tip input:checked ~ label,
html[data-theme="light"] .button.active {
    background: #FDCB01 !important;
    border-color: #FDCB01 !important;
    color: #151923 !important;
}

html[data-theme="light"] .search-model button,
html[data-theme="light"] .brone-btn,
html[data-theme="light"] .extra-btn:hover {
    background: linear-gradient(180deg, #FFD934 0%, #FDCB01 100%) !important;
    color: #151923 !important;
    border: none !important;
    box-shadow: 0 12px 28px rgba(216, 162, 0, 0.24) !important;
}

html[data-theme="light"] .cart-auto {
    overflow: hidden !important;
}

html[data-theme="light"] .cart-auto:hover,
html[data-theme="light"] .review-card:hover,
html[data-theme="light"] .extra-cart:hover,
html[data-theme="light"] .packet-card:hover {
    border-color: rgba(216, 162, 0, 0.55) !important;
    box-shadow: 0 22px 52px rgba(20, 25, 38, 0.14) !important;
}



html[data-theme="light"] .auto-bottom,
html[data-theme="light"] .packet-feature,
html[data-theme="light"] .check_pro_1,
html[data-theme="light"] .see-display {
    border-color: rgba(20, 25, 38, 0.09) !important;
}

html[data-theme="light"] .see-car a {
    color: #5D6574 !important;
    border-color: rgba(20, 25, 38, 0.10) !important;
}



html[data-theme="light"] .brone {
    background: rgba(21, 25, 35, 0.56) !important;
}

html[data-theme="light"] .rentacar-section,
html[data-theme="light"] .pagination-cars,
html[data-theme="light"] .filtering {
    background:
        radial-gradient(circle at 82% 12%, rgba(253, 203, 1, 0.10), transparent 30%),
        linear-gradient(180deg, #F8FAFC 0%, #EEF2F6 100%) !important;
    border-color: rgba(20, 25, 38, 0.08) !important;
}

html[data-theme="light"] .about-company {
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
    background-color: #08090F !important;
    border-color: rgba(20, 25, 38, 0.08) !important;
}

html[data-theme="light"] .about-company .filtering {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.72) 0%, rgba(245, 247, 250, 0.64) 100%),
        rgba(255, 255, 255, 0.18) !important;
}

html[data-theme="light"] .pagination-cars::before {
    background: radial-gradient(circle, rgba(253, 203, 1, 0.12), transparent 70%) !important;
}

html[data-theme="light"] .right-title p,
html[data-theme="light"] .right-title p *,
html[data-theme="light"] .content-1 li,
html[data-theme="light"] .content-1 p,
html[data-theme="light"] .property-col span,
html[data-theme="light"] .price-clicked-car,
html[data-theme="light"] .price-clicked-car p,
html[data-theme="light"] .price-clicked-car span,
html[data-theme="light"] .description-clicked-car,
html[data-theme="light"] .network-adress,
html[data-theme="light"] .network-adress span,
html[data-theme="light"] .network-adress a,
html[data-theme="light"] .name-extra,
html[data-theme="light"] .packet-feature-name,
html[data-theme="light"] .service-name,
html[data-theme="light"] .service div,
html[data-theme="light"] .service p,
html[data-theme="light"] .service span,
html[data-theme="light"] .service li,
html[data-theme="light"] .security-item,
html[data-theme="light"] .security-item *,
html[data-theme="light"] .accordion,
html[data-theme="light"] .accordion p,
html[data-theme="light"] .accordion-content,
html[data-theme="light"] .accordion-content *,
html[data-theme="light"] .cnt-info-val,
html[data-theme="light"] .cnt-label,
html[data-theme="light"] .pi-label,
html[data-theme="light"] .frame span,
html[data-theme="light"] .fh,
html[data-theme="light"] .company-name span {
    color: #38404E !important;
}

html[data-theme="light"] .price-clicked-car .daily span:first-child,
html[data-theme="light"] .price-clicked-car .week span:first-child,
html[data-theme="light"] .price-clicked-car .month span:first-child {
    color: #986E00 !important;
}

html[data-theme="light"] .price-clicked-car span[style],
html[data-theme="light"] .description-clicked-car * {
    color: #5D6574 !important;
}

html[data-theme="light"] .service-name,
html[data-theme="light"] .accordion p {
    color: #151923 !important;
}

/* ════════ Rich-text DB content (about + blog) — force readable text ════════ */
/* These containers hold {!! html !!} from DB that may carry inline white colours,
   leaving the text invisible on a light background. The descendant !important
   rule overrides inline (non-important) colours. */
html[data-theme="light"] .about-right-title,
html[data-theme="light"] .about-right-title *,
html[data-theme="light"] .right-title,
html[data-theme="light"] .right-title *,
html[data-theme="light"] .blog-inner-text,
html[data-theme="light"] .blog-inner-text *,
html[data-theme="light"] .blog-inner-body p,
html[data-theme="light"] .blog-inner-body li,
html[data-theme="light"] .blog-inner-body span {
    color: #38404E !important;
}
html[data-theme="light"] .about-right-title h1,
html[data-theme="light"] .about-right-title h2,
html[data-theme="light"] .about-right-title h3,
html[data-theme="light"] .about-right-title strong,
html[data-theme="light"] .about-right-title b,
html[data-theme="light"] .right-title h1,
html[data-theme="light"] .right-title h2,
html[data-theme="light"] .right-title h3,
html[data-theme="light"] .blog-inner-body h2,
html[data-theme="light"] .blog-inner-text h1,
html[data-theme="light"] .blog-inner-text h2,
html[data-theme="light"] .blog-inner-text h3,
html[data-theme="light"] .blog-inner-text strong,
html[data-theme="light"] .blog-inner-text b {
    color: #151923 !important;
}
html[data-theme="light"] .blog-inner-text a,
html[data-theme="light"] .about-right-title a,
html[data-theme="light"] .right-title a {
    color: #986E00 !important;
}

html[data-theme="light"] .service-inner {
    background: #FFF8DE !important;
    border-color: rgba(216, 162, 0, 0.28) !important;
}

html[data-theme="light"] .service:hover .service-inner {
    background: #FDCB01 !important;
    border-color: #FDCB01 !important;
}

html[data-theme="light"] .accordion.is-open {
    background: #FFF8DE !important;
    border-color: rgba(216, 162, 0, 0.42) !important;
}

html[data-theme="light"] .emblem-swipe,
html[data-theme="light"] footer,
html[data-theme="light"] .footer-navs {
    background: #FFFFFF !important;
    border-color: rgba(20, 25, 38, 0.09) !important;
}

html[data-theme="light"] .footer-socials a:hover {
    background: #FDCB01 !important;
    color: #151923 !important;
}

/* ════════════════════════════════════════════════════════════════
   Mobile offcanvas menu — light mode
   The dark theme builds every surface from translucent white
   (rgba(255,255,255,.0x)); on a white panel those vanish, which is
   why the menu looked flat/unfinished. Each surface is re-tinted here
   with proper light-mode colours so it matches the polish of dark mode.
   ════════════════════════════════════════════════════════════════ */

/* Panel */
html[data-theme="light"] .mobilemenu {
    background: linear-gradient(180deg, #FFFFFF 0%, #F6F8FC 100%) !important;
    border-right: 1px solid rgba(20, 25, 38, 0.10) !important;
    box-shadow: 24px 0 64px rgba(20, 25, 38, 0.18) !important;
}

/* Header */
html[data-theme="light"] .mobile-menu-header {
    background: rgba(20, 25, 38, 0.02) !important;
    border-bottom: 1px solid rgba(20, 25, 38, 0.08) !important;
}
html[data-theme="light"] .mobile-logo.car-logo span {
    color: #151923 !important;
}

/* Close button — was a near-white icon on white (invisible) */
html[data-theme="light"] .close-mobile {
    background: #EEF2F7 !important;
    border: 1px solid rgba(20, 25, 38, 0.12) !important;
    color: #5D6574 !important;
}
html[data-theme="light"] .close-mobile:hover {
    background: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #1A1205 !important;
}

/* Nav links, dividers, chevrons, hover & active */
html[data-theme="light"] .mobile-ul > li > a {
    border-bottom: 1px solid rgba(20, 25, 38, 0.06) !important;
}
html[data-theme="light"] .mobile-ul > li > a::after {
    border-color: rgba(20, 25, 38, 0.30) !important;
}
html[data-theme="light"] .mobile-ul > li > a:hover {
    color: #8A6200 !important;
    background: rgba(253, 203, 1, 0.12) !important;
    border-left-color: var(--primary) !important;
}
html[data-theme="light"] .mobile-ul > li > a:hover::after {
    border-color: var(--primary) !important;
}
html[data-theme="light"] .mobile-ul > li > a.mob-nav-active {
    color: #8A6200 !important;
    background: rgba(253, 203, 1, 0.14) !important;
    border-left-color: var(--primary) !important;
}

/* Language pill container */
html[data-theme="light"] .mobile-lang {
    border-bottom: 1px solid rgba(20, 25, 38, 0.06) !important;
}
html[data-theme="light"] .mobile-lang .lang {
    background: #EEF2F7 !important;
    border: 1px solid rgba(20, 25, 38, 0.10) !important;
}
html[data-theme="light"] .mobile-lang .lan:hover {
    color: #151923 !important;
    background: rgba(20, 25, 38, 0.05) !important;
}

/* Search field */
html[data-theme="light"] .mob-search-form {
    background: #F4F7FA !important;
    border: 1px solid rgba(20, 25, 38, 0.12) !important;
}
html[data-theme="light"] .mob-search-form:focus-within {
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 3px rgba(253, 203, 1, 0.18) !important;
}

/* Footer — was a dark band (rgba(0,0,0,.25)) on white */
html[data-theme="light"] .mobile-footer {
    background: rgba(20, 25, 38, 0.03) !important;
    border-top: 1px solid rgba(20, 25, 38, 0.08) !important;
}
html[data-theme="light"] .mobile-footer a {
    background: #FFFFFF !important;
    border: 1px solid rgba(20, 25, 38, 0.10) !important;
    color: #5D6574 !important;
    box-shadow: 0 1px 3px rgba(20, 25, 38, 0.05) !important;
}
html[data-theme="light"] .mobile-footer a:hover {
    color: #1A1205 !important;
    background: rgba(253, 203, 1, 0.16) !important;
    border-color: var(--primary) !important;
    box-shadow: 0 6px 16px rgba(253, 203, 1, 0.22) !important;
}

/* Scrollbar */
html[data-theme="light"] .mobile-menu-content::-webkit-scrollbar-thumb {
    background: rgba(212, 157, 0, 0.30) !important;
}

html[data-theme="light"] .select2-dropdown,
html[data-theme="light"] .select2-results__option,
html[data-theme="light"] .daterangepicker {
    background: #FFFFFF !important;
    border-color: rgba(20, 25, 38, 0.12) !important;
    color: #151923 !important;
    box-shadow: 0 18px 44px rgba(20, 25, 38, 0.14) !important;
}

html[data-theme="light"] .select2-results__option--highlighted,
html[data-theme="light"] .select2-results__option--highlighted[aria-selected] {
    background: #FFF3BF !important;
    color: #151923 !important;
}

html[data-theme="light"] .filter-s2-wrap .select2-selection__rendered,
html[data-theme="light"] .daterangepicker td,
html[data-theme="light"] .daterangepicker th {
    color: #151923 !important;
}

html[data-theme="light"] .select2-selection__placeholder,
html[data-theme="light"] .daterangepicker td.off {
    color: #8B93A3 !important;
}

.theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.06);
    color: var(--primary);
    cursor: pointer;
    transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
    flex-shrink: 0;
}

.theme-toggle:hover {
    background: rgba(253, 203, 1, 0.14);
    border-color: rgba(253, 203, 1, 0.42);
    transform: translateY(-1px);
}

.theme-toggle .svg-icon {
    width: 18px;
    height: 18px;
}

.theme-toggle .icon-moon {
    display: none;
}

.theme-toggle .icon-sun {
    display: block;
}

html[data-theme="light"] .theme-toggle .icon-sun {
    display: none;
}

html[data-theme="light"] .theme-toggle .icon-moon {
    display: block;
}

@media (max-width: 768px) {
    html[data-theme="light"] .header-row,
    html[data-theme="light"] .navbars .header-row {
        background: rgba(255, 255, 255, 0.92) !important;
        box-shadow: 0 14px 34px rgba(20, 25, 38, 0.11) !important;
    }

    html[data-theme="light"] .filters .filter-row {
        background: rgba(255, 255, 255, 0.96) !important;
        border-color: rgba(216, 162, 0, 0.34) !important;
    }

    html[data-theme="light"] .site-description p,
    html[data-theme="light"] .mobile-site-descripton p {
        text-shadow: 0 3px 20px rgba(0, 0, 0, 0.72), 0 1px 0 rgba(0, 0, 0, 0.45) !important;
    }
}

/* ════════════════════════════════════════════════════════════
   FINAL HEADER OVERRIDE — make the whole header LIGHT
   (supersedes the earlier dark-photo header rules above)
   ════════════════════════════════════════════════════════════ */
html[data-theme="light"] header .header-img,
html[data-theme="light"] .header-img,
html[data-theme="light"] .other-header {
    background-color: #EEF0F5 !important;
    background-attachment: scroll !important;
}

/* No dark overlay on a light header */
html[data-theme="light"] .header-overlay,
html[data-theme="light"] .filtering {
    background: transparent !important;
}

/* Hero wordmark → dark text, yellow accent word stays gold */
html[data-theme="light"] .site-description p span,
html[data-theme="light"] .header-img .site-description p span {
    color: #151923 !important;
    text-shadow: none !important;
}


/* Floating white nav card on the soft-grey hero */



/* Nav menu links: clean text inside the white card (no pill) */
html[data-theme="light"] .navbar ul li a {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    color: #242A36 !important;
}
html[data-theme="light"] .navbar ul li a:hover,
html[data-theme="light"] .navbar ul li a.nav-active {
    background: rgba(253, 203, 1, 0.15) !important;
    color: #8A6200 !important;
}

/* Phone / mail links: subtle light chips */
html[data-theme="light"] .phone-num a,
html[data-theme="light"] .mail a,
html[data-theme="light"] .contact ul li .phone-num a,
html[data-theme="light"] .contact ul li .mail a {
    background: #F4F6FA !important;
    border: 1px solid rgba(20, 25, 38, 0.07) !important;
    color: #242A36 !important;
}

/* Cart / search / theme buttons on the white card */
html[data-theme="light"] .basket-nav-link,
html[data-theme="light"] .search-section,
html[data-theme="light"] .theme-toggle {
    background: rgba(244, 247, 250, 0.82) !important;
    border-color: rgba(20, 25, 38, 0.08) !important;
}
html[data-theme="light"] .basket-nav-link .svg-icon {
    color: #242A36 !important;
    fill: #242A36 !important;
}

/* Decorative hero cars sit on light bg — keep, just no dark glow */
html[data-theme="light"] header .left-car,
html[data-theme="light"] header .right-car {
    filter: drop-shadow(0 24px 40px rgba(20, 25, 38, 0.18)) !important;
}

/* ════════ Search button icon visibility (light) ════════ */
html[data-theme="light"] .search-section .search-btn,
html[data-theme="light"] .navbar .search-section .search-btn,
html[data-theme="light"] .mob-search-form .search-btn {
    background: #FDCB01 !important;
    border: none !important;
    box-shadow: 0 2px 10px rgba(216, 162, 0, 0.28) !important;
}
html[data-theme="light"] .search-section .search-btn .svg-icon,
html[data-theme="light"] .navbar .search-section .search-btn .svg-icon,
html[data-theme="light"] .mob-search-form .search-btn .svg-icon,
html[data-theme="light"] .search-btn .svg-icon {
    color: #151923 !important;
    fill: #151923 !important;
}
html[data-theme="light"] .search-section .search-btn:hover,
html[data-theme="light"] .mob-search-form .search-btn:hover {
    background: #E6B800 !important;
}

/* ════════════════════════════════════════════════════════════
   RESERVATION PAGE — strong light overrides (high specificity)
   ════════════════════════════════════════════════════════════ */

/* Extra (add-on) cards — were staying dark */
html[data-theme="light"] .extra-cart,
html[data-theme="light"] .res-main .extra-cart,
html[data-theme="light"] .horiz-scroll-wrap .extra-cart,
html[data-theme="light"] .res-main .horiz-scroll-wrap .extra-cart {
    background: #FFFFFF !important;
    border: 1px solid rgba(20, 25, 38, 0.08) !important;
    box-shadow: 0 6px 20px rgba(20, 25, 38, 0.06) !important;
}
html[data-theme="light"] .name-extra,
html[data-theme="light"] .price-extra,
html[data-theme="light"] .extra-cart .thiscount {
    color: #242A36 !important;
}
html[data-theme="light"] .extra-img {
    background: #F4F6FA !important;
    border-radius: 12px !important;
}
html[data-theme="light"] .extra-btn,
html[data-theme="light"] .extra-count button {
    background: #F0F2F6 !important;
    border: 1px solid rgba(20, 25, 38, 0.12) !important;
    color: #242A36 !important;
}
html[data-theme="light"] .thiscount {
    background: transparent !important;
    color: #151923 !important;
}

/* Packet "Seçin" select button — label was invisible */
html[data-theme="light"] .bron-btn {
    background: #F4F6FA !important;
    border: 1px solid rgba(216, 162, 0, 0.40) !important;
}
html[data-theme="light"] .bron-btn label {
    color: #242A36 !important;
}
html[data-theme="light"] .bron-btn:hover {
    background: rgba(253, 203, 1, 0.14) !important;
}
html[data-theme="light"] .bron-btn:hover label,
html[data-theme="light"] .bron-btn.packet-selected label,
html[data-theme="light"] .packet-card.is-selected .bron-btn label {
    color: #8A6200 !important;
}
html[data-theme="light"] .bron-btn.packet-selected,
html[data-theme="light"] .packet-card.is-selected .bron-btn {
    background: rgba(253, 203, 1, 0.16) !important;
    border-color: #FDCB01 !important;
}

/* Reservation form selects (pickup / return) — Select2 + native */
html[data-theme="light"] .giving-item {
    background: #FFFFFF !important;
    border: 1px solid rgba(20, 25, 38, 0.10) !important;
}
html[data-theme="light"] .giving-item .select2-selection,
html[data-theme="light"] .giving-item .select2-selection--single {
    background: transparent !important;
}
html[data-theme="light"] .giving-item .select2-selection__rendered,
html[data-theme="light"] .giving-item select,
html[data-theme="light"] .giving-item input,
html[data-theme="light"] .giving-title {
    color: #151923 !important;
}
html[data-theme="light"] .giving-item .select2-selection__arrow b {
    border-color: #8A6200 transparent transparent transparent !important;
}

/* Daterange input text */
html[data-theme="light"] input[name="daterange"] {
    color: #151923 !important;
}

/* Sidebar checkout box */
html[data-theme="light"] .checkout_fixed,
html[data-theme="light"] .res-sidebar .checkout_fixed,
html[data-theme="light"] .sidebar-empty-state {
    background: #FFFFFF !important;
    border: 1px solid rgba(20, 25, 38, 0.08) !important;
    box-shadow: 0 10px 30px rgba(20, 25, 38, 0.07) !important;
}
html[data-theme="light"] .checkout_fixed h3,
html[data-theme="light"] .check_pro_1,
html[data-theme="light"] #sb-grand-total,
html[data-theme="light"] .sidebar-empty-state p {
    color: #242A36 !important;
}
html[data-theme="light"] .check_pro_1 {
    border-color: rgba(20, 25, 38, 0.08) !important;
}
html[data-theme="light"] .sb-icon-wrap,
html[data-theme="light"] .sb-arrow {
    color: #8A6200 !important;
}

/* Gallery nav arrows (prev/next) visible on light */
html[data-theme="light"] .gallery-nav,
html[data-theme="light"] .swiper-button-prev,
html[data-theme="light"] .swiper-button-next {
    background: #FFFFFF !important;
    color: #242A36 !important;
    box-shadow: 0 4px 14px rgba(20, 25, 38, 0.12) !important;
}
html[data-theme="light"] .gallery-nav .svg-icon {
    color: #242A36 !important;
    fill: #242A36 !important;
}

/* Property cards + share row */
html[data-theme="light"] .property-col,
html[data-theme="light"] .res-meta {
    background: #FFFFFF !important;
    border: 1px solid rgba(20, 25, 38, 0.08) !important;
}
/* Share buttons keep their brand colours in light mode (same as dark) */
html[data-theme="light"] .res-share-fb {
    background: #1877F2 !important;
    color: #FFFFFF !important;
}
html[data-theme="light"] .res-share-wa {
    background: #25D366 !important;
    color: #FFFFFF !important;
}
html[data-theme="light"] .res-share-tg {
    background: #229ED9 !important;
    color: #FFFFFF !important;
}
html[data-theme="light"] .res-share-copy {
    background: #EAEDF2 !important;
    color: #38404E !important;
    border: 1px solid rgba(20, 25, 38, 0.10) !important;
}
html[data-theme="light"] .res-share-fb .svg-icon,
html[data-theme="light"] .res-share-wa .svg-icon,
html[data-theme="light"] .res-share-tg .svg-icon {
    color: #FFFFFF !important;
    fill: #FFFFFF !important;
}
html[data-theme="light"] .res-share-copy .svg-icon {
    color: #38404E !important;
    fill: #38404E !important;
}
html[data-theme="light"] .res-share-copy.copied {
    background: rgba(34, 197, 94, .18) !important;
    color: #16A34A !important;
}
html[data-theme="light"] .res-share-copy.copied .svg-icon {
    color: #16A34A !important;
    fill: #16A34A !important;
}
html[data-theme="light"] .res-share-label {
    color: #565D6D !important;
}

/* ════════ Select2 dropdown search box (light) ════════ */
html[data-theme="light"] .select2-dropdown,
html[data-theme="light"] .select2-search,
html[data-theme="light"] .select2-search--dropdown {
    background: #FFFFFF !important;
    border-color: rgba(20, 25, 38, 0.12) !important;
}
html[data-theme="light"] .select2-search__field {
    background: #F4F6FA !important;
    border: 1px solid rgba(20, 25, 38, 0.14) !important;
    color: #151923 !important;
    border-radius: 8px !important;
}
html[data-theme="light"] .select2-search__field::placeholder {
    color: rgba(56, 64, 78, 0.5) !important;
}
html[data-theme="light"] .select2-results__option {
    color: #242A36 !important;
    background: #FFFFFF !important;
}
html[data-theme="light"] .select2-results__option--highlighted,
html[data-theme="light"] .select2-results__option[aria-selected="true"] {
    background: rgba(253, 203, 1, 0.20) !important;
    color: #151923 !important;
}

/* ════════ Uniform property icons & card shadows (light) ════════ */
/* All property PNG icons → identical gold tone */
html[data-theme="light"] .property-col img,
html[data-theme="light"] .propertyes-clicked .property-col img {
    filter: brightness(0) saturate(100%) invert(72%) sepia(78%) saturate(1100%) hue-rotate(2deg) brightness(98%) contrast(101%) !important;
    -webkit-filter: brightness(0) saturate(100%) invert(72%) sepia(78%) saturate(1100%) hue-rotate(2deg) brightness(98%) contrast(101%) !important;
    opacity: 1 !important;
}
/* All property cards → identical surface + shadow + border */
html[data-theme="light"] .property-col {
    background: #FFFFFF !important;
    border: 1px solid rgba(20, 25, 38, 0.08) !important;
    box-shadow: 0 6px 18px rgba(20, 25, 38, 0.06) !important;
}
html[data-theme="light"] .property-col:hover {
    border-color: rgba(216, 162, 0, 0.40) !important;
    box-shadow: 0 10px 26px rgba(20, 25, 38, 0.10) !important;
}

/* ════════ Select2 dropdown container — light surface (everywhere) ════════ */
/* Base CSS sets .select2-results__options bg #13141F (dark); override it so the
   semi-transparent highlighted option doesn't reveal a dark backdrop. */
html[data-theme="light"] .select2-results__options,
html[data-theme="light"] .select2-dropdown,
html[data-theme="light"] .select2-results {
    background: #FFFFFF !important;
}
html[data-theme="light"] .select2-results__option {
    color: #242A36 !important;
    background: #FFFFFF !important;
}
html[data-theme="light"] .select2-results__option--highlighted,
html[data-theme="light"] .select2-results__option--highlighted[aria-selected],
html[data-theme="light"] .select2-results__option--highlighted[aria-selected="true"] {
    background: #FFF3BF !important;
    color: #151923 !important;
}
html[data-theme="light"] .select2-results__option[aria-selected="true"] {
    background: rgba(253, 203, 1, 0.16) !important;
    color: #151923 !important;
}

/* ════════ Personal-information summary card text (light) ════════ */
/* .pi-summary gets a white surface above, but its text stays #fff → invisible. */
html[data-theme="light"] .pi-car-name {
    color: #151923 !important;
}
html[data-theme="light"] .pi-meta span {
    color: #565D6D !important;
}
html[data-theme="light"] .pi-meta i {
    color: #C89100 !important;
}
html[data-theme="light"] .pi-total-label {
    color: #6B7280 !important;
}
html[data-theme="light"] .pi-total-price {
    color: #B8860B !important;
}

/* ════════ Daterangepicker header text (light) ════════ */
/* Base CSS sets weekday + month th to white/transparent → invisible on white. */
html[data-theme="light"] .daterangepicker .calendar-table thead tr:last-child th {
    color: #565D6D !important;
}
html[data-theme="light"] .daterangepicker th.month,
html[data-theme="light"] .daterangepicker .calendar-table thead th.month {
    color: #151923 !important;
}
html[data-theme="light"] .daterangepicker td.available {
    color: #242A36 !important;
}
/* Month/Year are <select> dropdowns (showDropdowns) with white text → invisible.
   Style them as normal, readable light selects. */
html[data-theme="light"] .daterangepicker select.monthselect,
html[data-theme="light"] .daterangepicker select.yearselect {
    background: #FFFFFF !important;
    border: 1px solid rgba(20, 25, 38, 0.16) !important;
    color: #151923 !important;
    font-weight: 600 !important;
}
html[data-theme="light"] .daterangepicker select.monthselect option,
html[data-theme="light"] .daterangepicker select.yearselect option {
    background: #FFFFFF !important;
    color: #151923 !important;
}
/* Disabled / off (past) days must stay visible (muted, not white) */
html[data-theme="light"] .daterangepicker td.off,
html[data-theme="light"] .daterangepicker td.disabled,
html[data-theme="light"] .daterangepicker td.off.disabled {
    color: #AEB4BF !important;
}
html[data-theme="light"] .daterangepicker .drp-buttons {
    background: #F3F5F8 !important;
    border-top: 1px solid rgba(20, 25, 38, 0.10) !important;
}
html[data-theme="light"] .daterangepicker .cancelBtn {
    background: #E8EBF0 !important;
    color: #38404E !important;
}
html[data-theme="light"] .daterangepicker .cancelBtn:hover {
    background: #DCE0E7 !important;
    color: #151923 !important;
}
html[data-theme="light"] .daterangepicker .drp-calendar.left {
    border-right: 1px solid rgba(20, 25, 38, 0.10) !important;
}

/* ════════ Pagination-cars tab buttons (light) ════════ */
/* .button text is white (rgba 255) and .wrap-row gets white bg → labels invisible. */
html[data-theme="light"] .wrap-row {
    background: #F1F3F7 !important;
    border: 1px solid rgba(20, 25, 38, 0.10) !important;
}
html[data-theme="light"] .button {
    color: #38404E !important;
}
html[data-theme="light"] .button:hover {
    color: #151923 !important;
    background: rgba(20, 25, 38, 0.06) !important;
}
html[data-theme="light"] .button.active {
    background: var(--primary, #FDCB01) !important;
    color: #1A1205 !important;
    box-shadow: 0 4px 16px rgba(216, 162, 0, 0.30) !important;
}

/* ════════ Basket card meta text (light) ════════ */
html[data-theme="light"] .basket-car-meta span {
    color: #565D6D !important;
}
html[data-theme="light"] .basket-car-meta span .svg-icon {
    color: #C89100 !important;
    fill: #C89100 !important;
}

/* ════════ Service card icons — contrast on pale circle (light) ════════ */
/* Bright #fdcb01 icon on pale-gold circle has no contrast; use darker gold. */
html[data-theme="light"] .service-inner {
    background: rgba(216, 162, 0, 0.12) !important;
    border: 2px solid rgba(216, 162, 0, 0.35) !important;
}
html[data-theme="light"] .service:hover .service-inner {
    background: rgba(216, 162, 0, 0.20) !important;
    border-color: rgba(216, 162, 0, 0.55) !important;
}
html[data-theme="light"] .service-inner img {
    filter: brightness(0) saturate(100%) invert(54%) sepia(86%) saturate(720%) hue-rotate(1deg) brightness(92%) contrast(98%) !important;
    -webkit-filter: brightness(0) saturate(100%) invert(54%) sepia(86%) saturate(720%) hue-rotate(1deg) brightness(92%) contrast(98%) !important;
}