/* ============================================================
   Design Tiles — Custom Filter  v1.3.0
   ============================================================ */

/* ── Variables ─────────────────────────────────────────────── */
:root {
    --dtf-accent:    #633e3a;
    --dtf-bg:        #ffffff;
    --dtf-font:      inherit;
    --dtf-w:         380px;
    --dtf-ease:      cubic-bezier(0.4,0,0.2,1);
    --dtf-text:      #1a1a1a;
    --dtf-muted:     #6b6b6b;
    --dtf-border:    rgba(0,0,0,0.09);
    --dtf-shadow:    0 12px 60px rgba(0,0,0,0.16);
    --dtf-dur:       0.26s;
    --dtf-radius:    4px;
}

/* ============================================================
   NUCLEAR BULLET KILL
   Theme CSS often applies ul li { list-style:disc }
   These rules override with maximum specificity.
   ============================================================ */

#dtf-drawer ul,
#dtf-drawer ul li,
#dtf-drawer .dtf-checklist,
#dtf-drawer .dtf-checklist li,
#dtf-drawer .dtf-colour-list,
#dtf-drawer .dtf-colour-list li {
    list-style:       none !important;
    list-style-type:  none !important;
    list-style-image: none !important;
    padding-left:     0    !important;
    margin-left:      0    !important;
}

/* ============================================================
   DESKTOP FILTER TRIGGER
   ============================================================ */

.dtf-trigger--desktop {
    display:        inline-flex;
    align-items:    center;
    gap:            7px;
    padding:        8px 18px 8px 14px;
    background:     transparent;
    border:         1px solid var(--dtf-border);
    border-radius:  60px;
    font-family:    var(--dtf-font);
    font-size:      13px;
    font-weight:    500;
    color:          var(--dtf-text);
    cursor:         pointer;
    transition:     border-color .15s, color .15s, background .15s;
    white-space:    nowrap;
    line-height:    1;
    vertical-align: middle;
    float:          left;
    margin-right:   14px;
    margin-bottom:  8px;
}

.dtf-trigger--desktop:hover {
    border-color: var(--dtf-accent);
    color:        var(--dtf-accent);
}

.dtf-trigger--desktop[aria-expanded="true"] {
    background:   var(--dtf-accent);
    border-color: var(--dtf-accent);
    color:        #fff;
}

/* Active filter count badge */
.dtf-active-count {
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    min-width:       18px;
    height:          18px;
    padding:         0 4px;
    background:      var(--dtf-accent);
    color:           #fff;
    font-size:       10px;
    font-weight:     700;
    border-radius:   9px;
    line-height:     1;
}
.dtf-trigger--desktop[aria-expanded="true"] .dtf-active-count,
.dtf-trigger--mobile[aria-expanded="true"] .dtf-active-count {
    background: rgba(255,255,255,0.3);
}

@media (max-width: 767px) {
    .dtf-trigger--desktop { display: none !important; }
}

/* ============================================================
   MOBILE BAR: Filter (30%) | Sort (70%)
   ============================================================ */

.dtf-mobile-bar { display: none; }

@media (max-width: 767px) {
    .dtf-mobile-bar {
        display:       flex;
        align-items:   stretch;
        height:        44px;           /* definite height so child height:100% resolves */
        border:        1px solid var(--dtf-border);
        border-radius: 6px;
        overflow:      hidden;
        background:    #fff;
        margin-bottom: 16px;
        width:         100%;
        box-shadow:    0 1px 4px rgba(0,0,0,0.06);
    }
}

.dtf-trigger--mobile {
    flex:            0 0 30%;
    display:         flex;
    align-items:     center;
    justify-content: center;
    gap:             6px;
    padding:         0 8px;
    min-height:      44px;
    background:      #fafafa;
    border:          none;
    border-right:    1px solid var(--dtf-border);
    border-radius:   0;
    font-family:     var(--dtf-font);
    font-size:       13px;
    font-weight:     600;
    color:           var(--dtf-text);
    cursor:          pointer;
    transition:      background .15s, color .15s;
    white-space:     nowrap;
    line-height:     1;
}

.dtf-trigger--mobile:hover,
.dtf-trigger--mobile[aria-expanded="true"] {
    background: var(--dtf-accent);
    color:      #fff;
}

.dtf-mobile-sort {
    flex:            0 0 70%;
    display:         flex;
    align-items:     center;
    justify-content: center;
    padding:         0 12px;
    min-height:      44px;
}

/*
 * Collapse the form box so <select> becomes a direct flex child of
 * .dtf-mobile-sort. This sidesteps WooCommerce's own float/position
 * rules on .woocommerce-ordering and the height:100% chain entirely.
 */
.dtf-mobile-sort .woocommerce-ordering {
    display: contents;
}

/* Native <select> is now a direct flex item — .dtf-mobile-sort centers it */
.dtf-mobile-sort select.orderby {
    flex:            1 1 auto;
    height:          44px;
    border:          none !important;
    background:      transparent !important;
    font-size:       13px;
    font-weight:     500;
    color:           var(--dtf-text);
    padding:         0 28px 0 8px;
    margin:          0;
    -webkit-appearance: none;
    appearance:      none;
    text-align:      center;
    text-align-last: center;
    cursor:          pointer;
    outline:         none;
}

/* Select2 (if theme activates it) */
.dtf-mobile-sort .woocommerce-ordering .select2-container {
    width:       100% !important;
    height:      100% !important;
    display:     flex !important;
    align-items: center !important;
    border:      none;
    background:  transparent;
    margin:      0;
    padding:     0;
}

.dtf-mobile-sort .select2-container--default .select2-selection--single {
    border:      none !important;
    background:  transparent !important;
    height:      100% !important;
    width:       100% !important;
    display:     flex !important;
    align-items: center !important;
    padding:     0 !important;
}

.dtf-mobile-sort .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding:      0 20px 0 0 !important;
    text-align:   center !important;
    text-align-last: center !important;
    width:        100% !important;
    display:      block !important;
    line-height:  1.2 !important;
}

.dtf-mobile-sort .select2-container--default .select2-selection--single .select2-selection__arrow {
    top:       50% !important;
    right:     4px !important;
    transform: translateY(-50%) !important;
    height:    auto !important;
}

/* ============================================================
   OVERLAY
   ============================================================ */

.dtf-overlay {
    position:       fixed;
    inset:          0;
    background:     rgba(0,0,0,0.36);
    z-index:        999998;
    opacity:        0;
    pointer-events: none;
    transition:     opacity var(--dtf-dur) var(--dtf-ease);
}

.dtf-overlay.is-active {
    opacity:        1;
    pointer-events: auto;
}

/* ============================================================
   DRAWER
   ============================================================ */

.dtf-drawer {
    position:        fixed;
    top:             0;
    left:            0;
    width:           var(--dtf-w);
    max-width:       100vw;
    height:          100dvh;
    background:      var(--dtf-bg);
    font-family:     var(--dtf-font);
    color:           var(--dtf-text);
    z-index:         999999;
    display:         flex;
    flex-direction:  column;
    transform:       translateX(-100%);
    transition:      transform var(--dtf-dur) var(--dtf-ease);
    box-shadow:      var(--dtf-shadow);
    overflow:        hidden;
}

.dtf-drawer:not([hidden]) { display: flex; }
.dtf-drawer.is-open       { transform: translateX(0); }

/* ── Drawer header ─────────────────────────────────────────── */

.dtf-drawer__header {
    display:         flex;
    align-items:     center;
    justify-content: space-between;
    padding:         20px 24px;
    border-bottom:   1px solid var(--dtf-border);
    flex-shrink:     0;
}

.dtf-drawer__title {
    margin:         0;
    font-size:      13px;
    font-weight:    700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color:          var(--dtf-text);
}

.dtf-drawer__close {
    display:         flex;
    align-items:     center;
    justify-content: center;
    width:           36px;
    height:          36px;
    background:      transparent;
    border:          none;
    border-radius:   50%;
    cursor:          pointer;
    color:           var(--dtf-muted);
    transition:      background .12s, color .12s;
    padding:         0;
}

.dtf-drawer__close:hover {
    background: rgba(0,0,0,0.06);
    color:      var(--dtf-text);
}

/* ── Drawer body ───────────────────────────────────────────── */

.dtf-drawer__body {
    flex:                1;
    overflow-y:          auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}

.dtf-drawer__body::-webkit-scrollbar { width: 3px; }
.dtf-drawer__body::-webkit-scrollbar-thumb {
    background:    rgba(0,0,0,0.12);
    border-radius: 2px;
}

/* ── Drawer footer ─────────────────────────────────────────── */

.dtf-drawer__footer {
    display:     flex;
    gap:         10px;
    padding:     16px 20px;
    border-top:  1px solid var(--dtf-border);
    flex-shrink: 0;
    background:  var(--dtf-bg);
}

.dtf-clear-all {
    flex:          0 0 auto;
    padding:       10px 20px;
    background:    transparent;
    border:        1px solid var(--dtf-border);
    border-radius: 60px;
    font-size:     12px;
    font-weight:   500;
    color:         var(--dtf-muted);
    cursor:        pointer;
    transition:    border-color .12s, color .12s;
    font-family:   var(--dtf-font);
    white-space:   nowrap;
    letter-spacing: 0.04em;
}

.dtf-clear-all:hover {
    border-color: var(--dtf-text);
    color:        var(--dtf-text);
}

.dtf-apply {
    flex:            1;
    display:         flex;
    align-items:     center;
    justify-content: center;
    gap:             6px;
    padding:         10px 20px;
    background:      var(--dtf-accent);
    border:          none;
    border-radius:   60px;
    font-size:       12px;
    font-weight:     600;
    letter-spacing:  0.06em;
    color:           #fff;
    cursor:          pointer;
    transition:      opacity .12s;
    font-family:     var(--dtf-font);
    text-transform:  uppercase;
}

.dtf-apply:hover { opacity: 0.82; }

/* ============================================================
   PANELS
   ============================================================ */

.dtf-panel { border-bottom: 1px solid var(--dtf-border); }
.dtf-panel:last-child { border-bottom: none; }

.dtf-panel__toggle {
    display:         flex;
    align-items:     center;
    justify-content: space-between;
    width:           100%;
    padding:         16px 24px;
    background:      transparent;
    border:          none;
    font-family:     var(--dtf-font);
    font-size:       11px;
    font-weight:     700;
    letter-spacing:  0.1em;
    text-transform:  uppercase;
    color:           var(--dtf-text);
    cursor:          pointer;
    text-align:      left;
}

.dtf-panel__toggle:hover { color: var(--dtf-accent); }

.dtf-chevron { transition: transform .18s ease; flex-shrink: 0; }
.dtf-panel__toggle[aria-expanded="false"] .dtf-chevron { transform: rotate(-90deg); }

.dtf-panel__body {
    padding:  0 20px 20px;
    overflow: hidden;
}
.dtf-panel__body[hidden] { display: none; }

/* ── On Sale panel ─────────────────────────────────────────── */

.dtf-panel--onsale .dtf-panel__body { padding: 0; }

.dtf-toggle-row {
    display:         flex;
    align-items:     center;
    justify-content: space-between;
    padding:         14px 24px;
}

.dtf-toggle-label {
    font-size:      13px;
    font-weight:    500;
    color:          var(--dtf-text);
    letter-spacing: 0.01em;
}

.dtf-toggle {
    position:    relative;
    width:       42px;
    height:      24px;
    background:  transparent;
    border:      none;
    padding:     0;
    cursor:      pointer;
    flex-shrink: 0;
}

.dtf-toggle-track {
    display:       block;
    width:         42px;
    height:        24px;
    border-radius: 12px;
    background:    rgba(0,0,0,0.14);
    transition:    background var(--dtf-dur) var(--dtf-ease);
    position:      relative;
}

.dtf-toggle.is-active .dtf-toggle-track { background: var(--dtf-accent); }

.dtf-toggle-thumb {
    position:      absolute;
    top:           3px;
    left:          3px;
    width:         18px;
    height:        18px;
    border-radius: 50%;
    background:    #fff;
    box-shadow:    0 1px 3px rgba(0,0,0,0.22);
    transition:    transform var(--dtf-dur) var(--dtf-ease);
}

.dtf-toggle.is-active .dtf-toggle-thumb { transform: translateX(18px); }

/* ============================================================
   PRICE SLIDER
   ============================================================ */

.dtf-price-display {
    display:       flex;
    align-items:   center;
    gap:           8px;
    margin-bottom: 16px;
    font-size:     14px;
    font-weight:   500;
    color:         var(--dtf-text);
}

.dtf-price-sep { color: var(--dtf-muted); }

.dtf-range-wrap {
    position:    relative;
    height:      26px;
    display:     flex;
    align-items: center;
}

.dtf-range-track {
    position:       absolute;
    left:           0;
    right:          0;
    height:         3px;
    background:     rgba(0,0,0,0.10);
    border-radius:  2px;
    pointer-events: none;
}

.dtf-range-fill {
    position:      absolute;
    height:        100%;
    background:    var(--dtf-accent);
    border-radius: 2px;
}

.dtf-range {
    position:       absolute;
    width:          100%;
    left:           0;
    height:         3px;
    background:     transparent;
    border:         none;
    outline:        none;
    pointer-events: none;
    -webkit-appearance: none;
    appearance:     none;
}

.dtf-range::-webkit-slider-thumb {
    -webkit-appearance: none;
    width:          18px;
    height:         18px;
    border-radius:  50%;
    background:     #fff;
    border:         2px solid var(--dtf-accent);
    box-shadow:     0 1px 4px rgba(0,0,0,0.18);
    cursor:         pointer;
    pointer-events: auto;
    transition:     transform .1s;
}

.dtf-range::-webkit-slider-thumb:hover,
.dtf-range::-webkit-slider-thumb:active { transform: scale(1.15); }

.dtf-range::-moz-range-thumb {
    width:          14px;
    height:         14px;
    border-radius:  50%;
    background:     #fff;
    border:         2px solid var(--dtf-accent);
    box-shadow:     0 1px 4px rgba(0,0,0,0.18);
    cursor:         pointer;
    pointer-events: auto;
}

/* ============================================================
   SEARCH INPUT
   ============================================================ */

.dtf-search-wrap {
    position:      relative;
    margin-bottom: 12px;
}

.dtf-search {
    width:         100%;
    padding:       8px 14px;
    border:        1px solid var(--dtf-border);
    border-radius: var(--dtf-radius);
    font-size:     13px;
    font-family:   var(--dtf-font);
    color:         var(--dtf-text);
    background:    #f7f7f7;
    outline:       none;
    transition:    border-color .12s, background .12s;
    box-sizing:    border-box;
    letter-spacing: 0.01em;
}

.dtf-search:focus {
    border-color: var(--dtf-accent);
    background:   #fff;
    box-shadow:   0 0 0 3px rgba(99,62,58,0.08);
}

.dtf-search::placeholder {
    color:       var(--dtf-muted);
    font-size:   12px;
    font-style:  italic;
}

/* ============================================================
   SCROLL BOX — unified single-section filter container.
   Search pinned at top; all items scroll in one list below.
   ~10 items visible by default, rest accessible by scroll.
   ============================================================ */

.dtf-scroll-box {
    border:        1px solid var(--dtf-border);
    border-radius: var(--dtf-radius);
    overflow:      hidden;
    background:    rgba(0,0,0,0.015);
}

.dtf-scroll-box__search {
    border-bottom: 1px solid var(--dtf-border);
    background:    #f7f7f7;
}

.dtf-scroll-box__search .dtf-search {
    border:        none !important;
    border-radius: 0    !important;
    background:    transparent !important;
    box-shadow:    none !important;
    margin:        0;
}

.dtf-scroll-box__search .dtf-search:focus {
    background: #fff !important;
    box-shadow: none !important;
}

.dtf-scroll-box__items {
    max-height: 280px;
    overflow-y: auto;
    padding:    4px 0;
}

.dtf-scroll-box__items::-webkit-scrollbar { width: 3px; }
.dtf-scroll-box__items::-webkit-scrollbar-thumb {
    background:    rgba(0,0,0,0.14);
    border-radius: 2px;
}

/* Slightly tighter rows inside the box to fit ~10 items in 280px */
.dtf-scroll-box__items .dtf-check {
    padding-top:    7px;
    padding-bottom: 7px;
    padding-left:   10px;
    padding-right:  6px;
}

/* ============================================================
   CHECKLIST (size panel + extra attrs)
   ============================================================ */

.dtf-checklist {
    list-style: none !important;
    margin:     0 0 4px;
    padding:    0;
    display:    flex;
    flex-direction: column;
    gap:        1px;
}

.dtf-checklist li {
    margin:  0;
    padding: 0;
}

/* ── Check button ──────────────────────────────────────────── */

.dtf-check {
    display:       flex;
    align-items:   center;
    gap:           11px;
    width:         100%;
    padding:       8px 6px;
    background:    transparent;
    border:        none;
    border-radius: var(--dtf-radius);
    font-family:   var(--dtf-font);
    font-size:     13px;
    color:         var(--dtf-text);
    cursor:        pointer;
    text-align:    left;
    transition:    background .1s;
    line-height:   1.3;
}

.dtf-check:hover { background: rgba(0,0,0,0.04); }

.dtf-check.is-active { font-weight: 600; }

/* ── Check box (square tick) ──────────────────────────────── */

.dtf-check-box {
    flex-shrink:     0;
    width:           15px;
    height:          15px;
    border:          1.5px solid rgba(0,0,0,0.18);
    border-radius:   3px;
    background:      #fff;
    display:         flex;
    align-items:     center;
    justify-content: center;
    transition:      border-color .1s, background .1s;
}

.dtf-check.is-active .dtf-check-box {
    background:   var(--dtf-accent);
    border-color: var(--dtf-accent);
    color:        #fff;
}

.dtf-check-label {
    flex:          1;
    overflow:      hidden;
    text-overflow: ellipsis;
    white-space:   nowrap;
    letter-spacing: 0.01em;
}

.dtf-check-count {
    font-size:   11px;
    color:       var(--dtf-muted);
    margin-left: auto;
    flex-shrink: 0;
    min-width:   18px;
    text-align:  right;
}

/* ── Disabled state ────────────────────────────────────────── */
/* Available but not in current filtered result set — stay visible, grayed */

.dtf-check--disabled {
    opacity:        0.32;
    pointer-events: none;
    cursor:         default;
}

/* ============================================================
   COLOUR LIST — swatch dot + checkbox + name + count
   ============================================================ */

.dtf-colour-list {
    list-style: none !important;
    margin:     0;
    padding:    0;
}

.dtf-colour-list .dtf-check {
    display:       flex;
    align-items:   center;
    gap:           11px;
    width:         100%;
    padding:       8px 6px;
    background:    none;
    border:        none;
    border-radius: var(--dtf-radius);
    cursor:        pointer;
    text-align:    left;
    transition:    background .1s;
    font-size:     13px;
    color:         var(--dtf-text);
    line-height:   1.3;
}

.dtf-colour-list .dtf-check:hover { background: rgba(0,0,0,0.04); }

.dtf-colour-list .dtf-check.is-active { color: var(--dtf-text); font-weight: 600; }

/* Colour swatch circle */
.dtf-colour-dot {
    flex-shrink:   0;
    width:         22px;
    height:        22px;
    border-radius: 50%;
    display:       inline-block;
    box-shadow:    0 0 0 1px rgba(0,0,0,0.10);
}

/* Checkbox tick box */
.dtf-colour-list .dtf-check-box {
    flex-shrink:     0;
    width:           15px;
    height:          15px;
    border:          1.5px solid rgba(0,0,0,0.18);
    border-radius:   3px;
    display:         flex;
    align-items:     center;
    justify-content: center;
    background:      #fff;
    color:           var(--dtf-accent);
    transition:      border-color .1s, background .1s;
}

.dtf-colour-list .dtf-check.is-active .dtf-check-box {
    background:   var(--dtf-accent);
    border-color: var(--dtf-accent);
    color:        #fff;
}

.dtf-colour-list .dtf-check-label {
    flex:          1;
    font-size:     13px;
    line-height:   1.3;
    letter-spacing: 0.01em;
    overflow:      hidden;
    text-overflow: ellipsis;
    white-space:   nowrap;
}

.dtf-colour-list .dtf-check-count {
    margin-left: auto;
    font-size:   11px;
    color:       var(--dtf-muted);
    flex-shrink: 0;
    min-width:   18px;
    text-align:  right;
}

/* ============================================================
   ACTIVE FILTER TAGS
   ============================================================ */

.dtf-active-filters {
    display:       flex;
    flex-wrap:     wrap;
    gap:           6px;
    margin-top:    8px;
    margin-bottom: 16px;
    clear:         both;
}

/* ============================================================
   FILTERBAR WRAP — desktop: Filter button + pills on one row
   ============================================================ */

@media (min-width: 768px) {
    .dtf-filterbar-wrap {
        display:     flex;
        align-items: center;
        flex-wrap:   wrap;
        gap:         10px;
        margin-bottom: 16px;
    }

    /* Override the float that the standalone button uses */
    .dtf-filterbar-wrap .dtf-trigger--desktop {
        float:         none !important;
        margin-right:  0 !important;
        margin-bottom: 0 !important;
        flex-shrink:   0;
    }

    /* Pills sit inline: reset block margins and clear */
    .dtf-filterbar-wrap .dtf-active-filters {
        display:     flex !important;
        flex-wrap:   wrap;
        gap:         6px;
        clear:       none !important;
        margin:      0 !important;
        align-items: center;
    }
}

.dtf-active-filters:empty { display: none; }

.dtf-tag {
    display:       inline-flex;
    align-items:   center;
    gap:           5px;
    padding:       4px 10px;
    background:    rgba(99,62,58,0.07);
    border:        1px solid rgba(99,62,58,0.18);
    border-radius: 60px;
    font-size:     12px;
    font-weight:   500;
    color:         var(--dtf-accent);
    cursor:        pointer;
    transition:    background .1s, border-color .1s;
    white-space:   nowrap;
    line-height:   1.3;
    font-family:   var(--dtf-font);
}

.dtf-tag:hover {
    background:  rgba(99,62,58,0.14);
    border-color: var(--dtf-accent);
}

.dtf-tag__remove {
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    width:           14px;
    height:          14px;
    border-radius:   50%;
    background:      rgba(99,62,58,0.14);
    font-size:       10px;
    line-height:     1;
    flex-shrink:     0;
}

.dtf-tag--price {
    background:   rgba(99,62,58,0.10);
    border-color: rgba(99,62,58,0.25);
    font-weight:  600;
}

/* ============================================================
   LOADING STATE
   ============================================================ */

.dtf-loading {
    position:       relative;
    pointer-events: none;
    min-height:     200px;
}

.dtf-loading::after {
    content:       '';
    position:      absolute;
    inset:         0;
    background:    rgba(255,255,255,0.60);
    z-index:       5;
    border-radius: inherit;
}

.dtf-spinner {
    position:         absolute;
    top:              50%;
    left:             50%;
    transform:        translate(-50%, -50%);
    z-index:          6;
    width:            26px;
    height:           26px;
    border:           2.5px solid rgba(0,0,0,0.08);
    border-top-color: var(--dtf-accent);
    border-radius:    50%;
    animation:        dtf-spin 0.65s linear infinite;
}

@keyframes dtf-spin { to { transform: translate(-50%,-50%) rotate(360deg); } }

/* ============================================================
   NO RESULTS
   ============================================================ */

.dtf-no-results {
    text-align:  center;
    padding:     48px 20px;
    font-size:   14px;
    color:       var(--dtf-muted);
    grid-column: 1 / -1;
    letter-spacing: 0.01em;
}

/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width: 480px) {
    :root { --dtf-w: 100vw; }
    .dtf-drawer__footer { flex-direction: column; }
    .dtf-apply { width: 100%; }
}

/* WC ordering on mobile — suppress native widget, ours replaces it */
@media (max-width: 767px) {
    .woocommerce-ordering:not(.dtf-mobile-sort .woocommerce-ordering) {
        display: none !important;
    }
}

/* ============================================================
   SUPPRESS EXTERNAL ACTIVE-FILTER DISPLAYS
   Other filter plugins (YITH WCAN, WOOF, Layered Nav) output
   their own "Clear All / active tags" row which duplicates ours.
   ============================================================ */

/* YITH WooCommerce AJAX Product Filter */
.yith-wcan-active-filters-container,
.yith-wcan-filters-reset,
.yith-wcan-reset-button {
    display: none !important;
}

/* WOOF – WooCommerce Products Filter */
.woof_container_inner .woof_reset_search_form,
.woof_products_top_panel:not(:empty) {
    display: none !important;
}

/* WooCommerce built-in Active Filters widget */
.widget_layered_nav_filters,
.woocommerce-widget-layered-nav-list {
    display: none !important;
}

/* BeRocket AJAX Product Filters */
.berocket_aapf_widget-chosen-filters { display: none !important; }

/* WooBeWoo AJAX Product Filter */
.wcapf-active-filters-wrapper { display: none !important; }