/* ============================================================
   Carousel Arrows Fix
   ============================================================ */
.carousel-track,
.carousel-row,
.carousel-items,
.product-carousel,
[data-carousel-track]{
  scroll-behavior:smooth;
}

.carousel-prev,
.carousel-next,
.carousel-btn.prev,
.carousel-btn.next,
.carousel-arrow.prev,
.carousel-arrow.next,
.carousel-left,
.carousel-right,
[data-carousel-prev],
[data-carousel-next]{
  cursor:pointer;
  user-select:none;
  touch-action:manipulation;
}

.carousel-prev.is-disabled,
.carousel-next.is-disabled,
.carousel-btn.prev.is-disabled,
.carousel-btn.next.is-disabled,
.carousel-arrow.prev.is-disabled,
.carousel-arrow.next.is-disabled,
.carousel-left.is-disabled,
.carousel-right.is-disabled,
[data-carousel-prev].is-disabled,
[data-carousel-next].is-disabled{
  opacity:.35;
  cursor:not-allowed;
}

.carousel-prev:disabled,
.carousel-next:disabled,
.carousel-btn.prev:disabled,
.carousel-btn.next:disabled,
.carousel-arrow.prev:disabled,
.carousel-arrow.next:disabled,
.carousel-left:disabled,
.carousel-right:disabled,
[data-carousel-prev]:disabled,
[data-carousel-next]:disabled{
  opacity:.35;
  cursor:not-allowed;
}

/* ============================================================
   Homepage carousel arrow fixes
   ============================================================ */
.hero-carousel-panel,
.hero-carousel,
.hc-dots,
.nam-dots{
  position:relative;
}

.hc-dots{
  z-index:30;
}

.hc-arrow,
.nam-arrow{
  pointer-events:auto!important;
  cursor:pointer!important;
  position:relative;
  z-index:40;
  appearance:none;
  -webkit-appearance:none;
}

.hc-slide{
  z-index:1;
}

.hc-slide.active{
  z-index:2;
}

.nam-arrow{
  width:26px;
  height:26px;
  min-width:26px;
  min-height:26px;
  border-radius:50%;
  border:1px solid var(--border);
  background:var(--bg);
  color:var(--text);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:0.8rem;
  line-height:1;
  padding:0;
  transition:background .2s,border-color .2s,color .2s;
}

.nam-arrow:hover{
  background:var(--red);
  border-color:var(--red);
  color:#fff;
}

/* ============================================================
   Shared Product Image Carousel
   ============================================================ */
.product-media-carousel{
  position:relative;
  overflow:hidden;
  background:var(--surface2);
  display:block;
}
.product-media-carousel .product-media-slide{
  display:none;
  width:100%;
  height:100%;
}
.product-media-carousel .product-media-slide.is-active{
  display:block;
  animation:pmcFadeIn .22s ease;
}
@keyframes pmcFadeIn{from{opacity:0}to{opacity:1}}
.product-media-carousel .product-media-slide img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .55s ease;
}
.product-media-carousel .product-carousel-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:30;
  width:34px;
  height:34px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.7);
  background:rgba(0,0,0,.42);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--sans);
  font-size:1.15rem;
  line-height:1;
  cursor:pointer;
  opacity:0;
  transition:background .18s,opacity .22s,transform .18s;
  backdrop-filter:blur(4px);
}
.product-media-carousel .product-carousel-arrow:hover{
  background:rgba(0,0,0,.7);
  opacity:1!important;
  transform:translateY(-50%) scale(1.08);
}
.product-media-carousel .product-carousel-arrow.prev{left:10px}
.product-media-carousel .product-carousel-arrow.next{right:10px}
.product-media-carousel:not(.has-multiple) .product-carousel-arrow{display:none}
/* On cards: arrows appear on hover */
.prod-card:hover .product-media-carousel .product-carousel-arrow,
.aath-card:hover .product-media-carousel .product-carousel-arrow{opacity:.88}
/* On product pages: arrows always visible */
.product-img-main .product-carousel-arrow{opacity:.82!important}
/* Image counter badge — bottom-right corner of card carousels */
.product-media-carousel .pmc-counter{
  position:absolute;
  bottom:9px;
  right:10px;
  z-index:25;
  background:rgba(0,0,0,.52);
  color:#fff;
  font-size:0.5rem;
  letter-spacing:0.1em;
  padding:3px 7px;
  border-radius:20px;
  pointer-events:none;
  backdrop-filter:blur(4px);
  opacity:0;
  transition:opacity .22s;
}
.prod-card:hover .pmc-counter,
.aath-card:hover .pmc-counter{opacity:1}
.product-img-main .pmc-counter{display:none}
.prod-img.product-media-carousel,
.aath-img.product-media-carousel{
  width:100%;
  text-decoration:none;
}
.aath-img.product-media-carousel{aspect-ratio:1}
.prod-img.product-media-carousel{aspect-ratio:4/3}
.prod-card:hover .product-media-carousel img,
.aath-card:hover .product-media-carousel img{transform:scale(1.04)}
.product-img-main.product-media-carousel{
  display:block;
}
.product-img-main.product-media-carousel .wishlist-heart-product{
  z-index:50;
}
@media(max-width:700px){
  .product-media-carousel .product-carousel-arrow{width:34px;height:34px;min-width:34px;min-height:34px;font-size:1rem;opacity:.82!important;border-radius:50%!important;box-sizing:border-box!important;padding:0!important;display:flex!important;align-items:center!important;justify-content:center!important}
  .product-media-carousel .product-carousel-arrow.prev{left:8px}
  .product-media-carousel .product-carousel-arrow.next{right:8px}
  .product-media-carousel .pmc-counter{opacity:1}
}

/* ============================================================
   Carousel arrow shape fix
   Keeps hero/product carousel arrows perfectly round on desktop,
   tablet and mobile, even when global mobile button min-height applies.
   ============================================================ */
.hc-arrow-btn,
.product-media-carousel .product-carousel-arrow,
.nam-arrow{
  width:34px!important;
  height:34px!important;
  min-width:34px!important;
  min-height:34px!important;
  aspect-ratio:1 / 1!important;
  border-radius:50%!important;
  padding:0!important;
  box-sizing:border-box!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  line-height:1!important;
  flex:0 0 auto!important;
}

.hc-arrow-btn{
  width:32px!important;
  height:32px!important;
  min-width:32px!important;
  min-height:32px!important;
}

@media(max-width:700px){
  .hc-arrow-btn,
  .product-media-carousel .product-carousel-arrow,
  .nam-arrow{
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    min-height:34px!important;
    border-radius:50%!important;
  }
}

/* Carousel swipe affordance */
.hero-carousel,
.product-media-carousel{
  touch-action:pan-y;
  cursor:grab;
}

.hero-carousel:active,
.product-media-carousel:active{
  cursor:grabbing;
}