.template-collection {
  #AjaxinatePagination{
    .loading-text{
      font-size: 15px;
      color: #ccc;
      text-align: center;
      display: block;
      margin: 10px 0;
      font-family: var(--theme-default-theme);
    }
  }
  .facets__price{
    display: block;
    padding: 0;
  }
  .price-slider-wrapper {
    width: 100%;
    padding: 1rem 0;
    .slider-track-container {
      position: relative;
    }
  }
  .slider-track {
    position: absolute;
    height: 4px;
    background: #ccc;
    border-radius: 2px;
    top: 50%;
    left: 0;
    border: 1px solid #ccc !important;
    right: 0;
    transform: translateY(-50%);
    z-index: 1;
    display:block !important;
  }
  
  .price-inputs {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top:20px;
    .filter-drawer__price-range-input{
      position: relative;
      span{
        position: absolute;
        top: 50%;
        left: 12px;
        transform: translateY(-50%);
        font-family: var( --theme-default-theme);
        font-size: 15px;
      }
      input{
        padding: 12px;
        border: 1px solid rgba(197,197,197);
        text-align: right;
        min-width: 100px;
        font-family: var( --theme-default-theme);
        font-size: 15px;
        -webkit-appearance: none;
      }
    }
  }

  div.facets__price{
    display: block;
    .filter-drawer__price-range-title{
      font-size: 15px;
    }
    input[type='range'] {
      -webkit-appearance: none; 
      padding: 0;               
      font: inherit;            
      outline: none;
      color: rgba(191,93,73);             
      opacity: 1;
      background:transparent;        
      box-sizing: border-box;
      transition: opacity .2s;
      cursor: pointer;
      height: 2px;
      z-index: 2 ;
      position: absolute;
      width: 100%;
      margin: 0;
      top: 0;
      + input{
          position: absolute;
          top:2px;
         z-index: 3 ;
        &::-webkit-slider-thumb {
           margin-top: -6px;
        }
      }
      &::-webkit-slider-thumb {
        cursor: ew-resize;
        background: rgba(191,93,73); 
        color:#fff;  
        border: 1px solid #f7f7f7 !important;
        height: 20px;
        width: 20px;
        border-radius: 50%;
        cursor: pointer;
        position:relative;
        margin-top: -5px;
        z-index: 1;
        -webkit-appearance: none;
      }
      &::-moz-range-progress {
        background: rgba(191,93,73);        
      }
      &::-moz-range-track {  
        background: rgba(191,93,73);        
      }
      /* IE*/
      &::-ms-fill-lower {
        background:rgba(191,93,73);        
      }
      &::-ms-fill-upper {  
        background:rgba(191,93,73);        
      }
    }
     .range-wrap {
      display: flex;
      flex-direction: column;
      gap: 0.5rem;
      position: relative;
      margin: 0 auto 3rem;
    }
    .price-input {
      max-width: 100px;
    }
    .range {
      width: 100%;
    }
    .bubble {
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
    }
    .price-range-slider{
      display: flex;
    }
  }   
  form#FacetFiltersForm,form#FacetFiltersFormMobile {
    display: flex;
    flex-direction: column;
    .filter-p-m-custom-filter_color{
      .facets__label {
        display: flex;
        align-items: center;
        svg{
          margin: 0;
        }
      }
      .facet-checkbox__text{
        padding-left: 48px;
        position: relative;
        line-height: 2.6;
      }
      input  + svg + div{
        top: 47%;
        transform: translateX(-47%);
        margin: 0;
        left: 8px;
      }
      input  + svg + div + .facet-checkbox__text:before{
        content: "";
        background: #fff;
        width: 29px;
        height: 29px;
        border-radius: 50%;
        position: absolute;
        left: 11px;
        top: 3px;
        border: 1px solid #e4e4e4;
      }
      input{
        &[value="Red"] + svg + div + .facet-checkbox__text:before{
           background: #C30122;
        }
        &[value="Black"] + svg + div + .facet-checkbox__text:before{
           background: #000000;
        }
        &[value="Blue"] + svg + div + .facet-checkbox__text:before{
        background:#6099AC;
        }
       &[value="Green"] + svg + div + .facet-checkbox__text:before{
        background:#364837;
        }
        &[value="Brown"] + svg + div + .facet-checkbox__text:before{
        background:#362204;
        }
        &[value="White"] + svg + div + .facet-checkbox__text:before{
        background: #fff;
        }
        &[value="Yellow"] + svg + div + .facet-checkbox__text:before{
             background: #D4AF4A;
        }
        &[value="Neutral"] + svg + div + .facet-checkbox__text:before{
            background: #EDE2D5;
        }
      }
    }
    .filter-p-m-custom-filter_shoes_size{
      .facets__list{
        display: flex;
        flex-wrap: wrap;
        gap: 16px;
        .facets__label{
          padding: 12px 21px !important;
          background: #d9d9d9;
          border-radius: 50%;
          &.active{
            background: #C7E0EE;
          }
          svg,.svg-wrapper{
            display: none;
          }
          .facet-checkbox__text-count{
            display: none;
          }
        }
      }
    }
    .sort-by-filter{
      .facet-filters__radios{
        label{
          color: #000;
          font-size: 14px;
          font-weight: 400;
          padding: 0 0 9px;
          line-height: 1;
          height: auto;
          display: flex;
          align-items: center;
          cursor: pointer;
          margin-bottom: 9px;
          input:checked + .filter-item__radio{
            background: rgba(27,27,27);
            .indicator{
              opacity: 1;
            }
          } 
          .filter-item__radio{
            width: 16px;
            height: 16px;
            border: 1px solid rgba(27,27,27);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            .indicator{
              display: block;
              width: 6px;
              height: 6px;
              background-color: #fff;
              border-radius: 100%;
              opacity: 0;
            }
          }
          .filter-item__label{
              padding-left: 12px;
          }
        }
      }
    }
  }
  .page-width{
    padding: 0 15px;
  }
  .active-facets{
    margin: 0 0 20px;
    gap: 2px;
    facet-remove{
      font-family: var(--theme-default-theme);
      .active-facets__button{
        margin: 0;
        padding: 9px 12px;
        border: 1px solid #ccc;
        border-radius: 30px;
        font-size: 15px;
        .active-facets__button-inner{
          padding: 0;
          font-size: 15px;
          box-shadow: none;
        }
      }
    }
  }
  .collection-main-wrapper > div{
    display:flex;
    gap:20px;
    #main-collection-filters{
      width:241px;
      padding: 0;
      .facets__heading{
        display:none;
      }
      .facets__wrapper{
        display:block;
        width:100%;
        .facet-checkbox__text{
          display: flex;
          gap: 5px;
          justify-content: space-between;
          width: 100%;
          .facet-checkbox__text-count{
            color: #c2c2c2;
          }
        }
        
        .facets__disclosure {
            margin-right: 0;
            margin-bottom: 12px;
        }
        .facets__summary{
          &:hover{
            .facets__summary-label{
              text-decoration:none;
            }
          }
          .facets__summary-label,span {
              font-size: 16px;
              color: #000;
              line-height: 1.1;
          }
        }
        .facets__display{
          width: 100%;
          border: 0;
          box-shadow: none;
          position:unset;
          padding: 16px 0;
          .facets__header{
            display:none;
          }
          .facets__list {
            padding: 0;
            .facets__label {
              color:#000;
              padding-right: 0;
              &:hover{
                .facet-checkbox__text-label{
                  text-decoration: none;
                }
              }
              svg rect{
                    stroke: #000;
              }
              input[checked] + svg + div + .facet-checkbox__text{
                .facet-checkbox__text-count{
                  color: #000;
                }
              }
              input[checked] + svg{
                background: #1E1D66;
              }
              input[checked] + svg + div {
                svg path{
                      fill: #fff;
                }
              }
            }
          }
        }
      }
      .facet-filters.sorting{
        padding: 0;
        .facet-filters__field{
              justify-content: flex-start;
        }
      }
    }
    .product-grid-container{
      width:calc(100% - 251px);
      .collection.page-width{
        padding:0;
        margin-bottom: 80px;
        max-width:unset;
      }
      .product-grid{
        margin:0;
      }
    }
  }
  .container-col{
    max-width:90%;
    padding:0 15px;
    margin:0 auto;
  }
  .collection-hero__title{
    margin:0;
    margin-bottom:20px;
    text-align:center;
    padding-bottom:40px;
    font-family:var(--secondary-font-family);
    border-bottom:1px solid #dedede;
    font-size:34px;
    font-style:italic;
    line-height:1.2;
    letter-spacing:-1px;
    text-transform:uppercase;
    .shop-text{
      display:block;
      font-size:44px;
      line-height:0.9;
    }
    .page-title{
      margin-top:-6px;
      display:block;
    }
  }
}
.template-collection-perfume-sample{
  .card__inner {
    padding-top: 20%;
  }
}

.template-collection-men-socks{
  .product-grid-container{
    margin-bottom: 80px;
  }
}
.template-collection-winter-fur .circle__container .carousel-cell a span {
    font-size: 8px;
    letter-spacing: 0.074px;
}
.hide-desktop{
  display:none;
}
.heading-page {
    font-size: 38px;
    text-transform: unset;
}
.new-pieces-wrap {
  padding: 33px 17px 0;
  text-align:center;

  h4 {
    text-transform: capitalize;
    letter-spacing:-1px;
    font-size:36px;
    font-family: Editors-Note;
  }
  p{
    font-size: 22px;
    margin-top: 0;
    line-height: .8;
    font-family: Editors-Note;
  }
  a {
    font-size: 42px;
    line-height: 1.2;
    font-style: italic;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -1px;
    color:#000;
    font-family: Editors-Note;
    text-align:center;
  }
}
.margin0{
  margin:0;

  .lookbook-main-image{
    padding:0;
  }
}
/* media query code starts here */

@media(max-width:767px){
  .template-collection {
    .mobile-facets .submenu-open.mobile-facets__main {
        visibility: visible;
    }
     #MainContent .page-width {
              max-width: 100%;
    }
    .active-facets.active-facets-desktop{
      display: none;
    }
    .active-facets{
       margin: 0px;
      facet-remove{
        &:only-child{
          display: block;
        }
      }
     }
    .collection-main-wrapper > div {
      #main-collection-filters {
       .facets__wrapper {
              height: 100%;
              .facets__display {
                position: unset;
                transform: none;
                visibility: visible;
                padding: 0;
                max-height:100%;
                .mobile-facets__close-button{
                      display: none;
                }
                .facets__list {
                   padding:0 0 12px;
                  .facets__label{
                    padding-left: 0;
                  }
                }
              }
          }
        .mobile-facets__info{
          padding: 0;
        }
          price-range .facets__price{
              padding: 0;
          }
        }
      }
    #FacetFiltersFormMobile{
      .sort-by-filter {
        .facet-filters__radios {
                padding: 0;
        }
      }
      .mobile-facets__footer{
          display: block;
          border:0;
        .mobile-facets__clear-wrapper{
          margin-bottom: 12px;
          width: 100%;
          a{
            font-family: var(--secondary-font-family);
            font-style: italic;
            font-weight: 400;
            font-size: 22px;
            line-height: 1;
            text-align: center;
            text-transform: uppercase;
            color: #000;
            padding: 12px 38px;
            height: auto;
            background: #EEEBE9;
            border: 2px solid #E4DEDC;
            border-radius: 8px;
            width: 100%;
          }
        }
        .button{
            font-family: var(--secondary-font-family);
            font-style: italic;
            font-weight: 400;
            font-size: 22px;
            line-height: 1;
            text-align: center;
            text-transform: uppercase;
            color: #000;
            padding: 12px 38px;
            height: auto;
            background: rgba(193,58,56,.22)!important;
            border: 2px solid #E4DEDC;
            border-radius: 8px;
            width: 100%;
            margin: 0;
            &:before,&:after{
              display: none;
            }
        }
      }
    }
    .circle__container {
        .slick-list {
            /* padding-top: 0; */
        }
      }
    .collection-main-wrapper > div{
      flex-wrap:wrap;
      #main-collection-filters{
        width:100%;
      }
      .product-grid-container{
        width:100%;
      }
    }
    .container-col{
      padding:0 40px;
    }
    .product-grid .grid__item {
    width: calc(33% - var(--grid-desktop-horizontal-spacing)* 3 / 4);
    }
    .collection-hero__title{
      margin-bottom: 0;
    }
    .facets-container {
      display: block;
      padding: 0;
      .mobile-facets__wrapper{
        border-bottom: 1px solid #DBDBDB;
        margin-bottom: 24px;
      }
      .mobile-facets__close{
        right: 0.1rem;
      }
    }
    .mobile-facets__header{
      padding: 20px;
      text-align: left;
      border: 0;
      .mobile-facets__heading{
        font-size: 18px;
      }
    }
    .mobile-facets__main{
      padding:16px 20px 0;
      .mobile-facets__summary{
        font-size: 16px;
        padding: 0 0 16px;
        color: #000;
      }
    }
    .mobile-facets__wrapper .mobile-facets__button-group{
      display: flex;
      align-items: center;
      justify-content: flex-end;
      width: 100%;
      .mobile-facet-toggle{
        font-size: 13px;
        padding:14px 0;
        display: block;
        &:first-child{
          margin-right: auto;
        }
        &:nth-child(2){
          margin-right: 45px;
        }
      }
    }
  }
  .template-collection-men-socks{
    .product-grid-container{
      margin-bottom: 40px;
    }
  }
  .hide-desktop{
    display:block;
  }
}
@media(max-width:567px){
  .template-collection {   
    .collection-hero__inner.page-width {
        max-width: 100%;
    }
    .container-col{
      padding:0 20px;
      max-width: 100%;
    }
    .collection-hero__title{
      .shop-text{
        font-size:11.8vw;
      }
      .page-title{
        font-size:9vw;
      }
    }
    .product-grid {
       .card__heading a{
      font-size:3.2vw;
      }
      .card-information>.price,.price--on-sale .price-item--regular{
        font-size:3vw;
      }
      .grid__item {
        width: calc(50% - var(--grid-desktop-horizontal-spacing)* 3 / 4);
      }
    }
    .collection-main-wrapper > div {
        & .product-grid-container {
            .collection.page-width {
                margin-bottom: 40px;
            }
        }
    }
    .mobile-facets__wrapper{
      .mobile-facet-toggle{
        font-size: 3.5vw;
        padding: 3.75vw 1.3vw;
      }
    }
  }
}

@media (min-width: 1030px) {
    .template-collection-winter-fur .circle__container .carousel-cell a span {
        font-size: 12px;
    }
}