/**
 * Modeser Products Carousel Widget — Splide.js container/arrows/pagination
 * only; every card/title/button/variations-icon/modal style lives in the
 * shared product-card.css.
 */

.mdsproduct-widget-products-carousel {
  position: relative;
  padding: 0 4px;
}

.mdsproduct-widget-products-carousel .splide__slide .mdsproduct-product-card {
  height: 100%;
}

/* Icon Size + Box Size drive the arrow buttons now, not a fixed size —
   Splide's own bundled CSS sets both to a fixed "2em" by default, which
   would otherwise ignore our Border Radius/Box Size controls entirely. */
.mdsproduct-widget-products-carousel .splide__arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  height: auto;
  opacity: 1;
}

.mdsproduct-widget-products-carousel .splide__arrow:disabled {
  opacity: 0.35;
}

.mdsproduct-widget-products-carousel .splide__pagination {
  position: relative;
  margin-top: 16px;
  bottom: auto;
}