/* ==========================================================
   9GRAD OST · MOBILE NAVIGATION
   finaler isolierter State
   ========================================================== */

@media (max-width: 991px) {

    html.neo-no-scroll,
    body.neo-no-scroll {
        overflow: hidden !important;
    }


    /* ------------------------------------------------------
       Hamburger
       ------------------------------------------------------ */

    .neo-header__menu-button {
        position: relative;
        z-index: 10003;

        display: flex !important;
        flex-direction: column;
        justify-content: center;
        align-items: center;

        width: 46px;
        height: 46px;
        padding: 0;

        cursor: pointer;
    }

    .neo-header__menu-button span {
        position: absolute;

        width: 19px;
        height: 1px;

        background: #222;

        transition:
            transform .25s ease,
            top .25s ease;
    }

    .neo-header__menu-button span:first-child {
        top: 19px;
    }

    .neo-header__menu-button span:last-child {
        top: 26px;
    }


    .neo-menu-open
    .neo-header__menu-button
    span:first-child {
        top: 22px;
        transform: rotate(45deg);
    }

    .neo-menu-open
    .neo-header__menu-button
    span:last-child {
        top: 22px;
        transform: rotate(-45deg);
    }


    /* ------------------------------------------------------
       Menü
       ------------------------------------------------------ */

    #neo-mobile-menu {
        position: fixed !important;

        top: 76px !important;
        right: 0 !important;
        bottom: 0 !important;
        left: 0 !important;

        z-index: 10000 !important;

        display: block !important;

        width: 100% !important;
        height: calc(100dvh - 76px) !important;

        overflow-y: auto !important;
        overscroll-behavior: contain;

        background: #111214 !important;

        opacity: 0 !important;
        visibility: hidden !important;

        pointer-events: none !important;

        transform: translateY(-10px) !important;

        transition:
            opacity .25s ease,
            visibility .25s ease,
            transform .25s ease !important;
    }


    #neo-mobile-menu[aria-hidden="false"],
    .neo-menu-open #neo-mobile-menu {
        opacity: 1 !important;
        visibility: visible !important;

        pointer-events: auto !important;

        transform: translateY(0) !important;
    }


    #neo-mobile-menu[aria-hidden="true"] {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }


    /* ------------------------------------------------------
       Inhalt
       ------------------------------------------------------ */

    #neo-mobile-menu .neo-mobile-menu__inner {
        display: flex !important;
        flex-direction: column;

        min-height: 100%;
        width: 100%;

        padding:
            28px
            28px
            max(30px, env(safe-area-inset-bottom));

        background: #111214;
    }


    #neo-mobile-menu .neo-mobile-menu__nav {
        flex: 1 0 auto;
    }


    #neo-mobile-menu .neo-mobile-menu__footer {
        margin-top: auto;
        padding-top: 32px;
    }


    #neo-mobile-menu .neo-mobile-menu__footer .neo-btn {
        display: flex;
        justify-content: space-between;
        align-items: center;

        width: 100%;
        min-height: 58px;
    }


    /* ------------------------------------------------------
       Menülinks
       ------------------------------------------------------ */

    #neo-mobile-menu #primary-menu {
        display: block !important;
        width: 100%;
    }

    #neo-mobile-menu #primary-menu > ul {
        display: block !important;
        width: 100%;

        margin: 0 !important;
        padding: 0 !important;
    }

    #neo-mobile-menu #primary-menu > ul > li {
        display: block !important;
        float: none !important;

        width: 100%;

        margin: 0 !important;

        border-bottom: 1px solid rgba(255,255,255,.12);
    }

    #neo-mobile-menu #primary-menu > ul > li > a {
        display: block !important;

        width: 100%;
        padding: 17px 0 !important;

        color: #fff !important;
    }

    #neo-mobile-menu #primary-menu > ul > li > a > div {
        padding: 0 !important;

        font-size: 18px !important;
        line-height: 1.25 !important;

        color: inherit !important;
    }


    /* Legacy Dropdowns mobil untereinander */

    #neo-mobile-menu #primary-menu ul ul {
        position: static !important;

        display: block;

        width: 100% !important;

        padding:
            0
            0
            10px
            14px !important;

        background: transparent !important;

        box-shadow: none !important;
    }


    #neo-mobile-menu #primary-menu ul ul a {
        color: rgba(255,255,255,.72) !important;
    }

}


@media (max-width: 600px) {

    #neo-mobile-menu {
        top: 72px !important;
        height: calc(100dvh - 72px) !important;
    }

    #neo-mobile-menu .neo-mobile-menu__inner {
        padding:
            24px
            22px
            max(24px, env(safe-area-inset-bottom));
    }

}
