@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Inter:wght@300;400;500;600;700;800&family=Outfit:wght@300;400;500;600;700;800;900&family=Playfair+Display:ital,wght@0,400..900;1,400..900&family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&family=Quicksand:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&family=Syne:wght@400;600;700;800&display=swap');

/* ==========================================================================
   GLOBAL THEMATIC CORRECTIONS & HEADER LAYOUT FIXES
   ========================================================================== */
@media (min-width: 1101px) {
    .header-flex {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        gap: 20px !important;
    }
    .site-nav {
        display: flex !important;
        gap: 12px !important;
        justify-content: center !important;
        flex-shrink: 1 !important;
    }
    .site-search {
        flex-shrink: 0 !important;
        margin-left: auto !important;
    }
}

/* ==========================================================================
   THEMATIC DESIGN LAYOUTS ENGINE (10 UNIQUE STRUCTURAL & VISUAL DESIGN OPTIONS)
   ========================================================================== */

/* --------------------------------------------------------------------------
   THEME 1: OCEAN Breeze (Modern Centered Alignment & Clean Grids)
   -------------------------------------------------------------------------- */
body.theme-1 {
    --primary-color: #0f3d5e;
    --primary-soft: #e8f6fb;
    --secondary-color: #071527;
    --body-bg: #F5F7FB;
    --text-color: #162033;
    font-family: 'Manrope', 'Poppins', sans-serif;
}

/* --------------------------------------------------------------------------
   THEME 2: ROYAL GOLD (Luxury Serif - Centered Header & Editorial Columns)
   -------------------------------------------------------------------------- */
body.theme-2 {
    --primary-color: #C5A059;
    --primary-soft: #FAF6EE;
    --secondary-color: #111B24;
    --body-bg: #FAF9F6;
    --text-color: #2D3748;
    font-family: 'Poppins', sans-serif;
}
body.theme-2 h1, body.theme-2 h2, body.theme-2 h3, 
body.theme-2 .main-logo, body.theme-2 .section-title, body.theme-2 .hero-inner h1 {
    font-family: 'Playfair Display', serif;
    font-weight: 700;
}
/* Header layout: Centered vertical stacked header */
body.theme-2 .site-header {
    background: #111B24;
    padding: 22px 0;
    border-bottom: 2px solid rgba(197, 160, 89, 0.3);
}
body.theme-2 .header-flex {
    flex-direction: column;
    align-items: center;
    gap: 15px;
}
body.theme-2 nav {
    justify-content: center;
    width: 100%;
    border-top: 1px solid rgba(197, 160, 89, 0.2);
    padding-top: 12px;
    gap: 24px;
}
body.theme-2 nav a {
    font-size: 13px;
    letter-spacing: 1px;
    text-transform: uppercase;
}
/* Hero: Centered Text layout & floating center search card */
body.theme-2 .hero-slider {
    background: linear-gradient(180deg, rgba(17,27,36,0.96) 0%, rgba(17,27,36,0.85) 60%, rgba(17,27,36,0.7) 100%), url('/uploads/media/site/hero/home-hero.jpg');
    background-size: cover;
    padding-top: 180px;
    min-height: 780px;
    display: flex;
    align-items: center;
}
body.theme-2 .hero-inner {
    flex-direction: column;
    text-align: center;
    align-items: center;
    width: 100%;
}
body.theme-2 .hero-text {
    max-width: 800px;
    margin-bottom: 40px;
}
body.theme-2 .search-box.hero-search-card {
    width: 100%;
    max-width: 980px;
    margin: 0 auto;
    border: 1px solid rgba(197, 160, 89, 0.3);
    padding: 30px;
}
/* Package Card: Fine gold outline editorial look */
body.theme-2 .package-b2b-card {
    border-radius: 8px;
    border: 1px solid rgba(197, 160, 89, 0.25);
    box-shadow: 0 16px 36px rgba(17, 27, 36, 0.04);
}
body.theme-2 .package-b2b-img-box {
    border-radius: 8px 8px 0 0;
}
body.theme-2 .package-b2b-content h3 {
    font-family: 'Playfair Display', serif;
    font-weight: 700;
}
/* Destination grid: Centered labels, static layout, no card flipping */
body.theme-2 .destination-card-container {
    perspective: none;
}
body.theme-2 .destination-card-inner {
    transform: none !important;
}
body.theme-2 .destination-card-back {
    display: none;
}
body.theme-2 .destination-overlay {
    background: linear-gradient(to top, rgba(17,27,36,0.95) 0%, rgba(17,27,36,0.3) 100%);
    font-family: 'Playfair Display', serif;
    font-size: 22px;
    font-weight: 700;
}

/* --------------------------------------------------------------------------
   THEME 3: FOREST RETREAT (Organic Earthy Layout & Staggered Masonry)
   -------------------------------------------------------------------------- */
body.theme-3 {
    --primary-color: #2D5A27;
    --primary-soft: #F0F5EE;
    --secondary-color: #1E351A;
    --body-bg: #F4F6F2;
    --text-color: #2E3B2C;
    font-family: 'Outfit', sans-serif;
}
/* Layout Roundedness: Dynamic curves */
body.theme-3 .package-b2b-card,
body.theme-3 .destination-card-container,
body.theme-3 .logo-icon,
body.theme-3 .inquiry-box,
body.theme-3 button,
body.theme-3 .btn-primary-custom,
body.theme-3 .search-box.hero-search-card,
body.theme-3 input,
body.theme-3 select,
body.theme-3 textarea {
    border-radius: 28px !important;
}
body.theme-3 .package-b2b-img-box {
    border-radius: 28px 28px 0 0;
}
body.theme-3 nav a {
    border-radius: 14px;
}
/* Staggered Masonry Grid Layout on Desktop */
@media (min-width: 992px) {
    body.theme-3 .package-b2b-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 30px;
    }
    body.theme-3 .package-b2b-grid > *:nth-child(even) {
        transform: translateY(24px);
    }
}
body.theme-3 .hero-slider {
    background: linear-gradient(90deg, rgba(30,53,26,0.92) 0%, rgba(30,53,26,0.65) 50%, rgba(30,53,26,0.3) 100%), url('/uploads/media/site/hero/home-hero.jpg');
}

/* --------------------------------------------------------------------------
   THEME 4: SUNSET GLOW (Warm Poster Card Overlay & Angled Sections)
   -------------------------------------------------------------------------- */
body.theme-4 {
    --primary-color: #E25C3E;
    --primary-soft: #FFF3F0;
    --secondary-color: #2B1612;
    --body-bg: #FCFAF9;
    --text-color: #382420;
    font-family: 'Plus Jakarta Sans', sans-serif;
}
/* Layout: Diagonal angled sections */
body.theme-4 .packages-section, 
body.theme-4 .destinations-section {
    clip-path: polygon(0 2%, 100% 0%, 100% 98%, 0% 100%);
    padding: 100px 0;
}
/* Package Card: Full Background Image Poster Card Layout */
body.theme-4 .package-b2b-card {
    position: relative;
    height: 490px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    border-radius: 20px;
    overflow: hidden;
    border: none;
    box-shadow: 0 10px 30px rgba(43,22,18,0.12);
    transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}
body.theme-4 .package-b2b-card:hover {
    transform: translateY(-8px) scale(1.015);
}
body.theme-4 .package-b2b-img-box {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}
body.theme-4 .package-b2b-img-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
body.theme-4 .package-b2b-content {
    position: relative;
    z-index: 2;
    background: linear-gradient(to top, rgba(43,22,18,0.98) 0%, rgba(43,22,18,0.7) 65%, transparent 100%);
    color: #FFFFFF;
    padding: 24px;
    padding-top: 140px;
}
body.theme-4 .package-b2b-content h3 {
    color: #FFFFFF;
}
body.theme-4 .package-b2b-tags span {
    color: rgba(255,255,255,0.85);
    background: rgba(255,255,255,0.15);
}
body.theme-4 .package-b2b-itinerary p {
    color: rgba(255,255,255,0.8);
}
body.theme-4 .package-b2b-amenities {
    border-top-color: rgba(255,255,255,0.15);
    border-bottom-color: rgba(255,255,255,0.15);
}
body.theme-4 .package-b2b-amenities span {
    color: rgba(255,255,255,0.9);
}
body.theme-4 .package-b2b-amenities i {
    color: var(--primary-color);
}
body.theme-4 .price-lbl, body.theme-4 .price-per {
    color: rgba(255,255,255,0.7);
}
body.theme-4 .price-amount {
    color: #FFF3F0;
}
body.theme-4 .b2b-btn-outline {
    border-color: rgba(255,255,255,0.4);
    color: #FFFFFF;
}
body.theme-4 .b2b-btn-outline:hover {
    background: rgba(255,255,255,0.2);
    border-color: #FFFFFF;
}

/* --------------------------------------------------------------------------
   THEME 5: MIDNIGHT CYBER (Futuristic HUD Dark Theme & Split Layout)
   -------------------------------------------------------------------------- */
body.theme-5 {
    --primary-color: #06B6D4;
    --primary-soft: rgba(6, 182, 212, 0.08);
    --secondary-color: #0F172A;
    --body-bg: #0B0F19;
    --text-color: #E2E8F0;
    font-family: 'Space Grotesk', sans-serif;
}
/* Dark layout overrides */
body.theme-5 .site-header.is-scrolled {
    background: #0B0F19 !important;
    border-bottom: 1px solid rgba(6, 182, 212, 0.2);
}
body.theme-5 .package-b2b-card,
body.theme-5 .why-card,
body.theme-5 .testimonial-card,
body.theme-5 .inquiry-box {
    background: #0F172A;
    border: 1px solid rgba(6, 182, 212, 0.15);
    color: #F1F5F9;
    box-shadow: 0 8px 32px rgba(0,0,0,0.4);
}
body.theme-5 .package-b2b-card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 0 15px rgba(6, 182, 212, 0.25);
}
body.theme-5 input, body.theme-5 select, body.theme-5 textarea {
    background: #1E293B !important;
    color: #FFFFFF !important;
    border: 1px solid rgba(255,255,255,0.15) !important;
}
/* Hero: Reversed split layout */
body.theme-5 .hero-inner {
    flex-direction: row-reverse;
}
@media (max-width: 991px) {
    body.theme-5 .hero-inner {
        flex-direction: column;
    }
}
/* Destination layout: HUD layout, static grid items, zero margins */
body.theme-5 .destination-card-container {
    perspective: none;
}
body.theme-5 .destination-card-inner {
    transform: none !important;
    border: 1px solid rgba(6, 182, 212, 0.2);
}
body.theme-5 .destination-card-back {
    display: none;
}
body.theme-5 .destination-overlay {
    background: rgba(11, 15, 25, 0.85);
    font-family: monospace;
    font-size: 16px;
    letter-spacing: 2px;
}

/* --------------------------------------------------------------------------
   THEME 6: GLASSMORPHISM (Frosted Floating Island Designs)
   -------------------------------------------------------------------------- */
body.theme-6 {
    --primary-color: #8B5CF6;
    --primary-soft: rgba(139, 92, 246, 0.08);
    --secondary-color: #1E1B4B;
    --body-bg: #F5F3FF;
    --text-color: #1E1B4B;
    font-family: 'Syne', sans-serif;
}
/* Layout Style: Frosted glass panels */
body.theme-6 .package-b2b-card,
body.theme-6 .why-card,
body.theme-6 .testimonial-card,
body.theme-6 .inquiry-box,
body.theme-6 .search-box.hero-search-card {
    background: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(255, 255, 255, 0.4);
    box-shadow: 0 12px 30px rgba(139, 92, 246, 0.04);
    border-radius: 20px;
}
body.theme-6 .package-b2b-img-box {
    border-radius: 20px 20px 0 0;
}
/* Floating margins layout */
body.theme-6 .site-header {
    background: rgba(255, 255, 255, 0.55);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.4);
}
body.theme-6 .search-box.hero-search-card {
    margin-top: -50px;
    z-index: 10;
    position: relative;
}

/* --------------------------------------------------------------------------
   THEME 7: VINTAGE NOMAD (Flat Scrapbook Style & Outline Borders)
   -------------------------------------------------------------------------- */
body.theme-7 {
    --primary-color: #8C6239;
    --primary-soft: #F5EFEB;
    --secondary-color: #4A3525;
    --body-bg: #FAF6F0;
    --text-color: #3D2D21;
    font-family: 'Playfair Display', serif;
}
body.theme-7 p, body.theme-7 a, body.theme-7 span, body.theme-7 input, body.theme-7 button, body.theme-7 select, body.theme-7 textarea {
    font-family: 'Courier New', Courier, monospace;
    font-weight: 600;
}
/* Layout elements: Flat hard borders & offset solid shadows */
body.theme-7 .package-b2b-card,
body.theme-7 .why-card,
body.theme-7 .testimonial-card,
body.theme-7 .inquiry-box,
body.theme-7 .destination-card-inner,
body.theme-7 .search-box.hero-search-card {
    border: 2px solid #8C6239 !important;
    background: #FFFFFF;
    box-shadow: 6px 6px 0px #8C6239 !important;
    border-radius: 4px !important;
}
body.theme-7 .package-b2b-card:hover {
    transform: translate(-3px, -3px);
    box-shadow: 9px 9px 0px #8C6239 !important;
}
body.theme-7 .btn, body.theme-7 button, body.theme-7 .btn-primary-custom, body.theme-7 .b2b-btn-solid {
    border: 2px solid #8C6239 !important;
    background: #FAF6F0 !important;
    color: #8C6239 !important;
    box-shadow: 4px 4px 0px #8C6239 !important;
    border-radius: 4px !important;
}
body.theme-7 .btn:hover, body.theme-7 button:hover, body.theme-7 .b2b-btn-solid:hover {
    transform: translate(-2px, -2px);
    box-shadow: 6px 6px 0px #8C6239 !important;
}
body.theme-7 .destination-card-back {
    background: #FAF6F0;
    border: 2px solid #8C6239;
}

/* --------------------------------------------------------------------------
   THEME 8: NORDIC MINIMAL (Chic Horizontal Lists & Raw Grid Layouts)
   -------------------------------------------------------------------------- */
body.theme-8 {
    --primary-color: #111111;
    --primary-soft: #F3F4F6;
    --secondary-color: #000000;
    --body-bg: #FFFFFF;
    --text-color: #2D3748;
    font-family: 'Inter', sans-serif;
}
/* Layout elements: Zero border-radius and shadows */
body.theme-8 .package-b2b-card,
body.theme-8 .why-card,
body.theme-8 .testimonial-card,
body.theme-8 .inquiry-box,
body.theme-8 .search-box.hero-search-card,
body.theme-8 .btn,
body.theme-8 button,
body.theme-8 input,
body.theme-8 select,
body.theme-8 textarea {
    border-radius: 0px !important;
    box-shadow: none !important;
    border: 1px solid #E2E8F0;
}
/* Package Card: Horizontal row list design instead of vertical card */
body.theme-8 .package-b2b-card {
    display: flex;
    flex-direction: row;
    width: 100%;
}
@media (max-width: 768px) {
    body.theme-8 .package-b2b-card {
        flex-direction: column;
    }
}
body.theme-8 .package-b2b-img-box {
    width: 32%;
    flex-shrink: 0;
    border-radius: 0 !important;
}
body.theme-8 .package-b2b-img-box img {
    height: 100%;
    object-fit: cover;
}
body.theme-8 .package-b2b-content {
    width: 68%;
    padding: 24px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
body.theme-8 .package-b2b-footer {
    border-top: 1px solid #F3F4F6;
    padding-top: 15px;
    margin-top: 10px;
}

/* --------------------------------------------------------------------------
   THEME 9: LAVENDER AESTHETIC (Approachably Curved & Pill Badges)
   -------------------------------------------------------------------------- */
body.theme-9 {
    --primary-color: #6366F1;
    --primary-soft: #EEF2FF;
    --secondary-color: #312E81;
    --body-bg: #FAF9FE;
    --text-color: #3C3B6E;
    font-family: 'Quicksand', sans-serif;
    font-weight: 500;
}
/* Layout elements: Pill borders & smooth elastic bounce */
body.theme-9 .package-b2b-card,
body.theme-9 .why-card,
body.theme-9 .testimonial-card,
body.theme-9 .inquiry-box,
body.theme-9 .search-box.hero-search-card,
body.theme-9 .btn,
body.theme-9 button,
body.theme-9 input,
body.theme-9 select,
body.theme-9 textarea {
    border-radius: 24px !important;
    box-shadow: 0 10px 30px rgba(99, 102, 241, 0.04);
}
body.theme-9 .package-b2b-card:hover {
    transform: scale(1.025) translateY(-5px);
    transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
body.theme-9 .package-b2b-img-box {
    border-radius: 24px 24px 0 0;
}
body.theme-9 .package-b2b-badge {
    border-radius: 100px;
    padding: 6px 14px;
}

/* --------------------------------------------------------------------------
   THEME 10: CRIMSON MODERN (Passionate Packed Collage Layout)
   -------------------------------------------------------------------------- */
body.theme-10 {
    --primary-color: #BE123C;
    --primary-soft: #FFF1F2;
    --secondary-color: #4C0519;
    --body-bg: #FCFAFB;
    --text-color: #1F2937;
    font-family: 'DM Sans', sans-serif;
}
/* Layout Elements: Zero gap collage style grid */
body.theme-10 .package-b2b-grid {
    gap: 0px !important;
    border: 1px solid #E5E7EB;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 12px 30px rgba(0,0,0,0.05);
}
body.theme-10 .package-b2b-card {
    border-radius: 0px !important;
    border: 1px solid #E5E7EB;
    margin: 0;
    box-shadow: none !important;
}
body.theme-10 .package-b2b-card:hover {
    transform: scale(1.005);
    background: #FFF1F2;
    z-index: 5;
}
body.theme-10 .package-b2b-card {
    border-left: 4px solid #BE123C;
}

/* ==========================================================================
   GLOBAL LAYOUT ENGINE ACCENTS
   ========================================================================== */
body[class*="theme-"] .nav-cta, 
body[class*="theme-"] nav a:last-child {
    background: var(--primary-color);
}
body[class*="theme-"] .logo-icon {
    background: var(--primary-color);
}
body[class*="theme-"] .site-nav a.active {
    background: var(--primary-color) !important;
}
body[class*="theme-"] .loader-text-brand {
    color: var(--primary-color);
}
