// When JS is disabled, we need to:
// 1. Hide the preloader spinner
// 2. Make the slider content visible
// 3. Show only the first slide
// 4. Hide navigation controls that won't work without JS

.wp-block-csblo-slides {

	// Hide preloader spinner
	&.csblo-preloader-spinner::after {
		display: none;
	}

	// Make slider visible and enable pointer events
	.swiper.loading {
		opacity: 1;
		pointer-events: auto;
	}

	// Hide navigation controls since they won't work without JS
	.wp-block-csblo-slides__prevnext,
	.swiper-pagination {
		display: none;
	}

	// Make slides scrollable horizontally
	.swiper {
		overflow-x: auto;
		overflow-y: hidden;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch; // Smooth scrolling on iOS
	}
	.swiper-wrapper {
		display: flex;
		flex-wrap: nowrap;
	}
	.swiper-slide {
		flex: 0 0 100%;
		width: 100%;
		scroll-snap-align: start;
		scroll-snap-stop: always;
	}
}