/**
 * Ayaaz Khushboo Mahal — Video Reels CSS
 *
 * Ensures precise horizontal scroll-snapping and mobile centering
 * for video reel cards without altering visual identity.
 */

.akm-video-reels-track {
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none; /* Firefox */
	-ms-overflow-style: none; /* IE/Edge */
}

.akm-video-reels-track::-webkit-scrollbar {
	display: none; /* Chrome/Safari */
}

/* Mobile: Perfectly center each active reel card */
@media (max-width: 639px) {
	.akm-video-reels-track {
		scroll-padding-inline: calc(50vw - 38vw);
		padding-left: calc(50vw - 38vw);
		padding-right: calc(50vw - 38vw);
		margin-left: -1rem;
		margin-right: -1rem;
	}

	.akm-video-reel-card {
		scroll-snap-align: center;
		scroll-snap-stop: always;
		width: 76vw;
	}
}

/* Tablet & Desktop: Snap to start */
@media (min-width: 640px) {
	.akm-video-reel-card {
		scroll-snap-align: start;
	}
}