/* Catalog filter presentation. Functional selectors remain in products.css. */
.catalog-heading {
    margin: 20px 0 30px;
}

.panel-header__eyebrow {
    display: block;
    margin-bottom: 7px;
    color: #c66b23;
    font: 700 .7rem/1.4 Poppins, sans-serif;
    letter-spacing: .14em;
}

.catalog-heading h1 {
    margin: 0;
    color: #1f2937;
    font-size: 2.8rem;
    font-weight: 700;
    line-height: 1.2;
}
.catalog-heading h1::after {
    content: "";
    display: block;
    width: 80px;
    height: 4px;
    margin: 20px 0 0;
    border-radius: 2px;
    background: #e67e22;
}

.products-layout { gap: 25px; }
.filter-sidebar { width: 252px; top: 88px; }
.filter-sidebar-inner {
    max-height: calc(100dvh - 110px);
    overflow: auto;
    border: 1px solid #ece7e2;
    border-radius: 18px;
    box-shadow: 0 10px 35px rgb(39 27 17 / 6%);
    scrollbar-width: thin;
}

.filter-sidebar-head {
    padding: 18px 18px 16px;
    background: #25201d;
    border: 0;
}

.filter-sidebar-head > span {
    color: #fff;
    font-size: .98rem;
    letter-spacing: 0;
    text-transform: none;
}

.filter-sidebar-head > span i { margin-right: 7px; color: #f5a45c; }
.clear-all-btn { color: #ffd0a6; }
.clear-all-btn:hover { color: #fff; }
.filter-section { border-color: #f1eeeb; }
.filter-section-toggle { padding: 16px 18px 12px; color: #24201d; }
.filter-section-toggle:hover { background: #fffaf6; }
.filter-section-toggle > span { display: inline-flex; align-items: center; gap: 9px; }
.filter-section-toggle > span i { width: 17px; color: #df873d; font-size: .8rem; text-align: center; }
.toggle-chevron { color: #a59b92; }
.filter-section-body .filter-opts { padding: 0 11px 15px; gap: 3px; }
.filter-opt {
    min-height: 38px;
    padding: 9px 11px;
    border: 1px solid transparent;
    border-radius: 10px;
    color: #625d58;
}
.filter-opt:hover { background: #faf6f2; border-color: #f1e4d7; }
.filter-opt.is-active {
    background: #fff3e7;
    border-color: #f2d4b8;
    color: #a85011;
}
.filter-opt-dot { width: 15px; height: 15px; }
.price-range-wrap { padding: 5px 17px 20px; }
.price-range-input-box { min-height: 38px; border-radius: 10px; }
.price-num-input { color: #24201d; font-weight: 600; }

.products-toolbar {
    min-height: 52px;
    margin-bottom: 16px;
    padding: 0 4px 10px;
    border-bottom: 1px solid #f0ece8;
}
.results-count { color: #7a736d; font-size: .85rem; font-weight: 600; }
.btn-filter-mobile {
    border: 1px solid #e9d4c1;
    border-radius: 12px;
    background: #fff7f0;
    color: #a75718;
    box-shadow: 0 2px 8px rgb(100 50 0 / 5%);
}
.btn-filter-mobile:hover { border-color: #e6a76e; background: #fff1e4; }
.btn-filter-mobile:focus-visible,
.filter-section-toggle:focus-visible,
.filter-opt:focus-visible,
.panel-option:focus-visible,
.close-panel-btn:focus-visible,
.panel-footer button:focus-visible {
    outline: 3px solid #ec994e;
    outline-offset: 2px;
}

.filter-panel-overlay { background: rgb(31 24 20 / 55%); }
.filter-panel {
    width: min(440px, 100%);
    max-width: none;
    height: 100dvh;
    border-radius: 22px 0 0 22px;
    background: #fffdfb;
    box-shadow: -18px 0 50px rgb(24 19 15 / 20%);
    visibility: hidden;
    pointer-events: none;
    transition: right .38s cubic-bezier(.23, 1, .32, 1), visibility 0s linear .38s;
}
.filter-panel.is-open { visibility: visible; pointer-events: auto; transition: right .38s cubic-bezier(.23, 1, .32, 1); }
.panel-header {
    padding: 22px 22px 19px;
    border-color: #f0e9e3;
    background: #fffaf6;
}
.panel-header h3 { font-size: 1.4rem; color: #211e1b; }
.panel-header__eyebrow { font-size: .62rem; margin-bottom: 2px; }
.close-panel-btn {
    width: 38px;
    height: 38px;
    border: 1px solid #e9ddd3;
    border-radius: 11px;
    background: #fff;
    color: #5b5049;
    font-size: 1.5rem;
    line-height: 1;
}
.panel-content { gap: 0; padding: 0 20px; }
.panel-group { padding: 21px 2px; border-bottom: 1px solid #f0e9e3; }
.panel-group:last-child { border-bottom: 0; }
.panel-group h4 { margin-bottom: 12px; color: #3a312b; font-size: .83rem; letter-spacing: 0; text-transform: none; }
.panel-options { gap: 8px; }
.panel-option {
    padding: 10px 15px;
    border: 1px solid #ebe4de;
    border-radius: 11px;
    background: #fff;
    color: #5d554f;
    font-weight: 600;
}
.panel-option:hover { border-color: #e8b78c; background: #fff9f4; }
.panel-option.active { border-color: #eeaa70; background: #fff0e1; color: #a64d0a; }
.panel-option.filter-check { width: auto; }
.panel-group .price-range-wrap { padding: 4px 2px 0; }
.panel-footer {
    padding: 15px 20px max(18px, env(safe-area-inset-bottom));
    border-color: #eee5dd;
    box-shadow: 0 -10px 25px rgb(24 19 15 / 5%);
}
.btn-clear-filters,
.btn-apply-filters { min-height: 46px; border-radius: 12px; }
.btn-clear-filters { border-color: #e8ddd4; }
.btn-apply-filters { background: #25201d; box-shadow: none; }
.btn-apply-filters:hover { background: #e67e22; }

@media (max-width: 768px) {
    .catalog-heading { margin: 12px 0 22px; }
    .catalog-heading h1 { font-size: 1.8rem; }
    .products-toolbar { margin-bottom: 12px; padding: 10px 2px; }
    .filter-panel { border-radius: 18px 0 0 18px; }
}

@media (max-width: 480px) {
    .filter-panel { width: 100%; border-radius: 18px 18px 0 0; }
    .panel-header { padding: 17px 18px; }
    .panel-content { padding: 0 16px; }
    .panel-footer { padding-left: 16px; padding-right: 16px; }
}