/* section categories */
    .categories {
        width: fit-content;
        max-width: 100%;
    }

    .container_categories{
        display: flex;
        justify-content: flex-start;
        column-gap: 1rem;
        overflow-x: auto;
        padding-bottom: .5rem;
    }

    .container_categories::-webkit-scrollbar{
        width: .2rem;
        height: .2rem;
    }

    .container_categories:hover::-webkit-scrollbar{
        width: .4rem;
        height: .4rem;
    }
    
    .container_categories::-webkit-scrollbar-track{
        background-color: transparent;
        border-radius: .5rem;
    }
    
    .container_categories::-webkit-scrollbar-thumb{
        background-color: var(--light-black);
        border-radius: .5rem;
    }

    .container_categories .content_categories{
        flex: 0 0 auto;
        border: var(--border);
        padding: .5rem;
        display: flex;
        align-items: center;
        column-gap: .5rem;
        border-radius: .5rem;
    }

    .categorie_img{
        width: 3.5rem;
        height: 3.5rem;
        border: var(--border);
        border-radius: .5rem;
    }

    .categorie_img img{
        border-radius: .5rem;
        object-fit: cover;
    }

    .categorie_name{
        display: flex;
        flex-direction: column;
        row-gap: .3rem;
        width: 100%;
    }

    .name_count{
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .name_count .name{
        font-weight: bolder;
        font-size: 17px;
    }

    .name_count .qt{
        font-size: 15px;
        color: #00000075;
    }

    .categorie_name a{
        color: var(--orange);
    }
/* section categories */


/* section categories */
    @media screen and (max-width: 700px) {
        .title_categories{
            font-size: 15px;
        }

        .container_categories{
            gap: .5rem;
        }
        
        .name_count .name{
            font-size: 15px;
        }

        .name_count .qt{
            font-size: 13px;
        }

        .categorie_name a{
            font-size: 13px;
        }
    }
/* section categories */