/* ==================================================
   LEMARA MOBILE BOTTOM NAVIGATION
   Only Mobile Devices
================================================== */


/* RESET */

.mobile-bottom-nav,
.mobile-bottom-nav *{

    box-sizing:border-box;

}



/* MAIN NAV */

.mobile-bottom-nav{

    display:none;

    position:fixed;

    left:0;

    right:0;

    bottom:0;


    height:82px;


    background:#ffffff;


    z-index:99999;


    box-shadow:

    0 -5px 20px rgba(0,0,0,.08);



    border-top:1px solid #eeeeee;


    direction:rtl;


    padding-bottom:env(safe-area-inset-bottom);


}



/* NAV CONTAINER */

.mobile-nav-container{


    width:100%;

    height:100%;


    display:flex;


    justify-content:space-around;


    align-items:center;


}



/* NAV ITEM */

.mobile-nav-item{


    flex:1;


    height:100%;


    display:flex;


    flex-direction:column;


    align-items:center;


    justify-content:center;


    text-decoration:none;


    color:#555;


    font-family:inherit;


    font-size:14px;


    font-weight:700;


    position:relative;


    transition:.3s ease;



}



/* ACTIVE */

.mobile-nav-item.active{


    color:#b08d57;


}



/* ICON */

.mobile-nav-icon{


    width:30px;

    height:30px;


    margin-bottom:5px;


    position:relative;


    display:flex;


    align-items:center;


    justify-content:center;



}



.mobile-nav-icon svg{


    width:28px;


    height:28px;


    stroke:currentColor;


    fill:none;


    stroke-width:1.8;


    stroke-linecap:round;


    stroke-linejoin:round;



}



/* TEXT */

.mobile-nav-text{


    font-size:14px;


    line-height:20px;


    white-space:nowrap;



}



/* BADGE */

.mobile-nav-badge{


    position:absolute;


    top:-6px;


    right:-9px;



    min-width:20px;


    height:20px;


    padding:0 5px;


    border-radius:50%;


    background:#b08d57;


    color:#fff;


    display:flex;


    align-items:center;


    justify-content:center;


    font-size:11px;


    font-weight:bold;


    line-height:20px;



}



/* HIDE DESKTOP */

@media(min-width:769px){


    .mobile-bottom-nav{


        display:none !important;


    }


}

/* ==================================================
   MOBILE ONLY SETTINGS
================================================== */


@media(max-width:768px){


    body{


        padding-bottom:100px !important;


    }



    .mobile-bottom-nav{


        display:block !important;


    }



    .mobile-nav-container{


        display:flex;


    }




    .mobile-nav-item:active{


        transform:scale(.95);


    }



}



/* ==================================================
   ICON COLORS
================================================== */


.mobile-nav-item:hover .mobile-nav-icon svg{


    transform:translateY(-2px);


}



.mobile-nav-icon svg{


    transition:.3s ease;


}



/* ==================================================
   USER ICON
================================================== */


.mobile-user-icon{


    position:relative;


}



.mobile-user-icon svg{


    width:29px;

    height:29px;


}



/* ==================================================
   CART ICON
================================================== */


.mobile-cart-icon{


    position:relative;


}



.mobile-cart-icon svg{


    width:29px;

    height:29px;


}



/* ==================================================
   WISHLIST ICON
================================================== */


.mobile-wishlist-icon{


    position:relative;


}



.mobile-wishlist-icon svg{


    width:29px;

    height:29px;


}



/* ==================================================
   MENU ICON
================================================== */


.mobile-menu-icon svg{


    width:30px;

    height:30px;


}



/* ==================================================
   ACTIVE LINE
================================================== */


.mobile-nav-item.active::before{


    content:"";


    position:absolute;


    top:8px;


    width:25px;


    height:3px;


    border-radius:10px;


    background:#b08d57;



}



/* ==================================================
   MOBILE SMALL DEVICES
================================================== */


@media(max-width:480px){



    .mobile-bottom-nav{


        height:78px;


    }




    .mobile-nav-icon{


        width:27px;


        height:27px;


    }




    .mobile-nav-icon svg{


        width:26px;


        height:26px;


    }




    .mobile-nav-text{


        font-size:13px;


    }




    .mobile-nav-badge{


        min-width:18px;


        height:18px;


        font-size:10px;


        line-height:18px;


    }



}



/* ==================================================
   LARGE MOBILE / TABLET
================================================== */


@media(min-width:600px) and (max-width:768px){



    .mobile-bottom-nav{


        height:85px;


    }



    .mobile-nav-text{


        font-size:15px;


    }




    .mobile-nav-icon svg{


        width:30px;


        height:30px;


    }



}

/* ==================================================
   FINAL TOUCHES
================================================== */


/* PREVENT FOOTER COVER */

@media(max-width:768px){


    footer{


        margin-bottom:90px;


    }


}



/* ==================================================
   SMOOTH EFFECT
================================================== */


.mobile-nav-item{


    -webkit-tap-highlight-color:transparent;


}



.mobile-nav-item span{


    transition:.25s ease;


}



/* ==================================================
   ACTIVE EFFECT
================================================== */


.mobile-nav-item.active .mobile-nav-text{


    color:#b08d57;


}



.mobile-nav-item.active .mobile-nav-icon svg{


    stroke:#b08d57;


}



/* ==================================================
   BADGE VARIATIONS
================================================== */


.mobile-nav-badge.empty{


    display:none;


}



/* ==================================================
   DISABLED STATE
================================================== */


.mobile-nav-item.disabled{


    opacity:.5;


    pointer-events:none;


}



/* ==================================================
   SAFE AREA IOS
================================================== */


@supports(padding: max(0px)){


    .mobile-bottom-nav{


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


    }


}



/* ==================================================
   FINAL MOBILE HEIGHT FIX
================================================== */


@media(max-width:768px){


    .mobile-bottom-nav{


        min-height:75px;


        max-height:85px;


    }



}

/* =====================================
   MOBILE SIDE MENU
===================================== */


.mobile-menu{


    position:fixed;

    top:0;

    right:-320px;

    width:300px;

    height:100vh;

    background:#fff;

    z-index:100001;

    transition:.35s ease;

    box-shadow:-10px 0 30px rgba(0,0,0,.15);

}



/* OPEN */


.mobile-menu-open .mobile-menu{


    right:0;


}



.mobile-menu-header{


    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:25px;

    border-bottom:1px solid #eee;


}



.mobile-menu-header h3{


    margin:0;

    font-size:22px;

}



#closeMobileMenu{


    border:none;

    background:none;

    font-size:35px;

    cursor:pointer;

}



/* LINKS */


.mobile-menu-links{


    display:flex;

    flex-direction:column;

    padding:20px;


}



.mobile-menu-links a{


    text-decoration:none;

    color:#222;

    padding:18px;

    border-bottom:1px solid #eee;

    font-size:16px;

    font-weight:bold;


}



/* OVERLAY */


.mobile-menu-overlay{


    position:fixed;

    inset:0;

    background:rgba(0,0,0,.35);

    z-index:100000;

    display:none;


}



.mobile-menu-open .mobile-menu-overlay{


    display:block;


}




@media(min-width:769px){


.mobile-menu,
.mobile-menu-overlay{


    display:none !important;


}


}

@media(max-width:768px){

    .wishlist-image{

        height:230px;

    }


    .wishlist-image img{

        width:100% !important;

        height:100% !important;

        object-fit:cover !important;

    }

}

/* ===============================
   CENTER STORE BUTTON
================================ */


.mobile-store-btn{

    position:relative;

}



.mobile-store-logo{

    width:58px;

    height:58px;

    border-radius:50%;

    background:#fff;

    display:flex;

    align-items:center;

    justify-content:center;

    margin-top:-28px;

    border:2px solid #b08d57;

    box-shadow:0 6px 20px rgba(0,0,0,.18);

}



.mobile-store-logo img{

    width:42px;

    height:42px;

    object-fit:contain;

}



.mobile-store-btn .mobile-nav-text{

    margin-top:8px;

}



@media(max-width:480px){


.mobile-store-logo{

    width:54px;

    height:54px;

}


.mobile-store-logo img{

    width:38px;

    height:38px;

}


}