html { --catalog-columns: 3; }
html[data-catalog-columns="5"] { --catalog-columns: 5; }

/* One layout for categories, collections, sale and both search result lists. */
.catalog[data-catalog-grid] {
    display: grid;
    grid-template-columns: repeat(var(--catalog-columns), minmax(0, 1fr));
    column-count: auto;
    column-width: auto;
    gap: 0 2rem;
    align-items: start;
}
.catalog[data-catalog-grid] > .catalog_item {
    display: block;
    min-width: 0;
    width: auto;
    margin: 0;
    flex: initial;
}
.catalog[data-catalog-grid] .catalog_item__image img { display: block; width: 100%; height: auto; }

.catalog-view {
    position: sticky;
    top: calc(6rem + 2rem);
    z-index: 5;
    display: flex;
    justify-content: flex-end;
    width: max-content;
    height: 3.4rem;
    margin-left: auto;
    margin-bottom: -3.4rem;
}
.catalog-view__buttons {
    display: flex;
    align-items: center;
    gap: 1.2rem;
    padding: .8rem;
    background: #fefef8;
}
.catalog-view button { width: 2.4rem; height: 1.8rem; color: #c1c1c0; cursor: pointer; }
html:not([data-catalog-columns="5"]) [data-catalog-view="3"],
html[data-catalog-columns="5"] [data-catalog-view="5"] { color: red; }
.catalog-view button:focus-visible { outline: 2px solid #103f40; outline-offset: 4px; }

@media (max-width: 767px) {
    .catalog[data-catalog-grid] { --catalog-columns: 2; gap: 0 1rem; }
    .catalog-view { display: none; }
}
