#filterModal.filter-drawer-modal .modal-dialog{
  margin:0 0 0 auto;
  max-width:460px;
  width:100%;
  height:100vh;
}
#filterModal.filter-drawer-modal .modal-content{
  height:100vh;
  border-radius:0;
  border-left:1px solid #ddd;
}
#filterModal .modal-body{ overflow-y:auto; }

.filter-trigger.is-filtered{
  background:#111;
  color:#fff;
  border-color:#111;
}
.filter-trigger .filter-count{
  margin-left:6px;
  min-width:18px;height:18px;
  border-radius:999px;
  background:#111;color:#fff;
  font-size:11px;line-height:18px;
  justify-content:center;align-items:center;
  display:none;
}

.filter-price-wrap{ position:relative; padding-top:16px; }
.price-track{ height:4px; background:#ddd; border-radius:999px; position:relative; }
.price-fill{ position:absolute; height:4px; background:#111; border-radius:999px; left:0; right:0; }
.filter-price-wrap input[type=range]{ width:100%; position:absolute; left:0; top:8px; background:transparent; pointer-events:none; }
.filter-price-wrap input[type=range]::-webkit-slider-thumb{ pointer-events:auto; width:14px; height:14px; border-radius:50%; background:#111; border:0; }
.price-values{ display:flex; justify-content:space-between; margin-top:10px; font-size:13px; }


.filter-chip{
  border:1px solid #cfcfcf;
  background:#fff;
  color:#111;
  min-width:64px;
}
.filter-chip.is-selected{
  background:#111;
  color:#fff;
  border-color:#111;
}

.filter-color-dot{
  width:26px;
  height:26px;
  border-radius:4px;
  border:1px solid #cfcfcf;
  background: var(--dot-color, #f3f3f3);
  position: relative;
}
.filter-color-dot.is-selected{
  border-color:#111;
  box-shadow: inset 0 0 0 2px #fff, 0 0 0 1px #111;
}