/* section categorie */
    .container_categories{
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        overflow-x: auto;
        gap: 16px;
        width: max-content;
        max-width: 100%;
        margin: 0 auto;
        margin-bottom: 16px;
        padding: 8px;
        padding-bottom: 5px;
    }

    .content_categorie{
        background: var(--red);
        padding: 8px 16px;
        border-radius: 32px;
        border: none;
        text-transform: capitalize;
        display: flex;
        align-items: center;
        gap: 5px;
    }
    
    .content_categorie:hover{
        cursor: pointer;
        scale: 1.03;
    }
    
    .content_categorie.active{
        background: none;
        border: 1px solid var(--red);
        .nom_categorie{
            color: var(--red);
        }
    }
    
    .nom_categorie{
        color: var(--white);
        text-wrap: nowrap;
    }
    
    .count_article{
        background: var(--yellow);
        color: var(--red);
        width: 20px; height: 20px;
        font-size: 12px;
        padding: 2px;
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    
    /* évite que le header fixe cache les catégories au défilement */
    .container_categories { scroll-margin-top: 120px; }
    
    /* skeleton catégories */
        .cat-skeleton {
            position: relative;
            overflow: hidden;
            pointer-events: none;
            min-width: 120px;
        }
        .cat-skeleton::after {
            content: "";
            position: absolute;
            inset: 0;
            transform: translateX(-100%);
            background: linear-gradient(90deg, transparent, rgba(255,255,255,.5), transparent);
            animation: sk-shimmer 1.4s infinite;
        }
        .sk-cat-nom   { display: inline-block; height: 14px; width: 70px; vertical-align: middle; }
        .sk-cat-count { display: inline-block; height: 18px; width: 24px; margin-left: 10px; border-radius: 20px; vertical-align: middle; }
    /* skeleton catégories */
/* section categorie */