﻿/*
 * pricing-luxury.css
 * Luxury theme overrides for the enhanced tour pricing UI.
 * Palette: Gold #C9A84C · Navy #0D1B2A · Ivory #FDFCF9 · Silver #E4E8ED · Charcoal #1E2A38
 * Fonts  : 'Playfair Display' (headings) · 'Inter' (body)
 * All JS, PHP, and form-submission logic is untouched — CSS/HTML presentation only.
 */

/* ─── Google Fonts ─────────────────────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700&family=Inter:wght@300;400;500;600;700&display=swap');

/* ─── Custom Properties ─────────────────────────────────────────────────────── */
:root {
    --lux-gold:          #C9A84C;
    --lux-gold-light:    rgba(201, 168, 76, 0.15);
    --lux-gold-mid:      rgba(201, 168, 76, 0.35);
    --lux-navy:          #0D1B2A;
    --lux-navy-light:    rgba(13, 27, 42, 0.06);
    --lux-ivory:         #FDFCF9;
    --lux-silver:        #E4E8ED;
    --lux-charcoal:      #1E2A38;
    --lux-shadow:        0 4px 12px rgba(13, 27, 42, 0.10);
    --lux-shadow-lg:     0 8px 28px rgba(13, 27, 42, 0.14);
    --lux-radius:        14px;
    --lux-radius-sm:     8px;
}

/* ─── Section wrapper ───────────────────────────────────────────────────────── */
.enhanced-pricing-section {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    background: var(--lux-ivory);
    color: var(--lux-charcoal);
}

.enhanced-pricing-section h1,
.enhanced-pricing-section h2,
.enhanced-pricing-section h3,
.enhanced-pricing-section h4,
.enhanced-pricing-section h5,
.enhanced-pricing-section .setting-title h3,
.enhanced-pricing-section .package-title {
    font-family: 'Playfair Display', Georgia, serif;
    color: var(--lux-navy);
}

/* ─── Outer container ───────────────────────────────────────────────────────── */
.enhanced-pricing-section .pricing-outer-container {
    background: var(--lux-ivory);
    border: 1px solid var(--lux-silver);
    border-radius: var(--lux-radius);
    box-shadow: var(--lux-shadow);
}

/* ─── Accordion panels ──────────────────────────────────────────────────────── */
.enhanced-pricing-section .panel {
    background: #ffffff;
    border: 1px solid var(--lux-silver);
    border-radius: var(--lux-radius);
    box-shadow: var(--lux-shadow);
    margin-bottom: 12px;
    overflow: hidden;
    transition: box-shadow 0.25s ease, border-color 0.25s ease;
}

.enhanced-pricing-section .panel:hover {
    border-color: var(--lux-gold);
    box-shadow: var(--lux-shadow-lg);
}

/* Active / open panel */
.enhanced-pricing-section .panel.active {
    border-color: var(--lux-gold);
    box-shadow: 0 6px 24px rgba(201, 168, 76, 0.18), var(--lux-shadow);
    background: #ffffff;
}

.enhanced-pricing-section .panel.active::before {
    background: var(--lux-gold);
}

/* Selected package highlight */
.enhanced-pricing-section .panel.package-selected {
    border-color: var(--lux-gold);
    background: rgba(201, 168, 76, 0.04);
    box-shadow: 0 8px 28px rgba(201, 168, 76, 0.22);
}

/* ─── Accordion header (setting-title) ─────────────────────────────────────── */
.enhanced-pricing-section .panel .setting-title {
    background: var(--lux-navy);
    color: var(--lux-gold);
    padding: 18px 22px;
    cursor: pointer;
    user-select: none;
    border: none;
    transition: background 0.2s ease;
}

.enhanced-pricing-section .panel .setting-title:hover {
    background: #162336;
}

.enhanced-pricing-section .panel.active .setting-title {
    background: var(--lux-navy);
    border-bottom: 2px solid var(--lux-gold);
}

.enhanced-pricing-section .panel .setting-title h3 {
    color: var(--lux-gold);
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 17px;
    font-weight: 600;
    margin: 0;
    letter-spacing: 0.01em;
}

.enhanced-pricing-section .panel .setting-title i.fa {
    color: var(--lux-gold);
    filter: none;
}

/* Chevron arrow */
.enhanced-pricing-section .panel .accordion-arrow {
    color: var(--lux-gold);
    filter: none;
}

.enhanced-pricing-section .panel.active .accordion-arrow {
    color: var(--lux-gold);
    transform: rotate(180deg);
}

/* ─── Accordion header (pricing-accordion-header — inline style override) ──── */
/* These headers use inline styles; we use specificity to win without !important */
.enhanced-pricing-section .pricing-accordion-header {
    background: var(--lux-navy);
    color: var(--lux-gold);
    border: 2px solid var(--lux-navy);
    padding: 18px 22px;
    cursor: pointer;
    user-select: none;
    transition: background 0.2s ease;
}

.enhanced-pricing-section .pricing-accordion-header:hover {
    background: #162336;
}

.enhanced-pricing-section .pricing-accordion-header h3,
.enhanced-pricing-section .pricing-accordion-header span {
    color: var(--lux-gold);
    font-family: 'Playfair Display', Georgia, serif;
}

.enhanced-pricing-section .pricing-accordion-header i.fa {
    color: var(--lux-gold);
}

.enhanced-pricing-section .pricing-accordion-header .accordion-chevron {
    color: var(--lux-gold);
}

/* Recommended badge inside header */
.enhanced-pricing-section .pricing-accordion-header span[style*="rgba(255, 255, 255, 0.2)"],
.enhanced-pricing-section .panel .setting-title span[style*="rgba(255, 255, 255, 0.2)"] {
    background: var(--lux-gold) !important;
    color: var(--lux-navy) !important;
    font-weight: 700;
    border-radius: 20px;
    padding: 3px 10px;
    font-size: 11px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

/* Structure-key tag chips inside header */
.enhanced-pricing-section .pricing-accordion-header span[style*="rgba(255, 255, 255, 0.15)"] {
    background: rgba(201, 168, 76, 0.18) !important;
    color: var(--lux-gold) !important;
    border: 1px solid rgba(201, 168, 76, 0.35);
}

/* ─── Accordion content area ────────────────────────────────────────────────── */
.enhanced-pricing-section .pricing-accordion-content,
.enhanced-pricing-section .panel .setting-content {
    background: #ffffff;
    padding: 24px;
}

/* ─── Progress indicator — 3-step booking flow ──────────────────────────────── */
.lux-booking-steps {
    display: flex;
    align-items: center;
    gap: 0;
    margin-bottom: 24px;
    padding: 16px 20px;
    background: var(--lux-ivory);
    border: 1px solid var(--lux-silver);
    border-radius: var(--lux-radius-sm);
}

.lux-step {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
    position: relative;
}

.lux-step:not(:last-child)::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    height: 2px;
    background: var(--lux-silver);
    z-index: 0;
    left: 50%;
}

.lux-step-num {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--lux-gold);
    color: var(--lux-navy);
    font-weight: 700;
    font-size: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    z-index: 1;
    box-shadow: 0 2px 8px rgba(201, 168, 76, 0.35);
}

.lux-step-label {
    font-size: 12px;
    font-weight: 500;
    color: var(--lux-charcoal);
    white-space: nowrap;
}

.lux-step.completed .lux-step-num {
    background: var(--lux-navy);
    color: var(--lux-gold);
}

.lux-step.active .lux-step-num {
    background: var(--lux-gold);
    color: var(--lux-navy);
    box-shadow: 0 0 0 4px rgba(201, 168, 76, 0.25);
}

/* ─── Step numbers (①②③ circles) ───────────────────────────────────────────── */
.step-number,
.enhanced-pricing-section .step-number {
    background: var(--lux-gold) !important;
    color: var(--lux-navy) !important;
    box-shadow: 0 3px 10px rgba(201, 168, 76, 0.35) !important;
}

/* ─── "Select This Package" / "Book" buttons ────────────────────────────────── */
.fixed-select-package-btn,
.select-package-btn,
.select-occupancy-package-btn,
.package-button,
.enhanced-pricing-section button[onclick*="selectFixedPricePackage"],
.enhanced-pricing-section button[onclick*="selectPricingPackage"],
.enhanced-pricing-section .btn-select-package {
    background: var(--lux-gold) !important;
    color: var(--lux-navy) !important;
    border: none !important;
    border-radius: var(--lux-radius-sm) !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: 0.02em !important;
    box-shadow: 0 4px 14px rgba(201, 168, 76, 0.35) !important;
    transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease !important;
}

.fixed-select-package-btn:hover,
.select-package-btn:hover,
.select-occupancy-package-btn:not(:disabled):hover,
.package-button:hover {
    background: #b8943e !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(201, 168, 76, 0.45) !important;
    color: var(--lux-navy) !important;
}

.fixed-select-package-btn:active,
.select-package-btn:active,
.select-occupancy-package-btn:active {
    transform: translateY(0) !important;
}

/* ─── Price display — prominent Playfair Display ────────────────────────────── */
.enhanced-pricing-section .package-price,
.enhanced-pricing-section [id*="summary-total-price"],
.enhanced-pricing-section [id*="total-amount"],
.enhanced-pricing-section .price-amount,
.enhanced-pricing-section .gold-accent {
    font-family: 'Playfair Display', Georgia, serif !important;
    color: var(--lux-gold) !important;
    font-weight: 700 !important;
    text-shadow: none !important;
}

/* Total price box inside fixed-price summary */
.enhanced-pricing-section [id*="summary-total-price"] {
    font-size: 26px !important;
}

/* ─── Price summary box ─────────────────────────────────────────────────────── */
.fixed-price-summary-wrapper,
.enhanced-pricing-section .booking-summary,
.enhanced-pricing-section #price-breakdown-container {
    background: var(--lux-ivory) !important;
    border: 1px solid var(--lux-silver) !important;
    border-radius: var(--lux-radius-sm) !important;
    box-shadow: var(--lux-shadow) !important;
}

/* Total price banner inside summary */
.fixed-price-summary-wrapper [style*="background: var(--main-color"],
.fixed-price-summary-wrapper [style*="background: var(--main-color,"] {
    background: var(--lux-navy) !important;
    border-radius: var(--lux-radius-sm) !important;
}

/* Summary heading */
.fixed-price-summary-wrapper h4 {
    font-family: 'Playfair Display', Georgia, serif;
    color: var(--lux-navy);
}

/* Icons inside summary */
.fixed-price-summary-wrapper i.fa {
    color: var(--lux-gold) !important;
}

/* ─── Season cards (Low / High / Peak) ──────────────────────────────────────── */
/* Tier-season header strip */
.tier-season-section {
    background: var(--lux-navy) !important;
    color: var(--lux-gold) !important;
}

/* Season badge chips */
.enhanced-pricing-section .season-badge,
.enhanced-pricing-section [class*="season-low"],
.enhanced-pricing-section [class*="season-high"],
.enhanced-pricing-section [class*="season-peak"] {
    border-radius: 20px;
    font-weight: 600;
    font-size: 11px;
    padding: 3px 10px;
    letter-spacing: 0.04em;
}

.enhanced-pricing-section .season-low,
.enhanced-pricing-section [data-season="low"] {
    background: rgba(201, 168, 76, 0.12);
    color: #8a6d1e;
    border: 1px solid rgba(201, 168, 76, 0.3);
}

.enhanced-pricing-section .season-high,
.enhanced-pricing-section [data-season="high"] {
    background: rgba(201, 168, 76, 0.25);
    color: #7a5e10;
    border: 1px solid rgba(201, 168, 76, 0.5);
}

.enhanced-pricing-section .season-peak,
.enhanced-pricing-section [data-season="peak"] {
    background: var(--lux-gold);
    color: var(--lux-navy);
    border: 1px solid var(--lux-gold);
}

/* ─── Tier chips (1 pax, 2-3 pax, etc.) ────────────────────────────────────── */
.enhanced-pricing-section .tier-chip,
.enhanced-pricing-section .group-size,
.tier-season-info .group-size {
    background: var(--lux-gold-light) !important;
    color: var(--lux-charcoal) !important;
    border: 1px solid var(--lux-gold-mid) !important;
    border-radius: 20px !important;
    font-weight: 600 !important;
}

.enhanced-pricing-section .tier-chip.active,
.enhanced-pricing-section .tier-chip:hover {
    background: var(--lux-gold) !important;
    color: var(--lux-navy) !important;
    border-color: var(--lux-gold) !important;
}

/* ─── Guest counter buttons (+/-) ───────────────────────────────────────────── */
.enhanced-pricing-section .counter-btn,
.enhanced-pricing-section .js-counter .button,
.enhanced-pricing-section .lux-btn,
.occupancy-tiers-booking-section .counter-btn {
    border: 2px solid var(--lux-gold) !important;
    color: var(--lux-gold) !important;
    background: #ffffff !important;
    border-radius: var(--lux-radius-sm) !important;
    transition: background 0.2s ease, color 0.2s ease !important;
}

.enhanced-pricing-section .counter-btn:hover,
.enhanced-pricing-section .js-counter .button:hover,
.enhanced-pricing-section .lux-btn:hover,
.occupancy-tiers-booking-section .counter-btn:hover {
    background: var(--lux-gold) !important;
    color: var(--lux-navy) !important;
    border-color: var(--lux-gold) !important;
    transform: scale(1.05) !important;
}

/* ─── Date picker inputs ────────────────────────────────────────────────────── */
.enhanced-pricing-section input[type="text"].form-control,
.enhanced-pricing-section input[type="date"].form-control,
.enhanced-pricing-section .fixed-date-picker input,
.enhanced-pricing-section .calendar-input-wrapper input,
.enhanced-pricing-section input.tour-start-date,
.enhanced-pricing-section #inline-date-picker {
    border: 2px solid var(--lux-silver) !important;
    border-radius: var(--lux-radius-sm) !important;
    background: var(--lux-ivory) !important;
    color: var(--lux-charcoal) !important;
    font-family: 'Inter', sans-serif !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

.enhanced-pricing-section input[type="text"].form-control:focus,
.enhanced-pricing-section input[type="date"].form-control:focus,
.enhanced-pricing-section .fixed-date-picker input:focus,
.enhanced-pricing-section input.tour-start-date:focus,
.enhanced-pricing-section #inline-date-picker:focus,
.enhanced-pricing-section #inline-date-picker:hover {
    border-color: var(--lux-gold) !important;
    box-shadow: 0 0 0 3px rgba(201, 168, 76, 0.18) !important;
    outline: none !important;
}

/* Daterangepicker calendar accent */
.daterangepicker td.active,
.daterangepicker td.active:hover {
    background-color: var(--lux-gold) !important;
    color: var(--lux-navy) !important;
}

.daterangepicker .drp-buttons .btn-primary {
    background: var(--lux-gold) !important;
    border-color: var(--lux-gold) !important;
    color: var(--lux-navy) !important;
    font-weight: 700 !important;
}

/* ─── Tables ─────────────────────────────────────────────────────────────────── */
.enhanced-pricing-section table thead th {
    background: var(--lux-navy) !important;
    color: var(--lux-gold) !important;
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    letter-spacing: 0.03em;
    border-bottom: 2px solid var(--lux-gold) !important;
}

.enhanced-pricing-section table tbody tr:hover td {
    background: var(--lux-gold-light) !important;
}

.enhanced-pricing-section .occupancy-table-desktop th {
    background: var(--lux-navy) !important;
    color: var(--lux-gold) !important;
}

/* ─── Pricing section hover cards ───────────────────────────────────────────── */
.enhanced-pricing-section .pricing-section:hover {
    box-shadow: 0 2px 10px rgba(201, 168, 76, 0.15) !important;
}

/* ─── Extra service items ────────────────────────────────────────────────────── */
.enhanced-pricing-section .extra-service-item.selected {
    border-color: var(--lux-gold) !important;
    background-color: var(--lux-gold-light) !important;
    box-shadow: 0 4px 14px rgba(201, 168, 76, 0.2) !important;
}

.enhanced-pricing-section .extra-service-item.selected .service-name {
    color: var(--lux-gold) !important;
}

/* ─── Group joining interactive panel ───────────────────────────────────────── */
.group-joining-interactive-panel {
    background: var(--lux-ivory) !important;
    border: 1px solid var(--lux-silver) !important;
    border-radius: var(--lux-radius) !important;
}

.group-joining-interactive-panel .panel-header {
    border-bottom-color: var(--lux-silver) !important;
}

.booking-step {
    background: #ffffff !important;
    border: 1px solid var(--lux-silver) !important;
    border-radius: var(--lux-radius-sm) !important;
    box-shadow: var(--lux-shadow) !important;
}

.step-header {
    border-bottom-color: var(--lux-silver) !important;
}

/* ─── Pricing summary section (occupancy tiers) ─────────────────────────────── */
.enhanced-pricing-section #pricing-summary-section,
.enhanced-pricing-section [id*="pricing-summary"] {
    background: var(--lux-ivory) !important;
    border: 1px solid var(--lux-silver) !important;
    border-radius: var(--lux-radius-sm) !important;
}

/* ─── Package card (generic) ────────────────────────────────────────────────── */
.enhanced-pricing-section .package-card {
    background: #ffffff;
    border: 1px solid var(--lux-silver);
    border-radius: var(--lux-radius);
    box-shadow: var(--lux-shadow);
}

.enhanced-pricing-section .package-card:hover {
    border-color: var(--lux-gold);
    box-shadow: var(--lux-shadow-lg);
}

.enhanced-pricing-section .package-card.popular {
    border-color: var(--lux-gold);
}

.enhanced-pricing-section .package-card.popular::before {
    background: var(--lux-gold);
    color: var(--lux-navy);
}

.enhanced-pricing-section .package-features li::before {
    color: var(--lux-gold);
}

/* ─── Pricing row hover ──────────────────────────────────────────────────────── */
.enhanced-pricing-section .pricing-row:hover {
    background: var(--lux-gold-light) !important;
}

/* ─── Mobile pricing card header strip ──────────────────────────────────────── */
.enhanced-pricing-section .mobile-pricing-card .tier-season-section {
    background: var(--lux-navy) !important;
}

/* ─── Lux counter (booking form counters) ───────────────────────────────────── */
.lux-counter:focus-within {
    border-color: var(--lux-gold) !important;
    box-shadow: 0 0 0 4px rgba(201, 168, 76, 0.15) !important;
}

.lux-btn:hover {
    border-color: var(--lux-gold) !important;
    color: var(--lux-gold) !important;
    box-shadow: 0 4px 12px rgba(201, 168, 76, 0.18) !important;
}

/* ─── Inline date picker modal ───────────────────────────────────────────────── */
.pricing-date-modal .modal-content {
    border-radius: var(--lux-radius) !important;
    box-shadow: var(--lux-shadow-lg) !important;
}

.pricing-date-modal .modal-header {
    border-bottom-color: var(--lux-silver) !important;
}

/* ─── Responsive tweaks ──────────────────────────────────────────────────────── */
@media (max-width: 768px) {
    .enhanced-pricing-section .pricing-accordion-header,
    .enhanced-pricing-section .panel .setting-title {
        padding: 14px 16px;
    }

    .enhanced-pricing-section .pricing-accordion-header h3,
    .enhanced-pricing-section .panel .setting-title h3 {
        font-size: 15px;
    }

    .enhanced-pricing-section .pricing-accordion-content,
    .enhanced-pricing-section .panel .setting-content {
        padding: 16px;
    }
}


/* ═══════════════════════════════════════════════════════════════════════════
   INLINE STYLE OVERRIDES
   The pricing components use inline style="..." with #667eea / rgba(102,126,234,...)
   These rules use !important to override those hardcoded values.
   ═══════════════════════════════════════════════════════════════════════════ */

/* Occupancy tiers booking section — override inline border/background */
.occupancy-tiers-booking-section {
    border-color: rgba(201,168,76,0.25) !important;
    background: linear-gradient(145deg,#ffffff 0%,#FDFCF9 100%) !important;
}

/* Top accent bar (the 3px strip at top of containers) */
.occupancy-tiers-booking-section > div[style*="height: 3px"],
.occupancy-tiers-booking-section > div[style*="height:3px"],
[style*="height: 3px"][style*="background: var(--main-color"] {
    background: var(--lux-gold) !important;
}

/* Fixed price booking combined container */
[style*="border: 1px solid rgba(var(--main-color-rgb"],
[style*="border: 2px solid rgba(var(--main-color-rgb"] {
    border-color: rgba(201,168,76,0.25) !important;
}

/* Inline backgrounds using main-color-rgb */
[style*="background: rgba(var(--main-color-rgb"] {
    background: rgba(201,168,76,0.06) !important;
}

/* Guest type section backgrounds */
.guest-type-section[style*="background:#f0fdf4"] {
    background: linear-gradient(135deg,rgba(201,168,76,0.08) 0%,rgba(201,168,76,0.04) 100%) !important;
    border-left-color: var(--lux-gold) !important;
}

.guest-type-section[style*="background:#fefce8"] {
    background: linear-gradient(135deg,rgba(13,27,42,0.04) 0%,rgba(13,27,42,0.02) 100%) !important;
    border-left-color: var(--lux-navy) !important;
}

/* Resident section label */
.guest-type-section[style*="background:#f0fdf4"] > div[style*="color:#065f46"] {
    color: var(--lux-charcoal) !important;
}

/* Non-resident section label */
.guest-type-section[style*="background:#fefce8"] > div[style*="color:#854d0e"] {
    color: var(--lux-charcoal) !important;
}

/* Total guests info box */
[id*="total-guests-info"] {
    background: var(--lux-ivory) !important;
    border: 1px solid var(--lux-silver) !important;
    border-radius: var(--lux-radius-sm) !important;
}

/* Tier feedback box */
[id*="tier-feedback"] {
    border-radius: var(--lux-radius-sm) !important;
    font-size: 13px !important;
}

/* Pricing summary section */
[id*="pricing-summary-"] {
    background: var(--lux-ivory) !important;
    border-radius: var(--lux-radius-sm) !important;
}

[id*="pricing-breakdown-"] {
    background: transparent !important;
}

/* Total amount display */
[id*="total-amount-"] {
    color: var(--lux-gold) !important;
    font-family: 'Playfair Display', Georgia, serif !important;
}

/* Pricing breakdown rows */
.enhanced-pricing-section .pricing-breakdown-row,
.enhanced-pricing-section [class*="breakdown-row"] {
    border-bottom: 1px solid var(--lux-silver) !important;
}

/* Section dividers inside booking containers */
.occupancy-tiers-booking-section hr,
.occupancy-tiers-booking-section [style*="height: 1px"],
.occupancy-tiers-booking-section [style*="height:1px"] {
    background: linear-gradient(90deg,transparent,rgba(201,168,76,0.25),transparent) !important;
    border: none !important;
}

/* Step number circles (inline style override) */
[style*="background: var(--main-color"][style*="border-radius: 50%"],
[style*="background:var(--main-color"][style*="border-radius:50%"] {
    background: var(--lux-gold) !important;
    color: var(--lux-navy) !important;
}

/* Select package button disabled state */
.select-occupancy-package-btn:disabled {
    background: var(--lux-silver) !important;
    color: var(--lux-charcoal) !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
}

/* ─── Tour detail page — section headings consistency ───────────────────────── */
/* Match the "Important Information", "Itinerary" heading style */
.tour-section h3,
.tour-section .text-22 {
    font-family: 'Playfair Display', Georgia, serif;
    color: var(--lux-navy);
    font-weight: 700;
}

/* Gold underline accent on section headings */
.tour-section h3::after,
.tour-section .text-22::after {
    content: '';
    display: block;
    width: 40px;
    height: 3px;
    background: var(--lux-gold);
    border-radius: 2px;
    margin-top: 8px;
}

/* Tour section card wrapper */
.tour-section .bg-white.rounded-4 {
    border: 1px solid var(--lux-silver) !important;
    box-shadow: 0 2px 16px rgba(13,27,42,0.06) !important;
}

/* ─── Fixed price inclusions/exclusions (inline style override) ─────────────── */
/* Green included box → gold/ivory */
[style*="background:#f0fdf4"][style*="border-left:4px solid"] {
    background: linear-gradient(160deg,#FBF7EC 0%,#F5EDD4 100%) !important;
    border-left-color: var(--lux-gold) !important;
}

/* Red excluded box → navy */
[style*="background:#fef2f2"][style*="border-left:4px solid"] {
    background: linear-gradient(160deg,#0D1B2A 0%,#1B2E45 100%) !important;
    border-left-color: var(--lux-gold) !important;
}

[style*="background:#fef2f2"] h6[style*="color:#991b1b"] {
    color: #ffffff !important;
}

[style*="background:#fef2f2"] li {
    color: rgba(255,255,255,0.88) !important;
}

/* ─── Occupancy tiers date picker ───────────────────────────────────────────── */
.occupancy-tiers-booking-section input[type="text"],
.occupancy-tiers-booking-section input[type="date"],
.occupancy-tiers-booking-section select {
    border: 2px solid var(--lux-silver) !important;
    border-radius: var(--lux-radius-sm) !important;
    background: var(--lux-ivory) !important;
    color: var(--lux-charcoal) !important;
}

.occupancy-tiers-booking-section input:focus,
.occupancy-tiers-booking-section select:focus {
    border-color: var(--lux-gold) !important;
    box-shadow: 0 0 0 3px rgba(201,168,76,0.18) !important;
    outline: none !important;
}

/* ─── sp-cards (seasonal pricing overview cards) ────────────────────────────── */
.sp-overview {
    background: var(--lux-ivory) !important;
    border: 1px solid var(--lux-silver) !important;
    border-radius: var(--lux-radius) !important;
}

.sp-overview-header {
    background: var(--lux-navy) !important;
    color: var(--lux-gold) !important;
    border-radius: var(--lux-radius-sm) var(--lux-radius-sm) 0 0 !important;
}

.sp-card {
    border: 1px solid var(--lux-silver) !important;
    border-radius: var(--lux-radius-sm) !important;
    background: #ffffff !important;
}

.sp-card-header {
    background: var(--lux-navy) !important;
    color: var(--lux-gold) !important;
    border-radius: var(--lux-radius-sm) var(--lux-radius-sm) 0 0 !important;
}

/* ─── Group joining table ───────────────────────────────────────────────────── */
.gj-table-header {
    background: var(--lux-navy) !important;
    color: var(--lux-gold) !important;
}

.gj-table-row:hover {
    background: var(--lux-gold-light) !important;
}

.gj-table-row.selected {
    background: rgba(201,168,76,0.12) !important;
    border-left: 3px solid var(--lux-gold) !important;
}

.gj-price {
    color: var(--lux-gold) !important;
    font-family: 'Playfair Display', Georgia, serif !important;
    font-weight: 700 !important;
}

/* ─── Validity period info box ──────────────────────────────────────────────── */
[style*="background: rgba(var(--main-color-rgb"][style*="border-radius: 10px"] {
    background: rgba(201,168,76,0.08) !important;
    border: 1px solid rgba(201,168,76,0.2) !important;
}
