/* =====================================================
   Video Slider Module
   ===================================================== */

.video_slider_module {
	padding: 0px 0 60px;
	background: var(--black);
	overflow: hidden;
}

/* ---- Slick overrides ---- */

.video_slider_module .vsm-slider .slick-list {
	overflow: visible;
}

.video_slider_module .vsm-slider .slick-track {
	display: flex;
	align-items: center;
}

/* ---- Individual slide ---- */

.video_slider_module .vsm-slide {
	padding: 0 0px;
	outline: none;
}
.video_slider_module .slick-slide {
  margin: 0 0px;
}
/* ---- Card ---- */

.vsm-card {
	position: relative;
	overflow: hidden;
	border-radius: 12px;
	aspect-ratio: 16 / 9;
	background: var(--black);
	transform: scale(0.88);
	opacity: 0.55;
	transition: transform 0.45s ease, opacity 0.45s ease;
}

.vsm-slider .slick-center .vsm-card {
	transform: scale(1);
	opacity: 1;
}

/* ---- Poster image (always visible) ---- */

.vsm-poster {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
}

/* ---- Video (overlays poster when playing) ---- */

.vsm-video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
	opacity: 0;
	transition: opacity 0.3s ease;
}

/* Show video once it has begun playing */
.vsm-video.vsm-playing {
	opacity: 1;
}

/* ---- Custom navigation ---- */
/* Self-contained so this module works independently of featured_items_slider.css */

.vsm-nav {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	padding: 28px 0 0;
}

.vsm-nav .fis-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	border: none;
	cursor: pointer;
	color: var(--white);
	background: var(--dark-grey);
	transition: var(--transition);
}

.vsm-nav .fis-next {
	background: var(--main-color);
}

.vsm-nav .fis-btn:hover {
	opacity: 0.85;
}

.vsm-nav .fis-btn:focus-visible {
	outline: 2px solid var(--main-color);
	outline-offset: 3px;
}

.vsm-nav .fis-btn.fis-btn--disabled {
	opacity: 0.35;
	cursor: default;
}

.vsm-nav {display:none!important}
/* =====================================================
   Responsive
   ===================================================== */
@media (max-width: 1199px) {

	.vsm-nav .fis-btn{
		width: 46px;
		height: 46px;
	}
}
@media (max-width: 992px) {
	.video_slider_module {
		padding: 50px 0 40px;
	}
	.fis-nav.vsm-nav {display: flex!important; align-items: center;  justify-content: flex-end;  gap: 10px; padding-right: 25px; margin-top: 0px;}

	/* On mobile the slider is full-width / single card — reset to square-ish ratio */
	.vsm-card {
		aspect-ratio: 4 / 3;
		border-radius: 8px;
		/* All cards are "active" on mobile (no center mode) */
		transform: scale(1);
		opacity: 1;
	}

	.video_slider_module .vsm-slide {
		padding: 0 15px;
	}


}

@media (max-width: 768px) {
	.video_slider_module{padding: 5px 0;}
}