/*
 * Barres collantes des collections (thème Cartzilla). Position calculée par js/sticky-stack.js,
 * qui pose `--cz-stick-top` sur chaque élément `data-cz-stick` : le bas de l'en-tête quand il
 * colle, plus la barre collante précédente (onglets de sous-collections). Couleurs : celles du
 * thème (var(--cz-*)), jamais un hex.
 *
 * `.cz-catbar` : barre Filtres et Tri du composant de base (components/product-category) et
 * pastille Filtres de la planche luxe (components/product-category-luxe). Collante SOUS 992 px
 * seulement : sur ordinateur, la colonne de filtres est déjà à l'écran, rien ne change.
 */
@media (max-width: 991.98px) {
    .cz-catbar {
        position: sticky;
        top: var(--cz-stick-top, 0px);
        z-index: 15;
        background-color: var(--cz-body-bg);
        padding-top: .625rem;
        padding-bottom: .625rem !important;
        margin-bottom: 1rem;
        box-shadow: 0 1px 0 var(--cz-border-color);
    }
    /* Une seule ligne sur téléphone : compteur, Filtres et tri côte à côte. Sur deux lignes,
       la barre prenait 91 px de haut sur un écran de 390 px (mesuré sur une collection). */
    .cz-catbar.d-flex,
    .cz-catbar > .d-flex { flex-wrap: nowrap !important; }
    .cz-catbar.d-flex { gap: .5rem !important; }
    .cz-catbar [data-cz-catalog-count] { white-space: nowrap; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
    .cz-catbar > .d-flex { min-width: 0; }
    .cz-catbar .form-select { min-width: 0; flex: 0 1 auto; }
    .cz-catbar .btn { flex: 0 0 auto; }
    /* La planche luxe est bord à bord : la barre s'aligne sur sa marge intérieure. */
    .cz-catbar-luxe {
        display: flex;
        justify-content: center;
        padding-left: 1rem;
        padding-right: 1rem;
    }
}