.product-filter-pill{border:1px solid var(--color-border);border-radius:var(--radius-card);height:2.25rem;font-size:var(--text-body-sm);color:var(--color-on-surface);cursor:pointer;justify-content:center;align-items:center;gap:.5rem;padding:0 .75rem;font-weight:500;transition:border-color .15s;display:flex}.product-filter-pill:hover{border-color:var(--color-primary)}.product-filter-chips-section{border-bottom:1px solid var(--color-border);flex-direction:column;gap:.75rem;margin-bottom:.5rem;padding:.5rem 0 1rem;display:flex}.product-filter-chips{flex-wrap:wrap;gap:.5rem;display:flex}
.filter-skeleton-section{gap:var(--spacing-input);padding:var(--spacing-card) 0;flex-direction:column;display:flex}.filter-skeleton-header{justify-content:space-between;align-items:center;gap:var(--spacing-input);display:flex}.filter-skeleton-title{border-radius:var(--radius-input);width:7rem;height:1.25rem}.filter-skeleton-chevron{width:1.25rem;height:1.25rem;color:color-mix(in srgb, var(--color-on-surface) 50%, transparent);flex-shrink:0;justify-content:center;align-items:center;display:flex}.filter-skeleton-chevron-open{transform:rotate(180deg)}.filter-skeleton-collapsed-row{border-radius:var(--radius-card);width:100%;height:2rem}.filter-skeleton-options{gap:var(--spacing-input);flex-direction:column;display:flex}.filter-skeleton-option{align-items:center;gap:var(--spacing-input);display:flex}.filter-skeleton-checkbox{border-radius:var(--radius-checkbox);border:1px solid var(--color-border);background:color-mix(in srgb, var(--color-border) 12%, var(--color-surface));flex-shrink:0;width:1.5rem;height:1.5rem}.filter-skeleton-label{border-radius:var(--radius-input);width:6rem;height:1rem}.filter-skeleton-option:nth-child(3n+1) .filter-skeleton-label{width:8rem}.filter-skeleton-option:nth-child(3n+2) .filter-skeleton-label{width:5rem}.filter-skeleton-option:nth-child(3n+3) .filter-skeleton-label{width:7rem}
.select-filter-options{gap:calc(var(--spacing-input) - .25rem);flex-direction:column;display:flex}.select-filter-option{align-items:center;gap:var(--spacing-input);width:100%;padding:calc(var(--spacing-input) / 2) 0;color:var(--color-on-surface);text-align:left;display:flex}.select-filter-option:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.select-filter-option-label{font-size:var(--font-size-body-sm);line-height:var(--line-height-body)}
.sort-by-pill{border:1px solid var(--color-border);border-radius:var(--radius-card);height:2.25rem;font-size:var(--text-body-sm);color:var(--color-on-surface);cursor:pointer;justify-content:center;align-items:center;gap:.5rem;padding:0 .75rem;font-weight:500;transition:border-color .15s;display:flex}.sort-by-pill:hover{border-color:var(--color-primary)}.sort-by-options{flex-direction:column;gap:.25rem;display:flex}.sort-by-option{cursor:pointer;font-size:var(--text-body);color:var(--color-on-surface);background:0 0;border:none;align-items:center;gap:.75rem;padding:.5rem 0;display:flex}.sort-by-radio{border-radius:var(--radius-full);border:1px solid color-mix(in srgb, var(--color-on-surface) 40%, transparent);flex-shrink:0;justify-content:center;align-items:center;width:1.5rem;height:1.5rem;transition:border-color .15s;display:flex}.sort-by-radio-active{border-color:var(--color-primary)}.sort-by-radio-dot{border-radius:var(--radius-full);background-color:var(--color-primary);width:.875rem;height:.875rem}