.imgmq-marquee {
	overflow: hidden;
	position: relative;
	width: 100%;
	--imgmq-duration: 30s;
	--imgmq-gap: 20px;
	--imgmq-item-width: 250px;
	--imgmq-height: 200px;
}

.imgmq-marquee .imgmq-track {
	display: flex;
	width: max-content;
}

/* Horizontal layout */
.imgmq-horizontal {
	height: var(--imgmq-height);
}

.imgmq-horizontal .imgmq-track {
	flex-direction: row;
	gap: var(--imgmq-gap);
	animation: imgmq-scroll-x var(--imgmq-duration) linear infinite;
}

.imgmq-horizontal.imgmq-reverse .imgmq-track {
	animation-direction: reverse;
}

.imgmq-horizontal .imgmq-item {
	flex: 0 0 auto;
	width: var(--imgmq-item-width);
	height: var(--imgmq-height);
	display: block;
}

/* Vertical layout */
.imgmq-vertical {
	height: var(--imgmq-height);
}

.imgmq-vertical .imgmq-track {
	flex-direction: column;
	width: 100%;
	gap: var(--imgmq-gap);
	animation: imgmq-scroll-y var(--imgmq-duration) linear infinite;
}

.imgmq-vertical.imgmq-reverse .imgmq-track {
	animation-direction: reverse;
}

.imgmq-vertical .imgmq-item {
	flex: 0 0 auto;
	width: 100%;
	display: block;
}

/* Shared item styles */
.imgmq-item {
	overflow: hidden;
	display: block;
}

.imgmq-item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

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

@keyframes imgmq-scroll-x {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-50%);
	}
}

@keyframes imgmq-scroll-y {
	from {
		transform: translateY(0);
	}
	to {
		transform: translateY(-50%);
	}
}

@media (prefers-reduced-motion: reduce) {
	.imgmq-marquee .imgmq-track {
		animation: none !important;
	}
}