/* Collection  */
#collection {
  --sidebar_width: 300px;
  --sidebar_margin: 48px;
  --sidebar_padding: 20px;
  --price_filter_width: calc(var(--sidebar_width)- var(--sidebar_padding));
  --filterwrap_margin: 30px;
  --filtertitle_margin: 10px;
  --btn_toggle_icon: 1.2em;
  --btn_toggle_icon_margin: 5px;
  overflow:hidden;
}

#collection .page-wrap {
  display: flex;
}

#collection .usps-col {
  order:31;
}

#collection .banner-col {
  order:61;
}

@media(max-width:991px) {
  #collection .usps-col {
    order:21;
  }
  #collection .banner-col {
    order:41;
  }
}

.collection-usp {
  padding:24px 32px;
  background: var(--accent_light);
  border-radius:var(--border_radius_big);
  font-size:14px;
}
/* 
.collection-content.top .sort .toggle-filters i {
  font-size: var(--btn_toggle_icon);
  margin-right:var(--btn_toggle_icon_margin);
} */

.collection-content,
#collection .tile-slider,
.collection-brands-slider,
.sort  {
  margin:32px 0px;
}

@media(max-width:768px) {
  .collection-content,
  #collection .tile-slider,
  .collection-brands-slider,
  .sort  {
    margin:24px 0px;
  }
}

.sidebar {
  min-width: var(--sidebar_width);
  max-width: var(--sidebar_width);
  margin-right: var(--sidebar_margin);
}

.sidebar__title {
  padding-bottom:8px;
  margin-bottom:16px;
  border-bottom: 1px solid var(--grey_border);
  font-size: var(--font_h4)
}

.sidebar__block {
  margin-bottom:32px;
}

.sidebar__categories {
  margin:0;
  padding:0;
  list-style:none;
  display: flex;
  flex-direction:column;
  gap:8px;
}

.sidebar__categories li.active {
  font-weight:bold;
  color: var(--accent);
}

.sidebar__categories a:hover {
  color: var(--accent);
}

.sidebar-overlay {
  position: fixed;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0, .6);
  -webkit-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
  opacity: 0;
  top: 0;
  left: 0;
  visibility: hidden;
  z-index: 99999;
}

.sidebar-overlay.active {
  opacity: 1;
  visibility: visible;
}

@media(max-width:1200px) {
  .sidebar {
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    z-index: 99999;
    background: #fff;
    margin: 0;
    padding: 32px;
    overflow-y: scroll;
    width:90%;
    max-width:400px;
    transition: all .2s ease-in-out;
    transform: translate(-100%, 0px);
  }
  .sidebar.active {
    transform: translate(0%, 0px);
  }
}

/* .sidebar {
  margin: 0;
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  background: var(--grey_block);
  z-index: 99999;
  border-radius: var(--border_radius);
  transform: translateX(-100%);
  transition: all .2s ease-in-out;
  overflow: scroll;
  width: 100%;
  max-width: 400px;
}

.sidebar .inner {
  opacity: 0;
  transform: translateX(-10%);
  transition: all .2s ease-in-out;
  transition-delay: .2s;
  padding: var(--sidebar_padding);
}

.sidebar.active {
  box-shadow: 5px 0 10px 0 rgba(0,0,0,0.05);
  transform: translateX(0);
}

.sidebar.active .inner {
  opacity: 1;
  transform: translateX(0);
}

.sidebar .top-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--sidebar_padding) var(--sidebar_padding) 0;
}

.sidebar .top-wrap .title {
  font-size: var(--font_h3);
  font-weight: bold;
}

.sidebar-overlay {
  position: fixed;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0, .6);
  -webkit-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
  opacity: 0;
  top: 0;
  left: 0;
  visibility: hidden;
  z-index: 99999;
}

.sidebar-overlay.active {
  opacity: 1;
  visibility: visible;
} */

#collection .main-col {
  min-width: 100%;
  max-width: 100%;
}

#collection .sort-block.pagination {
  display: flex;
  align-items: center;
}

#collection .sort-block.pagination .per-page {
  margin-right: 10px;
}

#collection .custom-pager,
#collection .custom-pager .right {
  display: flex;
  align-items: center;
}

#collection .custom-pager .left {
  margin-right: 20px;
}

#collection .custom-pager ul li a {
  padding: 0 5px;
  color: var(--body);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  margin-right: 5px;
  text-align: center;
}

#collection .custom-pager ul li.disabled a {
  color: var(--disable);
}

#collection .custom-pager ul li.active a {
  color: var(--accent);
}
  
@media (min-width: 1200px){
  #collection .main-col {
    min-width: calc((100% - var(--sidebar_width)) - var(--sidebar_margin));
    max-width: calc((100% - var(--sidebar_width)) - var(--sidebar_margin));
  }

  /* #collection .sidebar {
    min-width: var(--sidebar_width);
    max-width: var(--sidebar_width);
    margin-right: var(--sidebar_margin);
    position: relative;
    top: unset;
    left:unset;
    height: unset;
    width: auto;
    transform: translateX(0);
  }

  .sidebar .inner {
    padding: var(--sidebar_padding);
    opacity: 1;
    transform: translateX(-0);
    transition: all .2s ease-in-out;
    transition-delay: .2s;
  }  */
}

/* End collection */

/* Collection filters */
.price-filter {
  max-width: var(--price_filter_width);
}

.price-filter a {
  -webkit-transition: none;
  -moz-transition: none;
  -o-transition: none;
  transition: none;
}

.collection-filter-price {
  height: 12px;
  border: none;
  margin: 0px;
  padding: 0;
  position: relative;
  width: 100%;
  background: var(--grey_border);
  
}
.price-filter .sidebar-hide{
  margin-top: 25px;
}
.price-filter-rangeclear{
  display: flex;
    justify-content: space-between;
    margin-top: 8px;
}

.collection-filter-price .ui-slider-range {
  border: none;
  margin: 0;
  position: absolute;
  height: 12px;
  top: 0;
  z-index: 1;
  background: var(--accent);
}

.collection-filter-price .ui-slider-handle {
  display: block;
  position: absolute;
  width: 24px;
  height: 24px;
  border-radius: 100%;
  border: 0;
  top: -6px;
  cursor: col-resize;
  border: none;
  background-color: #fff;
  border: solid 2px var(--accent);
  outline: none;
  z-index:9;
}

.collection-filter-price .ui-slider-handle:last-child {
	margin-left:-12px;
}

.collection-filter-price .ui-slider-handle:first-of-type {
  margin-left:-4px;
}

.collection-filter-price:after {
	display:block;
  content:'';
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:12px;
  background:var(--grey_border);
}

.price-filter-range {
  margin-top: 10px;
  font-size: .9em;
  display: flex;
  justify-content: space-between;
}

.price-filter-range .min,
.price-filter-range .max {
  display: inline-block;
}

.price-filter-range .min span,
.price-filter-range .max span {
  font-weight: 600;
}

.price-filter-range .max {
  margin-left: 15px;
}

.filter-wrap {
	margin-bottom: var(--filterwrap_margin);
}

.filter-wrap:last-child {
	margin-bottom: 0;
}

.filter-wrap .filter-title {
	margin-bottom: var(--filtertitle_margin);
  color: var(--black);
}

.filter-items {
	display: flex;
  flex-direction: column;
  gap:16px;
}

.filter-items .filter-item {
  padding:0;
  margin-top: 2px;
}

.filter-item label {
  margin:0;
}
.sidebar-hide{
  display: none;
  /* transition: height 0.5s ease; */
}


.sidebar__title{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.sidebar__block .sidebar__title i{
  transition: transform .2s ease-in-out;
}
.sidebar__block.active .sidebar__title i{
  transform: rotate(180deg);

} 
/* End collection filters */

.sort {
  padding:16px 0px;
  border-top:1px solid var(--grey_border);
  border-bottom: 1px solid var(--grey_border);
  margin:32px 0px;
  gap:32px;
  display:flex;
  justify-content: space-between;
  align-items: center;
}

.sort__results {
  color: var(--gray)
}

.sort__select {
  color: var(--gray)
}

.pagination {
  margin:0;
  list-style:none;
  gap:16px;
}

.pagination__item {
  width:40px;
  height:40px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:100%;
}

.pagination__item a {
  display: flex;
  align-items: center;
  justify-content: center;
  width:100%;
  height:100%;
}

.pagination__item i {
  font-size:1.5em;
}

.pagination__item--active {
  color: var(--accent);
  background: var(--accent_light);
  font-weight:bold;
}

.pagination__item--disabled {
  opacity:.5;
  pointer-events: none;
}

#collection .sort .pagination {
  justify-content:flex-end;
  flex-grow:10;
}

.aiden .btn {
  display: inline-flex;
}


.products-col .product{
  transition: background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}
.products-col:hover .product{
  background-color: #fff;
  box-shadow: 0 5px 10px rgba(0,0,0, .1) ;
}
.read-more-title:hover{
  cursor: pointer;
}

.price-filter .price-wrapper {
  position: relative;
  display: inline-block;
}

.price-filter .price-wrapper .currency {
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: #666;
  pointer-events: none;
  font-size: 14px;
  line-height: normal;
}

.price-filter-inputs {
	display: flex;
  gap: 12px;
  justify-content: space-between;
  padding-top: 16px;
  align-items: center;
}

.price-filter-inputs label {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.price-filter .price-wrapper .price-input {
  border: none !important;
  background-color: #f7f7f7;
  border-radius: 4px;
  min-height: 40px;
  width: 90px;
  padding: 8px 8px 8px 28px;
  box-sizing: border-box;
}

#delete-filters {
	color: #f71595;
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 12px;
}

#delete-filters svg {
	width: 16px;
  height: auto;
}