/* =========================================================================
   Baniya Oasis — responsive.css
   Breakpoint overrides for tablet & mobile. Base styles are mobile-friendly;
   this file handles header collapse and the off-canvas mega menu.
   Designed to scale 320px → 2560px.
   ========================================================================= */

/* Ultra-wide: cap the readable line length but allow the grid to breathe. */
@media (min-width: 1800px) {
	:root { --bo-container: 1480px; }
}

/* ---------- Tablet & down ---------- */
@media (max-width: 1024px) {
	.bo-header__inner { grid-template-columns: auto 1fr auto; gap: 16px; }
	.bo-header__action-label { display: none; }
	.bo-header__action { padding: 10px; }
	.bo-nav__support { display: none; }
}

/* ---------- Mobile header & off-canvas mega menu ---------- */
@media (max-width:900px){

    .bo-mobile-toggle{
        display:flex;
    }

    .bo-header__inner{
        grid-template-columns:auto auto;
        grid-template-areas:
            "brand actions"
            "search search";
        row-gap:14px;
    }

    .bo-header__brand{
        grid-area:brand;
    }

    .bo-header__actions{
        grid-area:actions;
        justify-self:end;
    }

    .bo-header__search{
        grid-area:search;
        max-width:none;
    }

    /* Keep wrapper visible */
    .bo-nav{
        display:block;
        position:relative;
    }

    /* Hide desktop navigation only */
    .bo-primary-nav,
    .bo-nav__support,
    .bo-mega__toggle{
        display:none;
    }

    /* Mobile menu */
    #bo-mega-panel{

        position:fixed;
        top:0;
        left:0;

/*         width:320px; */
/*         max-width:85vw; */
/*         height:100vh; */

        background:#fff;
overflow: visible !important;
/*         overflow-y:auto; */

        transform:translateX(-100%);
        transition:transform .35s ease;

        display:block;

        z-index:99999;
    }

    body.bo-menu-open #bo-mega-panel{
        transform:translateX(0);
    }

    .bo-mega__panel{
        display:none;
        position:static;
        width:100%;
        padding-left:20px;
        box-shadow:none;
    }

    .bo-mega__item.is-expanded>.bo-mega__panel{
        display:block;
    }

}

/* ---------- Small phones ---------- */
@media (max-width: 600px) {
	.bo-section { padding-block: 44px; }
	.bo-section__head--row { flex-direction: column; align-items: flex-start; }
	.bo-logo__text { font-size: 1.1rem; }
	.bo-logo__mark { width: 38px; height: 38px; flex-basis: 38px; font-size: 1.25rem; }
	.bo-countdown__unit { min-width: 54px; padding: 10px; }
	.bo-countdown__num { font-size: 1.3rem; }
	.bo-footer__bottom-inner { flex-direction: column; align-items: flex-start; }
	.bo-cookie { flex-direction: column; align-items: flex-start; }
	.bo-whatsapp { width: 52px; height: 52px; bottom: 18px; right: 18px; }
	.bo-backtop { bottom: 80px; right: 18px; }
}

/* ---------- Very small (320px) safety ---------- */
@media (max-width: 360px) {
	.bo-container { padding-inline: 14px; }
	.bo-header__action-ico { font-size: 1.15rem; }
	.bo-btn { padding: 11px 18px; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}