/* Announcement bar — fixed top, seamless horizontal marquee (Moblerone-style). */

.fecc-bar {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 100001; /* Strictly above Divi #top-header/#main-header (100000). */
	display: flex;
	align-items: center;
	height: 30px; /* lean: compact bar; adjust with --fecc-bar-h consumers. */
	overflow: hidden;
	background: #5b3a29; /* Matches Divi brown. */
	color: #fff;
	border-bottom: 1px solid rgba( 255, 255, 255, 0.28 ); /* Separation line, no gap. */
	font-size: 12px;
	line-height: 1;
	box-sizing: border-box;
}

.fecc-bar__track {
	display: flex;
	align-items: center;
	min-width: max-content; /* Never shrink; occupy real content width. */
	white-space: nowrap;
	will-change: transform;
}

.fecc-bar.is-animating .fecc-bar__track {
	animation-name: fecc-marquee;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	/* animation-duration is set inline by JS to keep a constant speed. */
}

.fecc-bar__inner {
	display: flex;
	align-items: center;
}

.fecc-bar__msg {
	display: inline-flex;
	align-items: center;
	font-weight: 500;
	letter-spacing: 0.01em;
}

/* Separator after every message (including seams between clones). */
.fecc-bar__msg::after {
	content: "—";
	margin: 0 22px;
	opacity: 0.55;
	font-weight: 400;
}

.fecc-bar__msg a {
	color: #fff;
	text-decoration: underline;
}

.fecc-bar__msg strong {
	font-weight: 700;
}

@keyframes fecc-marquee {
	from { transform: translateX( 0 ); }
	to   { transform: translateX( calc( -1 * var( --fecc-shift, 100% ) ) ); }
}

/* When the WP admin bar is present (logged-in), sit below it so the bar isn't
   hidden behind it (which otherwise leaves an empty gap). */
body.admin-bar .fecc-bar {
	top: 32px;
}
@media screen and ( max-width: 782px ) {
	body.admin-bar .fecc-bar {
		top: 46px;
	}
}

/* Push Divi's fixed headers + page content below the bar (margin-top works on
   fixed elements, unlike body margin, and ignores Divi's dynamic top values). */
html.fecc-has-bar {
	scroll-padding-top: var( --fecc-bar-h, 30px );
}
html.fecc-has-bar #top-header,
html.fecc-has-bar #main-header {
	margin-top: var( --fecc-bar-h, 30px ) !important;
}
html.fecc-has-bar #page-container {
	margin-top: var( --fecc-bar-h, 30px ) !important;
}

@media ( max-width: 782px ) {
	.fecc-bar {
		height: 28px;
		font-size: 11px;
	}
	.fecc-bar__msg::after {
		margin: 0 16px;
	}
}

/* Reduced motion: stop the marquee, show messages statically (they still scroll
   horizontally only if overflowing, but no auto-animation). */
@media ( prefers-reduced-motion: reduce ) {
	.fecc-bar.is-animating .fecc-bar__track {
		animation: none;
	}
}