/**
 * Eventure Theme — Video Carousel (Swiper + lite-youtube)
 */

/* ============================================
   Carousel container
   ============================================ */

.video-carousel {
	position: relative;
	padding-block: 6rem;
}

/* ============================================
   Slides — scale + blur for non-active
   ============================================ */

.video-carousel .swiper-slide {
	height: auto;
	transition:
		transform 0.4s ease,
		filter 0.4s ease;
	filter: blur(2px);

	.video-slide {
		border: 8px solid var(--wp--preset--color--violet-300);
		border-radius: 28px;
		overflow: hidden;
		background: var(--wp--preset--color--white);
		box-shadow: 0px 5px 10px 0px #00000040;

		lite-youtube {
			display: block;
			aspect-ratio: 16 / 9;
			width: 100%;
			max-width: 100%;
			background-color: var(--wp--preset--color--dark);
		}

		lite-youtube::before {
			background: linear-gradient(180deg, rgba(63, 22, 57, 0.6) 0%, transparent 60%);
		}
	}
}

/* Active (center) slide — scaled up, no blur */
.video-carousel .swiper-slide-active {
	transform: scale(1.7);
	filter: none;
	opacity: 1;
	z-index: 4;
}

/* Adjacent slides — slightly scaled up, overlap under the active */
.video-carousel .swiper-slide-prev,
.video-carousel .swiper-slide-next {
	transform: scale(1.3);
	filter: blur(1px);
	z-index: 3;
}
/* ============================================
   Pagination bullets
   ============================================ */

.video-carousel .swiper-pagination {
	bottom: -2rem;

	.swiper-pagination-bullet {
		background: var(--wp--preset--color--violet-200);
		opacity: 1;
		width: 10px;
		height: 10px;
	}

	.swiper-pagination-bullet-active {
		background: var(--wp--preset--color--violet-900);
	}
}
/* ============================================
   Event info below carousel
   ============================================ */

.video-carousel-info {
	text-align: center;
	margin-top: 1.5rem;

	.video-carousel-info__name {
		margin: 0;
		font-family: var(--wp--preset--font-family--century-gothic);
		font-size: 2rem;
		font-weight: 400;
		color: var(--wp--preset--color--violet-400);
	}

	.video-carousel-info__dates {
		margin: 0.25rem 0 0;
		font-family: var(--wp--preset--font-family--mplus-1-p);
		font-size: var(--wp--preset--font-size--medium);
		color: var(--wp--preset--color--violet-100);
		display: inline-flex;
		align-items: center;
		gap: 0.5rem;

		&::before {
			content: '';
			display: inline-block;
			width: 24px;
			height: 24px;
			flex-shrink: 0;
			background: url('../icons/calendar-linear-violet100.svg') no-repeat center / contain;
		}
	}
}

/* ============================================
   Empty state
   ============================================ */

.video-carousel-empty {
	text-align: center;
	color: var(--wp--preset--color--violet-100);
	font-style: italic;
	padding: var(--wp--preset--spacing--60) 0;
}
