/**
 * Preluence News — latest-headlines ticker.
 * Pure CSS marquee: pauses on hover or keyboard focus; static and scrollable
 * when the reader prefers reduced motion.
 */

.pn-ticker {
	background: var(--pn-bg);
	border-block-end: 1px solid var(--pn-border);
	font-size: 0.875rem;
}

.pn-ticker__inner {
	display: flex;
	align-items: stretch;
	min-height: 42px;
}

.pn-ticker__label {
	display: inline-flex;
	flex-shrink: 0;
	align-items: center;
	gap: 0.5rem;
	margin-inline-end: 1rem;
	padding-inline: 0.85rem;
	background: var(--pn-accent);
	color: var(--pn-on-accent);
	font-family: var(--pn-font-ui);
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 50%, calc(100% - 10px) 100%, 0 100%);
	padding-inline-end: 1.4rem;
}

[dir="rtl"] .pn-ticker__label {
	clip-path: polygon(10px 0, 100% 0, 100% 100%, 10px 100%, 0 50%);
	padding-inline: 1.4rem 0.85rem;
}

.pn-ticker__pulse {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: currentcolor;
	animation: pn-pulse 1.6s ease-in-out infinite;
}

@keyframes pn-pulse {

	50% {
		opacity: 0.25;
	}
}

.pn-ticker__viewport {
	position: relative;
	flex: 1;
	min-width: 0;
	overflow: hidden;
	mask-image: linear-gradient(to right, transparent, #000 24px, #000 calc(100% - 40px), transparent);
}

.pn-ticker__track {
	display: flex;
	width: max-content;
	height: 100%;
	animation: pn-ticker var(--pn-ticker-duration, 48s) linear infinite;
}

.pn-ticker:hover .pn-ticker__track,
.pn-ticker:focus-within .pn-ticker__track {
	animation-play-state: paused;
}

[dir="rtl"] .pn-ticker__track {
	animation-name: pn-ticker-rtl;
}

@keyframes pn-ticker {

	to {
		transform: translateX(-50%);
	}
}

@keyframes pn-ticker-rtl {

	to {
		transform: translateX(50%);
	}
}

.pn-ticker__list {
	display: flex;
	align-items: center;
	margin: 0;
	padding: 0;
	list-style: none;
}

.pn-ticker__list li {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding-inline-end: 2rem;
	white-space: nowrap;
}

.pn-ticker__list li::before {
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 1px;
	background: var(--pn-primary);
	transform: rotate(45deg);
}

.pn-ticker__list a {
	color: var(--pn-text);
	font-weight: 600;
	text-decoration: none;
}

.pn-ticker__list a:hover {
	color: var(--pn-link);
	text-decoration: underline;
}

.pn-ticker__time {
	color: var(--pn-text-muted);
	font-size: 0.75rem;
}

@media (prefers-reduced-motion: reduce) {

	.pn-ticker__track {
		animation: none;
	}

	.pn-ticker__viewport {
		overflow-x: auto;
		mask-image: none;
	}

	.pn-ticker__list[aria-hidden="true"] {
		display: none;
	}
}

/* ---------- Ticker styles ---------- */

.pn-ticker--futuristic {
	border-block-end: 1px solid color-mix(in srgb, var(--pn-primary) 30%, transparent);
	background: linear-gradient(90deg, color-mix(in srgb, var(--pn-primary) 12%, transparent), transparent);
}

.pn-ticker--futuristic .pn-ticker__label {
	background: linear-gradient(120deg, var(--pn-primary), var(--pn-accent, var(--pn-primary)));
}

.pn-ticker--glass {
	background: color-mix(in srgb, var(--pn-bg) 72%, transparent);
	-webkit-backdrop-filter: blur(12px) saturate(1.2);
	backdrop-filter: blur(12px) saturate(1.2);
}

.pn-ticker--pulse .pn-ticker__label {
	animation: pn-ticker-pulse 2.4s ease-in-out infinite;
}

@keyframes pn-ticker-pulse {

	0%,
	100% {
		box-shadow: 0 0 0 0 color-mix(in srgb, var(--pn-accent) 45%, transparent);
	}

	50% {
		box-shadow: 0 0 0 7px transparent;
	}
}

.pn-ticker--no-pause:hover .pn-ticker__track,
.pn-ticker--no-pause:focus-within .pn-ticker__track {
	animation-play-state: running;
}

.pn-ticker--ltr .pn-ticker__track {
	animation-name: pn-ticker;
}

.pn-ticker--rtl .pn-ticker__track {
	animation-name: pn-ticker-rtl;
}

.pn-ticker--vertical .pn-ticker__viewport {
	overflow: visible;
	mask-image: none;
}

.pn-ticker--vertical .pn-ticker__track {
	display: block;
	width: auto;
	animation: none;
}

.pn-ticker--vertical .pn-ticker__list {
	flex-direction: column;
	align-items: flex-start;
	gap: 0.35rem;
}

.pn-ticker--vertical .pn-ticker__list[aria-hidden="true"] {
	display: none;
}

.pn-ticker--carousel .pn-ticker__viewport {
	overflow-x: auto;
	mask-image: none;
	scroll-snap-type: x mandatory;
}

.pn-ticker--carousel .pn-ticker__track {
	animation: none;
}

.pn-ticker--carousel .pn-ticker__list[aria-hidden="true"] {
	display: none;
}

.pn-ticker--carousel .pn-ticker__list li {
	scroll-snap-align: start;
}