/* =========================================
   STAREL PRODUCT DISCOVERY
   Collection carousel cards
========================================= */

/*
 * Loop Card V2
 *
 * Add class "starel-loop-card--v2" to the outer loop card container
 * and "starel-aspect-square" to the media/image wrapper.
 */

.starel-loop-card--v2 {
  gap: 0;
}

.starel-loop-card--v2 .starel-loop-card__media,
.starel-loop-card--v2 .starel-aspect-square {
  aspect-ratio: 1 / 1 !important;
}

.starel-loop-card--v2 .starel-loop-card__gallery-slider,
.starel-loop-card--v2 .starel-loop-card__gallery-track,
.starel-loop-card--v2 .starel-loop-card__slide,
.starel-loop-card--v2 .starel-loop-card__image-link,
.starel-loop-card--v2 .starel-loop-card__image {
  aspect-ratio: 1 / 1;
}

.starel-loop-card--v2 .starel-loop-card__info {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 12px;
  padding: 0;
  text-align: center;
}

.starel-loop-card--v2 .starel-loop-card__title,
.starel-loop-card--v2 .starel-loop-card__title .elementor-heading-title,
.starel-loop-card--v2 .starel-loop-card__title .elementor-heading-title a,
.starel-loop-card--v2 .starel-loop-card__title a {
  margin: 0;
  color: #000;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.35;
  letter-spacing: 0.2px;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
}

.starel-loop-card--v2:hover .starel-loop-card__title .elementor-heading-title,
.starel-loop-card--v2:hover .starel-loop-card__title .elementor-heading-title a,
.starel-loop-card--v2:hover .starel-loop-card__title a {
  text-decoration: underline;
  text-underline-offset: 0.12em;
}

/* Image-only card variation: hide commercial overlays/details when present. */
.starel-loop-card--v2 .starel-loop-card__badge,
.starel-loop-card--v2 .starel-loop-card__wishlist,
.starel-loop-card--v2 .starel-loop-card__sample,
.starel-loop-card--v2 .starel-loop-card__price,
.starel-loop-card--v2 .starel-loop-card__vanity-tops,
.starel-loop-card--v2 .starel-loop-card__dots,
.starel-loop-card--v2 .starel-loop-card__arrow {
  display: none !important;
}

/* Defensive fallback: if Elementor renders the carousel empty, hide the whole wrapper. */
.starel-discovery-container:has(.e-loop-nothing-found-message),
.starel-discovery-conatainer:has(.e-loop-nothing-found-message),
.starel-collection-container:has(.e-loop-nothing-found-message),
.starel-product-discovery-section:has(.e-loop-nothing-found-message) {
  display: none !important;
}

/* =========================================
   Discovery section layout
   Full width, no max-width cap.
========================================= */

.starel-discovery-container,
.starel-discovery-conatainer,
.starel-collection-container,
.starel-product-discovery-section {
  width: 100%;
  max-width: none !important;
  margin-left: auto;
  margin-right: auto;
}

/* Keep the Elementor carousel and Swiper full width. */
.starel-discovery-container .elementor-widget-loop-carousel,
.starel-discovery-conatainer .elementor-widget-loop-carousel,
.starel-collection-container .elementor-widget-loop-carousel,
.starel-product-discovery-section .elementor-widget-loop-carousel,
.starel-discovery-container .elementor-swiper,
.starel-discovery-conatainer .elementor-swiper,
.starel-collection-container .elementor-swiper,
.starel-product-discovery-section .elementor-swiper,
.starel-discovery-container .elementor-main-swiper,
.starel-discovery-conatainer .elementor-main-swiper,
.starel-collection-container .elementor-main-swiper,
.starel-product-discovery-section .elementor-main-swiper,
.starel-discovery-container .swiper,
.starel-discovery-conatainer .swiper,
.starel-collection-container .swiper,
.starel-product-discovery-section .swiper,
.starel-discovery-container .elementor-loop-container,
.starel-discovery-conatainer .elementor-loop-container,
.starel-collection-container .elementor-loop-container,
.starel-product-discovery-section .elementor-loop-container {
  width: 100%;
  max-width: none !important;
  margin-left: auto;
  margin-right: auto;
}

/* Centre the full discovery section content. */
.starel-discovery-container,
.starel-discovery-conatainer,
.starel-collection-container,
.starel-product-discovery-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.starel-discovery-container > .elementor-element,
.starel-discovery-conatainer > .elementor-element,
.starel-collection-container > .elementor-element,
.starel-product-discovery-section > .elementor-element {
  width: 100%;
  max-width: none !important;
  margin-left: auto;
  margin-right: auto;
}

/* =========================================
   Centre under-filled carousels
   Applies when Swiper has locked the carousel because there are fewer
   products than the configured slides-to-show value.
========================================= */

.starel-discovery-container .elementor-widget-loop-carousel:has(.swiper-button-lock) .swiper-wrapper,
.starel-discovery-conatainer .elementor-widget-loop-carousel:has(.swiper-button-lock) .swiper-wrapper,
.starel-collection-container .elementor-widget-loop-carousel:has(.swiper-button-lock) .swiper-wrapper,
.starel-product-discovery-section .elementor-widget-loop-carousel:has(.swiper-button-lock) .swiper-wrapper {
  justify-content: center !important;
  gap: 24px;
}

/*
 * Elementor/Swiper writes margin-right inline on slides.
 * For locked under-filled carousels only, remove that inline gap and let
 * the wrapper gap above control the 24px spacing.
 */
.starel-discovery-container .elementor-widget-loop-carousel:has(.swiper-button-lock) .swiper-slide,
.starel-discovery-conatainer .elementor-widget-loop-carousel:has(.swiper-button-lock) .swiper-slide,
.starel-collection-container .elementor-widget-loop-carousel:has(.swiper-button-lock) .swiper-slide,
.starel-product-discovery-section .elementor-widget-loop-carousel:has(.swiper-button-lock) .swiper-slide {
  margin-right: 0 !important;
}

/* Keep cards centred inside each slide. */
.starel-discovery-container .swiper-slide,
.starel-discovery-conatainer .swiper-slide,
.starel-collection-container .swiper-slide,
.starel-product-discovery-section .swiper-slide,
.starel-discovery-container .e-loop-item,
.starel-discovery-conatainer .e-loop-item,
.starel-collection-container .e-loop-item,
.starel-product-discovery-section .e-loop-item {
  text-align: center;
}

/* Keep item heights consistent. */
.starel-product-discovery-section .elementor-loop-container,
.starel-product-discovery-section .swiper,
.starel-product-discovery-section .swiper-wrapper,
.starel-discovery-container .elementor-loop-container,
.starel-discovery-container .swiper,
.starel-discovery-container .swiper-wrapper {
  align-items: stretch;
}

/* =========================================
   Collection archive button shortcode
   Shortcode: [starel_collection_button text="VIEW MORE"]
========================================= */

.starel-collection-button-wrap {
  display: block;
  width: 100%;
  text-align: center;
}

.starel-collection-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #2b2b2b;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.04em;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
}

.starel-collection-button:hover,
.starel-collection-button:focus {
  color: #000;
  text-decoration: underline;
  text-underline-offset: 0.16em;
}