@font-face {
    font-family: 'tanha';
    src: url("font/Tanha-FD.woff2")
    format('woff2'),
    url("font/Tanha-FD.woff2")
       format('woff');
    font-weight: normal;
    font-style: normal;
}
h1,h2,h3,h4,h5,h6,p{
    font-family: 'tanha',sans-serif;
}
#dialogDeleteCart{
    height: 75vh;
}
#messageBox::-webkit-scrollbar{
    width: 8px;
}
#messageBox::-webkit-scrollbar-track{
    background: #f8f4f4;
    border-radius: 4px;
}
#messageBox::-webkit-scrollbar-thumb{
    background: #dedee1;
    border-radius: 2px;
    border: 2px solid #f7f7f7;
}
#messageBox::-webkit-scrollbar-thumb:hover{
    background:#0d6efd ;
}
.group-product::-webkit-scrollbar{
     width: 2px;
    height: 8px;
 }
.group-product::-webkit-scrollbar-track{
    background: #e8e8e8;
    border-radius: 4px;
}
.group-product::-webkit-scrollbar-thumb{
    background: #0d6efd;
    border-radius: 4px;
}
.fab{
    position: fixed;
    right: 20px;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: #0b5ed7;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.5rem;
    box-shadow: 0 4px 8px rgba(0,0,0,0.3);
    cursor: pointer;
    transition: transform 0.2s;
    z-index: 100;
}
.fab:hover{
    transform: scale(1.1);
}

#totalCart{
    position: absolute;
    bottom: 0;
    right:15px;
    left: 15px;
}
body{
    margin-bottom: 70px;
}
#iconEmptyCart{
    font-size: 80px;
}
/*icon size default for device small screen*/
.icon-responsive{
    font-size:15px;
}
.carousel-indicators{
    bottom:-25px
}
.carousel-indicators [data-bs-target]{
    background-color:#bbb;
}
.carousel-indicators .active{
    background-color:#0d6efd;
}
#title_shik_shap{
    letter-spacing: 1px;
}
#boxSearch{
    width:90%;
}
.carousel-item img{
    height: 200px;
    object-fit:contain;
    width: 100%;
}
#chat{
    width: 100vw;
}
/*tablet size 768 px*/
@media (min-width:768px){
.icon-responsive{
    font-size:20px;
}
    #chat{
        width: 100vw;
    }
body{
    margin-bottom: 80px;
}
#title_shik_shap{
    letter-spacing: 5px;
}
#boxSearch{
    width: 65%;
}
.carousel-item img{
height: 200px;
}
    .carousel-indicators{
        bottom:0px
    }
    #iconEmptyCart{
        font-size: 120px;
    }
}
/*desktop size screen 992px*/
@media (min-width:992px){
    .icon-responsive{
        font-size:25px;
    }
    #chat{
        width: 50vw !important;
    }
#title_shik_shap{
    letter-spacing: 10px;
}
body{
    margin-bottom: 0px;
}
    #iconEmptyCart{
        font-size: 150px;
    }
#boxSearch{
    width:65%
}
.carousel-item img{
    height: 250px;
}
.carousel-indicators{
    bottom:0px
}
}
