/* ── Shop index filters/search/sort ──────────────────────────────────
   Fonts/sizes for .section-title h2 and .page-menu come from the
   template's own style.css (.product-page-area .page-menu ul li a, etc.)
   — intentionally not overridden here so the sidebar matches the
   original Zeiran template look. Only the gaps between filter blocks
   and the custom "active filter" badges (not part of the template)
   need their own rules. */
.filter-section { margin-bottom: 30px; }
.filter-section:last-child { margin-bottom: 0; }

/* Group dividers for Color / Frame / Lens — a tier above .section-title,
   marking a cluster of related filter-sections rather than one filter. */
.filter-group-label {
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: #fac652;
    border-bottom: 1px solid #eee;
    padding-bottom: 8px;
    margin: 0 0 18px;
}

/* Sidebar headers — template default (30px) is oversized for this narrow column */
.product-page-area .section-title h2 { font-size: 19px; }

/* Fixed-height, scrollable filter lists — keeps the sidebar from growing
   unbounded when a list (brands especially) has many entries. */
.page-menu.filter-scroll {
    max-height: 190px;
    overflow-y: auto;
    padding-right: 4px;
}
.page-menu.filter-scroll::-webkit-scrollbar { width: 5px; }
.page-menu.filter-scroll::-webkit-scrollbar-thumb { background: #ddd; border-radius: 3px; }
.page-menu.filter-scroll::-webkit-scrollbar-thumb:hover { background: #fac652; }
.page-menu.filter-scroll { scrollbar-width: thin; scrollbar-color: #ddd transparent; }

.shop-form-search { position: relative; }
.shop-form-search input.input-text { padding-right: 40px; }
.shop-form-search button.button { width: 40px; }

.active-filter-badge {
    display: inline-flex; align-items: center; gap: 4px;
    background: #252525; color: #fff; padding: 4px 12px;
    font-size: 12px; border-radius: 20px; text-decoration: none; transition: .2s;
}
.active-filter-badge:hover { background: #fac652; color: #252525; }

.filter-active,
.product-page-area .page-menu ul li a.filter-active {
    color: #fac652 !important;
    font-weight: 600 !important;
}

.shop-results-header {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 18px; padding-bottom: 14px; border-bottom: 1px solid #eee;
    flex-wrap: wrap; gap: 12px;
}

.shop-results-header .limiter-2 {
    position: static;
    display: flex; align-items: center; gap: 8px;
}
.shop-results-header .limiter-2 select {
    border: 1px solid #e8e8e8; color: #555; font-size: 13px;
    padding: 7px 12px; background-color: #fff; cursor: pointer;
}
.shop-results-header .limiter-2 select:focus { outline: none; border-color: #fac652; }

/* Single product page — sidebar related carousel arrows */
.single-featured-active .owl-controls .owl-buttons div,
.single-hot-deals .owl-controls .owl-buttons div {
    background: #fff !important;
    color: #333 !important;
    font-size: 18px !important;
    font-weight: bold !important;
    line-height: 36px !important;
    opacity: 1 !important;
    border: 1px solid #ddd !important;
    width: 36px !important;
    height: 36px !important;
    text-align: center !important;
}

.single-featured-active .owl-controls .owl-buttons .owl-prev,
.single-hot-deals .owl-controls .owl-buttons .owl-prev {
    left: 0 !important;
}

.single-featured-active .owl-controls .owl-buttons .owl-next,
.single-hot-deals .owl-controls .owl-buttons .owl-next {
    left: auto !important;
    right: 0 !important;
}

.single-featured-active .owl-controls .owl-buttons div:hover,
.single-hot-deals .owl-controls .owl-buttons div:hover {
    border-color: #fac654 !important;
    color: #fac654 !important;
}

/* Pagination dots */
.single-featured-active .owl-theme .owl-controls .owl-page span,
.single-collection-carousel .owl-theme .owl-controls .owl-page span {
    background: #ccc !important;
    border-radius: 50% !important;
    width: 10px !important;
    height: 10px !important;
}

.single-featured-active .owl-theme .owl-controls .owl-page.active span,
.single-featured-active .owl-theme .owl-controls.clickable .owl-page:hover span,
.single-collection-carousel .owl-theme .owl-controls .owl-page.active span,
.single-collection-carousel .owl-theme .owl-controls.clickable .owl-page:hover span {
    background: #fac654 !important;
}