/*
 * Gallery: logo carousel
 *
 * Logos share one evenly distributed row when space permits. The frontend
 * enhancement switches the row to a continuous marquee only when it overflows.
 */

.wp-block-gallery.is-style-crunchr-logo-carousel {
	--crunchr-logo-gap: clamp(20px, 3vw, 48px);
	--crunchr-logo-height: 64px;
	--crunchr-logo-width: 180px;
	display: flex !important;
	flex-wrap: nowrap !important;
	align-items: center;
	gap: var(--crunchr-logo-gap) !important;
	overflow: hidden;
}

.wp-block-gallery.is-style-crunchr-logo-carousel > .wp-block-image,
.wp-block-gallery.is-style-crunchr-logo-carousel .crunchr-logo-carousel__track > .wp-block-image {
	display: flex !important;
	flex: 0 0 auto !important;
	align-items: center;
	justify-content: center;
	width: auto !important;
	min-height: var(--crunchr-logo-height);
	margin: 0 !important;
}

.wp-block-gallery.is-style-crunchr-logo-carousel .wp-block-image > a {
	display: flex;
	align-items: center;
	justify-content: center;
	height: var(--crunchr-logo-height);
}

.wp-block-gallery.is-style-crunchr-logo-carousel .wp-block-image img {
	width: auto !important;
	max-width: min(var(--crunchr-logo-width), 30vw);
	height: auto !important;
	max-height: var(--crunchr-logo-height);
	object-fit: contain !important;
}

.wp-block-gallery.is-style-crunchr-logo-carousel .crunchr-logo-carousel__track {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	gap: var(--crunchr-logo-gap);
	min-width: 100%;
	will-change: transform;
}

.wp-block-gallery.is-style-crunchr-logo-carousel.is-logo-row .crunchr-logo-carousel__track {
	justify-content: space-between;
}

.editor-styles-wrapper .wp-block-gallery.is-style-crunchr-logo-carousel {
	justify-content: space-between;
	overflow-x: auto;
}

@media (prefers-reduced-motion: reduce) {
	.wp-block-gallery.is-style-crunchr-logo-carousel.is-logo-carousel {
		overflow-x: auto;
		scrollbar-width: thin;
	}

	.wp-block-gallery.is-style-crunchr-logo-carousel .crunchr-logo-carousel__track {
		will-change: auto;
	}
}