/* Minimal, local swiper-like styles for RSCE */
.rsce-swiper {
  position: relative;
  overflow: visible; /* nav buttons live inside padding */
  padding: 0 30px; /* mobile default */
  box-sizing: border-box;
  --spv: 1; /* slides per view (effective) */
}
@media (min-width: 768px) {
  .rsce-swiper { padding: 0 60px; }
}
@media (min-width: 1024px) {
  .rsce-swiper { padding: 0 90px; }
}

.rsce-swiper__viewport {
  overflow: hidden;
  width: 100%;
  box-sizing: border-box;
}

.rsce-swiper__track {
  display: flex;
  gap: 0;
  will-change: transform;
  transition: transform 300ms ease;
}

/* Treat each direct child (typical Contao CE wrapper) as a slide */
.rsce-swiper__track > * {
  box-sizing: border-box;
  flex: 0 0 calc(100% / var(--spv));
  max-width: calc(100% / var(--spv));
}

/* Navigation */
.rsce-swiper__prev,
.rsce-swiper__next {
  position: absolute;
  top: 50%;
  z-index: 2;
  width: 45px;
  height: 45px;
  border: none;
  background: transparent;
  color: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.rsce-swiper[data-navigation="0"] .rsce-swiper__prev,
.rsce-swiper[data-navigation="0"] .rsce-swiper__next {
  display: none;
}

.rsce-swiper__prev {
  left: 15px; /* centered inside 30px padding on mobile */
  transform: translate(0, -50%);
  margin-left: 0;
  background-image: url('/assets/swiper-lite/prev.png');
}
.rsce-swiper__next {
  right: 15px; /* centered inside 30px padding on mobile */
  transform: translate(0, -50%);
  margin-right: 0;
  background-image: url('/assets/swiper-lite/next.png');
}
@media (min-width: 768px) {
  .rsce-swiper__prev { left: 30px; } /* centered inside 60px padding */
  .rsce-swiper__next { right: 30px; }
}
@media (min-width: 1024px) {
  .rsce-swiper__prev { left: 45px; } /* centered inside 90px padding */
  .rsce-swiper__next { right: 45px; }
}

.rsce-swiper__arrow { display: none; }

/* Responsive default: show one slide on small screens */
@media (max-width: 767px) {
  .rsce-swiper { --spv: 1; }
}