.tt-marquee {
	overflow: hidden;
	width: 100%;
	max-width: 100%;
	position: relative;
	--tt-marquee-shadow-color: #ffffff;
	--tt-marquee-gap: 0px;
}

.tt-marquee__rail {
	display: block;
	width: 100%;
	max-width: 100%;
}

.tt-marquee__track {
	display: flex;
	width: max-content;
	gap: var(--tt-marquee-gap);
	will-change: transform;
}

.tt-marquee__group {
	display: flex;
	gap: var(--tt-marquee-gap);
}

.tt-marquee__item {
	display: inline-flex;
	align-items: center;
	white-space: nowrap;
	text-decoration: none;
	flex-shrink: 0;
}

.tt-marquee__item--text {
	gap: 10px;
}

.tt-marquee__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
	flex-shrink: 0;
	width: 1em;
	height: 1em;
	min-width: 1em;
	min-height: 1em;
}

.tt-marquee__icon i,
.tt-marquee__icon svg {
	display: block;
	width: 1em !important;
	height: 1em !important;
}

.tt-marquee__icon i {
	font-size: 1em;
	line-height: 1;
}

.tt-marquee__icon svg {
	fill: currentColor !important;
	stroke: currentColor !important;
}

.tt-marquee__item--image {
	background: transparent;
	padding: 0;
}

.tt-marquee__item--image img {
	display: block;
	max-width: 100%;
	height: auto;
}

/* Vertical */
.tt-marquee--vertical .tt-marquee__track,
.tt-marquee--vertical .tt-marquee__group {
	flex-direction: column;
	width: 100%;
}

.tt-marquee--vertical .tt-marquee__group {
	padding-right: 0;
	padding-bottom: 0;
}

/* Shadow edges */
.tt-marquee--shadow::before,
.tt-marquee--shadow::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	width: 20%;
	z-index: 3;
	pointer-events: none;
}

.tt-marquee--shadow::before {
	left: 0;
	background: linear-gradient(90deg, var(--tt-marquee-shadow-color), transparent);
}

.tt-marquee--shadow::after {
	right: 0;
	background: linear-gradient(270deg, var(--tt-marquee-shadow-color), transparent);
}

.tt-marquee--shadow-hide-start::before,
.tt-marquee--shadow-hide-end::after {
	display: none;
}

/* Rotate overflow fix — widen so the rotated band still covers the viewport.
 * Clip the infinite track ON the marquee (local overflow:hidden), but keep
 * Elementor ancestors visible so the rotated box is not chopped on the sides.
 * overflow:visible on .tt-marquee itself let the duplicated track (~2000px)
 * expand document width and created iOS homepage scroll-x. */
.elementor-element:has(> .elementor-widget-container .tt-marquee--rotate-overflow),
.elementor-element:has(> .elementor-widget-container .tt-marquee--rotate-overflow) > .elementor-widget-container {
	overflow: visible;
}

.tt-marquee--rotate-overflow {
	overflow: hidden !important;
	--tt-marquee-cover-extra: 0px;
	--tt-marquee-offset-x: 0px;
	width: calc(100% + var(--tt-marquee-cover-extra));
	margin-left: calc((var(--tt-marquee-cover-extra) * -0.5) + var(--tt-marquee-offset-x));
	margin-right: calc(var(--tt-marquee-cover-extra) * -0.5);
}

/*
 * iOS: overflow on a transformed node does not stop the ~2000px track from
 * expanding page pan. Keep .tt-marquee unrotated and 100% wide so the clip
 * holds; rotate + cover-extra live on the inner rail so the band still
 * fills the viewport and the two strips can cross.
 */
@media (max-width: 1024px), (pointer: coarse) {
	.elementor-widget-treethemes-marquee,
	.elementor-widget-treethemes-marquee > .elementor-widget-container,
	.elementor-element:has(> .elementor-widget-container .tt-marquee--rotate-overflow),
	.elementor-element:has(> .elementor-widget-container .tt-marquee--rotate-overflow) > .elementor-widget-container {
		overflow: visible !important;
		max-width: 100%;
	}

	.tt-marquee,
	.tt-marquee--rotate-overflow {
		transform: none !important;
		overflow: hidden !important;
		width: 100% !important;
		max-width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.tt-marquee__rail {
		position: relative;
		transform: rotate(var(--tt-marquee-angle, 0deg));
		transform-origin: center center;
		width: calc(100% + var(--tt-marquee-cover-extra, 0px));
		max-width: none;
		height: 100%;
		margin-left: calc((var(--tt-marquee-cover-extra, 0px) * -0.5) + var(--tt-marquee-offset-x, 0px));
	}

	.tt-marquee__track {
		will-change: auto;
	}
}