/* ABADI_BOTTOM_EXTERNAL_VISUAL_V1 */

#glossybottomnavigation[data-abadi-global-bottom-menu-v4="1"]{
    background:
        linear-gradient(
            180deg,
            #eb7c2d 0%,
            #d9681b 100%
        ) !important;

    border-top:
        1px solid rgba(255,255,255,.24) !important;

    color:#fff !important;

    box-shadow:
        0 -4px 18px rgba(0,0,0,.20) !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;
}

#glossybottomnavigation
> div{
    display:block !important;
    width:100% !important;
    height:100% !important;
    background:transparent !important;
}

#glossybottomnavigation
> div
> div{
    position:relative !important;

    display:flex !important;

    width:100% !important;
    height:100% !important;

    align-items:center !important;
    justify-content:space-between !important;

    padding:0 4px !important;

    background:transparent !important;
}

#glossybottomnavigation
.pointer-events-none.absolute{
    position:absolute !important;

    top:0 !important;
    right:0 !important;
    left:0 !important;

    height:50% !important;

    background:
        linear-gradient(
            to bottom,
            rgba(255,255,255,.20),
            transparent
        ) !important;

    pointer-events:none !important;
}

#glossybottomnavigation
[data-index]{
    display:contents !important;
}

#glossybottomnavigation a,
#glossybottomnavigation a:link,
#glossybottomnavigation a:visited,
#glossybottomnavigation a:hover,
#glossybottomnavigation a:focus,
#glossybottomnavigation a:active{
    position:relative !important;
    z-index:10 !important;

    display:flex !important;

    flex:1 1 0 !important;

    min-width:0 !important;
    height:100% !important;

    flex-direction:column !important;

    align-items:center !important;
    justify-content:center !important;

    gap:4px !important;

    margin:0 !important;
    padding:0 3px !important;

    color:#fff !important;

    background:transparent !important;

    border:0 !important;

    text-decoration:none !important;
    text-decoration-line:none !important;

    box-shadow:none !important;

    -webkit-tap-highlight-color:transparent;
}

#glossybottomnavigation
a
> div:first-child{
    position:relative !important;

    display:flex !important;

    align-items:center !important;
    justify-content:center !important;

    transform:
        translateY(0)
        scale(1);

    transition:
        transform .28s ease !important;
}

#glossybottomnavigation
a
> div:first-child
> div:first-child{
    position:absolute !important;

    inset:0 !important;

    border-radius:8px !important;

    background:
        rgba(255,255,255,.22) !important;

    opacity:0 !important;

    filter:
        blur(10px) !important;

    pointer-events:none !important;

    transition:
        opacity .28s ease !important;
}

#glossybottomnavigation svg{
    position:relative !important;
    z-index:10 !important;

    display:block !important;

    width:24px !important;
    height:24px !important;

    min-width:24px !important;
    min-height:24px !important;

    color:#fff !important;

    stroke:#fff !important;
    fill:none !important;

    filter:
        drop-shadow(
            0 2px 2px rgba(0,0,0,.20)
        ) !important;
}

#glossybottomnavigation span{
    display:block !important;

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

    color:#fff !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size:10px !important;
    font-weight:700 !important;

    line-height:1 !important;

    letter-spacing:.05em !important;

    text-align:center !important;
    text-decoration:none !important;
    text-transform:uppercase !important;

    white-space:nowrap !important;

    filter:
        drop-shadow(
            0 2px 2px rgba(0,0,0,.16)
        ) !important;
}

#glossybottomnavigation
[data-index]
> div:last-child{
    width:1px !important;
    min-width:1px !important;

    height:32px !important;

    flex:0 0 1px !important;

    background:
        linear-gradient(
            to bottom,
            transparent,
            rgba(255,255,255,.50),
            transparent
        ) !important;
}

@media (hover:hover){

    #glossybottomnavigation
    a:hover
    > div:first-child{
        transform:
            translateY(-4px)
            scale(1) !important;
    }

    #glossybottomnavigation
    a:hover
    > div:first-child
    > div:first-child{
        opacity:1 !important;
    }

    #glossybottomnavigation
    a:hover span{
        color:#fff !important;
        text-decoration:none !important;
    }
}

#glossybottomnavigation
a:active
> div:first-child{
    transform:
        translateY(0)
        scale(.95) !important;
}

#glossybottomnavigation
a:focus-visible{
    outline:
        2px solid rgba(255,255,255,.90) !important;

    outline-offset:
        -4px !important;

    border-radius:
        6px !important;
}

@media (max-width:767px){

    #glossybottomnavigation
    > div
    > div{
        padding:0 2px !important;
    }

    #glossybottomnavigation a{
        gap:3px !important;
        padding:0 2px !important;
    }

    #glossybottomnavigation svg{
        width:22px !important;
        height:22px !important;

        min-width:22px !important;
        min-height:22px !important;
    }

    #glossybottomnavigation span{
        font-size:9px !important;
        letter-spacing:.03em !important;
    }
}

@media (max-width:360px){

    #glossybottomnavigation span{
        font-size:8px !important;
        letter-spacing:0 !important;
    }

    #glossybottomnavigation svg{
        width:21px !important;
        height:21px !important;

        min-width:21px !important;
        min-height:21px !important;
    }
}

@media (prefers-reduced-motion:reduce){

    #glossybottomnavigation *{
        transition:none !important;
        animation:none !important;
    }
}
