/* Masala Travel: compact mobile drawer, desktop/tablet unchanged. */
@media (max-width: 991px) {
    html,
    body {
        max-width: 100%;
        overflow-x: hidden;
    }

    body.masala-final-menu-open {
        overflow: hidden !important;
        touch-action: none;
    }

    #mobile-menu.mobile-menu-wrapper {
        position: fixed !important;
        z-index: 2147483000 !important;
        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        left: auto !important;
        width: min(88vw, 390px) !important;
        max-width: calc(100vw - 38px) !important;
        height: 100dvh !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: calc(15px + env(safe-area-inset-top)) 18px
            calc(10px + env(safe-area-inset-bottom)) !important;
        border: 0 !important;
        border-left: 0 !important;
        border-radius: 34px 0 0 34px !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
        background:
            linear-gradient(rgba(12, 40, 31, 0.86), rgba(12, 40, 31, 0.88)),
            var(--masala-mobile-menu-bg, url("/images/news/masalatravel-header-bg-user-india-goa-soft.webp"))
            center / cover no-repeat !important;
        box-shadow: -16px 0 40px rgba(0, 0, 0, 0.30) !important;
        backdrop-filter: blur(12px) !important;
        -webkit-backdrop-filter: blur(12px) !important;
        transform: translate3d(105%, 0, 0) !important;
        transition: transform 280ms ease !important;
    }

    #mobile-menu.mobile-menu-wrapper::before,
    #mobile-menu.mobile-menu-wrapper::after {
        display: none !important;
        content: none !important;
    }

    #mobile-menu[aria-hidden="false"],
    #mobile-menu.is-open,
    #mobile-menu.masala-menu-open,
    body.masala-final-menu-open #mobile-menu {
        transform: translate3d(0, 0, 0) !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    #mobile-menu .masala-mobile-menu-brand,
    #mobile-menu .masala-mobile-menu-brand-v2,
    #mobile-menu .mobile-menu-title,
    #mobile-menu .mobile-menu-subtitle {
        display: none !important;
    }

    #mobile-menu .mobile-menu.anchor-menu {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        height: 100% !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 58px 0 0 !important;
        overflow: hidden !important;
        background: none !important;
        box-sizing: border-box !important;
    }

    #mobile-menu .mobile-menu.anchor-menu > ul {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        grid-auto-rows: minmax(0, 1fr) !important;
        gap: 7px !important;
        width: 100% !important;
        min-height: 0 !important;
        max-height: 476px !important;
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
        flex: 1 1 auto !important;
    }

    #mobile-menu .mobile-menu.anchor-menu > ul > li {
        display: block !important;
        min-width: 0 !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
    }

    #mobile-menu a.nav-pill {
        display: grid !important;
        grid-template-columns: 34px minmax(0, 1fr) 12px !important;
        align-items: center !important;
        gap: 11px !important;
        width: 100% !important;
        height: 100% !important;
        min-height: 50px !important;
        margin: 0 !important;
        padding: 7px 15px !important;
        border: 1px solid rgba(141, 255, 164, 0.24) !important;
        border-radius: 17px !important;
        box-sizing: border-box !important;
        color: #fff !important;
        background: linear-gradient(135deg, rgba(48, 167, 79, 0.84), rgba(20, 120, 55, 0.88)) !important;
        box-shadow: 0 6px 14px rgba(0, 0, 0, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
        text-decoration: none !important;
        text-align: left !important;
        overflow: hidden !important;
    }

    #mobile-menu .masala-menu-icon {
        display: grid !important;
        place-items: center !important;
        width: 32px !important;
        height: 32px !important;
    }

    #mobile-menu .masala-menu-icon svg {
        width: 27px !important;
        height: 27px !important;
        fill: none !important;
        stroke: currentColor !important;
        stroke-width: 2 !important;
        stroke-linecap: round !important;
        stroke-linejoin: round !important;
    }

    #mobile-menu .masala-menu-label {
        min-width: 0 !important;
        font-size: clamp(14px, 4vw, 17px) !important;
        font-weight: 750 !important;
        line-height: 1.08 !important;
        letter-spacing: 0 !important;
        text-transform: uppercase !important;
        white-space: normal !important;
    }

    #mobile-menu .masala-menu-chevron {
        display: block !important;
        width: 10px !important;
        height: 18px !important;
    }

    #mobile-menu .masala-menu-chevron svg {
        display: block !important;
        width: 10px !important;
        height: 18px !important;
        fill: none !important;
        stroke: #fff !important;
        stroke-width: 2 !important;
    }

    #mobile-menu .masala-mobile-menu-close {
        position: absolute !important;
        z-index: 5 !important;
        top: calc(14px + env(safe-area-inset-top)) !important;
        right: 18px !important;
        display: grid !important;
        place-items: center !important;
        width: 48px !important;
        height: 48px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 1px solid rgba(255, 255, 255, 0.32) !important;
        border-radius: 50% !important;
        color: #fff !important;
        background: rgba(255, 255, 255, 0.10) !important;
        box-shadow: none !important;
        backdrop-filter: blur(10px) !important;
        -webkit-backdrop-filter: blur(10px) !important;
        cursor: pointer !important;
    }

    #mobile-menu .masala-mobile-menu-close svg {
        width: 24px !important;
        height: 24px !important;
        stroke: currentColor !important;
        stroke-width: 2 !important;
    }

    #mobile-menu .masala-mobile-menu-socials {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 10px !important;
        flex: 0 0 auto !important;
        width: 100% !important;
        margin: 10px 0 0 !important;
        padding: 10px 0 0 !important;
        border-top: 1px solid rgba(255, 255, 255, 0.24) !important;
    }

    #mobile-menu a.masala-mobile-menu-social {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 4px !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        color: #fff !important;
        background: none !important;
        box-shadow: none !important;
        text-decoration: none !important;
    }

    #mobile-menu .masala-mobile-menu-social__circle {
        display: grid !important;
        place-items: center !important;
        width: 44px !important;
        height: 44px !important;
        border: 1px solid rgba(255, 255, 255, 0.30) !important;
        border-radius: 50% !important;
        box-sizing: border-box !important;
        box-shadow: 0 5px 12px rgba(0, 0, 0, 0.20) !important;
    }

    #mobile-menu .masala-mobile-menu-social--whatsapp .masala-mobile-menu-social__circle { background: #20bd5a !important; }
    #mobile-menu .masala-mobile-menu-social--telegram .masala-mobile-menu-social__circle { background: #239bd3 !important; }
    #mobile-menu .masala-mobile-menu-social--max .masala-mobile-menu-social__circle { background: #315eea !important; }

    #mobile-menu .masala-mobile-menu-social__circle svg {
        width: 25px !important;
        height: 25px !important;
        fill: none !important;
        stroke: #fff !important;
        stroke-width: 2 !important;
        stroke-linecap: round !important;
        stroke-linejoin: round !important;
    }

    #mobile-menu .masala-mobile-menu-social__label {
        display: block !important;
        max-width: 100% !important;
        font-size: 11px !important;
        font-weight: 600 !important;
        line-height: 1.1 !important;
        color: #fff !important;
        white-space: nowrap !important;
        text-align: center !important;
    }

    body.masala-final-menu-open .menu-button,
    body.masala-final-menu-open .menu-btn,
    body.masala-final-menu-open .mobile-menu-button,
    body.masala-final-menu-open .hamburger,
    body.masala-final-menu-open .nav-toggle,
    body.masala-final-menu-open .mobile-toggle,
    body.masala-final-menu-open [data-toggle="mobile-menu"],
    body.masala-final-menu-open [data-menu="open"],
    body.masala-final-menu-open [aria-controls="mobile-menu"] {
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }

    @media (max-height: 720px) {
        #mobile-menu.mobile-menu-wrapper {
            padding-top: calc(8px + env(safe-area-inset-top)) !important;
            padding-bottom: calc(6px + env(safe-area-inset-bottom)) !important;
        }
        #mobile-menu .mobile-menu.anchor-menu { padding-top: 49px !important; }
        #mobile-menu .mobile-menu.anchor-menu > ul { gap: 5px !important; max-height: none !important; }
        #mobile-menu a.nav-pill { min-height: 43px !important; padding-top: 4px !important; padding-bottom: 4px !important; }
        #mobile-menu .masala-mobile-menu-socials { margin-top: 6px !important; padding-top: 6px !important; }
        #mobile-menu .masala-mobile-menu-social__circle { width: 38px !important; height: 38px !important; }
        #mobile-menu .masala-mobile-menu-social__circle svg { width: 22px !important; height: 22px !important; }
        #mobile-menu .masala-mobile-menu-close { top: calc(7px + env(safe-area-inset-top)) !important; width: 42px !important; height: 42px !important; }
    }

    @media (max-width: 360px) {
        #mobile-menu.mobile-menu-wrapper {
            width: min(90vw, 390px) !important;
            max-width: calc(100vw - 28px) !important;
            padding-left: 14px !important;
            padding-right: 14px !important;
        }
        #mobile-menu a.nav-pill { grid-template-columns: 30px minmax(0, 1fr) 10px !important; gap: 9px !important; padding-left: 12px !important; padding-right: 12px !important; }
        #mobile-menu .masala-menu-label { font-size: 14px !important; }
        #mobile-menu .masala-menu-icon svg { width: 24px !important; height: 24px !important; }
        #mobile-menu .masala-mobile-menu-social__circle { width: 40px !important; height: 40px !important; }
        #mobile-menu .masala-mobile-menu-social__label { font-size: 10px !important; }
    }
}