.product-section { overflow: visible; }
.product-section .section-heading { position: relative; }
.product-section.filter-open .section-heading { z-index: 90; }
.catalog-controls { position: relative; display: flex; flex-wrap: wrap; gap: 10px; z-index: 12; }
.catalog-controls.panel-open { z-index: 70; }
.catalog-control { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 46px; padding: 9px 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface, #fff); color: var(--ink); font: 600 14px var(--font); cursor: pointer; }
.catalog-control:hover, .catalog-control[aria-expanded="true"] { border-color: var(--brand); box-shadow: 0 0 0 3px rgb(245 124 0 / 16%); }
.catalog-control-icon { font-size: 19px; line-height: 1; color: var(--brand); }
.filter-badge { display: inline-grid; place-items: center; min-width: 21px; height: 21px; padding: 0 5px; border-radius: 20px; background: var(--brand); color: #263238; font: 700 11px 'DM Sans', sans-serif; }
.catalog-panel { position: absolute; top: calc(100% + 10px); inset-inline-end: 0; width: min(390px, calc(100vw - 36px)); max-height: min(72vh, 620px); overflow-y: auto; padding: 18px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface, #fff); color: var(--ink); box-shadow: 0 20px 55px rgb(0 0 0 / 22%); text-align: start; }
.catalog-panel[hidden], .filter-badge[hidden] { display: none !important; }
.panel-heading, .panel-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.panel-heading strong { font-size: 17px; }
.panel-close { width: 38px; height: 38px; border-radius: 50%; background: var(--soft); font-size: 25px; line-height: 1; }
.filter-search-label { display: block; margin: 15px 0 7px; color: var(--muted); font-size: 13px; font-weight: 600; }
#filterCategorySearch { width: 100%; min-height: 46px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--soft); color: var(--ink); font: 16px var(--font); }
.filter-category-list { display: grid; gap: 5px; max-height: 290px; overflow-y: auto; margin: 12px 0; padding-inline-end: 4px; }
.filter-category-option { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 44px; padding: 10px 12px; border-radius: 10px; color: var(--ink); text-align: start; font-size: 14px; }
.filter-category-option:hover { background: var(--soft); }
.filter-category-option[aria-pressed="true"] { background: var(--surface-tint); color: var(--brand); font-weight: 700; }
.filter-category-option small { color: var(--muted); font: 500 12px 'DM Sans', sans-serif; }
.filter-offer { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); color: var(--ink); font-weight: 600; text-align: start; }
.filter-offer[aria-pressed="true"] { border-color: var(--brand); background: var(--surface-tint); color: var(--brand); }
.filter-check { display: grid; place-items: center; width: 22px; height: 22px; border: 1px solid var(--line); border-radius: 6px; color: transparent; }
.filter-offer[aria-pressed="true"] .filter-check { background: var(--brand); border-color: var(--brand); color: #263238; }
.panel-actions { margin-top: 16px; padding-top: 15px; border-top: 1px solid var(--line); }
.panel-reset { min-height: 44px; padding: 8px 10px; color: var(--muted); text-decoration: underline; }
.panel-apply { min-height: 44px; padding: 10px 18px; border-radius: 9px; background: var(--brand); color: #263238; font-weight: 700; }
.catalog-control:focus-visible, .catalog-panel button:focus-visible, #filterCategorySearch:focus-visible { outline: 3px solid var(--yellow); outline-offset: 2px; }
html[data-theme="dark"] .catalog-control, html[data-theme="dark"] .catalog-panel { background: var(--surface); border-color: var(--line); color: var(--ink); }
html[data-theme="dark"] #filterCategorySearch { background: var(--soft); border-color: var(--line); color: var(--ink); }
html[data-theme="dark"] .filter-category-option[aria-pressed="true"], html[data-theme="dark"] .filter-offer[aria-pressed="true"] { background: #35454a; color: var(--yellow); }

@media (min-width: 681px) {
  .catalog-panel { position: fixed; top: var(--filter-panel-top, 180px); inset-inline-end: auto; inset-inline-start: auto; right: auto; left: var(--filter-panel-left, 18px); max-height: var(--filter-panel-max-height, min(72vh, 620px)); }
}

@media (max-width: 680px) {
  .catalog-controls { width: 100%; display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .catalog-control { min-width: 0; width: 100%; padding-inline: 10px; }
  .catalog-control > span:nth-child(2) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .catalog-panel { position: fixed; top: auto; inset-inline: 0; bottom: 0; width: 100%; max-height: min(82dvh, 700px); padding: 20px 18px calc(20px + env(safe-area-inset-bottom, 0px)); border-radius: 22px 22px 0 0; z-index: 80; }
}