/*
 * Vantorix Sticky Element
 */

.es-sticky-element {
	position: sticky;
	will-change: transform, background-color, box-shadow, padding, border-radius;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	/* Base transition for smooth state changes */
	transition-property: background-color, box-shadow, transform, padding, border-radius;
	transition-duration: 300ms;
	transition-timing-function: ease;
}

/* Fallback/Forced Fixed positioning if required by configuration via JS */
.es-sticky-element.es-sticky-fixed {
	position: fixed;
	width: 100%;
}

/* Device gate (1.1.8): JS adds .es-sticky-off on devices NOT in the Device list.
   It wins over both the base sticky rule and the forced-fixed rule, so the element
   behaves as a normal static element there. will-change:auto is intentional: no
   containing block is created on excluded devices (the nav drawer portal re-checks
   needsPortal() at open time, so it is unaffected). */
.es-sticky-element.es-sticky-off,
.es-sticky-element.es-sticky-off.es-sticky-fixed {
	position: static;
	top: auto;
	width: auto;
	will-change: auto;
}

/* Hide on Scroll up/down states via JS classes */
.es-sticky-element.is-sticking.is-hidden-scroll {
	transform: translateY(-100%);
}

/* When the element is sticking */
.es-sticky-element.is-sticking {
	/* The background color and shadow will be applied via inline styles injected by Elementor Controls */
}

/* Editor preview mode */
.elementor-element-edit-mode.es-sticky-element {
	/* We allow it to stick natively now! */
}
.elementor-element-edit-mode.es-sticky-element::after {
	content: 'Sticky Preview Enabled';
	position: absolute;
	top: 0;
	right: 0;
	background: #6c5ce7;
	color: #fff;
	font-size: 10px;
	padding: 2px 6px;
	border-radius: 0 0 0 4px;
	z-index: 9999;
	pointer-events: none;
	opacity: 0.8;
}
