/* PS UX Builder Addons — Content Ticker / Marquee */

.ps-uxb-ticker { --ps-ticker-speed: 30s; --ps-ticker-gap: 40px; --ps-ticker-size: 16px; --ps-ticker-weight: 600; --ps-ticker-accent: #446084; --ps-ticker-padding: 12px; display: flex; align-items: stretch; overflow: hidden; background: var(--ps-ticker-bg, transparent); color: var(--ps-ticker-color, inherit); }
.ps-uxb-ticker__label { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; padding: var(--ps-ticker-padding) 18px; background: var(--ps-ticker-accent); color: #fff; font-size: var(--ps-ticker-size); font-weight: 700; white-space: nowrap; }
.ps-uxb-ticker__viewport { position: relative; flex: 1 1 auto; overflow: hidden; padding: var(--ps-ticker-padding) 0; }
.ps-uxb-ticker--fade .ps-uxb-ticker__viewport { -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.ps-uxb-ticker__track { display: flex; width: max-content; animation: psUxbTickerLeft var(--ps-ticker-speed) linear infinite; }
.ps-uxb-ticker--right .ps-uxb-ticker__track { animation-name: psUxbTickerRight; }
.ps-uxb-ticker--pause:hover .ps-uxb-ticker__track { animation-play-state: paused; }
.ps-uxb-ticker__group { display: flex; align-items: center; padding-right: var(--ps-ticker-gap); }
.ps-uxb-ticker__item { font-size: var(--ps-ticker-size); font-weight: var(--ps-ticker-weight); white-space: nowrap; }
.ps-uxb-ticker--upper .ps-uxb-ticker__item { text-transform: uppercase; letter-spacing: .04em; }
.ps-uxb-ticker__link { color: inherit; text-decoration: none; }
.ps-uxb-ticker__link:hover { text-decoration: underline; }
.ps-uxb-ticker__sep { display: inline-block; margin: 0 calc(var(--ps-ticker-gap) / 2); color: var(--ps-ticker-accent); }
.ps-uxb-ticker--sep-dot .ps-uxb-ticker__sep::before { content: "\25CF"; font-size: .5em; vertical-align: middle; }
.ps-uxb-ticker--sep-slash .ps-uxb-ticker__sep::before { content: "/"; }
.ps-uxb-ticker--sep-star .ps-uxb-ticker__sep::before { content: "\2731"; font-size: .8em; }
.ps-uxb-ticker--sep-line .ps-uxb-ticker__sep::before { content: "|"; opacity: .5; }

@keyframes psUxbTickerLeft { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes psUxbTickerRight { from { transform: translateX(-50%); } to { transform: translateX(0); } }

/* Trên mobile: nhãn nằm ở hàng trên, nội dung chạy ở hàng dưới trong cùng một khối. */
@media (max-width: 767px) {
	.ps-uxb-ticker { display: grid; grid-template-columns: minmax(0, 1fr); width: 100%; }
	.ps-uxb-ticker__label { width: 100%; box-sizing: border-box; justify-content: flex-start; }
	.ps-uxb-ticker__viewport { width: 100%; min-width: 0; box-sizing: border-box; }
}

@media (prefers-reduced-motion: reduce) {
	.ps-uxb-ticker__track { animation: none; }
	.ps-uxb-ticker__viewport { overflow-x: auto; }
}
