/* Product Filter + Active Filters */
.eb-filter { box-sizing: border-box; margin-bottom: 24px; }
.eb-filter__title { margin: 0 0 10px; font-weight: 600; font-size: 1em; }
.eb-filter__box > summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; }
.eb-filter__box > summary::-webkit-details-marker { display: none; }
.eb-filter__box > summary::after { content: ""; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); margin: -4px 4px 0 8px; transition: transform .2s; }
.eb-filter__box[open] > summary::after { transform: rotate(-135deg); margin-top: 4px; }
.eb-filter__list, .eb-filter__children { list-style: none; margin: 0; padding: 0; }
.eb-filter__children { padding-left: 18px; }
.eb-filter__item { margin: 0; }
.eb-filter__item[hidden] { display: none; }
.eb-filter__link { display: flex; align-items: center; gap: 8px; padding: 5px 0; color: inherit; text-decoration: none; line-height: 1.35; }
a.eb-filter__link:hover .eb-filter__name { text-decoration: underline; }
.eb-filter__item.is-empty > .eb-filter__link { opacity: .45; cursor: default; }
.eb-filter__item.is-active > .eb-filter__link { font-weight: 600; }
.eb-filter__name { flex: 1 1 auto; min-width: 0; }
.eb-filter__count { flex: 0 0 auto; min-width: 22px; padding: 1px 6px; border-radius: 10px; background: rgba(0, 0, 0, .06); font-size: .8em; text-align: center; }
.eb-filter__check { flex: 0 0 16px; width: 16px; height: 16px; box-sizing: border-box; border: 1.5px solid currentColor; border-radius: 4px; opacity: .55; position: relative; }
.eb-filter__item.is-active > .eb-filter__link .eb-filter__check { opacity: 1; background: currentColor; }
.eb-filter__item.is-active > .eb-filter__link .eb-filter__check::after { content: ""; position: absolute; left: 4px; top: 0; width: 4px; height: 9px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.eb-filter__stars { color: #f5a623; letter-spacing: 1px; }
.eb-filter__stars span { color: rgba(0, 0, 0, .18); }
.eb-filter__more { margin-top: 6px; padding: 0; border: 0; background: none; color: inherit; font: inherit; font-size: .9em; text-decoration: underline; cursor: pointer; }

/* Swatches, buttons and dropdown (Envo Blocks PRO) */
.eb-filter--swatches .eb-filter__list, .eb-filter--buttons .eb-filter__list { display: flex; flex-wrap: wrap; gap: 8px; }
.eb-filter--swatches .eb-filter__link { padding: 0; }
.eb-filter__swatch { flex: 0 0 auto; display: block; width: 28px; height: 28px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .15); overflow: hidden; }
.eb-filter__swatch img { display: block; width: 100%; height: 100%; object-fit: cover; }
.eb-filter--swatches .eb-filter__swatch ~ .eb-filter__name, .eb-filter--swatches .eb-filter__swatch ~ .eb-filter__count { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.eb-filter--swatches .eb-filter__item.is-active .eb-filter__swatch { box-shadow: 0 0 0 2px #fff, 0 0 0 4px currentColor; }
.eb-filter--buttons .eb-filter__link { padding: 6px 12px; border: 1px solid rgba(0, 0, 0, .2); border-radius: 6px; }
.eb-filter--buttons .eb-filter__item.is-active > .eb-filter__link { border-color: currentColor; box-shadow: inset 0 0 0 1px currentColor; }
.eb-filter--buttons .eb-filter__count { background: none; padding: 0; min-width: 0; opacity: .6; }
.eb-filter__select { width: 100%; padding: 8px 10px; border: 1px solid rgba(0, 0, 0, .2); border-radius: 6px; font: inherit; background: #fff; color: #111; }

/* Price */
.eb-filter__slider { position: relative; height: 28px; margin: 4px 0 10px; }
.eb-filter__slider::before { content: ""; position: absolute; left: 0; right: 0; top: 13px; height: 3px; border-radius: 2px; background: rgba(0, 0, 0, .12); }
.eb-filter__slider-fill { position: absolute; top: 13px; height: 3px; border-radius: 2px; background: currentColor; }
.eb-filter .eb-filter__range { position: absolute; left: 0; top: 4px; width: 100%; height: 20px; margin: 0; padding: 0; border: 0; box-shadow: none; background: transparent; pointer-events: none; -webkit-appearance: none; appearance: none; }
/* Doubled class: themes style input[type=range] (and its track and thumb) more specifically. */
.eb-filter .eb-filter__range::-webkit-slider-runnable-track { height: 20px; border: 0; box-shadow: none; background: transparent; }
.eb-filter .eb-filter__range::-webkit-slider-thumb { pointer-events: auto; -webkit-appearance: none; width: 18px; height: 18px; margin-top: 1px; border-radius: 50%; background: #fff; border: 2px solid currentColor; box-shadow: none; cursor: pointer; }
.eb-filter .eb-filter__range::-moz-range-thumb { pointer-events: auto; width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 2px solid currentColor; box-shadow: none; cursor: pointer; }
.eb-filter .eb-filter__range::-moz-range-track { border: 0; background: transparent; }
.eb-filter .eb-filter__range::-moz-range-progress { background: transparent; }
.eb-filter .eb-filter__range:focus { outline: none; }
.eb-filter .eb-filter__range:focus-visible::-webkit-slider-thumb { box-shadow: 0 0 0 3px rgba(0, 0, 0, .2); }
.eb-filter__fields { display: flex; align-items: center; gap: 6px; }
.eb-filter__field { flex: 1 1 0; min-width: 0; display: flex; align-items: center; gap: 4px; padding: 0 8px; border: 1px solid rgba(0, 0, 0, .2); border-radius: 6px; }
.eb-filter .eb-filter__field input { width: 100%; min-width: 0; height: auto; margin: 0; padding: 7px 0; border: 0; border-radius: 0; box-shadow: none; outline: 0; background: none; color: inherit; font: inherit; -moz-appearance: textfield; }
.eb-filter__field:focus-within { border-color: currentColor; }
.eb-filter__field input::-webkit-inner-spin-button { -webkit-appearance: none; }
.eb-filter__currency { opacity: .6; font-size: .9em; }
.eb-filter__apply { margin-top: 10px; padding: 8px 16px; border: 0; border-radius: 6px; font: inherit; font-weight: 600; cursor: pointer; }

/* Active filters */
.eb-active-filters__list { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; padding: 0; list-style: none; }
.eb-active-filters__chip { display: inline-flex; align-items: center; gap: 4px; padding: 5px 10px; border-radius: 999px; background: rgba(0, 0, 0, .06); color: inherit; text-decoration: none; font-size: .9em; }
.eb-active-filters__chip:hover { background: rgba(0, 0, 0, .1); }
.eb-active-filters__label { opacity: .7; }
.eb-active-filters__x { margin-left: 2px; font-size: 1.15em; line-height: 1; }
.eb-active-filters__clear { display: inline-block; padding: 5px 4px; color: inherit; font-size: .9em; }

/* While Envo Blocks PRO loads the results */
.eb-filters-loading { opacity: .5; pointer-events: none; transition: opacity .15s; }
