/* DAV Communication Portal v7.7.0 — isolated mobile navigation rebuild */

@media(max-width:960px){
    :root{
        --mobile-portal-header-height:78px;
        --mobile-menu-width:min(390px,92vw);
    }

    html,
    body{
        width:100%;
        max-width:100%;
        overflow-x:hidden;
    }

    .portal-header,
    header.portal-header{
        position:relative !important;
        top:auto !important;
        left:auto !important;
        right:auto !important;
        z-index:2000 !important;
        width:100% !important;
        min-height:var(--mobile-portal-header-height) !important;
        height:var(--mobile-portal-header-height) !important;
        max-height:var(--mobile-portal-header-height) !important;
        padding:0 !important;
        overflow:visible !important;
        border-radius:0 !important;
        box-shadow:none !important;
    }

    body.sticky-mobile-header-enabled{
        padding-top:var(--mobile-portal-header-height) !important;
    }

    body.sticky-mobile-header-enabled .portal-header,
    body.sticky-mobile-header-enabled header.portal-header{
        position:fixed !important;
        top:0 !important;
        left:0 !important;
        right:0 !important;
        z-index:2000 !important;
        box-shadow:0 3px 12px rgba(0,0,0,.18) !important;
    }

    .portal-header .portal-header-inner,
    header.portal-header .wrap.portal-header-inner{
        display:flex !important;
        align-items:center !important;
        justify-content:space-between !important;
        flex-wrap:nowrap !important;
        gap:10px !important;
        width:100% !important;
        max-width:100% !important;
        min-height:var(--mobile-portal-header-height) !important;
        height:var(--mobile-portal-header-height) !important;
        max-height:var(--mobile-portal-header-height) !important;
        margin:0 !important;
        padding:0 12px !important;
    }

    .portal-brand{
        display:grid !important;
        align-content:center !important;
        flex:1 1 auto !important;
        min-width:0 !important;
        max-width:calc(100% - 60px) !important;
        gap:2px !important;
        margin:0 !important;
        padding:0 !important;
        overflow:hidden !important;
    }

    .portal-brand strong{
        display:block !important;
        margin:0 !important;
        color:#fff !important;
        font-size:1rem !important;
        line-height:1.12 !important;
        white-space:normal !important;
        overflow-wrap:normal !important;
        word-break:normal !important;
    }

    .portal-brand span{
        display:block !important;
        margin:0 !important;
        color:rgba(255,255,255,.84) !important;
        font-size:.72rem !important;
        line-height:1.18 !important;
        white-space:normal !important;
    }

    .portal-menu-toggle{
        position:relative !important;
        z-index:2201 !important;
        display:inline-flex !important;
        align-items:center !important;
        justify-content:center !important;
        flex:0 0 48px !important;
        width:48px !important;
        min-width:48px !important;
        max-width:48px !important;
        height:48px !important;
        min-height:48px !important;
        margin:0 !important;
        padding:10px !important;
        border:1px solid rgba(255,255,255,.55) !important;
        border-radius:11px !important;
        background:rgba(255,255,255,.10) !important;
        color:#fff !important;
        box-shadow:none !important;
        opacity:1 !important;
        visibility:visible !important;
        pointer-events:auto !important;
        filter:none !important;
        backdrop-filter:none !important;
        -webkit-backdrop-filter:none !important;
    }

    .portal-menu-label{
        display:none !important;
    }

    #primary-nav.portal-nav{
        position:fixed !important;
        top:var(--mobile-portal-header-height) !important;
        right:0 !important;
        bottom:0 !important;
        left:auto !important;
        z-index:2200 !important;
        display:flex !important;
        flex-direction:column !important;
        align-items:stretch !important;
        justify-content:flex-start !important;
        width:var(--mobile-menu-width) !important;
        max-width:92vw !important;
        height:auto !important;
        min-height:0 !important;
        margin:0 !important;
        padding:14px !important;
        overflow-x:hidden !important;
        overflow-y:auto !important;
        overscroll-behavior:contain !important;
        border-left:1px solid #d8e0e7 !important;
        background:#fff !important;
        color:#172033 !important;
        box-shadow:-14px 0 36px rgba(15,23,42,.22) !important;
        opacity:1 !important;
        visibility:hidden !important;
        pointer-events:none !important;
        transform:translateX(105%) !important;
        transition:
            transform .20s ease,
            visibility .20s ease !important;
        filter:none !important;
        backdrop-filter:none !important;
        -webkit-backdrop-filter:none !important;
    }

    #primary-nav.portal-nav.is-open{
        visibility:visible !important;
        pointer-events:auto !important;
        transform:translateX(0) !important;
    }

    #primary-nav.portal-nav .portal-nav-group{
        display:grid !important;
        align-items:stretch !important;
        gap:6px !important;
        width:100% !important;
        margin:0 !important;
        padding:0 !important;
    }

    #primary-nav.portal-nav .portal-nav-group + .portal-nav-group{
        margin-top:14px !important;
        padding-top:14px !important;
        border-top:1px solid #dfe5eb !important;
    }

    #primary-nav.portal-nav a,
    #primary-nav.portal-nav .portal-nav-dropdown-toggle{
        display:flex !important;
        align-items:center !important;
        justify-content:flex-start !important;
        width:100% !important;
        min-width:0 !important;
        max-width:100% !important;
        min-height:48px !important;
        margin:0 !important;
        padding:11px 13px !important;
        border:1px solid transparent !important;
        border-radius:9px !important;
        background:#f6f8fa !important;
        color:#172033 !important;
        font:inherit !important;
        font-size:.96rem !important;
        font-weight:800 !important;
        line-height:1.25 !important;
        text-align:left !important;
        text-decoration:none !important;
        white-space:normal !important;
        opacity:1 !important;
        visibility:visible !important;
        pointer-events:auto !important;
        filter:none !important;
    }

    #primary-nav.portal-nav a:hover,
    #primary-nav.portal-nav a:focus-visible,
    #primary-nav.portal-nav .portal-nav-dropdown-toggle:hover,
    #primary-nav.portal-nav .portal-nav-dropdown-toggle:focus-visible{
        border-color:#c9d7e2 !important;
        background:#eaf2f7 !important;
        color:#0b4d7a !important;
        outline:none !important;
    }

    #primary-nav.portal-nav .portal-logout-link{
        background:#f8e9e9 !important;
        color:#7a1c1c !important;
    }

    #primary-nav.portal-nav .portal-icon-link{
        width:100% !important;
    }

    #primary-nav.portal-nav .portal-icon-link::after{
        content:'Notifications';
        margin-left:10px;
    }

    #primary-nav.portal-nav .portal-nav-dropdown{
        width:100% !important;
    }

    #primary-nav.portal-nav .portal-nav-dropdown-menu{
        position:static !important;
        display:none !important;
        width:100% !important;
        min-width:0 !important;
        margin:6px 0 0 !important;
        padding:7px !important;
        border:1px solid #dfe5eb !important;
        border-radius:9px !important;
        background:#f2f5f7 !important;
        box-shadow:none !important;
    }

    #primary-nav.portal-nav
        .portal-nav-dropdown.is-open
        .portal-nav-dropdown-menu{
        display:grid !important;
        gap:4px !important;
    }

    #primary-nav.portal-nav .portal-nav-dropdown-menu a{
        padding-left:18px !important;
        background:#fff !important;
        color:#172033 !important;
    }

    /*
     * The old backdrop caused the darkened, untappable menu.
     * It is intentionally disabled for the rebuilt mobile navigation.
     */
    .portal-nav-backdrop,
    body.portal-menu-open .portal-nav-backdrop,
    body.portal-nav-open .portal-nav-backdrop{
        display:none !important;
        visibility:hidden !important;
        opacity:0 !important;
        pointer-events:none !important;
        filter:none !important;
        backdrop-filter:none !important;
        -webkit-backdrop-filter:none !important;
    }

    body.portal-menu-open,
    body.portal-nav-open{
        overflow:hidden !important;
    }
}

@media(max-width:420px){
    :root{
        --mobile-menu-width:94vw;
    }

    .portal-header .portal-header-inner,
    header.portal-header .wrap.portal-header-inner{
        padding:0 10px !important;
    }

    .portal-brand strong{
        font-size:.94rem !important;
    }

    .portal-brand span{
        font-size:.68rem !important;
    }
}


/*
 * Version 7.7.1 — force readable mobile drawer colors.
 */
@media(max-width:960px){
    body #primary-nav.portal-nav,
    body #primary-nav.portal-nav *,
    body #primary-nav.portal-nav a,
    body #primary-nav.portal-nav button,
    body #primary-nav.portal-nav span,
    body #primary-nav.portal-nav strong{
        opacity:1 !important;
        filter:none !important;
        -webkit-filter:none !important;
        text-shadow:none !important;
    }

    body #primary-nav.portal-nav a,
    body #primary-nav.portal-nav button,
    body #primary-nav.portal-nav .portal-nav-dropdown-toggle,
    body #primary-nav.portal-nav a span,
    body #primary-nav.portal-nav button span{
        color:#172033 !important;
        -webkit-text-fill-color:#172033 !important;
    }

    body #primary-nav.portal-nav .portal-logout-link,
    body #primary-nav.portal-nav .portal-logout-link span{
        color:#7a1c1c !important;
        -webkit-text-fill-color:#7a1c1c !important;
    }

    body #primary-nav.portal-nav .portal-icon-link svg{
        color:#172033 !important;
        fill:currentColor !important;
        stroke:currentColor !important;
    }
}