/*
 * Bareilly Taxi Mobile Menu Fix v1.0.1
 * ONLY affects the custom mobile header/drawer below 1051px.
 */

@media (max-width: 1050px) {

    /* Keep the header row stable: logo left, menu button right. */
    .bt-header .bt-header-row {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        gap: 10px !important;
    }

    .bt-header .bt-logo {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        margin-right: 8px !important;
    }

    .bt-header .bt-header-actions {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 8px !important;
        flex: 0 0 auto !important;
        margin-left: auto !important;
        min-width: 44px !important;
    }

    /* On mobile the Book Taxi header CTA is hidden so the hamburger
       stays at the correct right-side position. The mobile drawer
       contains its own Book Taxi button. */
    .bt-header .bt-header-actions .bt-btn-call,
    .bt-header .bt-header-actions .bt-btn-whatsapp,
    .bt-header .bt-header-actions .bt-btn-book {
        display: none !important;
    }

    .bt-header .bt-menu-toggle {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex: 0 0 44px !important;
        width: 44px !important;
        height: 42px !important;
        margin: 0 !important;
        padding: 8px !important;
        position: relative !important;
        z-index: 10002 !important;
        cursor: pointer !important;
        touch-action: manipulation !important;
    }

    .bt-header .bt-menu-toggle span {
        display: block !important;
        width: 24px !important;
        height: 2px !important;
        margin: 5px 2px !important;
    }

    /* Initial state: ALWAYS closed. */
    .bt-header .bt-mobile-menu {
        right: -380px !important;
        left: auto !important;
        visibility: hidden !important;
        opacity: 1 !important;
        pointer-events: none !important;
        transform: none !important;
    }

    /* Open state: only after a real menu-button click. */
    body.bt-mobile-menu-open .bt-header .bt-mobile-menu {
        right: 0 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    /* Older class compatibility. */
    body.bt-mobile-menu-open .bt-header .bt-mobile-menu.is-open {
        right: 0 !important;
    }

    .bt-header .bt-mobile-overlay {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }

    body.bt-mobile-menu-open .bt-header .bt-mobile-overlay {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }
}

@media (max-width: 767px) {
    .bt-header .bt-container {
        width: calc(100% - 24px) !important;
        max-width: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .bt-header .bt-header-row {
        min-height: 70px !important;
    }

    .bt-header .bt-mobile-menu {
        width: 100% !important;
        max-width: 100% !important;
    }

    body:not(.bt-mobile-menu-open) .bt-header .bt-mobile-menu {
        right: -100% !important;
    }

    body.bt-mobile-menu-open .bt-header .bt-mobile-menu {
        right: 0 !important;
    }
}

@media (max-width: 380px) {
    .bt-header .bt-logo img {
        max-width: 150px !important;
    }

    .bt-header .bt-menu-toggle {
        flex-basis: 42px !important;
        width: 42px !important;
        height: 42px !important;
    }
}