/* AUTOPARTS_KAZ — фильтр горизонтальной полосой над таблицей (как на tigerauto.kz).
Подключать ОТДЕЛЬНЫМ файлом на catalog.html, В КОНЦЕ , ПОСЛЕ style.css:
Ничего в style.css не меняется. Работает только на десктопе (>900px) —
мобильная версия (плашка фильтров снизу, кнопка "Фильтры") не тронута,
там всё как было: .sidebar на <=900px управляется правилами из style.css. */
@media (min-width: 901px) {
.layout {
grid-template-columns: 1fr;
}
.sidebar {
position: static;
align-self: auto;
flex-direction: row;
flex-wrap: wrap;
align-items: flex-end;
gap: 14px 20px;
padding: 18px 20px;
margin-bottom: 24px;
background: var(--card);
border: 1px solid var(--line);
border-radius: var(--radius);
}
.sidebar .filter-block {
flex: 1 1 170px;
min-width: 170px;
}
/* "Модель авто" и "Категория запчасти" — самые длинные значения, им нужно больше места */
.sidebar .filter-block:nth-child(1) {
flex: 1.6 1 230px;
min-width: 230px;
}
.sidebar .filter-block:nth-child(2) {
flex: 1.3 1 190px;
min-width: 190px;
}
.sidebar .filter-block h3 {
margin-bottom: 6px;
}
/* блок "Наличие" — чекбокс, а не select; выравниваем по низу вместе с остальными */
.sidebar .filter-block:has(.check) {
flex: 0 0 auto;
padding-bottom: 10px;
}
.sidebar > .btn--block {
flex: 0 0 auto;
width: auto;
padding: 10px 22px;
}
}