/* Vitabolic iOS/Safari hotfix v3
   - drawer stays full viewport height
   - no forced oversized category text
   - drawer remains hidden until body.vtb-mobile-menu-open exists
*/

html,
body {
    width: 100% !important;
    min-height: 100% !important;
    overflow-x: hidden !important;
    -webkit-text-size-adjust: 100% !important;
}

#page,
.ui-page,
.ui-mobile-viewport,
.ui-overlay-a {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
}

body:not(.vtb-mobile-menu-open) .vtb-mobile-drawer {
    transform: translateX(-110%) !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

body.vtb-mobile-menu-open .vtb-mobile-drawer {
    transform: translateX(0) !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

@media (max-width: 767px) {
    .vtb-mobile-drawer {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: auto !important;
        bottom: auto !important;
        width: 86vw !important;
        max-width: 360px !important;
        height: 100vh !important;
        height: 100svh !important;
        height: 100dvh !important;
        max-height: 100vh !important;
        max-height: 100svh !important;
        max-height: 100dvh !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        padding-bottom: max(28px, env(safe-area-inset-bottom)) !important;
        box-sizing: border-box !important;
    }

    .vtb-mobile-drawer-head {
        flex: 0 0 auto !important;
    }

    .vtb-mobile-category-list {
        padding-bottom: max(95px, calc(env(safe-area-inset-bottom) + 70px)) !important;
    }

    .vtb-mobile-category-list a {
        font-size: inherit !important;
        line-height: inherit !important;
    }

    .vtb-mobile-backdrop {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        height: 100vh !important;
        height: 100dvh !important;
    }
}