/* Sina UI Commerce — Filter Component 1.14.9
 * Professional filter UI. This file is the single visual authority for both
 * Frontend and Admin Live Preview. Preview-specific CSS may position the
 * component, but must not restyle its internals.
 */
.suc-filter-shell{
  --suc-filter-width:260px;
  --suc-filter-bg:#FFFDFE;
  --suc-filter-accent:#E889A6;
  --suc-filter-text:#4E4355;
  --suc-filter-title:#492B54;
  --suc-filter-border:#F0DFEA;
  --suc-filter-border-w:1px;
  --suc-filter-radius:26px;
  --suc-filter-pad:16px;
  --suc-filter-gap:12px;
  --suc-filter-chip-bg:#fff;
  --suc-filter-chip-text:#64576A;
  --suc-filter-chip-selected-bg:#FFF0F6;
  --suc-filter-chip-selected-text:#C9507A;
  --suc-filter-chip-radius:14px;
  --suc-filter-swatch:26px;
  --suc-filter-shadow:14;
  --suc-filter-font:"Estedad",sans-serif;
  font-family:var(--suc-filter-font,"Estedad",sans-serif);
  flex:0 0 var(--suc-filter-width);
  width:var(--suc-filter-width);
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
  z-index:20;
}

/* Typography ownership: Woodmart/theme typography must never leak inside. */
.suc-filter-shell,
.suc-filter-shell button,
.suc-filter-shell input,
.suc-filter-shell select,
.suc-filter-shell textarea,
.suc-filter-shell label,
.suc-filter-shell span,
.suc-filter-shell b,
.suc-filter-shell small,
.suc-filter-shell em,
.suc-filter-shell a,
.suc-filter-shell div,
.suc-filter-shell section,
.suc-filter-shell form{
  font-family:var(--suc-filter-font,"Estedad",sans-serif)!important;
}

.suc-filter-shell.is-sticky{
  position:sticky;
  top:var(--suc-filter-sticky-top,0px);
}

.suc-filter-frame{
  position:relative;
  display:flex;
  flex-direction:column;
  min-width:0;
  overflow:hidden;
  border:var(--suc-filter-border-w) solid color-mix(in srgb,var(--suc-filter-border) 92%,#fff);
  border-radius:var(--suc-filter-radius);
  background:var(--suc-filter-bg);
  box-shadow:0 calc(var(--suc-filter-shadow)*.45px) calc(var(--suc-filter-shadow)*1.65px) rgba(72,49,82,.075);
  box-sizing:border-box;
  isolation:isolate;
}
.suc-filter-frame>.suc-filter-header{
  margin:0!important;
  width:100%!important;
  border-radius:0!important;
  border:0!important;
}
.suc-filter-mobile-bar{display:none}
.suc-filter-mobile-actions{display:none}
.suc-filter-mobile-clear,.suc-filter-mobile-apply{font-family:var(--suc-filter-font,"Estedad",sans-serif)!important}

.suc-filter-mobile-bar-copy{min-width:0;display:flex;align-items:center;justify-content:center;flex:1 1 auto}
.suc-filter-mobile-bar-copy b{color:var(--suc-filter-title);font-size:16px!important;font-weight:900!important;line-height:1.45!important;text-align:center}
.suc-filter-mobile-bar-copy span{display:none!important}
.suc-filter-mobile-close{
  width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;
  display:grid!important;place-items:center!important;flex:0 0 38px!important;
  margin:0!important;padding:0!important;border:1px solid color-mix(in srgb,var(--suc-filter-border) 84%,#fff)!important;
  border-radius:12px!important;background:#fff!important;color:var(--suc-filter-title)!important;box-shadow:0 5px 14px rgba(72,49,82,.07)!important;
  cursor:pointer!important;appearance:none!important;-webkit-appearance:none!important;
}
.suc-filter-mobile-close:hover{background:color-mix(in srgb,var(--suc-filter-accent) 6%,#fff)!important;border-color:color-mix(in srgb,var(--suc-filter-accent) 20%,var(--suc-filter-border))!important}
.suc-filter-mobile-close:focus-visible{outline:2px solid color-mix(in srgb,var(--suc-filter-accent) 34%,transparent)!important;outline-offset:2px!important}
.suc-filter-mobile-close svg{width:18px!important;height:18px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;stroke-linecap:round!important;pointer-events:none!important}

.suc-filter-scroll-body{
  min-width:0;
  min-height:0;
  flex:1 1 auto;
  overflow:visible;
  background:var(--suc-filter-bg);
}
.suc-filter-form{
  display:flex;
  flex-direction:column;
  gap:0;
  padding:0 var(--suc-filter-pad) var(--suc-filter-pad);
  box-sizing:border-box;
  color:var(--suc-filter-text);
  background:var(--suc-filter-bg);
}

/* Flat accordion sections: no capsule-inside-capsule visual nesting. */
.suc-filter-group{
  position:relative;
  border:0;
  border-bottom:1px solid color-mix(in srgb,var(--suc-filter-border) 72%,#fff);
  border-radius:0;
  background:transparent;
  overflow:visible;
  box-shadow:none;
}
.suc-filter-group:last-child{border-bottom:0}
.suc-filter-group + .suc-filter-group{margin-top:calc(var(--suc-filter-gap) * .32)}
.suc-filter-group-head{
  width:100%;
  min-height:49px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 30px;
  align-items:center;
  gap:10px;
  padding:0 2px;
  border:0!important;
  border-radius:10px!important;
  outline:0;
  background:transparent!important;
  color:var(--suc-filter-title)!important;
  font-size:11.25px!important;
  font-weight:750!important;
  line-height:1.6!important;
  cursor:pointer;
  text-align:right;
  text-transform:none!important;
  letter-spacing:0!important;
  box-sizing:border-box;
  box-shadow:none!important;
  transition:background .16s ease,color .16s ease;
}
.suc-filter-group-head:hover{
  background:color-mix(in srgb,var(--suc-filter-accent) 5%,transparent)!important;
}
.suc-filter-group-head:focus-visible{
  outline:2px solid color-mix(in srgb,var(--suc-filter-accent) 34%,transparent);
  outline-offset:1px;
}
.suc-filter-group-head>span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.suc-filter-group-head i{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  justify-self:end;
  margin:0!important;
  border:1px solid color-mix(in srgb,var(--suc-filter-border) 74%,#fff)!important;
  border-radius:9px!important;
  background:color-mix(in srgb,var(--suc-filter-bg) 88%,#fff)!important;
  color:var(--suc-filter-title)!important;
  box-shadow:none!important;
  position:relative;
  transition:transform .18s ease,background .18s ease,border-color .18s ease;
}
.suc-filter-group-head i:after{
  content:"";
  width:7px;
  height:7px;
  border-left:1.7px solid currentColor;
  border-bottom:1.7px solid currentColor;
  transform:rotate(-45deg);
  opacity:.58;
  margin-top:-3px;
  transition:transform .18s ease,margin .18s ease;
}
.suc-filter-group.is-open>.suc-filter-group-head i{
  background:color-mix(in srgb,var(--suc-filter-accent) 8%,#fff)!important;
  border-color:color-mix(in srgb,var(--suc-filter-accent) 24%,var(--suc-filter-border))!important;
}
.suc-filter-group.is-open>.suc-filter-group-head i:after{
  transform:rotate(135deg);
  margin-top:3px;
}
.suc-filter-group-body{
  display:none;
  padding:0 1px 14px;
  box-sizing:border-box;
}
.suc-filter-group-body[hidden]{display:none!important}
.suc-filter-group.is-open>.suc-filter-group-body:not([hidden]){
  display:block;
  animation:sucFilterIn .16s ease;
}
@keyframes sucFilterIn{from{opacity:.25;transform:translateY(-2px)}to{opacity:1;transform:none}}
.suc-filter-stock-group>.suc-filter-group-body{padding-top:12px}

/* Category list: compact, readable, multi-select friendly. */
.suc-filter-category-list{flex-direction:column;gap:4px}
.suc-filter-group.is-open>.suc-filter-category-list:not([hidden]){display:flex}
.suc-filter-category-row{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto 20px;
  align-items:center;
  gap:8px;
  min-height:42px;
  padding:5px 8px 5px 9px;
  border:1px solid transparent;
  border-radius:min(var(--suc-filter-chip-radius),14px);
  background:transparent;
  cursor:pointer;
  box-sizing:border-box;
  transition:background .15s ease,border-color .15s ease,box-shadow .15s ease;
}
.suc-filter-category-row>input,
.suc-filter-checks input,
.suc-filter-buttons label>input,
.suc-filter-swatches input,
.suc-filter-stock-toggle input{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  margin:-1px!important;
  padding:0!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;
  clip-path:inset(50%)!important;
  white-space:nowrap!important;
  border:0!important;
  opacity:0!important;
}
.suc-filter-category-row:hover{
  background:color-mix(in srgb,var(--suc-filter-accent) 5%,#fff);
  border-color:color-mix(in srgb,var(--suc-filter-accent) 13%,transparent);
}
.suc-filter-category-row:has(>input:focus-visible){
  outline:0;
  border-color:color-mix(in srgb,var(--suc-filter-accent) 42%,var(--suc-filter-border));
  box-shadow:0 0 0 2px color-mix(in srgb,var(--suc-filter-accent) 14%,transparent);
}
.suc-filter-category-row.is-selected,
.suc-filter-category-row:has(>input:checked){
  background:color-mix(in srgb,var(--suc-filter-chip-selected-bg) 72%,#fff);
  border-color:color-mix(in srgb,var(--suc-filter-accent) 19%,transparent);
}
.suc-filter-category-copy{
  min-width:0;
  display:block;
  text-align:right;
}
.suc-filter-category-copy b{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--suc-filter-chip-text);
  font-size:10.5px!important;
  font-weight:650!important;
  line-height:1.55!important;
}
.suc-filter-category-row.is-selected .suc-filter-category-copy b,
.suc-filter-category-row:has(>input:checked) .suc-filter-category-copy b{
  color:var(--suc-filter-chip-selected-text);
  font-weight:750!important;
}
.suc-filter-count-badge{
  min-width:24px;
  height:20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 6px;
  border:1px solid color-mix(in srgb,var(--suc-filter-border) 72%,#fff);
  border-radius:999px;
  background:color-mix(in srgb,var(--suc-filter-bg) 78%,#f5f2f6);
  color:color-mix(in srgb,var(--suc-filter-text) 58%,#fff);
  font-size:8px!important;
  font-weight:650!important;
  line-height:1!important;
  box-sizing:border-box;
  white-space:nowrap;
}
.suc-filter-category-row.is-selected .suc-filter-count-badge,
.suc-filter-category-row:has(>input:checked) .suc-filter-count-badge{
  border-color:color-mix(in srgb,var(--suc-filter-accent) 18%,transparent);
  background:#fff;
  color:var(--suc-filter-chip-selected-text);
}
.suc-filter-category-mark{
  width:18px;
  height:18px;
  display:grid;
  place-items:center;
  border:1px solid color-mix(in srgb,var(--suc-filter-border) 92%,#ddd);
  border-radius:6px;
  background:#fff;
  box-sizing:border-box;
  transition:background .15s ease,border-color .15s ease,box-shadow .15s ease;
}
.suc-filter-category-mark:after{
  content:"";
  width:6px;
  height:3px;
  border-left:1.7px solid #fff;
  border-bottom:1.7px solid #fff;
  transform:rotate(-45deg) scale(.7);
  opacity:0;
  transition:.14s ease;
}
.suc-filter-category-row.is-selected .suc-filter-category-mark,
.suc-filter-category-row:has(>input:checked) .suc-filter-category-mark{
  border-color:var(--suc-filter-accent);
  background:var(--suc-filter-accent);
  box-shadow:0 3px 8px color-mix(in srgb,var(--suc-filter-accent) 18%,transparent);
}
.suc-filter-category-row.is-selected .suc-filter-category-mark:after,
.suc-filter-category-row:has(>input:checked) .suc-filter-category-mark:after{
  opacity:1;
  transform:rotate(-45deg) scale(1);
}

/* Attribute chips/buttons. */
.suc-filter-buttons{display:flex;flex-wrap:wrap;gap:6px}
.suc-filter-buttons label{position:relative;cursor:pointer}
.suc-filter-buttons label>span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:32px;
  padding:5px 10px;
  border:1px solid color-mix(in srgb,var(--suc-filter-border) 80%,#fff);
  border-radius:min(var(--suc-filter-chip-radius),12px);
  background:var(--suc-filter-chip-bg);
  color:var(--suc-filter-chip-text);
  font-size:9.5px!important;
  font-weight:600!important;
  box-sizing:border-box;
  transition:background .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease;
}
.suc-filter-buttons label:hover>span{
  border-color:color-mix(in srgb,var(--suc-filter-accent) 25%,var(--suc-filter-border));
  background:color-mix(in srgb,var(--suc-filter-accent) 4%,#fff);
}
.suc-filter-buttons label>input:focus-visible+span{
  border-color:color-mix(in srgb,var(--suc-filter-accent) 45%,var(--suc-filter-border));
  box-shadow:0 0 0 2px color-mix(in srgb,var(--suc-filter-accent) 13%,transparent);
}
.suc-filter-buttons label>input:checked+span{
  background:var(--suc-filter-chip-selected-bg);
  color:var(--suc-filter-chip-selected-text);
  border-color:color-mix(in srgb,var(--suc-filter-accent) 31%,var(--suc-filter-border));
}
.suc-filter-buttons label>span em{
  min-width:17px;
  height:17px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 4px;
  border-radius:999px;
  background:color-mix(in srgb,var(--suc-filter-bg) 75%,#f2eef3);
  font-style:normal;
  font-size:7.5px!important;
  font-weight:650!important;
  opacity:.72;
}

/* Attribute checkbox rows use the same visual language as categories. */
.suc-filter-checks{display:flex;flex-direction:column;gap:3px}
.suc-filter-checks label{
  position:relative;
  display:grid;
  grid-template-columns:20px minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  min-height:38px;
  padding:4px 7px;
  border:1px solid transparent;
  border-radius:10px;
  cursor:pointer;
  box-sizing:border-box;
  transition:background .15s ease,border-color .15s ease,box-shadow .15s ease;
}
.suc-filter-checks label:hover{background:color-mix(in srgb,var(--suc-filter-accent) 4%,#fff)}
.suc-filter-checks label:has(input:focus-visible){
  border-color:color-mix(in srgb,var(--suc-filter-accent) 40%,var(--suc-filter-border));
  box-shadow:0 0 0 2px color-mix(in srgb,var(--suc-filter-accent) 12%,transparent);
}
.suc-filter-checks i{
  width:18px;
  height:18px;
  border:1px solid color-mix(in srgb,var(--suc-filter-border) 92%,#ddd)!important;
  border-radius:6px!important;
  background:#fff!important;
  position:relative;
  box-sizing:border-box;
  margin:0!important;
}
.suc-filter-checks input:checked+i{
  background:var(--suc-filter-accent)!important;
  border-color:var(--suc-filter-accent)!important;
}
.suc-filter-checks input:checked+i:after{
  content:"";
  position:absolute;
  width:6px;
  height:3px;
  border-left:1.7px solid #fff;
  border-bottom:1.7px solid #fff;
  transform:rotate(-45deg);
  left:5px;
  top:5px;
}
.suc-filter-checks span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--suc-filter-chip-text);
  font-size:9.75px!important;
  font-weight:600!important;
}
.suc-filter-checks em{
  min-width:23px;
  height:19px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 5px;
  border:1px solid color-mix(in srgb,var(--suc-filter-border) 66%,#fff);
  border-radius:999px;
  background:color-mix(in srgb,var(--suc-filter-bg) 78%,#f4f1f5);
  color:color-mix(in srgb,var(--suc-filter-text) 58%,#fff);
  font-style:normal;
  font-size:7.5px!important;
  font-weight:650!important;
  box-sizing:border-box;
}

.suc-filter-swatches{display:flex;flex-wrap:wrap;gap:10px}
.suc-filter-swatches label{position:relative;display:inline-flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer}
.suc-filter-swatches span{
  display:block;
  width:var(--suc-filter-swatch);
  height:var(--suc-filter-swatch);
  border-radius:50%;
  background:var(--suc-swatch,#ddd);
  border:3px solid #fff;
  box-shadow:0 0 0 1px color-mix(in srgb,var(--suc-filter-border) 88%,#fff),0 3px 8px rgba(50,40,65,.07);
  box-sizing:border-box;
  transition:box-shadow .15s ease,transform .15s ease;
}
.suc-filter-swatches input:focus-visible+span{
  box-shadow:0 0 0 2px #fff,0 0 0 4px color-mix(in srgb,var(--suc-filter-accent) 55%,transparent);
}
.suc-filter-swatches input:checked+span{
  box-shadow:0 0 0 2px #fff,0 0 0 4px var(--suc-filter-accent),0 4px 10px color-mix(in srgb,var(--suc-filter-accent) 14%,transparent);
  transform:scale(1.04);
}
.suc-filter-swatches em{font-style:normal;font-size:7px!important;line-height:1;color:var(--suc-filter-text);opacity:.6}

.suc-filter-options .is-extra,.suc-filter-buttons .is-extra,.suc-filter-checks .is-extra,.suc-filter-swatches .is-extra{display:none}
.suc-filter-buttons.is-expanded .is-extra,.suc-filter-checks.is-expanded .is-extra,.suc-filter-swatches.is-expanded .is-extra{display:flex}
.suc-filter-more{
  margin-top:8px;
  padding:5px 7px!important;
  border:0!important;
  border-radius:8px!important;
  background:transparent!important;
  color:var(--suc-filter-accent)!important;
  font-size:8.5px!important;
  font-weight:700!important;
  cursor:pointer;
  min-height:0!important;
  height:auto!important;
  line-height:1.5!important;
  text-transform:none!important;
  box-shadow:none!important;
}
.suc-filter-more:hover{background:color-mix(in srgb,var(--suc-filter-accent) 6%,transparent)!important}
.suc-filter-more:focus-visible{outline:2px solid color-mix(in srgb,var(--suc-filter-accent) 34%,transparent);outline-offset:1px}

/* Price range. */
.suc-price-range{position:relative;padding-top:8px}
.suc-price-range-track{
  position:relative;
  height:4px;
  margin:10px 8px 20px;
  border-radius:99px;
  background:color-mix(in srgb,var(--suc-filter-border) 75%,#fff);
}
.suc-price-range-fill{
  position:absolute;top:0;bottom:0;left:0;right:0;
  border-radius:99px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--suc-filter-accent) 66%,#fff),var(--suc-filter-accent));
}
.suc-price-range>input[type=range]{
  position:absolute;top:4px;left:0;width:100%;height:30px;
  background:transparent!important;
  pointer-events:none;
  appearance:none;-webkit-appearance:none;
  margin:0;
  box-shadow:none!important;
}
.suc-price-range>input[type=range]::-webkit-slider-runnable-track{height:4px;background:transparent}
.suc-price-range>input[type=range]::-webkit-slider-thumb{
  appearance:none;-webkit-appearance:none;
  width:17px;height:17px;margin-top:-6.5px;
  border:3px solid #fff;border-radius:50%;
  background:var(--suc-filter-accent);
  box-shadow:0 1px 0 1px color-mix(in srgb,var(--suc-filter-accent) 68%,#fff),0 4px 10px color-mix(in srgb,var(--suc-filter-accent) 20%,transparent);
  pointer-events:auto;cursor:pointer;
}
.suc-price-range>input[type=range]::-moz-range-track{height:4px;background:transparent}
.suc-price-range>input[type=range]::-moz-range-thumb{width:13px;height:13px;border:3px solid #fff;border-radius:50%;background:var(--suc-filter-accent);pointer-events:auto;cursor:pointer}
.suc-price-range-values{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.suc-price-range-values label{
  display:flex;align-items:center;gap:5px;min-width:0;
  border:1px solid color-mix(in srgb,var(--suc-filter-border) 85%,#fff);
  border-radius:10px;
  background:#fff;
  padding:7px 8px;
  box-sizing:border-box;
}
.suc-price-range-values label:focus-within{border-color:color-mix(in srgb,var(--suc-filter-accent) 42%,var(--suc-filter-border));box-shadow:0 0 0 2px color-mix(in srgb,var(--suc-filter-accent) 11%,transparent)}
.suc-price-range-values span{font-size:7.5px!important;opacity:.58}
.suc-price-range-values input{
  min-width:0;width:100%;
  border:0!important;outline:0!important;
  background:transparent!important;
  color:var(--suc-filter-text)!important;
  font-size:8.75px!important;font-weight:650!important;
  padding:0!important;box-shadow:none!important;text-align:center;
}

.suc-filter-stock-toggle{display:flex;align-items:center;gap:9px;font-size:9.75px!important;font-weight:600!important;cursor:pointer}
.suc-filter-stock-toggle i{
  width:34px;height:19px;border-radius:99px!important;background:#E9E2E8!important;position:relative;transition:.18s;margin:0!important;border:0!important;
}
.suc-filter-stock-toggle i:after{content:"";position:absolute;width:15px;height:15px;top:2px;right:2px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.1);transition:.18s}
.suc-filter-stock-toggle input:checked+i{background:var(--suc-filter-accent)!important}
.suc-filter-stock-toggle input:checked+i:after{right:17px}
.suc-filter-stock-toggle:has(input:focus-visible) i{box-shadow:0 0 0 2px color-mix(in srgb,var(--suc-filter-accent) 18%,transparent)}

.suc-active-filters{
  width:min(100%,var(--suc-grid-required-width,100%));
  display:flex;align-items:center;flex-wrap:wrap;gap:7px;
  box-sizing:border-box;margin-inline:auto;
}
.suc-active-filters>a{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:4px 10px;border:1px solid #EEE4EC;border-radius:999px;background:#fff;color:#625469;text-decoration:none;font:600 9px inherit}
.suc-active-filters>a b{font-size:13px;color:#C45E7B}.suc-active-filters .suc-active-filters-clear{border-color:transparent;background:transparent;color:#A25B76;padding-inline:4px}

/* Mobile drawer overlay is generated only when needed. */
body > .suc-filter-overlay{
  display:none!important;
  position:fixed!important;
  inset:0!important;
  width:auto!important;height:auto!important;min-width:0!important;min-height:0!important;
  margin:0!important;padding:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;
  background:rgba(36,24,43,.10)!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  cursor:pointer;
  pointer-events:none;
  z-index:9997!important;
}
html.suc-filter-drawer-open,
body.suc-filter-drawer-open{
  overflow:hidden!important;
  overscroll-behavior:none!important;
}
body.suc-filter-drawer-open{
  position:fixed!important;
  top:var(--suc-filter-scroll-lock-top,0px)!important;
  left:0!important;right:0!important;
  width:100%!important;max-width:100%!important;
}


.suc-filter-empty{width:100%;min-height:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;border:1px dashed #E8DCE7;border-radius:22px;background:rgba(255,255,255,.72);color:#6D6071;text-align:center}
.suc-filter-empty b{font-size:14px;color:#4F4056}.suc-filter-empty span{font-size:11px;opacity:.7}.suc-filter-empty a{margin-top:7px;padding:8px 14px;border-radius:999px;background:#FFF0F6;color:#C9507A;text-decoration:none;font-size:10px;font-weight:700}
.suc-filter-notice{position:fixed;left:24px;bottom:24px;z-index:10020;max-width:min(360px,calc(100vw - 32px));padding:11px 15px;border:1px solid #F0DFEA;border-radius:14px;background:#fff;color:#63495D;box-shadow:0 14px 36px rgba(70,45,64,.14);font:600 11px/1.8 inherit;opacity:0;transform:translateY(10px);transition:.2s ease}.suc-filter-notice.is-show{opacity:1;transform:none}
.suc-shop-layout.is-filter-loading .suc-products-region{opacity:.58;pointer-events:none;transition:opacity .16s ease}.suc-shop-layout.is-filter-loading .suc-shop-filter-region{pointer-events:none}.suc-shop-layout.is-filter-loading .suc-products-region:before{content:"";position:fixed;left:50%;top:calc(var(--suc-sticky-header-offset,0px) + 28px);width:22px;height:22px;border:2px solid rgba(112,87,133,.14);border-top-color:var(--suc-filter-accent,#E889A6);border-radius:50%;animation:sucFilterSpin .7s linear infinite;z-index:9996}@keyframes sucFilterSpin{to{transform:rotate(360deg)}}

/* Admin Preview adapter: position only. The shared rules above own appearance. */
.suc-demo-filter.suc-filter-shell{
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  align-self:start;
}
.suc-demo-filter [disabled]{pointer-events:none}
.suc-gen2-runtime-state,.suc-gen2-status{display:none!important}

/* Device presentation is data-driven, so wp-admin browser width cannot alter
 * the selected Preview device. Frontend receives the same data attribute. */
.suc-filter-shell[data-suc-component-device="desktop"],
.suc-filter-shell[data-suc-component-device="tablet"]{
  position:relative;
}
.suc-filter-shell[data-suc-component-device="mobile"]:not(.suc-demo-filter){
  position:fixed!important;
  inset:0 0 0 auto!important;
  width:min(calc(100vw - 18px),var(--suc-filter-width,420px))!important;
  max-width:min(430px,var(--suc-filter-width,420px))!important;
  min-width:0!important;
  height:100vh!important;height:100dvh!important;
  z-index:100005!important;
  transform:translateX(104%);
  visibility:hidden;pointer-events:none;
  transition:transform .26s cubic-bezier(.2,.75,.2,1),visibility 0s linear .26s;
  padding:0!important;margin:0!important;
  box-sizing:border-box;overflow:hidden;overscroll-behavior:contain;
}
.suc-filter-shell[data-suc-component-device="mobile"]:not(.suc-demo-filter).is-open{
  transform:translateX(0);visibility:visible;pointer-events:auto;
  transition:transform .26s cubic-bezier(.2,.75,.2,1),visibility 0s;
}
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-frame{
  height:100%!important;min-height:0!important;max-height:100%!important;
  border-radius:min(var(--suc-filter-radius),26px) 0 0 min(var(--suc-filter-radius),26px)!important;
  border-right:0!important;background:var(--suc-filter-bg);
}
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-mobile-bar{
  min-height:66px;display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:12px max(14px,var(--suc-filter-pad));
  border-bottom:1px solid color-mix(in srgb,var(--suc-filter-border) 76%,#fff);
  background:color-mix(in srgb,var(--suc-filter-bg) 94%,#fff);
  flex:0 0 auto;box-sizing:border-box;z-index:5;
}
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-scroll-body{
  min-height:0;flex:1 1 auto;overflow-y:auto!important;overflow-x:hidden!important;
  overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin;
  scrollbar-color:color-mix(in srgb,var(--suc-filter-accent) 20%,transparent) transparent;
}
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-scroll-body::-webkit-scrollbar{width:4px;height:0}
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-scroll-body::-webkit-scrollbar-track{background:transparent}
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-scroll-body::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--suc-filter-accent) 20%,transparent);border-radius:999px}
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-form{padding-top:8px}
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-mobile-actions{
  display:grid!important;grid-template-columns:minmax(92px,.72fr) minmax(0,1.5fr);gap:9px;
  flex:0 0 auto;min-height:74px;padding:10px max(14px,var(--suc-filter-pad));
  border-top:1px solid color-mix(in srgb,var(--suc-filter-border) 76%,#fff);
  background:color-mix(in srgb,var(--suc-filter-bg) 97%,#fff);
  box-shadow:0 -10px 26px rgba(72,49,82,.055);box-sizing:border-box;z-index:8;
}
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-mobile-actions button{
  min-width:0!important;height:48px!important;margin:0!important;padding:0 14px!important;
  border-radius:14px!important;appearance:none!important;-webkit-appearance:none!important;
  font-size:11.5px!important;font-weight:800!important;line-height:1!important;cursor:pointer!important;
  transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,opacity .16s ease!important;
}
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-mobile-clear{
  border:1px solid color-mix(in srgb,var(--suc-filter-border) 88%,#fff)!important;
  background:#fff!important;color:color-mix(in srgb,var(--suc-filter-text) 82%,#fff)!important;
  box-shadow:none!important;
}
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-mobile-apply{
  border:1px solid color-mix(in srgb,var(--suc-filter-accent) 72%,#fff)!important;
  background:var(--suc-filter-accent)!important;color:#fff!important;
  box-shadow:0 8px 20px color-mix(in srgb,var(--suc-filter-accent) 23%,transparent)!important;
}
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-mobile-apply.is-loading{opacity:.68!important;pointer-events:none!important}
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-mobile-actions button:focus-visible{outline:2px solid color-mix(in srgb,var(--suc-filter-accent) 38%,transparent)!important;outline-offset:2px!important}
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-scroll-body{touch-action:pan-y!important}

body > .suc-filter-overlay.is-open{display:block!important;pointer-events:auto;z-index:100004!important}
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-category-row{min-height:46px}
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-category-copy b{font-size:11px!important}
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-group-head{min-height:52px;font-size:11.5px!important}
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-notice{left:16px;right:16px;bottom:18px;max-width:none;text-align:center}

/* Preview adapter keeps the same mobile internals while the Admin device layer
 * owns only its absolute positioning inside the canonical 390px canvas. */
.suc-demo-filter.suc-filter-shell[data-suc-component-device="mobile"]{
  position:relative!important;inset:auto!important;transform:none!important;
  width:100%!important;max-width:100%!important;min-width:0!important;
  height:100%!important;max-height:100%!important;
  z-index:auto!important;padding:0!important;margin:0!important;overflow:hidden!important;
}
.suc-demo-filter.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-frame{height:100%!important;max-height:100%!important}

/* 1.14.8 Mobile drawer crispness. No blur/filter/opacity may leak from theme
 * dialogs or the page overlay into the Drawer surface or its filter options. */
.suc-filter-shell[data-suc-component-device="mobile"],
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-frame,
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-scroll-body,
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-form,
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-group,
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-group-body,
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-category-row,
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-checks label,
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-buttons label{
  filter:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;opacity:1!important;
}
.suc-filter-shell[data-suc-component-device="mobile"] .suc-filter-frame{background:var(--suc-filter-bg)!important}

/* 1.14.9 Mobile Drawer portal: while open the actual filter root is moved
 * directly under BODY. This escapes theme/Elementor ancestor filters, opacity,
 * transforms and dialog effects that descendant `filter:none` cannot cancel. */
body > .suc-filter-shell[data-suc-drawer-portal="1"]{
  filter:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;opacity:1!important;
  isolation:isolate!important;
}