/* ================================================================ Awestruck — Popup v2 DARK MODE Load AFTER awestruck-popup-v2.css. Activated via: [data-bs-theme="dark"] on Matches awestruck-details-v2-dark.css variable scheme. ================================================================ */ [data-bs-theme="dark"] #experienceModal .exp-popup-v2, [data-bs-theme="dark"] .exp-popup-v2 { --ep-blue: #6f72ff; --ep-blue-2: #8a8dff; --ep-blue-soft: #1c1e3a; --ep-cream: #2a2218; --ep-yellow: #FFD153; --ep-yellow-d: #d9a000; --ep-green: #3ad57c; --ep-ink: #f2f2f2; --ep-gray: #9aa0a6; --ep-line: rgba(255,255,255,0.10); } /* ── Modal shell ─────────────────────────────────────────────── */ [data-bs-theme="dark"] .exp-popup-v2 .modal-content { background: #0c0c10; color: #f2f2f2; } /* ── Close button ────────────────────────────────────────────── */ [data-bs-theme="dark"] .exp-popup-v2 .exp-popup-close { background: #f2f2f2; color: #0c0c10; } /* ── Two-column layout card ─────────────────────────────────── */ [data-bs-theme="dark"] .exp-popup-v2 .ep-layout { background: #16161a; box-shadow: 0 24px 60px rgba(0,0,0,0.55); } /* ── Service Provider bar ────────────────────────────────────── */ [data-bs-theme="dark"] .exp-popup-v2 .ep-provider-bar { background: linear-gradient(90deg, #4547cc 0%, #5a5cdd 100%); } [data-bs-theme="dark"] .exp-popup-v2 .ep-duration-pill { background: #2a2a32; color: #f2f2f2; } /* ── Brand name ─────────────────────────────────────────────── */ [data-bs-theme="dark"] .exp-popup-v2 .ep-brand-name, [data-bs-theme="dark"] .exp-popup-v2 .package-title { color: #fff !important; } [data-bs-theme="dark"] .exp-popup-v2 .ep-mobile-title { color: #f2f2f2; } /* ── Tabs ────────────────────────────────────────────────────── */ [data-bs-theme="dark"] .exp-popup-v2 .ep-tab-btns { border-bottom-color: rgba(255,255,255,0.12); } [data-bs-theme="dark"] .exp-popup-v2 .ep-tab-btn { color: rgba(255,255,255,0.55); } [data-bs-theme="dark"] .exp-popup-v2 .ep-tab-btn.active { color: #fff; background: rgba(111,114,255,0.18); border-bottom-color: var(--ep-blue); } /* ── Description text ───────────────────────────────────────── */ [data-bs-theme="dark"] .exp-popup-v2 .ep-included-desc-text, [data-bs-theme="dark"] .exp-popup-v2 .ep-desc-full { color: rgba(255,255,255,0.75); } [data-bs-theme="dark"] .exp-popup-v2 .ep-read-more-btn { color: #8a8dff; } [data-bs-theme="dark"] .exp-popup-v2 .ep-cancel-text { color: rgba(255,255,255,0.5); } /* ── How to reach ───────────────────────────────────────────── */ [data-bs-theme="dark"] .exp-popup-v2 .ep-map-card { background: linear-gradient(135deg, #1a1f2e 0%, #0e1024 100%); border-color: rgba(255,255,255,0.08); background-image: linear-gradient(rgba(255,255,255,0.10) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.10) 1px, transparent 1px); background-size: 24px 24px; background-color: #0e1024; } [data-bs-theme="dark"] .exp-popup-v2 .ep-address-card { background: rgba(111,114,255,0.10); border-color: rgba(111,114,255,0.18); color: #f2f2f2; } [data-bs-theme="dark"] .exp-popup-v2 .ep-address-card b { color: #aab0ff; } [data-bs-theme="dark"] .exp-popup-v2 .ep-address-card .add { color: rgba(255,255,255,0.78); } [data-bs-theme="dark"] .exp-popup-v2 .ep-view-map-link { border-color: #6f72ff; color: #aab0ff; background: transparent; } [data-bs-theme="dark"] .exp-popup-v2 .ep-view-map-link:hover { background: #6f72ff; color: #fff; } /* ── FAQs ────────────────────────────────────────────────────── */ [data-bs-theme="dark"] .exp-popup-v2 .ep-faq-item { background: #1c1c22; border-color: rgba(255,255,255,0.10); } [data-bs-theme="dark"] .exp-popup-v2 .ep-faq-item.open { border-color: #6f72ff; box-shadow: 0 6px 18px rgba(111,114,255,0.15); } [data-bs-theme="dark"] .exp-popup-v2 .ep-q-num { background: rgba(111,114,255,0.18); color: #aab0ff; } [data-bs-theme="dark"] .exp-popup-v2 .ep-q-text { color: #f2f2f2; } [data-bs-theme="dark"] .exp-popup-v2 .ep-q-toggle { background: #f2f2f2; color: #0c0c10; } [data-bs-theme="dark"] .exp-popup-v2 .ep-faq-item:hover .ep-q-toggle, [data-bs-theme="dark"] .exp-popup-v2 .ep-faq-item.open .ep-q-toggle { background: #6f72ff; color: #fff; } [data-bs-theme="dark"] .exp-popup-v2 .ep-faq-answer { color: rgba(255,255,255,0.7); } [data-bs-theme="dark"] .exp-popup-v2 .ep-faq-more-btn { color: #aab0ff; border-color: rgba(111,114,255,0.55); } /* ── Booking card ────────────────────────────────────────────── */ [data-bs-theme="dark"] .exp-popup-v2 .ep-booking-card, [data-bs-theme="dark"] #experienceModal .booking-card { background: #2a2218 !important; } [data-bs-theme="dark"] .exp-popup-v2 .ep-book-title, [data-bs-theme="dark"] .exp-popup-v2 .book-title { color: #ffd87a !important; } /* ── Form fields ─────────────────────────────────────────────── */ [data-bs-theme="dark"] .exp-popup-v2 .ep-field, [data-bs-theme="dark"] .exp-popup-v2 .aw-field, [data-bs-theme="dark"] #experienceModal .aw-field { border-color: rgba(255,255,255,0.12) !important; } [data-bs-theme="dark"] #experienceModal .aw-field select, [data-bs-theme="dark"] .exp-popup-v2 .ep-field select, [data-bs-theme="dark"] .exp-popup-v2 .aw-field select{ background: transparent !important; border: none !important; color: #f2f2f2 !important; } [data-bs-theme="dark"] .exp-popup-v2 .ep-field label, [data-bs-theme="dark"] .exp-popup-v2 .aw-field label, [data-bs-theme="dark"] #experienceModal .aw-field label { color: rgba(255,255,255,0.65) !important; } [data-bs-theme="dark"] .exp-popup-v2 .ep-field input, [data-bs-theme="dark"] .exp-popup-v2 .aw-field input, [data-bs-theme="dark"] .exp-popup-v2 .ep-booking-card .quantity, [data-bs-theme="dark"] #experienceModal .aw-field input { background: #1c1c22 !important; border-color: rgba(255,255,255,0.12) !important; color: #f2f2f2 !important; } [data-bs-theme="dark"] .exp-popup-v2 .ep-field input::placeholder, [data-bs-theme="dark"] #experienceModal .aw-field input::placeholder { color: rgba(255,255,255,0.35) !important; } [data-bs-theme="dark"] .exp-popup-v2 .ep-field:focus-within, [data-bs-theme="dark"] #experienceModal .aw-field:focus-within { border-color: var(--ep-blue) !important; /* box-shadow: 0 0 0 4px rgba(111,114,255,0.20) !important; */ } /* Qty buttons */ [data-bs-theme="dark"] .exp-popup-v2 .ep-qty-row { background: #1c1c22; border-color: rgba(255,255,255,0.12); } [data-bs-theme="dark"] .exp-popup-v2 .ep-qty-btn, [data-bs-theme="dark"] .exp-popup-v2 .qty-minus, [data-bs-theme="dark"] .exp-popup-v2 .qty-plus { background: rgba(111,114,255,0.18) !important; color: #aab0ff !important; } [data-bs-theme="dark"] .exp-popup-v2 .ep-booking-card .qty-minus, [data-bs-theme="dark"] .exp-popup-v2 .ep-booking-card .qty-plus{ background:transparent !important; } /* ── Nice select dark ────────────────────────────────────────── */ [data-bs-theme="dark"] #experienceModal .nice-select { background: #1c1c22 !important; border-color: rgba(255,255,255,0.12) !important; color: #f2f2f2 !important; } [data-bs-theme="dark"] #experienceModal .nice-select .list { background: #1c1c22 !important; border-color: rgba(255,255,255,0.12) !important; } [data-bs-theme="dark"] #experienceModal .nice-select .option { color: #f2f2f2 !important; } [data-bs-theme="dark"] #experienceModal .nice-select .option:hover, [data-bs-theme="dark"] #experienceModal .nice-select .option.selected { background: rgba(111,114,255,0.18) !important; color: #fff !important; } /* ── Price breakup box ───────────────────────────────────────── */ [data-bs-theme="dark"] .exp-popup-v2 .ep-price-breakup { background: #1c1c22; border-color: rgba(255,255,255,0.10); } [data-bs-theme="dark"] .exp-popup-v2 .ep-pb-row { color: rgba(255,255,255,0.65); } [data-bs-theme="dark"] .exp-popup-v2 .ep-pb-total { color: #f2f2f2; } [data-bs-theme="dark"] .exp-popup-v2 .ep-pb-hr { border-color: rgba(255,255,255,0.10); } /* ── ep-price-bar (desktop) ─────────────────────────────────── */ /* Price bar is already dark (blue gradient), minimal changes needed */ [data-bs-theme="dark"] #experienceModal [data-bs-theme="dark"] .ep-field .ep-qty-control, [data-bs-theme="dark"] #experienceModal .ep-field .quantity, [data-bs-theme="dark"] .exp-popup-v2 .ep-booking-card .ep-qty-control, [data-bs-theme="dark"] .exp-popup-v2 .ep-booking-card .quantity { background: #1c1c22 !important; color: #f2f2f2 !important; border-color: rgba(255, 255, 255, 0.12) !important; outline: none; } [data-bs-theme="dark"] .qty-text, [data-bs-theme="dark"] #experienceModal .ep-field .ep-qty-control .ep-qty-val, [data-bs-theme="dark"] #experienceModal .ep-field .quantity .qty-text, [data-bs-theme="dark"] .exp-popup-v2 .ep-booking-card .qty-text, [data-bs-theme="dark"] .exp-popup-v2 .ep-booking-card .ep-qty-val { color: #f2f2f2 !important; } /* ── modal-booking mobile bar dark ─────────────────────────── */ [data-bs-theme="dark"] .modal-booking.ep-mobile-bar { background: #16161a !important; } [data-bs-theme="dark"] .modal-booking.ep-mobile-bar .price { color: #f2f2f2 !important; } /* ── aw-v2 extra sections (rails, reach, partner, footer) ─── */ [data-bs-theme="dark"] #experienceModal .aw-v2 { --aw-blue: #6f72ff; --aw-blue-2: #8a8dff; --aw-blue-soft: #1c1e3a; --aw-cream: #2a2218; --aw-peach-soft:#1a1410; --aw-sky-soft: #0e1024; --aw-green: #3ad57c; --aw-ink: #f2f2f2; --aw-gray: #9aa0a6; --aw-line: rgba(255,255,255,0.10); --aw-surface: #16161a; --aw-surface-2: #1c1c22; --aw-bg: #0c0c10; } /* Rail backgrounds */ [data-bs-theme="dark"] #experienceModal .rail-similar { background: #1a130f; } [data-bs-theme="dark"] #experienceModal .rail-discover { background: #0e1024; } [data-bs-theme="dark"] #experienceModal .exp-card-slot { background: rgba(255,255,255,0.03); border-color: rgba(255,255,255,0.12); color: rgba(255,255,255,0.45); } [data-bs-theme="dark"] #experienceModal .cat-chip { background: #1c1c22; color: #f2f2f2; border-color: rgba(255,255,255,0.12); } [data-bs-theme="dark"] #experienceModal .cat-chip.active { background: #f2f2f2; color: #0c0c10; border-color: #f2f2f2; } [data-bs-theme="dark"] #experienceModal .arrows button { background: #1c1c22; color: #f2f2f2; border-color: rgba(255,255,255,0.12); } [data-bs-theme="dark"] #experienceModal .arrows button:hover { background: #f2f2f2; color: #0c0c10; border-color: #f2f2f2; } [data-bs-theme="dark"] #experienceModal .rail-head h2, [data-bs-theme="dark"] #experienceModal .rail-head h3 { color: #f2f2f2; } [data-bs-theme="dark"] #experienceModal .rail-head .sub { color: #9aa0a6; } /* Reach section + forms */ [data-bs-theme="dark"] #experienceModal .reach-section { background: #08080c !important; border: 1px solid rgba(255,255,255,0.05) !important; } [data-bs-theme="dark"] #experienceModal .reach-section input, [data-bs-theme="dark"] #experienceModal .reach-section textarea, [data-bs-theme="dark"] #experienceModal .reach-section select { background: rgba(255,255,255,0.05) !important; border-color: rgba(255,255,255,0.15) !important; color: #f2f2f2 !important; } [data-bs-theme="dark"] #experienceModal .reach-section input::placeholder, [data-bs-theme="dark"] #experienceModal .reach-section textarea::placeholder { color: rgba(255,255,255,0.35) !important; } /* Trust strip sidebar */ [data-bs-theme="dark"] #experienceModal .trust-strip--sidebar { background: rgba(255,255,255,0.03) !important; border-color: rgba(255,255,255,0.08) !important; } [data-bs-theme="dark"] #experienceModal .trust-strip--sidebar .trust-title { color: #f2f2f2 !important; } [data-bs-theme="dark"] #experienceModal .trust-strip--sidebar .trust-sub, [data-bs-theme="dark"] #experienceModal .trust-strip--sidebar .trust-contacts a { color: rgba(255,255,255,0.55) !important; } /* Footer */ [data-bs-theme="dark"] #experienceModal .aw-footer { background: #050507 !important; border: 1px solid rgba(255,255,255,0.05) !important; } [data-bs-theme="dark"] #experienceModal .footer-copy { color: rgba(255,255,255,0.35) !important; } [data-bs-theme="dark"] #experienceModal .footer-nav a { color: rgba(255,255,255,0.55) !important; } [data-bs-theme="dark"] #experienceModal .footer-nav a:hover { color: #FFD153 !important; } /* Partner form */ [data-bs-theme="dark"] #experienceModal .lp-partner-section button { color: #0c0c10 !important; } /* App CTA already dark themed, minimal changes */ [data-bs-theme="dark"] #experienceModal .awd-app-cta__btn { background: #1c1c22 !important; color: #f2f2f2 !important; } [data-bs-theme="dark"] #experienceModal .awd-app-cta__btn strong { color: #f2f2f2; } [data-bs-theme="dark"] #experienceModal .awd-app-cta__btn small { color: rgba(255,255,255,0.5); } [data-bs-theme="dark"] .package-share .share-btn { color : #0c0c10 } /* =========== */ [data-bs-theme="dark"] #experienceModal .nice-select .current { color: #fff !important; } /* Hover option */ [data-bs-theme="dark"] #experienceModal .nice-select .option:hover, [data-bs-theme="dark"] #experienceModal .nice-select .option.focus, [data-bs-theme="dark"] #experienceModal .nice-select .option.selected.focus { background-color: var(--ep-yellow) !important; color: #222 !important; } /* Selected option */ [data-bs-theme="dark"] #experienceModal .nice-select .option.selected { background-color: var(--ep-yellow) !important; color: #222 !important; font-weight: 600 !important; } /* @media (max-width: 992px) { [data-bs-theme="dark"] .exp-popup-v2 .ep-field, [data-bs-theme="dark"] .exp-popup-v2 .aw-field, [data-bs-theme="dark"] #experienceModal .aw-field { background-color:black; } } */ [data-bs-theme="dark"] .exp-popup-v2 .ep-trust-title{ color:black !important; } /* =========== */ [data-bs-theme="dark"] #experienceModal .nice-select .current { color: #fff !important; } /* Hover option */ [data-bs-theme="dark"] #experienceModal .nice-select .option:hover, [data-bs-theme="dark"] #experienceModal .nice-select .option.focus, [data-bs-theme="dark"] #experienceModal .nice-select .option.selected.focus { background-color: var(--ep-yellow) !important; color: #222 !important; } /* Selected option */ [data-bs-theme="dark"] #experienceModal .nice-select .option.selected { background-color: var(--ep-yellow) !important; color: #222 !important; font-weight: 600 !important; } [data-bs-theme="dark"] .ep-trust-title{ color:#0c0c10 !important; }