@layer components{.facets-toggle{display:flex;align-items:center;gap:calc(var(--spacing) * 2)}.facets-toggle__button{display:inline-flex;align-items:center;gap:calc(var(--spacing) * 2);padding:calc(var(--spacing) * 2) calc(var(--spacing) * 4);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:transparent;cursor:pointer;transition:border-color var(--transition-fast);&:hover{border-color:var(--color-foreground)}}.facets-toggle__count{display:inline-flex;align-items:center;justify-content:center;min-width:1.25rem;height:1.25rem;padding:0 calc(var(--spacing) * 1);font-size:var(--text-xs);font-weight:600;background:var(--color-foreground);color:var(--color-background);border-radius:var(--radius-full)}.filter-drawer__content{display:flex;flex-direction:column;height:100%}.filter-drawer__filters{flex:1;overflow-y:auto;padding:calc(var(--spacing) * 6)}.filter-drawer__actions{display:flex;flex-direction:column;gap:calc(var(--spacing) * 3);padding:calc(var(--spacing) * 6);border-top:1px solid var(--color-border);background:var(--color-background)}.filter-group{border-bottom:1px solid var(--color-border);&:last-child{border-bottom:none}}.filter-drawer__filters .accordion-details{margin-bottom:var(--space-md);&:last-child{margin-bottom:0}}.filter-group__header{display:flex;align-items:center;justify-content:space-between;width:100%;padding:calc(var(--spacing) * 4) 0;background:transparent;border:none;cursor:pointer;text-align:left}.filter-group__title{font-weight:600;font-size:var(--text-base)}.filter-group__count{font-size:var(--text-sm);opacity:.6;margin-left:calc(var(--spacing) * 2)}.filter-group__icon{width:1rem;height:1rem;transition:transform var(--transition-base)}.filter-group[open] .filter-group__icon{transform:rotate(180deg)}.filter-group__content{padding-bottom:var(--space-md)}.filter-options{display:flex;flex-direction:column;gap:var(--space-sm)}.filter-option{display:flex;align-items:center;gap:var(--space-sm);cursor:pointer}.filter-option__checkbox{width:1.125rem;height:1.125rem;border:1px solid var(--color-border);border-radius:var(--radius-sm);appearance:none;cursor:pointer;position:relative;flex-shrink:0;transition:border-color var(--transition-fast),background-color var(--transition-fast);&:checked{background:var(--color-foreground);border-color:var(--color-foreground)}&:checked:after{content:"";position:absolute;left:5px;top:2px;width:5px;height:9px;border:solid var(--color-background);border-width:0 2px 2px 0;transform:rotate(45deg)}&:focus-visible{outline:2px solid var(--color-foreground);outline-offset:2px}}.filter-option__label{flex:1;font-size:var(--text-sm)}.filter-option__count{font-size:var(--text-sm);opacity:.6}.filter-option--disabled{opacity:.4;pointer-events:none}.filter-options--swatches{flex-direction:row;flex-wrap:wrap;gap:var(--space-sm)}.filter-option--swatch{position:relative}.filter-option__swatch{width:2rem;height:2rem;border-radius:var(--radius-full);border:2px solid transparent;cursor:pointer;transition:border-color var(--transition-fast);&:hover{border-color:color-mix(in srgb,var(--color-foreground) 3%,transparent)}}.filter-option__swatch-input:checked+.filter-option__swatch{border-color:var(--color-foreground)}.filter-option__swatch-input{position:absolute;opacity:0;width:0;height:0}.price-filter{display:flex;align-items:center;gap:var(--space-sm)}.price-filter .form-input{flex:1;min-width:0}.price-filter__separator{opacity:.5;flex-shrink:0}.active-filters{display:flex;flex-wrap:wrap;gap:var(--space-sm);margin-bottom:var(--space-md)}.active-filters.active-filters--inline{margin-bottom:0;gap:var(--space-sm)}.active-filters--drawer{margin-bottom:var(--space-md);gap:var(--space-xs)}.active-filter{display:inline-flex;align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);background:color-mix(in srgb,var(--color-foreground) 1%,transparent);border-radius:var(--radius-full);font-size:var(--text-sm);text-decoration:none;color:inherit;transition:background-color var(--transition-fast);&:hover{background:color-mix(in srgb,var(--color-foreground) 2%,transparent)}}.badge.active-filter,facet-remove-component.badge{cursor:pointer;text-decoration:none;transition:background-color var(--transition-fast);&:hover{background-color:color-mix(in srgb,var(--color-muted) 80%,transparent)}}.badge__remove{display:inline-flex;align-items:center;justify-content:center;width:1rem;height:1rem;padding:0;margin-left:var(--space-1);background:transparent;border:none;border-radius:var(--radius-full);cursor:pointer;opacity:.7;flex-shrink:0;&:focus-visible{outline:2px solid currentColor;outline-offset:2px;opacity:1}svg{width:100%;height:100%;pointer-events:none}}.active-filters__clear{font-size:var(--text-sm);text-decoration:underline;opacity:.7;cursor:pointer;color:inherit;text-decoration:none;border:none;background:transparent;padding:0;transition:opacity var(--transition-fast);&:hover{opacity:1}}.active-filters--inline .active-filters__clear--inline,.active-filters__clear.active-filters__clear--inline{font-size:var(--text-sm);text-decoration:underline;opacity:.7;margin-left:var(--space-sm);&:hover{opacity:1}}.filter-drawer__filters .checkbox__input{border-radius:50%!important}.sorting-select{padding:.5rem 2.5rem .5rem 1rem;border:1px solid rgb(0 0 0 / .1);border-radius:.375rem;background:transparent;font-size:.875rem;cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .5rem center;transition:border-color .2s ease;&:focus{outline:none;border-color:#000}&:hover{border-color:#0000004d}}.products-count{font-size:.875rem;opacity:.7}.filter-bar{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);margin-bottom:var(--space-lg);flex-wrap:wrap}.filter-bar__left,.filter-bar__right{display:flex;align-items:center;gap:var(--space-md)}.filter-bar__right .products-count{margin-right:var(--space-md)}@media(prefers-reduced-motion:reduce){.filter-group__icon,.filter-option__checkbox,.filter-option__swatch{transition:none}}}