/**
 * Shared carousel slider (subjects, testimonials, etc.).
 *
 * @package ALW
 * @since   1.0.0
 */

.alw-carousel {
	--alw-carousel-gap: 16px;
	margin-top: 48px;
}

.alw-carousel__controls {
	display: flex;
	align-items: center;
	gap: 12px;
}

.alw-carousel__viewport {
	flex: 1;
	min-width: 0;
	overflow: hidden;
}

.alw-carousel__track {
	display: flex;
	gap: var(--alw-carousel-gap);
	transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
	will-change: transform;
}

.alw-carousel__slide {
	flex: 0 0 calc(100% - 0px);
	min-width: 0;
}

@media (min-width: 640px) {
	.alw-carousel__slide {
		flex-basis: calc((100% - var(--alw-carousel-gap)) / 2);
	}
}

@media (min-width: 1024px) {
	.alw-carousel__slide {
		flex-basis: calc((100% - (3 * var(--alw-carousel-gap))) / 4);
	}
}

.alw-carousel__nav {
	display: inline-flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid var(--alw-border);
	border-radius: 50%;
	background-color: var(--alw-card);
	box-shadow: var(--alw-shadow-soft);
	color: var(--alw-foreground);
	cursor: pointer;
	transition:
		background-color var(--alw-transition),
		border-color var(--alw-transition),
		color var(--alw-transition),
		opacity var(--alw-transition);
}

.alw-carousel__nav:hover,
.alw-carousel__nav:focus-visible {
	border-color: var(--alw-primary);
	background-color: var(--alw-accent);
	color: var(--alw-primary);
}

.alw-carousel__nav:disabled {
	opacity: 0.35;
	cursor: not-allowed;
}

.alw-carousel__nav[hidden] {
	display: none;
}

.alw-carousel__nav svg {
	display: block;
	width: 20px;
	height: 20px;
}

@media (max-width: 639px) {
	.alw-carousel__controls {
		gap: 8px;
	}

	.alw-carousel__nav {
		width: 40px;
		height: 40px;
	}
}

/* RTL: chevrons face outward (away from slides), not inward toward the track */
[dir="rtl"] .alw-carousel__nav svg,
body.alw-rtl .alw-carousel__nav svg {
	transform: scaleX(-1);
}

@media (prefers-reduced-motion: reduce) {
	.alw-carousel__track {
		transition: none;
	}
}