/*
==========================================================
ALAIDEE MOBILE HEADER MASTER - CLEAN V1
Single source of truth for mobile header.
==========================================================
*/

@media (max-width:767.98px){

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

    body{
        margin:0 !important;
        padding-top:0 !important;
    }

    /* HEADER */

    .v2-header{
        display:block !important;

        position:-webkit-sticky !important;
        position:sticky !important;

        top:0 !important;
        z-index:1000 !important;

        width:100% !important;

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

        background:#f6d51d !important;
        border:0 !important;

        box-shadow:
            0 2px 8px
            rgba(15,23,42,.07) !important;

        box-sizing:border-box !important;
    }

    .v2-header-inner{
        display:grid !important;

        width:100% !important;
        max-width:none !important;

        height:55px !important;
        min-height:55px !important;

        margin:0 !important;

        padding:
            5px
            5px
            5px
            6px !important;

        grid-template-columns:
            40px
            minmax(0,1fr)
            22px
            25px !important;

        column-gap:2px !important;

        align-items:center !important;

        box-sizing:border-box !important;
        overflow:visible !important;
    }


    /* LOGO */

    .v2-logo{
        display:flex !important;

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

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

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

        overflow:hidden !important;
        text-decoration:none !important;
    }

    .v2-logo img{
        display:block !important;

        width:40px !important;
        height:40px !important;

        min-width:40px !important;
        max-width:40px !important;
        max-height:40px !important;

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

        flex:0 0 40px !important;

        object-fit:contain !important;
    }


    /* SEARCH */

    .v2-search{
        position:relative !important;

        display:flex !important;
        align-items:center !important;

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

        height:40px !important;

        margin:0 !important;

        padding:
            0 7px
            0 9px !important;

        box-sizing:border-box !important;

        background:#fff !important;

        border:
            1px solid
            rgba(15,23,42,.08) !important;

        border-radius:14px !important;

        box-shadow:
            0 1px 2px
            rgba(15,23,42,.05) !important;

        overflow:hidden !important;
    }


    /* MAGNIFIER */

    .v2-header .v2-search .v2-search-icon{
        display:flex !important;

        width:17px !important;
        height:17px !important;

        min-width:17px !important;
        max-width:17px !important;

        flex:0 0 17px !important;

        margin:
            0 5px
            0 0 !important;

        padding:0 !important;

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

        color:#172033 !important;

        font-size:0 !important;

        transform:none !important;
    }

    .v2-header .v2-search .v2-search-icon svg{
        display:block !important;

        width:17px !important;
        height:17px !important;

        min-width:17px !important;
        max-width:17px !important;
        min-height:17px !important;
        max-height:17px !important;

        flex:0 0 17px !important;

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

        fill:none !important;

        stroke:currentColor !important;
        stroke-width:1.8 !important;

        stroke-linecap:round !important;
        stroke-linejoin:round !important;

        transform:none !important;

        overflow:visible !important;
    }


    /* SEARCH INPUT
       16px prevents iOS Safari auto zoom.
    */

    .v2-header .v2-search input[type="search"]{
        display:block !important;

        flex:1 1 auto !important;

        width:0 !important;
        min-width:0 !important;

        height:38px !important;

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

        border:0 !important;
        outline:0 !important;

        background:transparent !important;

        color:#111827 !important;

        font-family:inherit !important;
        font-size:16px !important;
        font-weight:400 !important;

        line-height:1.2 !important;

        white-space:nowrap !important;
        overflow:hidden !important;
        text-overflow:ellipsis !important;

        box-shadow:none !important;

        -webkit-appearance:none !important;
        appearance:none !important;
    }

    .v2-header .v2-search input[type="search"]::placeholder{
        color:#77808f !important;
        opacity:1 !important;
    }


    /* IMAGE SEARCH */

    .v2-image-search-trigger{
        display:flex !important;

        width:27px !important;
        height:30px !important;

        min-width:27px !important;

        flex:0 0 27px !important;

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

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

        border:0 !important;
        outline:0 !important;

        background:transparent !important;
        box-shadow:none !important;
    }

    .v2-image-search-trigger svg{
        display:block !important;

        width:18px !important;
        height:18px !important;

        fill:none !important;

        stroke:#111827 !important;
        stroke-width:1.7 !important;

        stroke-linecap:round !important;
        stroke-linejoin:round !important;
    }


    /* HEADER ACTIONS */

    .v2-header-action{
        position:relative !important;

        display:flex !important;

        height:40px !important;

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

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

        color:#111827 !important;
        text-decoration:none !important;

        background:transparent !important;
        box-shadow:none !important;

        box-sizing:border-box !important;
    }

    .v2-notification-action{
        width:22px !important;
        min-width:22px !important;
        max-width:22px !important;

        justify-self:end !important;
    }

    .v2-cart-action{
        width:25px !important;
        min-width:25px !important;
        max-width:25px !important;

        justify-self:end !important;
    }

    .v2-notification-icon{
        display:block !important;

        width:20px !important;
        height:20px !important;

        fill:none !important;

        stroke:currentColor !important;
        stroke-width:1.7 !important;

        stroke-linecap:round !important;
        stroke-linejoin:round !important;
    }

    .v2-header .v2-cart-action .v2-cart-icon{
        display:block !important;

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

        min-width:24px !important;

        flex:0 0 24px !important;

        fill:none !important;

        stroke:currentColor !important;
        stroke-width:1.7 !important;

        stroke-linecap:round !important;
        stroke-linejoin:round !important;
    }


    /* BADGES */

    .v2-notification-badge,
    .v2-cart-badge{
        position:absolute !important;

        top:0 !important;
        right:-3px !important;

        display:flex !important;

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

        padding:0 3px !important;

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

        border-radius:999px !important;

        background:#e5252a !important;
        color:#fff !important;

        font-size:8px !important;
        line-height:15px !important;
        font-weight:800 !important;

        box-sizing:border-box !important;
    }
}


/* SMALL MOBILE */

@media (max-width:400px){

    .v2-header-inner{
        grid-template-columns:
            40px
            minmax(0,1fr)
            21px
            24px !important;

        column-gap:1px !important;

        padding-left:5px !important;
        padding-right:4px !important;
    }

    .v2-logo,
    .v2-logo img{
        width:38px !important;
        height:38px !important;
        min-width:38px !important;
    }

    .v2-notification-action{
        width:21px !important;
        min-width:21px !important;
        max-width:21px !important;
    }

    .v2-cart-action{
        width:24px !important;
        min-width:24px !important;
        max-width:24px !important;
    }
}


/* DESKTOP */

@media (min-width:768px){

    .v2-header{
        display:none !important;
    }
}
