/* ============================================================
   EBO Stay — mobile bottom nav (OYO-style)
   PHONE ONLY. Desktop is intentionally untouched:
   the bar is display:none by default and only appears
   at <=900px, the same breakpoint where the hamburger
   menu takes over from the desktop nav.
   ============================================================ */
.ebo-bottom-nav {
    display: none !important;
}

/* Wordmark next to logo: hidden everywhere by default (desktop untouched) */
.ebo-wordmark {
    display: none !important;
}

/* Desktop: force-hide no matter what overrides exist */
@media (min-width: 901px) {
    .ebo-bottom-nav,
    .ebo-m-home,
    .ebo-m-h1 {
        display: none !important;
    }
}

@media (max-width: 900px) {
    /* Keep footer copyright visible above the fixed bar */
    body {
        padding-bottom: calc(70px + env(safe-area-inset-bottom));
    }

    .ebo-bottom-nav {
        display: flex !important;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 900; /* below slide-in panel (1000) + backdrop (999), above page */
        background: #fff;
        border-top: 1px solid #E5EAF1;
        box-shadow: 0 -6px 24px rgba(15, 23, 42, 0.10);
        padding: 6px 4px calc(6px + env(safe-area-inset-bottom));
        margin: 0;
    }

    .ebo-bottom-nav a {
        flex: 1 1 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 3px;
        min-width: 0;
        min-height: 52px;
        padding: 6px 1px;
        border-radius: 10px;
        text-decoration: none;
        color: #7C8AA0;
        font-family: 'Inter', system-ui, sans-serif;
        font-size: 9px;
        font-weight: 600;
        line-height: 1.2;
        white-space: nowrap;
    }

    .ebo-bottom-nav a svg {
        width: 22px;
        height: 22px;
        flex-shrink: 0;
    }

    .ebo-bottom-nav a.ebo-bn-active {
        color: var(--primary, #F97316);
    }

    .ebo-bottom-nav a:active {
        background: #FFF4EC;
    }

    /* Lift floating elements above the bottom bar on phones */
    .wa-float {
        bottom: calc(84px + env(safe-area-inset-bottom)) !important;
    }

    .compare-bar {
        bottom: calc(78px + env(safe-area-inset-bottom)) !important;
    }

    /* Sticky Book Now / Enquire bar (activity, hotel & package pages):
       lift it above the bottom nav so it is never hidden behind it */
    .mobile-sticky-cta {
        bottom: calc(70px + env(safe-area-inset-bottom)) !important;
    }
}

/* Mobile usability pass: compact, touch-friendly booking UI. */
@media (max-width: 600px) {
    html { scroll-padding-bottom: calc(86px + env(safe-area-inset-bottom)); }
    body { padding-bottom: calc(82px + env(safe-area-inset-bottom)); overflow-x: hidden; }
    .ebo-bottom-nav { padding: 7px 3px calc(7px + env(safe-area-inset-bottom)); border-radius: 18px 18px 0 0; }
    .ebo-bottom-nav a { min-height: 54px; font-size: 9px; gap: 4px; }
    .ebo-bottom-nav a svg { width: 21px; height: 21px; }
    .ebo-bottom-nav a.ebo-bn-active { background: color-mix(in srgb, var(--primary, #F97316) 12%, transparent); border-radius: 12px; }
    .hero { min-height: auto !important; padding: 76px 0 42px !important; background-attachment: scroll !important; }
    .hero-search { width: calc(100% - 4px) !important; padding: 7px !important; margin-bottom: 18px !important; }
    .hs-field { min-height: 58px; padding: 11px 12px !important; }
    .hs-field input, .hs-field select, .hs-date-display { font-size: 14px !important; min-height: 30px; }
    .hs-submit { min-height: 52px; padding: 14px 18px !important; font-size: 15px !important; }
    .hero-trust-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; width: 100%; }
    .hero-trust-item { justify-content: center; gap: 5px; font-size: 10px; text-align: left; }
    .hero-trust-item svg { width: 17px; height: 17px; }
    .section { padding: 42px 0 !important; }
    .section-header { margin-bottom: 24px !important; padding: 0 4px; }
    .section-header h1, .section-header h2 { font-size: 24px !important; line-height: 1.2; }
    .section-header p { font-size: 14px !important; line-height: 1.55; }
    .card, .pkg-card, .hotel-card, .item-card { border-radius: 16px !important; }
    .card-footer-btns, .package-actions, .hotel-actions { gap: 8px !important; }
    .card-footer-btns .btn, .package-actions .btn, .hotel-actions .btn { min-height: 44px; font-size: 13px; }
    footer { margin-top: 48px !important; padding: 42px 0 20px !important; }
    footer .container { gap: 22px !important; }
    footer ul li { padding: 5px 0 !important; }
    .wa-float { bottom: calc(94px + env(safe-area-inset-bottom)) !important; right: 14px !important; width: 50px !important; height: 50px !important; }
}

/* ============================================================
   Mobile-only homepage (OYO-style). Desktop hidden.
   ============================================================ */
.ebo-m-home {
    display: none;
}

@media (max-width: 900px) {
    /* (homepage search card handled in the scoped body.v2-home block below) */

    /* Quick tiles strip */
    .ebo-m-home {
        display: block !important;
        padding: 2px 16px 10px;
    }

    .ebo-m-tiles-title {
        font-family: 'Poppins', system-ui, sans-serif;
        font-size: 15px;
        font-weight: 700;
        color: #0F172A;
        margin: 14px 2px 10px;
    }

    .ebo-m-tiles {
        display: flex;
        gap: 14px;
        overflow-x: auto;
        padding: 2px 2px 10px;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x mandatory;
        align-items: flex-start;
    }

    .ebo-m-tiles::-webkit-scrollbar {
        display: none;
    }

    .ebo-m-tile {
        flex: 0 0 auto;
        width: 70px;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 6px;
        text-decoration: none;
        color: #0F172A;
        font-size: 11px;
        font-weight: 600;
        text-align: center;
    }

    .ebo-m-tile-ic {
        width: 56px;
        height: 56px;
        border-radius: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 26px;
        background: #FFF4EC;
        border: 1px solid #F5E3D3;
    }

    .ebo-m-dest {
        flex: 0 0 auto;
        width: 78px;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 7px;
        text-decoration: none;
        color: #0F172A;
        font-size: 11px;
        font-weight: 600;
        text-align: center;
        scroll-snap-align: start;
    }

    .ebo-m-dest img {
        width: 68px !important;
        height: 68px !important;
        aspect-ratio: 1 / 1;
        border-radius: 50% !important;
        object-fit: cover;
        display: block;
        flex-shrink: 0;
        background: #E2E8F0;
        border: 1px solid #EDF2F7;
    }

    /* ===== Mobile-only OYO heading (hidden on desktop via base rule) ===== */
    .ebo-m-h1 {
        display: block !important;
        font-family: 'Poppins', system-ui, sans-serif;
        font-size: 21px;
        font-weight: 700;
        letter-spacing: -0.01em;
        color: #0F172A;
        text-align: left;
        margin: 2px 2px 12px;
    }

    /* ===== Homepage premium look (body.v2-home only, phone only) ===== */
    /* Kill decor blobs + dark overlay that muddy the light hero */
    body.v2-home::before,
    body.v2-home::after,
    body.v2-home .hero::after {
        display: none !important;
    }
    body.v2-home .ebo-header {
        background: #fff !important;
        border-bottom: 1px solid #EDF2F7 !important;
    }

    body.v2-home .ebo-header-inner {
        position: relative !important;
        justify-content: flex-start !important;
    }

    body.v2-home .logo {
        display: inline-flex !important;
        align-items: center !important;
        gap: 9px !important;
        text-decoration: none !important;
    }

    body.v2-home .ebo-wordmark {
        display: inline-block !important;
        font-family: 'Poppins', system-ui, sans-serif !important;
        font-size: 17px !important;
        font-weight: 800 !important;
        letter-spacing: 0.06em !important;
        color: #F97316 !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }

    body.v2-home .ebo-wordmark b {
        font-weight: 800 !important;
        color: #0F172A !important;
    }

    body.v2-home .logo img {
        height: 38px !important;
        width: 38px !important;
        border-radius: 10px !important;
    }

    body.v2-home .ebo-mobile-actions {
        position: absolute !important;
        right: 16px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        margin-left: 0 !important;
    }

    body.v2-home .ebo-mobile-account-btn,
    body.v2-home .ebo-hamburger {
        background: #F1F5F9 !important;
        border-color: #E2E8F0 !important;
        color: #0F172A !important;
    }

    body.v2-home .ebo-hamburger span {
        background: #0F172A !important;
    }

    body.v2-home .hero {
        background: linear-gradient(180deg, #FFF6EE 0%, #FFFFFF 92%) !important;
        padding-top: 16px !important;
        padding-bottom: 30px !important;
    }

    body.v2-home .hero-badge,
    body.v2-home .hero h1,
    body.v2-home .hero .container > p,
    body.v2-home .hero-trust-row,
    body.v2-home .hero-stats-bar {
        display: none !important;
    }

    /* Compact 2-col search card: destination full row,
       check-in | check-out side by side, guests + button full width */
    body.v2-home .hero-search {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 0 !important;
        background: #fff !important;
        border: 1px solid #ECEEF3 !important;
        border-radius: 22px !important;
        box-shadow: 0 16px 40px rgba(15, 23, 42, 0.12) !important;
        padding: 6px !important;
        overflow: visible !important;
    }

    body.v2-home .hs-field {
        border: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        min-height: 0 !important;
        padding: 10px 12px !important;
        margin: 0 !important;
    }

    body.v2-home .hs-field-main {
        grid-column: 1 / -1 !important;
        border-bottom: 1px solid #F1F2F6 !important;
        padding: 12px !important;
    }

    body.v2-home .hs-field-date {
        min-width: 0 !important;
    }

    body.v2-home #hsCheckinWrap {
        border-right: 1px solid #F1F2F6 !important;
    }

    body.v2-home .hs-field-guests {
        grid-column: 1 / -1 !important;
        border-top: 1px solid #F1F2F6 !important;
    }

    body.v2-home .hs-label {
        font-size: 10px !important;
        letter-spacing: 0.08em !important;
        color: #94A3B8 !important;
        margin-bottom: 2px !important;
    }

    body.v2-home .hs-date-display,
    body.v2-home .hs-guests-display {
        font-size: 14px !important;
        font-weight: 700 !important;
        color: #0F172A !important;
        min-height: 0 !important;
        padding: 2px 0 !important;
    }

    body.v2-home .hs-field-main input {
        font-size: 14px !important;
        font-weight: 500 !important;
        color: #0F172A !important;
    }

    body.v2-home .hs-field-main input::placeholder {
        color: #94A3B8 !important;
        font-weight: 500 !important;
    }

    body.v2-home .hs-icon {
        width: 19px !important;
        height: 19px !important;
        color: #F97316 !important;
    }

    body.v2-home .hs-field .hs-icon-right {
        width: 30px !important;
        height: 30px !important;
        border-radius: 9px !important;
        background: #FFF3E8 !important;
    }

    body.v2-home .hero-search .hs-submit {
        grid-column: 1 / -1 !important;
        width: 100% !important;
        height: 50px !important;
        border: none !important;
        border-radius: 15px !important;
        background: linear-gradient(135deg, #FF8A1E 0%, #F9530B 100%) !important;
        color: #fff !important;
        font-size: 16px !important;
        font-weight: 700 !important;
        letter-spacing: 0.01em !important;
        box-shadow: 0 10px 22px rgba(249, 83, 11, 0.35) !important;
        margin-top: 6px !important;
    }
}