.banner-category img{
  width:100%;
  height:100%;
}
.fillter-product-ready{
  padding:20px 0px;
  border-bottom: 1px solid rgba(35 ,49 ,75 ,0.12);
  border-top: 1px solid rgba(35 ,49 ,75 ,0.12);
}
.fillter-price{
   padding:20px 0px;
   border-bottom: 1px solid rgba(35 ,49 ,75 ,0.12);
}
.switch{
    appearance: none;
    height: 20px;
    width: 40px;
    border-radius: var(--rounded-full);
    background: #23314B26;
    padding: 3px;
    transition: background .2s ease-in-out;
    display: grid;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
    cursor: pointer;
    display: flex;
    align-items: center;
}
.switch::after {
    content: "";
    width: 14px;
    height: 14px;
    background: white;
    border-radius: var(--rounded-full);
    transition: transform .2s ease-in-out;
    box-shadow: 0 1px 1px #0003;
}
.switch:checked {
    background: rgb(var(--accent));
}
.switch:checked::after {
    transform: translate(20px);
}
.fillter-by-box_content{
  top: 30px;
  right:0;
  left:0;
  box-shadow: var(--shadow-md);
  padding:10px;
  background: white;
  z-index:99;
  overscroll-behavior-y: contain;
  width: max-content;
  overflow-y: auto;
  border-radius:8px;
  border: 1px solid rgba(35 ,49 ,75 ,0.12);
  display:flex;
  flex-direction: column;
  width:max-content;
  opacity:0;
  visibility: hidden;
  transition: opacity 0.5s;  
}
.fillter-by-box_content.active{
   opacity:1;
  visibility: visible;
}
.fillter-by-box_content button{
  padding: 8px 10px;
  color:rgba(35 ,49 ,75 ,0.7);
  background: linear-gradient(to right,currentColor,currentColor) 0 min(100%,1.35em) / 0 1px no-repeat;
  transition: background-size .3s ease-in-out;
  position:relative;
  
}
.fillter-by-box_content button::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 0;
    height: 1px;
    background: #000000;
    transition: all .6s ease;
}
.fillter-by-box_content button:hover::after{
     content: '';
    width: 100%;
}
div[data-quantity].outstock{
  display:none;
}
#row-inner-prod{
  min-height:1000px;
}



.range-slider {
  margin: auto;
  text-align: center;
  position: relative;
  height:0;
  display: none;
   transition: height 0.3s;
}
.range-slider.active{
  display: block;
   height:auto;
}

.range-slider svg,
.range-slider input[type="range"] {
  position: absolute;
  left: 0;
 top: -20px;
}

.range-slider .label-number-sortPirce {
  border: 1px solid rgba(35 ,49 ,75 ,0.12);
  text-align: center;
  font-size: 14px;
  border-radius:8px;
  width:100px;
  height:46px;
  padding:0px 10px;
}
.range-slider .label-number-sortPirce input[type='number']{
  text-align:end;
}


.range-slider input[type="range"] {
  -webkit-appearance: none;
  width: 100%;
  
}

.range-slider input[type="range"]:focus {
  outline: none;
}

.range-slider input[type="range"]:focus::-webkit-slider-runnable-track {
  background: var(--text-color);
}

.range-slider input[type="range"]:focus::-ms-fill-lower {
  background:  var(--text-color);
}

.range-slider input[type="range"]:focus::-ms-fill-upper {
  background:  var(--text-color);
}

.range-slider input[type="range"]::-webkit-slider-runnable-track {
  width: 100%;
  height: 5px;
  cursor: pointer;
  animate: 0.2s;
  background:  var(--text-color);
  border-radius: 1px;
  box-shadow: none;
  border: 0;
}

.range-slider input[type="range"]::-webkit-slider-thumb {
  z-index: 2;
  position: relative;
  box-shadow: 0px 0px 0px #000;
  border: 1px solid  white;
  height: 18px;
  width: 18px;
  border-radius: 25px;
  background:  var(--text-color);
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -7px;
}

.range-slider input[type="range"]::-moz-range-track {
  width: 100%;
  height: 5px;
  cursor: pointer;
  animate: 0.2s;
  background:  var(--text-color);
  border-radius: 1px;
  box-shadow: none;
  border: 0;
}

.range-slider input[type="range"]::-moz-range-thumb {
  z-index: 2;
  position: relative;
  box-shadow: 0px 0px 0px #000;
  border: 1px solid  white;
  height: 18px;
  width: 18px;
  border-radius: 25px;
  background:  var(--text-color);
  cursor: pointer;
}

.range-slider input[type="range"]::-ms-track {
  width: 100%;
  height: 5px;
  cursor: pointer;
  animate: 0.2s;
  background: transparent;
  border-color: transparent;
  color: transparent;
}

.range-slider input[type="range"]::-ms-fill-lower,
.range-slider input[type="range"]::-ms-fill-upper {
  background:  var(--text-color);
  border-radius: 1px;
  box-shadow: none;
  border: 0;
}

.range-slider input[type="range"]::-ms-thumb {
  z-index: 2;
  position: relative;
  box-shadow: 0px 0px 0px #000;
  border: 1px solid  white;
  height: 18px;
  width: 18px;
  border-radius: 25px;
  background:  var(--text-color);
  cursor: pointer;
}
#btn-submit-sort{
  display:none;
}