/**
 * BKD CSS Patch — fixes.css
 * Upload to: public/assets/css/fixes.css
 * Add AFTER style.css in main.php
 */

/* ── 1. HEADER OVERLAP FIX ─────────────────────────────────── */
.header-top-bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1001;
}
.site-header {
    position: fixed !important;
    top: 33px !important;
    left: 0;
    right: 0;
    z-index: 1000;
}
/* Scroll: hide topbar, header snaps to top via JS */
body > main {
    padding-top: 101px !important;
}

/* ── 2. CONTAINER FIX ──────────────────────────────────────── */
.bkd-container {
    max-width: 1240px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
    width: 100% !important;
}

/* ── 3. GRID — FORCE DISPLAY (Tailwind conflict fix) ──────── */
/* Stats bar */
.stats-bar {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
}
/* Pkg grid 4 */
.pkg-grid-4 {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 16px !important;
}
/* Hero grid */
.hero-grid {
    display: grid !important;
    grid-template-columns: 1fr 440px !important;
    gap: 56px !important;
    align-items: center !important;
}
/* Why grid */
.why-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 64px !important;
    align-items: center !important;
}
/* Reviews grid */
.reviews-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 18px !important;
}
/* Fleet grid */
.fleet-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 16px !important;
}
/* Dhams grid */
.dhams-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 14px !important;
}
/* Hotels grid */
.hotels-grid {
    display: grid !important;
    grid-template-columns: repeat(6, 1fr) !important;
    gap: 14px !important;
}
/* Nearby grid */
.nearby-grid {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 14px !important;
}
/* Cities grid */
.cities-grid {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 10px !important;
}
/* News grid */
.news-main-grid {
    display: grid !important;
    grid-template-columns: 1fr 380px !important;
    gap: 48px !important;
}
/* Helicopter featured */
.heli-feat {
    display: grid !important;
    grid-template-columns: 2fr 3fr !important;
}
/* Package page layout */
.pkg-layout {
    display: grid !important;
    grid-template-columns: 1fr 360px !important;
    gap: 28px !important;
    align-items: start !important;
}
/* Hero pkg grid (page hero) */
.hero-pkg-grid {
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    gap: 32px !important;
    align-items: start !important;
}
/* Form grids */
.form-grid-2 {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 14px !important;
}

/* ── 4. IMG FIX — prevent Tailwind resetting object-fit ───── */
.pkg-card-img img,
.fleet-img img,
.hotel-img img,
.nearby-img img,
.fleet-card .fleet-img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

/* ── 5. BOOKING FORM WIDTH FIX ─────────────────────────────── */
.booking-form-wrap {
    width: 100%;
}
.booking-form-wrap input,
.booking-form-wrap select,
.booking-form-wrap textarea {
    width: 100% !important;
}

/* ── 6. FOOTER GRID FIX ────────────────────────────────────── */
.footer-main .bkd-container > div {
    display: grid !important;
    grid-template-columns: 2.2fr 1fr 1fr 1fr 1.4fr !important;
    gap: 40px !important;
}

/* ── 7. SECTION SPACING FIX ────────────────────────────────── */
.section-pad  { padding: 80px 0 !important; }
.section-pad-sm { padding: 56px 0 !important; }

/* ── RESPONSIVE OVERRIDES ──────────────────────────────────── */
@media (max-width: 1200px) {
    .hotels-grid  { grid-template-columns: repeat(3, 1fr) !important; }
    .nearby-grid  { grid-template-columns: repeat(3, 1fr) !important; }
    .footer-main .bkd-container > div {
        grid-template-columns: 1fr 1fr 1fr !important;
    }
}
@media (max-width: 1024px) {
    .hero-grid    { grid-template-columns: 1fr !important; }
    .heli-feat    { grid-template-columns: 1fr !important; }
    .pkg-grid-4   { grid-template-columns: repeat(2, 1fr) !important; }
    .fleet-grid   { grid-template-columns: repeat(2, 1fr) !important; }
    .dhams-grid   { grid-template-columns: repeat(2, 1fr) !important; }
    .news-main-grid { grid-template-columns: 1fr !important; }
    .pkg-layout   { grid-template-columns: 1fr !important; }
    .hero-pkg-grid{ grid-template-columns: 1fr !important; }
    .stats-bar    { grid-template-columns: repeat(2, 1fr) !important; }
    .footer-main .bkd-container > div {
        grid-template-columns: 1fr 1fr !important;
    }
}
@media (max-width: 768px) {
    body > main   { padding-top: 60px !important; }
    .site-header  { top: 0 !important; }
    .header-top-bar { display: none !important; }
    .reviews-grid { grid-template-columns: 1fr !important; }
    .why-grid     { grid-template-columns: 1fr !important; }
    .pkg-grid-4   { grid-template-columns: 1fr !important; }
    .dhams-grid   { grid-template-columns: repeat(2, 1fr) !important; }
    .cities-grid  { grid-template-columns: repeat(2, 1fr) !important; }
    .nearby-grid  { grid-template-columns: repeat(2, 1fr) !important; }
    .hotels-grid  { grid-template-columns: repeat(2, 1fr) !important; }
    .fleet-grid   { grid-template-columns: repeat(2, 1fr) !important; }
    .form-grid-2  { grid-template-columns: 1fr !important; }
    .footer-main .bkd-container > div { grid-template-columns: 1fr !important; }
    .stats-bar    { grid-template-columns: 1fr 1fr !important; }
}