/**
 * Frontend styles.
 *
 * @since 1.0.0
 */

/* ── Marquee: hold the raw content hidden until the JS engine builds the
   track, so the un-animated (broken) layout never flashes on load. The engine
   adds `.danim-mq-ready` once set up. A 3s CSS failsafe reveals it even if the
   engine never runs. ── */
[data-da-marquee="1"] {
	opacity: 0;
	transition: opacity .45s ease;
	animation: danim-mq-failsafe .01s linear 3s forwards;
}
[data-da-marquee="1"].danim-mq-ready {
	opacity: 1;
	animation: none;
}
[data-da-marquee-loader="instant"] {
	transition: none;
}
@keyframes danim-mq-failsafe { to { opacity: 1; } }

/* Shimmer: keep the box visible but hide the raw children and run a shimmer
   sweep while loading, then reveal on ready. */
[data-da-marquee-loader="shimmer"]:not(.danim-mq-ready) {
	opacity: 1;
	position: relative;
}
[data-da-marquee-loader="shimmer"]:not(.danim-mq-ready) > * {
	visibility: hidden;
}
[data-da-marquee-loader="shimmer"]:not(.danim-mq-ready)::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(90deg, transparent, rgba(150, 150, 150, .18), transparent);
	background-size: 200% 100%;
	animation: danim-mq-shimmer 1.2s linear infinite;
}
@keyframes danim-mq-shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }