.catalog-categories,
.catalog-active-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-block: 16px;
}

.catalog-categories a,
.catalog-active-filters a {
    padding: 6px 12px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: var(--white);
    color: var(--blue-dark);
    font-size: .88rem;
    text-decoration: none;
    overflow-wrap: anywhere;
}

.catalog-categories a:hover,
.catalog-active-filters a:hover {
    border-color: var(--blue);
    background: var(--blue-soft);
}

.catalog-categories a[aria-current] {
    border-color: var(--blue);
    background: var(--blue);
    color: white;
}

.catalog-active-filters span {
    margin-inline-start: 5px;
    font-weight: 700;
}

.catalog-active-filters .catalog-clear {
    border-color: transparent;
    background: transparent;
    color: var(--blue);
    text-decoration: underline;
}

.filters.catalog-filters {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px 16px;
    padding: 16px;
}

.catalog-filters label,
.catalog-filters select,
.catalog-filters input:not([type=checkbox]) {
    min-width: 0;
    width: 100%;
}

.catalog-filters .catalog-search {
    grid-column: span 2;
}

@media (max-width: 780px) {
    .filters.catalog-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}