.advanced-filter-bar{background-color:#000;color:#fff;width:100vw;margin:0 calc(50% - 50vw);padding:0;margin-bottom:20px}.advanced-filter-bar__inner{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;width:min(100%,var(--page-width, 1200px));margin:0 auto;padding:18px clamp(16px,5vw,40px);box-sizing:border-box}.advanced-filter-bar__count{font-size:14px;color:#fff;white-space:nowrap}.advanced-filter-bar__count strong{font-weight:600}.advanced-filter-bar__filters{display:flex;gap:15px;flex:1;justify-content:center}.advanced-filter-form{display:flex;gap:15px;align-items:center}.filter-dropdown{position:relative}.filter-dropdown__trigger{display:flex;align-items:center;gap:8px;background:transparent;border:1px solid rgba(255,255,255,.3);color:#fff;padding:8px 16px;border-radius:4px;cursor:pointer;font-size:14px;font-weight:600;transition:all .3s ease;white-space:nowrap}.filter-dropdown__trigger:hover{background:#ffffff1a;border-color:#ffffff80}.filter-dropdown__trigger svg{transition:transform .3s ease;width:16px;height:16px}.filter-dropdown.is-open .filter-dropdown__trigger svg{transform:rotate(180deg)}.filter-dropdown__content{position:absolute;top:calc(100% + 5px);left:0;background:#1a1a1a;border:1px solid rgba(255,255,255,.2);border-radius:4px;padding:15px;min-width:200px;max-height:400px;overflow-y:auto;z-index:1000;display:none;box-shadow:0 4px 12px #00000080}.filter-dropdown.is-open .filter-dropdown__content{display:block}.filter-options{display:flex;flex-direction:column;gap:10px}.filter-option{display:flex;align-items:center;gap:10px;cursor:pointer;color:#fff;font-size:14px;padding:5px 0;transition:color .2s ease}.filter-option:hover{color:#ccc}.filter-option input[type=checkbox],.filter-option input[type=radio]{display:none}.checkbox-wrapper{width:20px;height:20px;border:2px solid rgba(255,255,255,.5);border-radius:3px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s ease}.filter-option input:checked+.checkbox-wrapper{background-color:#fff;border-color:#fff}.checkbox-wrapper svg{width:16px;height:16px;opacity:0;transition:opacity .2s ease;color:#000}.filter-option input:checked+.checkbox-wrapper svg{opacity:1}.filter-label-text{flex:1}.filter-count{color:#fff9;font-size:13px}.filter-options--colors{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:10px}.filter-option--color{flex-direction:column;align-items:center;text-align:center;padding:10px;border-radius:4px;transition:background .2s ease}.filter-option--color:hover{background:#ffffff0d}.color-swatch{width:40px;height:40px;border-radius:50%;border:2px solid rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center;margin-bottom:5px;position:relative;transition:border-color .2s ease}.filter-option--color input:checked+.color-swatch{border-color:#fff;border-width:3px}.color-swatch .checkmark{position:absolute;width:20px;height:20px;opacity:0;transition:opacity .2s ease}.filter-option--color input:checked+.color-swatch .checkmark{opacity:1}.color-swatch[data-color=black]{background:#000}.color-swatch[data-color=white]{background:#fff}.color-swatch[data-color=green]{background:#15c988}.color-swatch[data-color=red]{background:red}.color-swatch[data-color=blue]{background:#00f}.color-swatch[data-color=yellow]{background:#ff0}.color-swatch[data-color=pink]{background:#ff69b4}.color-swatch[data-color=purple]{background:purple}.color-swatch[data-color=orange]{background:orange}.color-label{font-size:12px;color:#fff}.sort-options{display:flex;flex-direction:column;gap:10px}.sort-option{display:flex;align-items:center;gap:10px;cursor:pointer;color:#fff;font-size:14px;padding:8px 10px;border-radius:3px;transition:background .2s ease}.sort-option:hover{background:#ffffff1a}.sort-option input[type=radio]{display:none}.sort-option input:checked~span{font-weight:600}.mobile-filter-controls{display:none;gap:10px;width:100%}.mobile-sort{flex:1}.mobile-sort__trigger{display:flex;align-items:center;justify-content:space-between;gap:8px;background:transparent;border:1px solid rgba(255,255,255,.3);color:#fff;padding:10px 16px;border-radius:4px;cursor:pointer;font-size:14px;font-weight:600;width:100%}.show-filter-btn{display:flex;align-items:center;gap:8px;background:transparent;border:1px solid rgba(255,255,255,.3);color:#fff;padding:10px 16px;border-radius:4px;cursor:pointer;font-size:14px;font-weight:600;white-space:nowrap}.show-filter-btn:hover,.mobile-sort__trigger:hover{background:#ffffff1a;border-color:#ffffff80}.show-filter-btn svg{width:20px;height:20px}.mobile-filter-drawer{position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999;display:none}.mobile-filter-drawer.is-open{display:block}.mobile-filter-drawer__overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#000000b3;animation:fadeIn .3s ease}.mobile-filter-drawer__content{position:absolute;bottom:0;left:0;right:0;background:#fff;border-radius:16px 16px 0 0;max-height:80vh;display:flex;flex-direction:column;animation:slideUp .3s ease}.mobile-filter-drawer__header{display:flex;align-items:center;justify-content:space-between;padding:20px;border-bottom:1px solid #e5e5e5}.mobile-filter-drawer__header h2{font-size:20px;font-weight:700;margin:0;color:#000}.mobile-filter-drawer__close{background:transparent;border:none;cursor:pointer;padding:5px;display:flex;align-items:center;justify-content:center}.mobile-filter-drawer__close svg{width:24px;height:24px;color:#000}.mobile-filter-drawer__body{flex:1;overflow-y:auto;padding:20px}.mobile-filter-group{margin-bottom:30px}.mobile-filter-group__title{font-size:18px;font-weight:700;margin:0 0 15px;color:#000}.mobile-filter-options{display:flex;flex-direction:column;gap:12px}.mobile-filter-option{display:flex;align-items:center;gap:12px;cursor:pointer;color:#000;font-size:16px}.mobile-filter-option input{display:none}.mobile-filter-option .checkbox-wrapper{width:24px;height:24px;border:2px solid #545759;border-radius:3px;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:#fff}.mobile-filter-option input:checked+.checkbox-wrapper{background-color:#000;border-color:#000}.mobile-filter-option input:checked+.checkbox-wrapper:after{content:"";width:12px;height:8px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg);margin-top:-2px}.mobile-filter-options--buttons{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.size-button{display:flex;align-items:center;justify-content:center;padding:12px;border:2px solid #e5e5e5;border-radius:4px;cursor:pointer;font-size:16px;font-weight:600;color:#000;transition:all .2s ease}.size-button:hover{border-color:#000}.size-button input{display:none}.size-button input:checked+span,.size-button:has(input:checked){background-color:#000;color:#fff;border-color:#000}.mobile-filter-drawer__footer{padding:20px;border-top:1px solid #e5e5e5}.clear-filters-btn{width:100%;padding:15px;background:transparent;border:2px solid #000;border-radius:4px;cursor:pointer;font-size:16px;font-weight:700;color:#000;text-transform:uppercase;transition:all .2s ease}.clear-filters-btn:hover{background:#000;color:#fff}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}@media (max-width: 1024px){.advanced-filter-bar__filters.desktop-filters,.advanced-filter-bar__sort.desktop-sort{display:none}.mobile-filter-controls{display:flex}.advanced-filter-bar__count{width:100%;text-align:center;margin-bottom:10px}}@media (min-width: 1025px){.mobile-filter-controls{display:none!important}}.filter-dropdown__content::-webkit-scrollbar{width:6px}.filter-dropdown__content::-webkit-scrollbar-track{background:#ffffff1a;border-radius:3px}.filter-dropdown__content::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:3px}.filter-dropdown__content::-webkit-scrollbar-thumb:hover{background:#ffffff80}.mobile-filter-drawer__body::-webkit-scrollbar{width:6px}.mobile-filter-drawer__body::-webkit-scrollbar-track{background:#f0f0f0;border-radius:3px}.mobile-filter-drawer__body::-webkit-scrollbar-thumb{background:#ccc;border-radius:3px}.mobile-filter-drawer__body::-webkit-scrollbar-thumb:hover{background:#999}
/*# sourceMappingURL=/cdn/shop/t/39/assets/advanced-filter-bar.css.map */