.deejay-category-logo-carousel {
	--deejay-category-logo-carousel-gap: 1rem;
	--deejay-category-logo-carousel-visible: 2;
	box-sizing: border-box;
}

.deejay-category-logo-carousel__frame {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	align-items: center;
	gap: var(--deejay-category-logo-carousel-gap);
}

.deejay-category-logo-carousel.is-enhanced .deejay-category-logo-carousel__frame {
	grid-template-columns: auto minmax(0, 1fr) auto;
}

.deejay-category-logo-carousel__viewport {
	overflow-x: auto;
	overscroll-behavior-inline: contain;
	scroll-snap-type: inline mandatory;
	scrollbar-width: thin;
}

.deejay-category-logo-carousel__list {
	display: grid;
	grid-auto-columns: calc((100% - (var(--deejay-category-logo-carousel-visible) - 1) * var(--deejay-category-logo-carousel-gap)) / var(--deejay-category-logo-carousel-visible));
	grid-auto-flow: column;
	gap: var(--deejay-category-logo-carousel-gap);
	list-style: none;
	margin: 0;
	padding: 0;
}

.deejay-category-logo-carousel__item {
	min-width: 0;
	scroll-snap-align: start;
}

.deejay-category-logo-carousel__link,
.deejay-category-logo-carousel__image {
	display: block;
}

.deejay-category-logo-carousel__image {
	height: auto;
	max-width: 100%;
	width: 100%;
}

.deejay-category-logo-carousel:not(.is-enhanced) :is(.deejay-category-logo-carousel__previous, .deejay-category-logo-carousel__next, .deejay-category-logo-carousel__autoplay),
.deejay-category-logo-carousel [hidden] {
	display: none !important;
}

@media (min-width: 480px) {
	.deejay-category-logo-carousel {
		--deejay-category-logo-carousel-visible: 3;
	}
}

@media (min-width: 768px) {
	.deejay-category-logo-carousel {
		--deejay-category-logo-carousel-visible: 5;
	}
}

@media (min-width: 1024px) {
	.deejay-category-logo-carousel {
		--deejay-category-logo-carousel-visible: 6;
	}
}

@media (min-width: 1280px) {
	.deejay-category-logo-carousel {
		--deejay-category-logo-carousel-visible: 7;
	}
}

@media (prefers-reduced-motion: reduce) {
	.deejay-category-logo-carousel__viewport {
		scroll-behavior: auto;
	}
}