/* ==========================================================================
   Emergency House – Slágercsík (marquee)
   A sablon (sablonhouse/styles.css) visuals átvezetve, .eh- prefix-szel a
   téma/egyéb bővítmények osztályneveivel való névütközés elkerülésére.
   Megjelenésre 1:1 a sablonnal; csak a körbe-futást tettük robusztussá.
   ========================================================================== */

/* Az .eh-hazard elválasztó csík stílusa a css/hazard.css-ben él
   ([eh_hazard] shortcode) — a marquee és az önálló vonal is azt használja. */

/* --- A csík ------------------------------------------------------------- */
.eh-marquee {
	background: #111;
	border-top: 1px solid #ffffff10;
	border-bottom: 1px solid #ffffff10;
	overflow: hidden; /* élek elvágása ("elvágás") */
	padding: 18px 0;
}

.eh-marquee__track {
	display: flex;
	align-items: center;
	width: max-content;
	white-space: nowrap;
	animation: eh-marquee-scroll var(--eh-marquee-duration, 26s) linear infinite;
}

/* Hoverre megáll (nem változtat a megjelenésen, csak kényelmesebb). */
.eh-marquee:hover .eh-marquee__track {
	animation-play-state: paused;
}

.eh-marquee__item-text {
	font-family: 'Anton', sans-serif;
	text-transform: uppercase;
	font-size: 28px;
	letter-spacing: 2px;
	color: #ffffff;
	display: inline-flex;
	align-items: center;
}

.eh-marquee__sep {
	color: #E8E51C;
	margin: 0 22px;
	font-size: 28px;
	line-height: 1;
	display: inline-flex;
	align-items: center;
}

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

/* --- Reszponzív --------------------------------------------------------- */
@media (max-width: 720px) {
	.eh-marquee__item-text,
	.eh-marquee__sep {
		font-size: 22px;
	}
	.eh-marquee__sep {
		margin: 0 16px;
	}
}

/* Akinek zavaró a mozgás, annak áll. */
@media (prefers-reduced-motion: reduce) {
	.eh-marquee__track {
		animation: none;
	}
}