/**
 * Scrolling Image Banner Block Styles
 *
 * @package made-to-thrive-2026-base
 * @since 1.0.0
 */

/* Container */
.scrolling-image-banner {
	width: 100%;
	position: relative;
	overflow: hidden;
	padding: 22px 0;
}

.scrolling-image-banner-container {
	width: 100%;
	overflow: hidden;
	position: relative;
}

/* Track Container */
.scrolling-image-banner-track {
	width: 100%;
	overflow: hidden;
	position: relative;
}

.scrolling-image-banner-swiper {
	width: 100%;
}

.scrolling-image-banner-swiper .swiper-wrapper {
	align-items: center;
	will-change: transform;
	transition-timing-function: linear;
}

/* Slide */
.scrolling-image-banner-slide {
	width: auto;
	height: 277px;
	flex-shrink: 0;
}

.scrolling-image-banner-figure {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

.scrolling-image-banner-image {
	width: auto;
	height: 277px;
	max-width: none;
	object-fit: contain;
	border-radius: 12px;
	display: block;
}


/* Responsive Design - Tablet */
@media (max-width: 1024px) {
	.scrolling-image-banner-slide {
		width: auto;
		height: 233px;
	}

	.scrolling-image-banner-image {
		width: auto;
		height: 233px;
		max-width: none;
	}
}

/* Responsive Design - Mobile */
@media (max-width: 768px) {
	.scrolling-image-banner {
		padding: 18px 0;
	}

	.scrolling-image-banner-slide {
		width: auto;
		height: 187px;
	}

	.scrolling-image-banner-image {
		width: auto;
		height: 187px;
		max-width: none;
	}
}

/* Extra Small Devices */
@media (max-width: 500px) {
	.scrolling-image-banner-wrapper {
		gap:20px;
	}
}

/* High Contrast Mode Support */
@media (prefers-contrast: high) {
	.scrolling-image-banner-image {
		border: 2px solid currentColor;
	}
}

/* Reduced Motion Support */
@media (prefers-reduced-motion: reduce) {
	/* With Swiper, reduced motion means no autoplay; keep layout stable */
}

/* Print Styles */
@media print {
	.scrolling-image-banner {
		padding: 10px 0;
		overflow: visible;
	}

	.scrolling-image-banner-wrapper {
		flex-wrap: wrap;
		gap: 10px;
		justify-content: center;
	}

	.scrolling-image-banner-slide {
		width: auto;
		height: 133px;
		page-break-inside: avoid;
	}

	.scrolling-image-banner-image {
		width: auto;
		height: 133px;
		max-width: none;
		border: 1px solid #000000;
	}
}

/* Support for block wrapper color classes */
.scrolling-image-banner.has-background {
	padding: 21px 0;
}

.scrolling-image-banner.has-text-color .scrolling-image-banner-image {
	color: inherit;
}