/* Synth — Ticker « En bref » ----------------------------------------------
   Couleurs pilotées par variables (réglables dans l'admin / le shortcode). */

.synth-ticker {
	--st-cyan: #01ffe0;
	--st-ink: #0a0a0a;
	--st-accent: #f4be43;

	display: flex;
	align-items: stretch;
	width: 100%;
	height: 42px;
	background: var(--st-cyan);
	overflow: hidden;
	font-family: "Space Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	box-sizing: border-box;
}

.synth-ticker * {
	box-sizing: border-box;
}

/* fixed label chip on the left */
.synth-ticker__label {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-shrink: 0;
	padding: 0 18px;
	background: var(--st-ink);
	color: var(--st-label, var(--st-cyan)) !important;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	white-space: nowrap;
}

/* label as a link — keep its colour regardless of the theme's link styles */
.synth-ticker a.synth-ticker__label,
.synth-ticker a.synth-ticker__label:link,
.synth-ticker a.synth-ticker__label:visited {
	text-decoration: none;
	color: var(--st-label, var(--st-cyan)) !important;
	transition: opacity 0.15s ease;
}

.synth-ticker a.synth-ticker__label:hover,
.synth-ticker a.synth-ticker__label:focus {
	text-decoration: underline;
	text-underline-offset: 3px;
	color: var(--st-label, var(--st-cyan)) !important;
	opacity: 0.85;
}

.synth-ticker__dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--st-dot, var(--st-cyan));
	animation: synth-ticker-flicker 1.4s infinite;
	flex-shrink: 0;
}

/* scrolling viewport */
.synth-ticker__viewport {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	display: flex;
	align-items: center;
}

.synth-ticker__track {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	white-space: nowrap;
	will-change: transform;
	animation: synth-ticker-scroll var(--st-duration, 40s) linear infinite;
}

.synth-ticker__item {
	display: inline-flex;
	align-items: center;
	padding: 0 22px;
	color: var(--st-ink);
	font-size: 12.5px;
	font-weight: 700;
	line-height: 42px;
	text-decoration: none;
	letter-spacing: 0.2px;
}

a.synth-ticker__item:hover,
a.synth-ticker__item:focus {
	text-decoration: underline !important;
	text-underline-offset: 3px;
	color: #000000 !important;
}

.synth-ticker__sep {
	color: var(--st-ink);
	opacity: 0.5;
	font-size: 11px;
}

/* title | date */
.synth-ticker__bar {
	margin: 0 8px;
	color: var(--st-ink);
	opacity: 0.45;
	font-weight: 400;
}

.synth-ticker__date {
	color: var(--st-ink);
	font-weight: 400;
	opacity: 0.75;
	font-size: 12px;
}

/* pause when the visitor hovers / focuses the bar */
.synth-ticker:hover .synth-ticker__track,
.synth-ticker:focus-within .synth-ticker__track {
	animation-play-state: paused;
}

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

@keyframes synth-ticker-flicker {
	0%, 100% { opacity: 1; }
	50%      { opacity: 0.3; }
}

/* accessibility: no motion → static, manually scrollable strip */
@media (prefers-reduced-motion: reduce) {
	.synth-ticker__track {
		animation: none;
	}
	.synth-ticker__viewport {
		overflow-x: auto;
	}
	.synth-ticker__dot {
		animation: none;
	}
}
