.logo-carousel {
	overflow: hidden;
	position: relative;
	width: 100%;
}

.logo-carousel-empty {
	padding: 2rem;
	text-align: center;
	color: #6b7280;
	background: #f9fafb;
	border: 2px dashed #d1d5db;
	border-radius: .5rem;
}

.logo-carousel-row {
	overflow: hidden;
	width: 100vw;
	margin-left: calc(-50vw + 50%);
}

.logo-carousel-gradient {
	position: absolute;
	top: 0;
	bottom: 0;
	z-index: 2;
	pointer-events: none;
}

.logo-carousel-gradient--start {
	left: 0;
}

.logo-carousel-gradient--end {
	right: 0;
}

.logo-carousel-track {
	display: flex;
	align-items: center;
	width: -moz-max-content;
	width: max-content;
}

.logo-carousel-track--ltr {
	animation: scrollLogosLTR var(--animation-duration, 20s) linear infinite;
}

.logo-carousel-track--rtl {
	animation: scrollLogosRTL var(--animation-duration, 20s) linear infinite;
}

.logo-carousel-track--pause-hover:hover {
	animation-play-state: paused;
}

.logo-carousel-item {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	padding-left: calc(var(--item-spacing, 0px) / 2);
	padding-right: calc(var(--item-spacing, 0px) / 2);
}

.logo-carousel .logo-carousel-image {
	height: var(--image-height, 48px);
	width: auto;
	-o-object-fit: contain;
	object-fit: contain;
}

@keyframes scrollLogosLTR {
	0% {
		transform: translate(0);
	}
	
	to {
		transform: translate(-50%);
	}
}

@keyframes scrollLogosRTL {
	0% {
		transform: translate(-50%);
	}
	
	to {
		transform: translate(0);
	}
}