/* AHS Woo Category Cards */
.ahs-category-cards{
  width:100%;
  color:#111111;
  box-sizing:border-box;
}

.ahs-category-cards *,
.ahs-category-cards *::before,
.ahs-category-cards *::after{
  box-sizing:border-box;
}

.ahs-category-cards__head{
  margin-bottom:16px;
}

.ahs-category-cards__title{
  margin:0;
  text-align:center;
  font:inherit;
  font-weight:400;
  font-size:var(--ahs-heading-size, 40px);
  line-height:1.1;
  color:#111111;
}

.ahs-category-cards__viewport{
  width:100%;
  overflow:hidden;
}

.ahs-category-cards__track{
  display:flex;
  flex-wrap:wrap;
  gap:var(--ahs-gap, 16px);
}

.ahs-category-card{
  position:relative;
  display:block;
  width:calc((100% - (var(--ahs-gap, 16px) * (var(--ahs-columns, 3) - 1))) / var(--ahs-columns, 3));
  text-decoration:none;
  color:inherit;
}

.ahs-category-card__media{
  position:relative;
  overflow:hidden;
  border-radius:var(--ahs-radius, 22px);
  aspect-ratio:1 / 1;
  background:#efefef;
}

.ahs-category-card__image,
.ahs-category-card__placeholder{
  width:100% !important;
  height:100% !important;
  display:block;
  object-fit:cover;
}

.ahs-category-card__placeholder{
  background:#ececec;
}

.ahs-category-card__shade{
  position:absolute;
  inset:0;
  background:linear-gradient(to top, rgba(0,0,0,.48) 0%, rgba(0,0,0,.18) 32%, rgba(0,0,0,0) 58%);
  pointer-events:none;
}

.ahs-category-card__content{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px;
}

.ahs-category-card__name{
  display:block;
  min-width:0;
  color:#ffffff;
  font-size:var(--ahs-card-title-size, 20px);
  line-height:1.18;
  font-weight:400;
  word-break:break-word;
}

.ahs-category-card__cta{
  width:var(--ahs-card-arrow-size, 44px);
  height:var(--ahs-card-arrow-size, 44px);
  min-width:var(--ahs-card-arrow-size, 44px);
  min-height:var(--ahs-card-arrow-size, 44px);
  border-radius:999px;
  background:#ffffff;
  color:#111111;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}

.ahs-category-card__cta span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:var(--ahs-card-arrow-icon-size, 14px);
  height:var(--ahs-card-arrow-icon-size, 14px);
  font-size:var(--ahs-card-arrow-icon-size, 14px);
  line-height:1;
}

.ahs-category-cards__nav{
  display:none;
}

.ahs-category-cards__nav-btn{
  width:var(--ahs-nav-arrow-size, 46px);
  height:var(--ahs-nav-arrow-size, 46px);
  min-width:var(--ahs-nav-arrow-size, 46px);
  min-height:var(--ahs-nav-arrow-size, 46px);
  border:0;
  border-radius:999px;
  padding:0;
  background:#111111;
  color:#ffffff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow:none;
  transition:transform .18s ease, opacity .18s ease;
  touch-action:manipulation;
  -ms-touch-action:manipulation;
  user-select:none;
  -webkit-user-select:none;
  -webkit-tap-highlight-color:transparent;
  font-size:var(--ahs-nav-icon-size, 14px);
  line-height:1;
}

.ahs-category-cards__nav-btn:hover{
  transform:translateY(-1px);
}

.ahs-category-cards__nav-btn:disabled{
  background:#b0b0b0;
  color:#ffffff;
  opacity:1;
  cursor:not-allowed;
  transform:none;
}

.ahs-category-cards__nav-btn span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:var(--ahs-nav-icon-size, 14px);
  height:var(--ahs-nav-icon-size, 14px);
  font-size:var(--ahs-nav-icon-size, 14px);
  line-height:1;
}

/* Tablet */
@media (max-width: 1024px){
  .ahs-category-card{
    width:calc((100% - (var(--ahs-gap, 16px) * 1)) / 2);
  }
}

/* Mobile */
@media (max-width: 767px){
  .ahs-category-cards{
    --ahs-nav-arrow-size:var(--ahs-nav-arrow-size-mobile, 46px);
    --ahs-nav-icon-size:var(--ahs-nav-icon-size-mobile, 14px);
    --ahs-card-arrow-size:var(--ahs-card-arrow-size-mobile, 44px);
    --ahs-card-arrow-icon-size:var(--ahs-card-arrow-icon-size-mobile, 14px);
  }

  .ahs-category-cards__head{
    margin-bottom:12px;
  }

  .ahs-category-cards__title{
    font-size:var(--ahs-heading-size-mobile, 32px);
  }

  .ahs-category-cards__viewport{
    overflow:visible;
  }

  .ahs-category-cards__track{
    flex-wrap:nowrap;
    gap:12px;
    overflow-x:auto;
    scrollbar-width:none;
    -ms-overflow-style:none;
    scroll-snap-type:x mandatory;
    scroll-behavior:smooth;
    overscroll-behavior-x:none;
    overscroll-behavior-y:auto;
    -webkit-overflow-scrolling:touch;
    touch-action:pan-x pan-y;
  }

  .ahs-category-cards__track::-webkit-scrollbar{
    display:none;
  }

  .ahs-category-card{
    width:67%;
    min-width:67%;
    flex:0 0 67%;
    scroll-snap-align:start;
  }

  .ahs-category-card__content{
    padding:14px;
    gap:12px;
  }

  .ahs-category-card__name{
    font-size:var(--ahs-card-title-size-mobile, 18px);
  }

  .ahs-category-cards__nav{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    margin-top:18px;
  }
}


.ahs-category-card__cta img{
  width:var(--ahs-card-arrow-icon-size, 14px);
  height:var(--ahs-card-arrow-icon-size, 14px);
  display:block;
  object-fit:contain;
  pointer-events:none;
}

.ahs-category-cards__nav-btn img{
  width:var(--ahs-nav-icon-size, 14px);
  height:var(--ahs-nav-icon-size, 14px);
  display:block;
  object-fit:contain;
  pointer-events:none;
}


/* Featured Mosaic layout: 1 large card on left, 2 stacked cards on right */
@media (min-width: 768px){
  .ahs-category-cards--mosaic .ahs-category-cards__track{
    display:grid;
    grid-template-columns:minmax(0, 2.05fr) minmax(320px, 1fr);
    grid-template-rows:repeat(2, minmax(0, auto));
    gap:var(--ahs-gap, 16px);
    align-items:stretch;
  }

  .ahs-category-cards--mosaic .ahs-category-card{
    width:auto;
    min-width:0;
  }

  .ahs-category-cards--mosaic .ahs-category-card:nth-child(1){
    grid-column:1;
    grid-row:1 / span 2;
  }

  .ahs-category-cards--mosaic .ahs-category-card:nth-child(2){
    grid-column:2;
    grid-row:1;
  }

  .ahs-category-cards--mosaic .ahs-category-card:nth-child(3){
    grid-column:2;
    grid-row:2;
  }

  /* Side cards follow the supplied reference ratio:
     about 422.67px wide x 275.33px high */
  .ahs-category-cards--mosaic .ahs-category-card:nth-child(2) .ahs-category-card__media,
  .ahs-category-cards--mosaic .ahs-category-card:nth-child(3) .ahs-category-card__media{
    width:100%;
    aspect-ratio:422.67 / 275.33;
    min-height:0;
    height:auto;
  }

  /* Large card equals both side cards + the gap between them */
  .ahs-category-cards--mosaic .ahs-category-card:nth-child(1) .ahs-category-card__media{
    width:100%;
    height:100%;
    min-height:100%;
    aspect-ratio:auto;
  }

  /* Any additional cards continue underneath as normal cards */
  .ahs-category-cards--mosaic .ahs-category-card:nth-child(n+4){
    grid-column:auto;
    grid-row:auto;
  }

  .ahs-category-cards--mosaic .ahs-category-card:nth-child(n+4) .ahs-category-card__media{
    aspect-ratio:422.67 / 275.33;
    min-height:0;
    height:auto;
  }
}

/* Mobile keeps the same horizontal slider style as the previous plugin */
@media (max-width: 767px){
  .ahs-category-cards--mosaic .ahs-category-cards__track{
    display:flex;
  }

  .ahs-category-cards--mosaic .ahs-category-card{
    width:67%;
    min-width:67%;
    flex:0 0 67%;
  }

  .ahs-category-cards--mosaic .ahs-category-card__media{
    aspect-ratio:1 / 1;
    min-height:0;
    height:auto;
  }
}


/* Vertical Stack layout: every category is one full-width row */
.ahs-category-cards--vertical .ahs-category-cards__track{
  display:grid;
  grid-template-columns:1fr;
  gap:var(--ahs-gap, 16px);
}

.ahs-category-cards--vertical .ahs-category-card{
  width:100%;
  min-width:0;
}

.ahs-category-cards--vertical .ahs-category-card__media{
  aspect-ratio:2.2 / 1;
}

/* Keep mobile as the same slider used by the other layouts */
@media (max-width: 767px){
  .ahs-category-cards--vertical .ahs-category-cards__track{
    display:flex;
  }

  .ahs-category-cards--vertical .ahs-category-card{
    width:67%;
    min-width:67%;
    flex:0 0 67%;
  }

  .ahs-category-cards--vertical .ahs-category-card__media{
    aspect-ratio:1 / 1;
  }
}


/* Mobile-only vertical stack option */
@media (max-width: 767px){
  .ahs-category-cards--mobile-vertical .ahs-category-cards__viewport{
    overflow:visible;
  }

  .ahs-category-cards--mobile-vertical .ahs-category-cards__track{
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
    overflow:visible;
    scroll-snap-type:none;
  }

  .ahs-category-cards--mobile-vertical .ahs-category-card{
    width:100%;
    min-width:0;
    flex:none;
  }

  .ahs-category-cards--mobile-vertical .ahs-category-card__media{
    aspect-ratio:1 / 1;
  }

  .ahs-category-cards--mobile-vertical .ahs-category-cards__nav{
    display:none;
  }
}


@media (min-width: 768px){
  .ahs-category-cards--mosaic .ahs-category-card:nth-child(1){
    align-self:stretch;
  }

  .ahs-category-cards--mosaic .ahs-category-card:nth-child(1) .ahs-category-card__media{
    position:absolute;
    inset:0;
  }

  .ahs-category-cards--mosaic .ahs-category-card:nth-child(1){
    position:relative;
    min-height:0;
  }
}
