/* ==========================================================================
   DARK MODE OVERRIDES  —  html[data-theme="dark"]
   All rules use !important to beat inline <style> specificity.
   ========================================================================== */

/* ── Theme toggle button (shared across all consumer navbars) ── */
.theme-toggle-btn {
    display: inline-flex; align-items: center; justify-content: center;
    width: 36px; height: 36px;
    border-radius: 10px;
    border: 1.5px solid rgba(0,0,0,.12);
    background: #f3f4f6;
    color: #4b5563;
    cursor: pointer;
    flex-shrink: 0;
    font-size: 0.95rem;
    transition: background .2s, color .2s, border-color .2s;
    padding: 0;
}
.theme-toggle-btn:hover { background: #e5e7eb; color: #111827; }

/* Index nav — transparent or scrolled (both light backgrounds) */
.site-nav .theme-toggle-btn,
.site-nav.scrolled .theme-toggle-btn {
    background: #f3f4f6;
    border-color: rgba(0,0,0,.12);
    color: #4b5563;
}
.site-nav .theme-toggle-btn:hover,
.site-nav.scrolled .theme-toggle-btn:hover { background: #e5e7eb; color: #111827; }

/* Dark mode toggle button inside any navbar */
[data-theme="dark"] .theme-toggle-btn,
[data-theme="dark"] .consumer-nav .theme-toggle-btn,
[data-theme="dark"] .site-nav .theme-toggle-btn,
[data-theme="dark"] .site-nav.scrolled .theme-toggle-btn {
    background: rgba(255,255,255,.1) !important;
    border-color: rgba(255,255,255,.18) !important;
    color: rgba(255,255,255,.9) !important;
}
[data-theme="dark"] .theme-toggle-btn:hover,
[data-theme="dark"] .consumer-nav .theme-toggle-btn:hover,
[data-theme="dark"] .site-nav .theme-toggle-btn:hover,
[data-theme="dark"] .site-nav.scrolled .theme-toggle-btn:hover {
    background: rgba(255,255,255,.18) !important;
    color: #fff !important;
}

/* ==========================================================================
   GLOBAL — applies to ALL pages
   ========================================================================== */
[data-theme="dark"] {
    /* Index page uses inverted var names — flip them for dark mode */
    --white: #f0f0f0;
    --dark:  #1a1a2e;
    --dark2: #242432;
}
[data-theme="dark"] body {
    background: #0d0d0d !important;
    color: #e5e7eb !important;
}

/* ==========================================================================
   INDEX / LANDING PAGE
   ========================================================================== */

/* Hero */
[data-theme="dark"] .hero-bg {
    background: linear-gradient(160deg, #0a1a1a 0%, #0d2222 25%, #0e1f1f 50%, #0b1c1c 75%, #0a1a1a 100%) !important;
}
[data-theme="dark"] .hero-overlay {
    background: linear-gradient(to bottom, rgba(0,0,0,.15) 0%, transparent 45%, rgba(0,0,0,.25) 100%) !important;
}
[data-theme="dark"] .hero-eyebrow  { color: #4bc3c4 !important; }
[data-theme="dark"] .hero-title    { color: #fff !important; }
[data-theme="dark"] .hero-title .accent { color: #4bc3c4 !important; }
[data-theme="dark"] .hero-tagline  { color: rgba(255,255,255,.7) !important; }
[data-theme="dark"] .hero-stats {
    background: rgba(0,0,0,.7) !important;
    border-top-color: rgba(255,255,255,.07) !important;
}
[data-theme="dark"] .hero-stat        { border-right-color: rgba(255,255,255,.08) !important; }
[data-theme="dark"] .hero-stat-num    { color: #fff !important; }
[data-theme="dark"] .hero-stat-label  { color: rgba(255,255,255,.45) !important; }
[data-theme="dark"] .hero-scroll      { color: rgba(255,255,255,.35) !important; }

/* Index nav */
[data-theme="dark"] .site-nav.scrolled {
    background: rgba(10,10,10,.97) !important;
    border-bottom-color: rgba(255,255,255,.06) !important;
}
[data-theme="dark"] .nav-hotel-name { color: #fff !important; }
[data-theme="dark"] .nav-link       { color: rgba(255,255,255,.8) !important; }
[data-theme="dark"] .nav-link:hover { color: #fff !important; }
[data-theme="dark"] .nav-menu-btn   { color: rgba(255,255,255,.8) !important; }
[data-theme="dark"] .nav-drawer {
    background: rgba(10,10,10,.98) !important;
    border-top-color: rgba(255,255,255,.06) !important;
}
[data-theme="dark"] .nav-drawer .nav-link {
    color: rgba(255,255,255,.8) !important;
    border-bottom-color: rgba(255,255,255,.06) !important;
}

/* Areas section */
[data-theme="dark"] .areas-section  { background: #111111 !important; }
[data-theme="dark"] .section-label  { color: #4bc3c4 !important; }
[data-theme="dark"] .section-heading { color: #fff !important; }
[data-theme="dark"] .section-sub    { color: rgba(255,255,255,.5) !important; }
[data-theme="dark"] .area-placeholder {
    background: rgba(255,255,255,.04) !important;
    border-color: rgba(255,255,255,.1) !important;
    color: rgba(255,255,255,.3) !important;
}
/* Book strip inside areas section */
[data-theme="dark"] .book-strip { background: #0c4040 !important; }
[data-theme="dark"] .book-strip-sub { color: rgba(255,255,255,.5) !important; }
[data-theme="dark"] .book-strip-btn {
    background: #fff !important;
    color: #0c4040 !important;
}
[data-theme="dark"] .book-strip-btn:hover { background: #e5e7eb !important; }

/* How it works */
[data-theme="dark"] .how-section    { background: #0d0d0d !important; }
[data-theme="dark"] .how-grid       { border-color: rgba(255,255,255,.07) !important; }
[data-theme="dark"] .how-step       { border-color: rgba(255,255,255,.07) !important; }
[data-theme="dark"] .how-step-title { color: #fff !important; }
[data-theme="dark"] .how-step-desc  { color: rgba(255,255,255,.5) !important; }

/* CTA section */
[data-theme="dark"] .cta-section    { background: #050f0f !important; }
[data-theme="dark"] .cta-title      { color: #fff !important; }
[data-theme="dark"] .cta-sub        { color: rgba(255,255,255,.5) !important; }

/* ==========================================================================
   BOOKING PAGE & POOL AREA DETAIL PAGE  (CSS-variable based)
   ========================================================================== */
[data-theme="dark"] {
    --bg:       #0d0d0d;
    --bg2:      #141414;
    --bg3:      #1a1a1a;
    --surface:  #1e1e1e;
    --surface2: #242424;
    --border:   rgba(255,255,255,.08);
}

/* Consumer nav (Booking + PoolArea + Cart + Checkout) */
[data-theme="dark"] .consumer-nav {
    background: rgba(10,10,10,.97) !important;
    border-bottom-color: rgba(255,255,255,.08) !important;
    box-shadow: 0 1px 0 rgba(255,255,255,.04) !important;
}
[data-theme="dark"] .nav-name        { color: #fff !important; }
[data-theme="dark"] .nav-title       { color: #fff !important; }
[data-theme="dark"] .nav-sep         { color: rgba(255,255,255,.2) !important; }
[data-theme="dark"] .nav-back        { color: #3dacac !important; }
[data-theme="dark"] .nav-home-link   { color: rgba(255,255,255,.6) !important; }
[data-theme="dark"] .nav-home-link:hover { color: #fff !important; }
[data-theme="dark"] .nav-date-label  { color: rgba(255,255,255,.4) !important; }
[data-theme="dark"] input[type="date"] { color-scheme: dark; color: #fff !important; background: rgba(255,255,255,.08) !important; border-color: rgba(255,255,255,.15) !important; }

/* Map elements */
[data-theme="dark"] .consumer-main   { background: #0d0d0d !important; }
[data-theme="dark"] .map-wrapper     { background: #0d0d0d !important; }
[data-theme="dark"] .map-container   { background: #0d0d0d !important; }
[data-theme="dark"] .map-area-label  {
    background: rgba(15,15,15,.96) !important;
    border-color: rgba(255,255,255,.12) !important;
}
[data-theme="dark"] .map-area-name   { color: #e5e7eb !important; }
[data-theme="dark"] .map-area-tag    { color: #3dacac !important; }
[data-theme="dark"] .cat-legend-bar  {
    background: rgba(15,15,15,.88) !important;
    border-color: rgba(255,255,255,.1) !important;
}
[data-theme="dark"] .cat-legend-item { color: rgba(255,255,255,.75) !important; }
[data-theme="dark"] .cat-label       { fill: #e5e7eb !important; }
[data-theme="dark"] .map-section-label {
    background: rgba(13,13,13,.96) !important;
    border-color: rgba(255,255,255,.12) !important;
}
[data-theme="dark"] .map-section-tag   { color: #3dacac !important; }
[data-theme="dark"] .map-section-title { color: #e5e7eb !important; }
[data-theme="dark"] .map-legend {
    background: rgba(13,13,13,.96) !important;
    border-color: rgba(255,255,255,.12) !important;
}
[data-theme="dark"] .area-legend,
[data-theme="dark"] .status-legend   { background: rgba(13,13,13,.85) !important; }
[data-theme="dark"] .legend-row      { color: rgba(255,255,255,.7) !important; }
[data-theme="dark"] .legend-dot.closed { border-color: rgba(255,255,255,.2) !important; }

/* Intro strip */
[data-theme="dark"] .page-intro      { background: #141414 !important; border-bottom-color: rgba(255,255,255,.07) !important; }
[data-theme="dark"] .intro-step      { background: #1e1e1e !important; border-color: rgba(255,255,255,.08) !important; }
[data-theme="dark"] .intro-step-label { color: rgba(255,255,255,.65) !important; }

/* Toast */
[data-theme="dark"] .toast-notif {
    background: #1e1e1e !important;
    color: #fff !important;
    box-shadow: 0 4px 24px rgba(0,0,0,.5) !important;
}

/* Off-canvas panel */
[data-theme="dark"] .oc-backdrop     { background: rgba(0,0,0,.6) !important; }
[data-theme="dark"] .offcanvas       { background: #1a1a1a !important; box-shadow: -8px 0 40px rgba(0,0,0,.5) !important; }
[data-theme="dark"] .oc-header       { background: #1a1a1a !important; border-bottom-color: rgba(255,255,255,.07) !important; }
[data-theme="dark"] .oc-bed-name     { color: #fff !important; }
[data-theme="dark"] .oc-cat-badge    { background: rgba(61,172,172,.15) !important; color: #3dacac !important; }
[data-theme="dark"] .oc-date-badge   { background: rgba(255,255,255,.08) !important; color: rgba(255,255,255,.55) !important; }
[data-theme="dark"] .oc-close        { background: rgba(255,255,255,.08) !important; border-color: rgba(255,255,255,.1) !important; color: rgba(255,255,255,.6) !important; }
[data-theme="dark"] .oc-close:hover  { background: rgba(255,255,255,.14) !important; color: #fff !important; }
[data-theme="dark"] .oc-desc-strip   { background: #1a1a1a !important; border-bottom-color: rgba(255,255,255,.06) !important; }
[data-theme="dark"] .oc-desc-text    { color: rgba(255,255,255,.55) !important; }
[data-theme="dark"] .oc-section-title { color: rgba(255,255,255,.35) !important; }
[data-theme="dark"] .oc-section-title::after { background: rgba(255,255,255,.07) !important; }
[data-theme="dark"] .oc-footer       { background: #1a1a1a !important; border-top-color: rgba(255,255,255,.07) !important; }
[data-theme="dark"] .oc-total-label  { color: rgba(255,255,255,.4) !important; }
[data-theme="dark"] .oc-total-value  { color: #fff !important; }
[data-theme="dark"] .oc-total-breakdown { color: rgba(255,255,255,.35) !important; }
[data-theme="dark"] .oc-total-slots  { color: rgba(255,255,255,.5) !important; }

/* Packages */
[data-theme="dark"] .pkg-card        { background: #242424 !important; border-color: rgba(255,255,255,.08) !important; }
[data-theme="dark"] .pkg-card:hover  { background: rgba(61,172,172,.07) !important; border-color: #3dacac !important; }
[data-theme="dark"] .pkg-card.selected { background: rgba(61,172,172,.12) !important; border-color: #3dacac !important; }
[data-theme="dark"] .pkg-name        { color: #fff !important; }
[data-theme="dark"] .pkg-desc        { color: rgba(255,255,255,.45) !important; }

/* Gallery */
[data-theme="dark"] .gallery-wrap    { background: #111 !important; }
[data-theme="dark"] .gallery-slide   { background: #111 !important; }
[data-theme="dark"] .gallery-arrow   { background: rgba(0,0,0,.6) !important; color: #fff !important; border-color: rgba(255,255,255,.12) !important; }
[data-theme="dark"] .gallery-thumbs  { background: #141414 !important; border-bottom-color: rgba(255,255,255,.07) !important; }
[data-theme="dark"] .gallery-placeholder { background: #1a1a1a !important; color: rgba(255,255,255,.3) !important; }

/* Slot rows */
[data-theme="dark"] .slot-row        { background: #242424 !important; border-color: rgba(255,255,255,.07) !important; }
[data-theme="dark"] .slot-row:hover  { background: #2a2a2a !important; }
[data-theme="dark"] .slot-row.available:hover   { border-color: #3dacac !important; background: rgba(61,172,172,.07) !important; }
[data-theme="dark"] .slot-row.available.selected { border-color: #3dacac !important; background: rgba(61,172,172,.13) !important; box-shadow: 0 0 0 3px rgba(61,172,172,.15) !important; }
[data-theme="dark"] .slot-time       { color: #fff !important; }
[data-theme="dark"] .slot-duration   { color: rgba(255,255,255,.35) !important; }
[data-theme="dark"] .slot-price      { color: #fff !important; }
[data-theme="dark"] .slot-status.closed { background: rgba(255,255,255,.07) !important; color: rgba(255,255,255,.3) !important; }
[data-theme="dark"] .popup-slots-empty,
[data-theme="dark"] .slots-loading   { color: rgba(255,255,255,.4) !important; }
/* Waitlist */
[data-theme="dark"] .waitlist-inline-form { background: rgba(229,184,108,.05) !important; border-color: rgba(229,184,108,.2) !important; }
[data-theme="dark"] .waitlist-form-row input { background: #2a2a2a !important; color: #fff !important; border-color: rgba(255,255,255,.15) !important; }
[data-theme="dark"] .btn-add-cart:disabled { background: rgba(255,255,255,.08) !important; color: rgba(255,255,255,.3) !important; }

/* ==========================================================================
   CART PAGE
   ========================================================================== */
[data-theme="dark"] .cart-main          { background: #0d0d0d !important; }
[data-theme="dark"] .cart-heading       { color: #fff !important; }
[data-theme="dark"] .cart-sub           { color: rgba(255,255,255,.5) !important; }
[data-theme="dark"] .bed-group          { background: #1a1a1a !important; border-color: rgba(255,255,255,.08) !important; }
[data-theme="dark"] .bed-group-header   { background: #242424 !important; border-bottom-color: rgba(255,255,255,.06) !important; }
[data-theme="dark"] .bed-group-name     { color: #fff !important; }
[data-theme="dark"] .bed-group-area     { background: #2a2a2a !important; color: rgba(255,255,255,.5) !important; }
[data-theme="dark"] .slot-row           { border-bottom-color: rgba(255,255,255,.06) !important; }
[data-theme="dark"] .slot-row:hover     { background: #242424 !important; }
[data-theme="dark"] .slot-date          { color: rgba(255,255,255,.4) !important; }
[data-theme="dark"] .slot-bed-name      { color: #fff !important; }
[data-theme="dark"] .slot-time-text     { color: rgba(255,255,255,.7) !important; }
[data-theme="dark"] .slot-amount        { color: #fff !important; }
[data-theme="dark"] .remove-btn         { color: rgba(255,255,255,.35) !important; }
[data-theme="dark"] .remove-btn:hover   { color: #ff6b6b !important; background: rgba(255,107,107,.1) !important; }
[data-theme="dark"] .summary-card       { background: #1a1a1a !important; border-color: rgba(255,255,255,.08) !important; }
[data-theme="dark"] .summary-label      { color: rgba(255,255,255,.65) !important; }
[data-theme="dark"] .summary-value      { color: #fff !important; }
[data-theme="dark"] .summary-divider    { border-color: rgba(255,255,255,.07) !important; }
[data-theme="dark"] .summary-total      { color: #3dacac !important; }
[data-theme="dark"] .summary-total-val  { color: #3dacac !important; }
[data-theme="dark"] .cart-empty         { background: #1a1a1a !important; border-color: rgba(255,255,255,.08) !important; }
[data-theme="dark"] .cart-empty-title   { color: #fff !important; }
[data-theme="dark"] .cart-empty-sub     { color: rgba(255,255,255,.4) !important; }
[data-theme="dark"] .cart-footer        { background: rgba(10,10,10,.97) !important; border-top-color: rgba(255,255,255,.08) !important; }
[data-theme="dark"] .cart-footer-total  { color: rgba(255,255,255,.65) !important; }
[data-theme="dark"] .cart-footer-amount { color: #3dacac !important; }

/* Steps bar (Cart + Checkout) */
[data-theme="dark"] .steps-bar         { background: #141414 !important; border-bottom-color: rgba(255,255,255,.08) !important; }
[data-theme="dark"] .step              { color: rgba(255,255,255,.35) !important; }
[data-theme="dark"] .step.done         { color: rgba(255,255,255,.55) !important; }
[data-theme="dark"] .step-dot          { background: #2a2a2a !important; color: rgba(255,255,255,.35) !important; }
[data-theme="dark"] .step.done .step-dot { background: #333 !important; color: rgba(255,255,255,.55) !important; }
[data-theme="dark"] .step.active       { color: #3dacac !important; }
[data-theme="dark"] .step.active .step-dot { background: linear-gradient(135deg, #3dacac, #0c6b6b) !important; color: #fff !important; box-shadow: 0 2px 8px rgba(61,172,172,.3) !important; }
[data-theme="dark"] .step-arrow        { color: rgba(255,255,255,.15) !important; }
[data-theme="dark"] .step-connector    { background: rgba(255,255,255,.1) !important; }

/* ==========================================================================
   CHECKOUT PAGE
   ========================================================================== */
[data-theme="dark"] .checkout-main        { background: #0d0d0d !important; }
[data-theme="dark"] .section-card         { background: #1a1a1a !important; border-color: rgba(255,255,255,.08) !important; }
[data-theme="dark"] .section-header       { background: #242424 !important; border-bottom-color: rgba(255,255,255,.06) !important; }
[data-theme="dark"] .section-header h2    { color: #fff !important; }
[data-theme="dark"] .section-body         { color: rgba(255,255,255,.8) !important; }
[data-theme="dark"] label                 { color: rgba(255,255,255,.7) !important; }
[data-theme="dark"] .form-control         { background: #242424 !important; border-color: rgba(255,255,255,.12) !important; color: #fff !important; }
[data-theme="dark"] .form-control::placeholder { color: rgba(255,255,255,.3) !important; }
[data-theme="dark"] .form-control:focus   { background: #2a2a2a !important; border-color: #3dacac !important; box-shadow: 0 0 0 3px rgba(61,172,172,.15) !important; }
[data-theme="dark"] textarea.form-control { background: #242424 !important; }
[data-theme="dark"] select.form-control   { background: #242424 !important; color: #fff !important; }
[data-theme="dark"] .payment-card         { background: #1e1e1e !important; border-color: rgba(255,255,255,.1) !important; }
[data-theme="dark"] .payment-card:has(input:checked) { background: rgba(61,172,172,.1) !important; border-color: #3dacac !important; }
[data-theme="dark"] .payment-card-title   { color: #fff !important; }
[data-theme="dark"] .payment-card-desc    { color: rgba(255,255,255,.5) !important; }
[data-theme="dark"] .policy-banner        { background: rgba(61,172,172,.08) !important; border-color: rgba(61,172,172,.22) !important; color: rgba(255,255,255,.75) !important; }
[data-theme="dark"] .sum-bed              { color: #fff !important; }
[data-theme="dark"] .sum-area             { color: rgba(255,255,255,.4) !important; }
[data-theme="dark"] .sum-time             { color: rgba(255,255,255,.6) !important; }
[data-theme="dark"] .sum-price            { color: #fff !important; }
[data-theme="dark"] .summary-total-label  { color: rgba(255,255,255,.65) !important; }
[data-theme="dark"] .summary-total-value  { color: #3dacac !important; }
[data-theme="dark"] .summary-item         { border-bottom-color: rgba(255,255,255,.06) !important; }
[data-theme="dark"] .summary-total-row    { border-top-color: rgba(255,255,255,.1) !important; }
[data-theme="dark"] .checkout-sidebar     { background: #1a1a1a !important; border-color: rgba(255,255,255,.08) !important; }
[data-theme="dark"] .conflict-banner      { background: rgba(255,107,107,.1) !important; border-color: rgba(255,107,107,.25) !important; color: #ff9999 !important; }

/* ==========================================================================
   _LAYOUT — Privacy page, etc.
   ========================================================================== */
[data-theme="dark"] .site-nav {
    background: rgba(10,10,10,.97) !important;
    border-bottom-color: rgba(255,255,255,.08) !important;
}
[data-theme="dark"] .site-nav-hotel-name { color: #fff !important; }
[data-theme="dark"] .site-nav-links a    { color: rgba(255,255,255,.7) !important; }
[data-theme="dark"] .site-nav-links a:hover { color: #fff !important; background: rgba(255,255,255,.08) !important; }
[data-theme="dark"] .site-footer         { background: #0a0a0a !important; border-top-color: rgba(255,255,255,.07) !important; color: rgba(255,255,255,.45) !important; }
[data-theme="dark"] .site-footer a       { color: #3dacac !important; }
[data-theme="dark"] .site-footer .footer-brand { color: #3dacac !important; }

/* Mobile Offcanvas Nav */
[data-theme="dark"] .mobile-offcanvas,
[data-theme="dark"] .mobile-offcanvas .offcanvas-body {
    background: #1a1a1a !important;
}
[data-theme="dark"] .mobile-nav-item {
    color: #e5e7eb !important;
}
[data-theme="dark"] .mobile-nav-item:hover,
[data-theme="dark"] .mobile-nav-item:focus {
    background: rgba(61,172,172,.12) !important;
    color: #4bc3c4 !important;
}
[data-theme="dark"] .mobile-nav-item .nav-icon {
    background: rgba(61,172,172,.15) !important;
    color: #4bc3c4 !important;
}
[data-theme="dark"] .mobile-nav-item:hover .nav-icon {
    background: rgba(61,172,172,.25) !important;
}
[data-theme="dark"] .mobile-nav-item .nav-arrow {
    color: rgba(255,255,255,.25) !important;
}
[data-theme="dark"] .mobile-nav-divider {
    background: rgba(255,255,255,.07) !important;
}

/* Privacy / content pages that use _Layout */
[data-theme="dark"] .container           { color: rgba(255,255,255,.85) !important; }
[data-theme="dark"] h1, [data-theme="dark"] h2,
[data-theme="dark"] h3, [data-theme="dark"] h4 { color: #fff !important; }
[data-theme="dark"] p                    { color: rgba(255,255,255,.75) !important; }