/**
 * ST Extras marquee text — Flatsome-friendly, LTR/RTL aware.
 */

.st-extras-marquee {
	--st-extras-marquee-duration: 35s;
	--st-extras-marquee-distance: 50%;
	--st-extras-marquee-gap: 2.25rem;
	--st-extras-marquee-fade: 20px;
	display: block;
	width: 100%;
	max-width: 100%;
	line-height: 1.35;
}

.st-extras-marquee__viewport {
	overflow: hidden;
	width: 100%;
	min-height: 1.35em;
	contain: layout style;
	-webkit-mask-image: linear-gradient(
		to right,
		transparent,
		#000 var(--st-extras-marquee-fade),
		#000 calc(100% - var(--st-extras-marquee-fade)),
		transparent
	);
	mask-image: linear-gradient(
		to right,
		transparent,
		#000 var(--st-extras-marquee-fade),
		#000 calc(100% - var(--st-extras-marquee-fade)),
		transparent
	);
}

.st-extras-marquee.is-rtl .st-extras-marquee__viewport {
	-webkit-mask-image: linear-gradient(
		to left,
		transparent,
		#000 var(--st-extras-marquee-fade),
		#000 calc(100% - var(--st-extras-marquee-fade)),
		transparent
	);
	mask-image: linear-gradient(
		to left,
		transparent,
		#000 var(--st-extras-marquee-fade),
		#000 calc(100% - var(--st-extras-marquee-fade)),
		transparent
	);
}

.st-extras-marquee__track {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	width: max-content;
	min-width: 100%;
	transform: translate3d(0, 0, 0);
	backface-visibility: hidden;
	animation: st-extras-marquee-scroll var(--st-extras-marquee-duration) linear infinite;
}

.st-extras-marquee.is-rtl .st-extras-marquee__track {
	animation-name: st-extras-marquee-scroll-rtl;
}

.st-extras-marquee__group {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	flex-shrink: 0;
	white-space: nowrap;
}

.st-extras-marquee__item,
.st-extras-marquee__sep {
	display: inline-block;
	flex: 0 0 auto;
	font-size: var(--st-extras-marquee-font-size, 13px);
	font-weight: 500;
	letter-spacing: 0.01em;
	white-space: nowrap;
}

.st-extras-marquee__sep {
	opacity: 0.55;
	padding-inline: calc(var(--st-extras-marquee-gap) / 2);
}

.st-extras-marquee__group .st-extras-marquee__sep:last-child {
	display: none;
}

@keyframes st-extras-marquee-scroll {
	0% {
		transform: translate3d(0, 0, 0);
	}
	100% {
		transform: translate3d(calc(-1 * var(--st-extras-marquee-distance)), 0, 0);
	}
}

@keyframes st-extras-marquee-scroll-rtl {
	0% {
		transform: translate3d(0, 0, 0);
	}
	100% {
		transform: translate3d(var(--st-extras-marquee-distance), 0, 0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.st-extras-marquee__track {
		animation: none;
		transform: none;
		flex-wrap: wrap;
		width: 100%;
		white-space: normal;
	}

	.st-extras-marquee__group {
		white-space: normal;
		flex-wrap: wrap;
	}

	.st-extras-marquee__viewport {
		-webkit-mask-image: none;
		mask-image: none;
	}
}

/* Flatsome top bar integration */
#top-bar.header-top {
	min-height: 34px;
}

#top-bar .flex-row.container {
	align-items: center;
	min-height: 34px;
}

#top-bar .html.custom {
	display: block;
	width: 100%;
	max-width: 100%;
	padding: 0;
	margin: 0;
	line-height: 1.35;
}

#top-bar .flex-col.flex-center {
	flex: 1 1 auto;
	max-width: 100%;
	min-width: 0;
}

#top-bar .nav-center > .html.custom,
#top-bar .mobile-nav > .html.custom {
	width: 100%;
}

#top-bar .nav > li.html.custom {
	overflow: visible;
}

#top-bar .st-extras-marquee {
	margin: 0;
	padding-block: 4px;
}

#top-bar .st-extras-marquee__item,
#top-bar .st-extras-marquee__sep {
	font-size: var(--st-extras-marquee-font-size, 13px);
}

@media (max-width: 549px) {
	.st-extras-marquee__item,
	.st-extras-marquee__sep {
		font-size: var(--st-extras-marquee-font-size-mobile, var(--st-extras-marquee-font-size, 12px));
	}

	#top-bar .st-extras-marquee__item,
	#top-bar .st-extras-marquee__sep {
		font-size: var(--st-extras-marquee-font-size-mobile, var(--st-extras-marquee-font-size, 12px));
	}
}

.header-top.nav-dark .st-extras-marquee__item,
.header-top.nav-dark .st-extras-marquee__sep {
	color: inherit;
}

.header-top:not(.nav-dark) .st-extras-marquee__item,
.header-top:not(.nav-dark) .st-extras-marquee__sep {
	color: inherit;
}
