:root{
    --text-color:#fff;
    --first-color:#050000;
    --second-color:#e91e63;
    --third-color:#f5f2f2;
    --fouth-color:#6379f8;

    --box-shadow:0 5px 25px rgb(2, 2, 2,);
    --text-shadow:0 5px 25px rgb(2, 2, 2,);


}

.categories-icon bg-light section-padding{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: Arial, Helvetica,  sans-serif;
 
}
#section-scroll-bar{
    position: relative;
    margin: 0px 15px;
    transition: 0.5 ease;
}
.tab-nav-bar{
    position: relative;
}
.tab-navigaton{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: fit-content;
    margin: 0 auto;
}
.tab-menu{
   
    color: var(--text-color);
    max-width: 2000px;
    padding: 2px;
    margin-right: 10px;
    white-space: nowrap;
    border: 1px solid var(--third-color);
    border-radius: 50px;
    box-shadow: var(--box-shadow);
    overflow: auto;
    user-select: none;
    scroll-behavior: smooth;
   
}
.tab-menu.dragging{
    scroll-behavior: unset;
    cursor: grab;

}
.tab-menu::-webkit-scrollbar{
    display: none;
}
.tab-btn{
    color: var(--second-color);
    display: inline-block;
    font-size: 18px;
    font-weight: 400;
   
    padding: 10px 20px;
    border-radius: 30px;
    cursor: pointer;
    user-select: none;
    transition: 0.3s ease;
    margin-left: 10px;


}
.tab-btn li {
    padding: 10px 20px;

}
.tab-btn.tab-menu.dragging.tab-menu{
    pointer-events: none;
}
.tab-btn:hover{
    background: var(--third-color);
   
}
.tab-btn.active{
    background: var(--fouth-color);
    color: var(--text-color);
    padding: 5px;
}
.left-btn, .right-btn{
    position: absolute;
    color: #0a0a0a;
    font-size: 18px;
    padding: px;
    margin: px;
    cursor: pointer;
   
}
.left-btn{
    left: 0;
    background:linear-gradient(to left,transparent, var(--text-color));
    border-radius: 30px;
    display: none;

}
.right-btn{
    right: 0;
    padding: 9px;
    background:linear-gradient(to left,transparent, var(--text-color));
    border-radius: 30px;

}