/* Cora Animated Ticker
 * .cora-ticker        clips the moving track (overflow hidden)
 * .cora-ticker__track flex row of one or more identical groups (animated by GSAP)
 * .cora-ticker__group flex row of the actual items, with the inter-item gap
 * The track gap == group gap, so the seam between the original group and its
 * clone matches the inter-item spacing exactly (seamless loop). */

.cora-ticker {
	overflow: hidden;
	position: relative;
	/* No width:100% — a block-level element already fills its container, and an
	 * explicit width caps alignfull's negative-margin full-bleed (it would only
	 * reach the content width, not the viewport). */
}

.cora-ticker__track {
	display: flex;
	flex-wrap: nowrap;
	width: max-content;
	gap: var( --cora-ticker-gap, 3rem );
	will-change: transform;
}

.cora-ticker__group {
	display: flex;
	flex-wrap: nowrap;
	flex: 0 0 auto;
	align-items: center;
	gap: var( --cora-ticker-gap, 3rem );
}

/* Items shouldn't shrink or wrap — a ticker is a single line. */
.cora-ticker__group > * {
	flex: 0 0 auto;
	margin: 0;
	max-width: none;
}

/* Before JS clones the group, hide horizontal overflow gracefully. */
.cora-ticker:not( .is-ready ) .cora-ticker__track {
	transform: none;
}

/* Editor: show the content as a static, non-clipped row so it's easy to edit. */
.editor-styles-wrapper .cora-ticker--editor {
	overflow: visible;
}
.editor-styles-wrapper .cora-ticker--editor .cora-ticker__track {
	width: 100%;
}

@media ( prefers-reduced-motion: reduce ) {
	/* Static fallback: no transform; allow the row to scroll if it overflows. */
	.cora-ticker {
		overflow-x: auto;
	}
}
