/* AQL COMMUNITY MOBILE MENU SAFE FIX
   Purpose:
   - prevent mobile menu/dropdown from covering the whole page
   - allow page and menu scrolling
   - stop login/community pages from being hidden behind an open menu
*/

@media (max-width: 820px) {
    html,
    body {
        height: auto !important;
        min-height: 100dvh !important;
        overflow-y: auto !important;
        overscroll-behavior-y: auto !important;
        position: static !important;
    }

    body.menu-open,
    body.nav-open,
    body.mobile-menu-open,
    body.modal-open {
        overflow-y: auto !important;
        position: static !important;
        height: auto !important;
    }

    header,
    .site-header,
    .community-header,
    .aql-header,
    .top-header {
        max-width: 100% !important;
    }

    header nav,
    .site-header nav,
    .community-header nav,
    .mobile-menu,
    .mobile-nav,
    .nav-menu,
    .nav-links,
    .menu-panel,
    .dropdown-menu,
    .header-menu,
    .community-menu,
    .main-menu,
    .navbar-menu,
    .offcanvas,
    .drawer,
    .side-menu {
        max-height: calc(100dvh - 76px) !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
        overscroll-behavior: contain !important;
    }

    .aql-mobile-force-closed {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }

    main,
    .page,
    .community-page,
    .login-page,
    .auth-page,
    .login-card,
    .auth-card,
    .community-board,
    .container {
        position: relative !important;
        z-index: 1 !important;
    }
}