.fm-catalog-filter {
    --fm-filter-primary: var(--teal, #087a3d);
    --fm-filter-ink: var(--ink, #17372b);
    width: 100%;
    margin: 2px 0 20px;
    padding: 13px;
    background: linear-gradient(120deg, #f4faf6, #f2f9fd);
    border: 1px solid #dce9e4;
    border-radius: 15px;
}

.fm-catalog-filter__heading {
    display: flex;
    margin-bottom: 9px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.fm-catalog-filter__heading strong { color: var(--fm-filter-ink); font-size: .86rem; }
.fm-catalog-filter__actions { display: flex; align-items: center; gap: 9px; }
.fm-catalog-filter__actions a { color: var(--fm-filter-primary); font-size: .61rem; font-weight: 800; text-decoration: underline; text-underline-offset: 2px; }
.fm-catalog-filter__toggle { display: none; }

.fm-catalog-filter form {
    display: grid;
    grid-template-columns: minmax(190px, 1.65fr) repeat(2, minmax(112px, 1fr)) repeat(2, minmax(88px, .72fr)) minmax(118px, .9fr) auto;
    align-items: end;
    gap: 8px;
}

.fm-catalog-filter__fields { display: contents; }
.fm-catalog-filter label { display: flex; min-width: 0; flex-direction: column; gap: 5px; color: #49645c; font-size: .57rem; font-weight: 800; }
.fm-catalog-filter :is(input, select) { width: 100%; min-width: 0; height: 39px; padding: 0 9px; color: var(--fm-filter-ink); background: #fff; border: 1px solid #d4e2dd; border-radius: 9px; outline: 0; font-size: .66rem; }
.fm-catalog-filter :is(input, select):focus { border-color: var(--fm-filter-primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--fm-filter-primary) 10%, transparent); }
.fm-filter-field { position: relative; display: flex; align-items: center; }
.fm-filter-field svg { position: absolute; left: 10px; width: 16px; fill: none; stroke: var(--fm-filter-primary); stroke-width: 1.8; pointer-events: none; }
.fm-filter-field input { padding-left: 32px; }
.fm-catalog-filter button { min-height: 39px; padding: 0 14px; color: #fff; background: var(--fm-filter-primary); border: 0; border-radius: 9px; font-size: .63rem; font-weight: 850; cursor: pointer; }
.fm-catalog-filter__search-submit { display: none; white-space: nowrap; }

@media (max-width: 1050px) {
    .fm-catalog-filter form { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .fm-filter-search { grid-column: span 2; }
}

@media (max-width: 700px) {
    .fm-catalog-filter { margin-bottom: 15px; padding: 10px; border-radius: 13px; }
    .fm-catalog-filter__heading { margin-bottom: 7px; }
    .fm-catalog-filter__heading strong { font-size: .8rem; }
    .fm-catalog-filter__actions { flex-shrink: 0; gap: 7px; }
    .fm-catalog-filter-js .fm-catalog-filter__toggle { display: inline-flex; min-height: 33px; padding: 0 9px; align-items: center; justify-content: center; gap: 5px; color: var(--fm-filter-primary); background: #fff; border: 1px solid #bfd8cf; }
    .fm-catalog-filter__toggle svg { width: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
    .fm-catalog-filter__toggle span { font-size: .63rem; }
    .fm-catalog-filter__toggle small { display: grid; width: 18px; height: 18px; place-items: center; color: #fff; background: var(--fm-filter-primary); border-radius: 50%; font-size: .55rem; line-height: 1; }
    .fm-catalog-filter form { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
    .fm-filter-search > span:first-child { display: none; }
    .fm-filter-search input { height: 42px; font-size: .73rem; }
    .fm-catalog-filter__search-submit { display: block; min-height: 42px; }
    .fm-catalog-filter__fields { display: grid; grid-column: 1 / -1; margin-top: 8px; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .fm-catalog-filter-js .fm-catalog-filter__fields { display: none; }
    .fm-catalog-filter-js .fm-catalog-filter.is-open .fm-catalog-filter__fields { display: grid; }
    .fm-catalog-filter__fields .fm-filter-order, .fm-catalog-filter__submit { grid-column: 1 / -1; }
    .fm-catalog-filter__fields :is(input, select) { height: 39px; font-size: .68rem; }
    .fm-catalog-filter__submit { min-height: 40px; }
}