.catalog-filter-form {
    display: grid;
    gap: var(--catalog-filter-gap, 10px);
    margin: var(--catalog-filter-margin, 0);
    padding: var(--catalog-filter-padding, 12px);
    border: 1px solid var(--catalog-filter-border, var(--line));
    border-radius: var(--catalog-filter-radius, var(--radius));
    background: var(--catalog-filter-bg, var(--surface));
    box-shadow: var(--catalog-filter-shadow, var(--shadow-soft));
}

.catalog-filter-form label {
    display: grid;
    gap: var(--catalog-filter-label-gap, 5px);
}

.catalog-filter-form label span {
    color: var(--catalog-filter-label-color, var(--muted));
    font-size: var(--catalog-filter-label-size, .75rem);
    font-weight: var(--catalog-filter-label-weight, 850);
}

.catalog-filter-form input,
.catalog-filter-form select {
    width: 100%;
    min-height: var(--catalog-filter-control-height, 40px);
    border: 1px solid var(--catalog-filter-control-border, var(--line));
    border-radius: var(--catalog-filter-control-radius, 10px);
    background: var(--catalog-filter-control-bg, var(--surface));
    color: var(--catalog-filter-control-color, var(--text));
    font-size: var(--catalog-filter-control-size, .85rem);
    font-weight: var(--catalog-filter-control-weight, 760);
}

.catalog-filter-form button,
.catalog-pagination a {
    display: inline-flex;
    min-height: var(--catalog-action-height, 40px);
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 0;
    border-radius: var(--catalog-action-radius, 10px);
    background: var(--catalog-action-bg, var(--primary));
    color: var(--catalog-action-color, var(--cream));
    font-size: var(--catalog-action-size, .85rem);
    font-weight: 900;
    cursor: pointer;
}

.catalog-filter-form button:hover,
.catalog-pagination a:hover {
    text-decoration: none;
}

.catalog-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: var(--catalog-pagination-padding, 8px 0 0);
}

.catalog-pagination > span {
    color: var(--catalog-pagination-color, var(--muted));
    font-size: var(--catalog-pagination-size, .75rem);
    font-weight: var(--catalog-pagination-weight, 800);
}

.catalog-empty {
    display: grid;
    justify-items: center;
    gap: 10px;
    padding: var(--catalog-empty-padding, 24px 16px);
    border: 1px solid var(--catalog-empty-border, var(--line));
    border-radius: var(--catalog-empty-radius, var(--radius));
    background: var(--catalog-empty-bg, var(--surface));
    text-align: center;
    box-shadow: var(--catalog-empty-shadow, var(--shadow-soft));
}

.catalog-empty__icon {
    display: inline-flex;
    width: var(--catalog-empty-icon-size, 48px);
    height: var(--catalog-empty-icon-size, 48px);
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--catalog-empty-icon-bg, var(--brand-soft));
    color: var(--catalog-empty-icon-color, var(--brand));
}

.catalog-empty strong {
    color: var(--catalog-empty-title-color, var(--text));
    font-size: var(--catalog-empty-title-size, 1rem);
    font-weight: 900;
}

.catalog-empty p {
    max-width: 44ch;
    margin: 0;
    color: var(--catalog-empty-text-color, var(--muted));
    font-size: var(--catalog-empty-text-size, .85rem);
    font-weight: 700;
}