.marquee-wrapper {
	overflow: hidden;
	white-space: nowrap;
	position: relative;
	width: 100%;
	display: flex;
}

/* Dégradés pour les marquees d'images */
.marquee-type-image {
	position: relative;
}

.marquee-type-image::before,
.marquee-type-image::after {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	width: 17%;
	z-index: 10;
	pointer-events: none;
}

.marquee-type-image::before {
	left: 0;
	background: linear-gradient(to right, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
}

.marquee-type-image::after {
	right: 0;
	background: linear-gradient(to left, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
}

.marquee-content {
	display: flex;
	position: relative;
	z-index: 2;
}

.marquee-group {
	display: flex;
	gap: var(--marquee-gap, 50px);
	flex-shrink: 0;
	justify-content: center;
	min-width: 100%;
	animation: marquee-scroll var(--marquee-speed, 20s) linear infinite;
}

.marquee-item {
	flex-shrink: 0;
	display: flex;
	align-items: center;
}

.marquee-group .marquee-item:last-of-type {
	margin-right: var(--marquee-gap, 50px);
}

.marquee-item img {
	max-height: 100px; /* Default height, can be overridden */
	width: auto;
	display: block;
}

/* Direction: Left */
.marquee-left .marquee-group {
	animation-name: marquee-scroll-left;
}

@keyframes marquee-scroll-left {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(-100%); /* Move by 100% of the content width */
	}
}

/* Direction: Right */
.marquee-right .marquee-group {
	animation-name: marquee-scroll-right;
}

@keyframes marquee-scroll-right {
	0% {
		transform: translateX(-100%);
	}
	100% {
		transform: translateX(0);
	}
}

/* Pause on hover optional */
/*
.marquee-wrapper:hover .marquee-content {
	animation-play-state: paused;
}
*/

/* Grayscale filter */
.marquee-grayscale .marquee-item img {
	filter: grayscale(100%);
}