/**
 * SITS Sticky Controls – Frontend Styles
 *
 * Handles fixed positioning, transitions, animations, and
 * the hidden-on-scroll-down state for sticky Elementor elements.
 *
 * @package Softech_Addons_for_Elementor
 */

/* ── Base sticky state ───────────────────────────────────────── */

/* AFTER */
.sits-is-sticky {
    z-index: 999;
    box-sizing: border-box;
    transition-property: background, box-shadow, opacity, transform;
    transition-duration: 0.3s;
    transition-timing-function: ease;
    /* will-change removed — it breaks fixed children like mega menus */
}

/* ── Direction variants ──────────────────────────────────────── */

.sits-sticky-top {
	top: 0; /* refined at runtime via JS + user offset */
}

.sits-sticky-bottom {
	bottom: 0; /* refined at runtime via JS + user offset */
}

/* ── Hide on scroll down ─────────────────────────────────────── */

.sits-is-sticky.sits-sticky-hidden {
	opacity: 0 !important;
	pointer-events: none;
	/* Use the correct direction so the element slides off screen */
}

.sits-is-sticky.sits-sticky-top.sits-sticky-hidden {
	transform: translateY(-110%) !important;
	transition: transform 0.3s ease, opacity 0.3s ease;
}

.sits-is-sticky.sits-sticky-bottom.sits-sticky-hidden {
	transform: translateY(110%) !important;
	transition: transform 0.3s ease, opacity 0.3s ease;
}

/* ── Fade animation ──────────────────────────────────────────── */

.sits-is-sticky.sits-sticky-anim-fade {
	/* Opacity transition handled inline by JS for the entrance;
	   CSS provides the ongoing transition for background changes etc. */
	transition: background 0.3s ease,
	            box-shadow 0.3s ease,
	            opacity    0.3s ease;
}

/* ── Slide animation ─────────────────────────────────────────── */

.sits-is-sticky.sits-sticky-anim-slide {
	transition: background  0.3s ease,
	            box-shadow  0.3s ease,
	            transform   0.3s ease;
}

/* ── Placeholder (prevents layout jump) ─────────────────────── */

.sits-sticky-placeholder {
	display: block !important;
	visibility: hidden !important;
	pointer-events: none;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	flex: 0 0 auto;
	overflow: hidden;
	contain: layout style paint;
}
.sits-is-sticky {
	transition-property: background, box-shadow, opacity, transform !important;
}

.sits-is-sticky {
	-webkit-transition: background 0.3s ease,
	                    box-shadow 0.3s ease,
	                    opacity    0.3s ease,
	                    transform  0.3s ease;
	        transition: background 0.3s ease,
	                    box-shadow 0.3s ease,
	                    opacity    0.3s ease,
	                    transform  0.3s ease;
}

.sits-is-sticky {
	position: fixed !important;
}

/* Full-width sections: stretch to the viewport. */
.elementor-section.elementor-section-full_width.sits-is-sticky {
	width: 100% !important;
	left: 0 !important;
}
