.gpcf-banners {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 0 0 20px;
}

.gpcf-banner {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border-radius: 8px;
}

.gpcf-banner p {
    margin: 0;
    font-size: 14px;
}

.gpcf-banner i {
    font-size: 20px;
    flex-shrink: 0;
}

.gpcf-banner-info {
    background: #e6f1fb;
    color: #0c447c;
}

.gpcf-banner-warning {
    background: #faeeda;
    color: #854f0b;
}

.gpcf-banner-success {
    background: #eaf3de;
    color: #3b6d11;
}

/* Fix: the theme's "hidden-sm-down" utility class appears to hide the
   category sidebar (tree + facet filters) even on desktop widths, where
   it should normally be visible. This override forces it back to visible
   from the tablet/desktop breakpoint up, scoped only to #left-column so
   it cannot affect any other "hidden-sm-down" usage on the site (e.g. in
   the header or menu). */
@media (min-width: 768px) {
    #left-column.hidden-sm-down,
    #left-column .hidden-sm-down {
        display: block !important;
    }
}

/* Filters relocated out of the (still empty/broken) left column to a
   visible spot above the product grid - see inject.js. Restyled as a
   horizontal box instead of a narrow vertical sidebar. */
.gpcf-filters-relocated {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    margin: 0 0 16px !important;
    padding: 16px !important;
    background: #f9f9f9;
    border-radius: 8px;
    box-sizing: border-box;
}

.gpcf-filters-relocated .category-top-menu {
    margin: 0 0 12px;
    padding: 0;
    list-style: none;
}

#search_filters_wrapper.gpcf-filters-relocated #search_filters {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

#search_filters_wrapper.gpcf-filters-relocated .facet {
    flex: 1 1 220px;
    max-width: 260px;
}

/* Keep each filter's checkbox list to a manageable height - long lists
   (e.g. Weight with 20+ values) scroll instead of stretching the page. */
.gpcf-facet-scroll {
    max-height: 160px;
    overflow-y: auto;
    display: block !important;
}