/* ============ Global components ============
   Moved out of inline <style> blocks in template-parts (ticker,
   categories-mobile) into the <head> so pages validate. Static CSS only. */

/* ---- News ticker ---- */
@keyframes ticker {
	0%   { transform: translate3d(0, 0, 0); }
	100% { transform: translate3d(-50%, 0, 0); }
}
.animate-ticker { animation: ticker 60s linear infinite; }
.animate-ticker.paused { animation-play-state: paused; }
.ticker-wrapper:hover .animate-ticker { animation-play-state: paused; }

/* ---- Mobile categories bar ---- */
#mobile-categories-bar > div::-webkit-scrollbar { display: none; }
#mobile-categories-bar * { transition: all 0.2s ease !important; }
#mobile-categories-bar.categories-compact { padding-top: 0 !important; padding-bottom: 0 !important; }
#mobile-categories-bar.categories-compact .categories-inner { padding: 0.8rem 0.75rem !important; gap: 0.2rem !important; }
#mobile-categories-bar.categories-compact a { padding: 0.15rem 0.4rem !important; gap: 0.15rem !important; }
#mobile-categories-bar.categories-compact a span:last-child { font-size: 0.55rem !important; }
#mobile-categories-bar.categories-compact a svg { width: 0.5rem !important; height: 0.5rem !important; }
