.peap-loop-carousel {
	--peap-carousel-slides: 3;
	--peap-carousel-scroll: 1;
	--peap-carousel-gap: 24px;
	--peap-carousel-nav-size: 42px;
	--peap-carousel-dot-size: 8px;
	--peap-carousel-nav-start-offset: 0px;
	--peap-carousel-nav-end-offset: 0px;
	position: relative;
	min-width: 0;
}

.peap-loop-carousel__viewport { overflow: hidden; min-width: 0; }

.peap-loop-carousel__track {
	display: flex;
	align-items: stretch;
	gap: var(--peap-carousel-gap);
	min-width: 0;
	transition-property: transform;
	transition-timing-function: cubic-bezier(.22, 1, .36, 1);
	will-change: transform;
}

.peap-loop-carousel--draggable .peap-loop-carousel__viewport { touch-action: pan-y; cursor: grab; }
.peap-loop-carousel.is-peap-carousel-dragging .peap-loop-carousel__viewport { cursor: grabbing; user-select: none; }

.peap-loop-carousel__slide {
	flex: 0 0 calc((100% - (var(--peap-carousel-gap) * (var(--peap-carousel-slides) - 1))) / var(--peap-carousel-slides));
	min-width: 0;
}

.peap-loop-carousel--equal-height .peap-loop-carousel__slide,
.peap-loop-carousel--equal-height .peap-loop-carousel__slide > .peap-loop-item,
.peap-loop-carousel--equal-height .peap-loop-carousel__slide > .peap-loop-item > .elementor,
.peap-loop-carousel--equal-height .peap-loop-carousel__slide > .peap-loop-item > .elementor > .e-con { height: 100%; }

.peap-loop-carousel__nav {
	position: absolute;
	top: 50%;
	/* Keep controls above interactive content inside loop item templates. */
	z-index: 10;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--peap-carousel-nav-size);
	height: var(--peap-carousel-nav-size);
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: #111;
	color: #fff;
	font-size: 18px;
	line-height: 1;
	transform: translateY(-50%);
	transition: color .2s ease, background-color .2s ease, opacity .2s ease, transform .2s ease;
	cursor: pointer;
}

.peap-loop-carousel__nav:hover:not(:disabled) { transform: translateY(-50%) scale(1.05); }
.peap-loop-carousel__nav:disabled { opacity: .35; cursor: not-allowed; }
.peap-loop-carousel__prev { left: calc(12px + var(--peap-carousel-nav-start-offset)); }
.peap-loop-carousel__next { right: calc(12px + var(--peap-carousel-nav-end-offset)); }

.peap-loop-carousel[dir="rtl"] .peap-loop-carousel__prev { left: auto; right: calc(12px + var(--peap-carousel-nav-end-offset)); }
.peap-loop-carousel[dir="rtl"] .peap-loop-carousel__next { left: calc(12px + var(--peap-carousel-nav-start-offset)); right: auto; }

.peap-loop-carousel__dots { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 20px; }
.peap-loop-carousel__dots[hidden] { display: none; }

.peap-loop-carousel__dot {
	width: var(--peap-carousel-dot-size);
	height: var(--peap-carousel-dot-size);
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: rgba(17, 17, 17, .28);
	transition: width .2s ease, background-color .2s ease, transform .2s ease;
	cursor: pointer;
}

.peap-loop-carousel__dot.is-active { width: calc(var(--peap-carousel-dot-size) * 2.5); background: #111; }

@media (prefers-reduced-motion: reduce) {
	.peap-loop-carousel__track,
	.peap-loop-carousel__nav,
	.peap-loop-carousel__dot { transition-duration: .01ms !important; }
}