/* knobs */
:root{
  --mn-gap:19px;
  --mn-bar-h:3px;
  --mn-bar-r:24px;
  --mn-bar-bg:#EAEAEA;
  --mn-bar-fill:#AC87FF;
}

/* mobile slider */
.mn-mobile-slider{
  padding:0px 0px 40px;
  overflow:hidden;
}
.mn-track{
  display:flex;
  gap:var(--mn-gap);
  overflow:auto;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  padding:0;
  -ms-overflow-style:none;
  scrollbar-width:none;
}
.mn-track::-webkit-scrollbar{ display:none; height:0; }

@media (max-width:768px){
  .mn-slide{
    flex:0 0 calc((100% - var(--mn-gap)) / 1.5);
    max-width:calc((100% - var(--mn-gap)) / 1.5);
    scroll-snap-align:start;
  }
}
@media (max-width:767px) and (orientation:landscape),
       (max-width:767px) and (min-aspect-ratio:3/2){
  .mn-track{padding:0 !important;}
  .mn-slide{
    margin:0 !important;
    flex:0 0 calc((100% - (var(--mn-gap)*2.5)) / 3.5) !important;
    max-width:calc((100% - (var(--mn-gap)*2.5)) / 3.5) !important;
    scroll-snap-align:start;
  }
}

/* slide/content */
.mn-slide{
  position:relative;
  isolation:isolate;
}
.mn-slide .mn-slide-img{
  position:relative;
  z-index:0;
}

/* UPDATED aspect ratio 50/63 */
.mn-slide .mn-slide-img img{
  display:block;
  width:100%;
  aspect-ratio:50/63;
  object-fit:cover;
}

.mn-slide-title{
  margin:10px 0 0;
  font-family:"Figtree",system-ui,sans-serif;
  font-weight:600;
  font-size:15px;
  line-height:1.6;
  color:#000;
}
.mn-slide-title a{
  color:inherit;
  text-decoration:none;
}
.mn-slide-price{
  font-family:"Figtree",system-ui,sans-serif;
  font-weight:400;
  font-size:13px;
  line-height:1.8;
  color:#626262;
}

/* badges */
.mn-badge{
  position:absolute !important;
  top:14px;
  left:14px;
  z-index:5;
  pointer-events:none;
  padding:7px 10px;
  border-radius:999px;
  background:#e6edff;
  color:#000;
  font-family:"Figtree",system-ui,sans-serif;
  font-weight:600;
  font-size:11px;
  line-height:1;
  box-shadow:0 1px 2px rgba(0,0,0,.06);
}
.mn-badge:empty{display:none;}
.mn-badge.is-glow{background:#C1EFDF;}
.mn-badge.is-softblue{background:#CDDBFF;}

/* swatches */
.product-color-options{
  display:flex;
  gap:10px;
  align-items:center;
  margin:12px 5px 14px;
  position:relative;
  z-index:2;
}
.product-color-options .color-swatch{
  display:inline-block;
  width:18px;
  height:18px;
  border-radius:50%;
  border:1px solid #e5e7eb;
  position:relative;
  box-sizing:content-box;
  cursor:pointer;
  outline:none;
  z-index:3;
}
.product-color-options .color-swatch::after{
  content:"";
  position:absolute;
  inset:-2px;
  border:2px solid #222;
  border-radius:50%;
  opacity:0;
  pointer-events:none;
  transition:opacity .12s;
}
.product-color-options .color-swatch.selected::after,
.product-color-options .color-swatch:where(:focus,:active)::after{
  opacity:1;
}

/* swatch click fix */
.product-wrapper .product-item .brxe-image,
.product-wrapper .product-item .product-image-link{
  overflow:visible !important;
  position:relative;
}
.product-item{
  position:relative;
  isolation:isolate;
}
.product-item .product-image-link{
  position:relative;
  z-index:0 !important;
}
.product-item .product-image-link::before,
.product-item .product-image-link::after{
  pointer-events:none !important;
}
.product-item:has(.product-color-options:hover) .product-image-link,
.product-item:has(.product-color-options:focus-within) .product-image-link{
  pointer-events:none;
}

/* progress bar */
.mn-progress{
  height:var(--mn-bar-h);
  background:var(--mn-bar-bg);
  border-radius:999px;
  margin:12px var(--mn-bar-r) 0 0;
  width:calc(100% - var(--mn-bar-r));
  max-width:100%;
  overflow:hidden;
  position:relative;
  pointer-events:none;
  contain:paint;
}
.mn-progress i{
  display:block;
  height:100%;
  width:44px;
  min-width:44px;
  background:var(--mn-bar-fill);
  border-radius:inherit;
  transition:width .15s linear;
}

/* visibility */
@media (max-width:768px){
  .psm-wrapper .mn-mobile-slider{display:block;}
  .psm-wrapper .product-wrapper{display:none !important;}
}
@media (min-width:769px){
  .psm-wrapper .mn-mobile-slider{display:none !important;}
}

/* desktop badge + swatches */
@media (min-width:768px){
  .product-wrapper .product-item .mn-badge{
    position:absolute !important;
    top:14px;
    left:14px;
    z-index:5;
    pointer-events:none;
  }
  .product-wrapper .product-item .product-color-options{
    display:flex;
    gap:10px;
    align-items:center;
    margin:12px 5px 14px;
    overflow:visible;
  }
}

/* Safari fallback */
@supports not (gap:1rem){
  .mn-track{margin-right:-19px;}
  .mn-slide{margin-right:19px;}
  .mn-track>.mn-slide:last-child{margin-right:0;}
  .psm-wrapper .product-wrapper{margin:-10px;}
  .psm-wrapper .product-wrapper .product-item{margin:10px;}
}

/* UPDATED mobile image frame */
@media (max-width:768px){
  .psm-wrapper .mn-slide .mn-slide-img,
  .psm-wrapper .product-item .product-image-link{
    display:block;
    width:100%;
    aspect-ratio:50/63;
    border:0;
    overflow:visible;
  }
  .psm-wrapper .mn-slide .mn-slide-img img,
  .psm-wrapper .product-item .product-image-link img{
    width:100%;
/*     height:100%; */
	height: auto;
    display:block;
    object-fit:cover;
  }
  .psm-wrapper article{position:relative;}
  .psm-wrapper .mn-badge{
    position:absolute;
    top:9px;
    left:8px;
    z-index:2;
  }
}

/* fallback for browsers without aspect-ratio */
@supports not (aspect-ratio:1 / 1){
  .psm-wrapper .mn-slide .mn-slide-img,
  .psm-wrapper .product-item .product-image-link{
    position:relative;
  }
  .psm-wrapper .mn-slide .mn-slide-img::before,
  .psm-wrapper .product-item .product-image-link::before{
    content:"";
    display:block;
    padding-top:calc(63 / 50 * 100%);
  }
  .psm-wrapper .mn-slide .mn-slide-img img,
  .psm-wrapper .product-item .product-image-link img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
  }
}

/* wishlist desktop */
span.yith-wcwl-add-to-wishlist-button__label{display:none !important;}
.product-item .product-wishlist{
  position:absolute;
  top:16px;
  right:16px;
  z-index:6;
}
.product-item .product-wishlist .yith-wcwl-add-to-wishlist a{
  width:28px;
  height:28px;
  padding:0 !important;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#f8f9fa;
  border:1px solid #e9ecef;
  line-height:1;
  color:#6c757d;
  transition:background .2s,border-color .2s,color .2s;
}
.product-item .product-wishlist .yith-wcwl-add-to-wishlist a img{
  width:16px;
  height:16px;
  object-fit:contain;
}

/* wishlist mobile */
.mn-mobile-slider .mn-slide .mn-badge{
  position:absolute;
  top:8px;
  left:8px;
  z-index:5;
  display:inline-flex;
  align-items:center;
  height:28px;
  padding:0 10px;
  pointer-events:none;
}
.mn-mobile-slider .mn-slide .product-wishlist{
  position:absolute;
  top:8px;
  right:8px;
  z-index:6;
}

/* hover flip */
.mn-mobile-slider .mn-slide-img,
.product-item .product-image-link{
  position:relative;
  display:block;
  overflow:hidden;
}
.mn-mobile-slider .mn-slide-img img.front-images,
.product-item .product-image-link img.front-images{
  transition:opacity .2s ease;
}
.mn-mobile-slider .mn-slide-img img.second-image,
.product-item .product-image-link img.second-image{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:0;
  transition:opacity .2s ease;
  pointer-events:none;
}
.mn-mobile-slider .mn-slide-img:hover img.second-image,
.mn-mobile-slider .mn-slide-img.flipped img.second-image,
.product-item .product-image-link:hover img.second-image,
.product-item .product-image-link.flipped img.second-image{
  opacity:1;
}
.mn-mobile-slider .mn-slide-img:hover img.front-images,
.mn-mobile-slider .mn-slide-img.flipped img.front-images,
.product-item .product-image-link:hover img.front-images,
.product-item .product-image-link.flipped img.front-images{
  opacity:0;
}

/* FIX: same size front & hover image on mobile */
@media (max-width:768px){
  .mn-slide .mn-slide-img{
    position:relative;
    width:100%;
    aspect-ratio:50/63;
    overflow:hidden;
  }
  .mn-slide .mn-slide-img img.front-images,
  .mn-slide .mn-slide-img img.second-image{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    aspect-ratio:50/63 !important;
    transition:opacity .2s ease;
  }
  .mn-slide .mn-slide-img img.second-image{
    opacity:0;
    pointer-events:none;
  }

  .product-item .product-image-link:hover img.front-images,
.product-item .product-image-link.flipped img.front-images{ 
    opacity:1;
  }

}

/* last-slide spacing */
@media (max-width:768px){
  .mn-track{
    padding-right: var(--mn-bar-r);
  }
}

@media (max-width:768px){
  .mn-slide .mn-slide-img,
  .mn-slide .mn-slide-img img,
  .mn-slide .mn-slide-img img.front-images,
  .mn-slide .mn-slide-img img.second-image {
    width:100% !important;
    height:100% !important;
    aspect-ratio:50/63 !important;
    object-fit:cover !important;
    position:absolute !important;
    top:0; left:0; right:0; bottom:0;
  }
}

