/* WidgetVisuaLab Sticky & Shrink Header Styles */
:root {
	--wv-shrink-duration: 320ms;
	--wv-shrink-easing: cubic-bezier(0.16, 1, 0.3, 1);
}

/* Base Header Section/Container when Shrink mode is enabled */
.wv-sticky-shrink-active,
.wv-sticky-shrink-yes {
	transition: background-color var(--wv-shrink-duration) var(--wv-shrink-easing),
	            box-shadow var(--wv-shrink-duration) var(--wv-shrink-easing),
	            padding var(--wv-shrink-duration) var(--wv-shrink-easing);
	box-sizing: border-box;
}

/* Shrunk / Sticky state applied on scroll past threshold */
.wv-header-shrunk {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	width: 100% !important;
	z-index: 9999 !important;
	height: var(--wv-shrink-compact-height, auto) !important;
	min-height: var(--wv-shrink-compact-height, 0) !important;
	background-color: var(--wv-shrink-compact-bg, inherit) !important;
	box-shadow: var(--wv-shrink-compact-shadow, none) !important;
}

/* Admin bar fallback offsets */
body.admin-bar .wv-header-shrunk {
	top: 32px !important;
}

@media screen and (max-width: 782px) {
	body.admin-bar .wv-header-shrunk {
		top: 46px !important;
	}
}

/* Universal Widget Scaling (visual + layout box contraction across all widget types) */
html body .wv-shrink-element-scale img,
html body [data-wv-shrink-scale] img,
html body .wv-has-shrink-scale-yes img,
html body .wv-shrink-element-scale svg,
html body [data-wv-shrink-scale] svg {
	max-width: 100% !important;
	height: auto !important;
}

html body .wv-header-shrunk .wv-shrink-element-scale,
html body [data-wv-shrunk="1"] .wv-shrink-element-scale,
html body .wv-header-shrunk [data-wv-shrink-scale],
html body [data-wv-shrunk="1"] [data-wv-shrink-scale],
html body .wv-header-shrunk .wv-has-shrink-scale-yes,
html body [data-wv-shrunk="1"] .wv-has-shrink-scale-yes {
	transform: scale(var(--wv-shrink-scale-val, 0.75)) !important;
	transform-origin: var(--wv-shrink-origin, left center) !important;
	transition: transform var(--wv-shrink-transition-duration, var(--wv-shrink-duration)) var(--wv-shrink-easing, cubic-bezier(0.16, 1, 0.3, 1)) !important;
}

/* Hide secondary elements on scroll */
html body .wv-header-shrunk .wv-shrink-element-hide,
html body [data-wv-shrunk="1"] .wv-shrink-element-hide,
html body .wv-header-shrunk [data-wv-shrink-hide="yes"],
html body [data-wv-shrunk="1"] [data-wv-shrink-hide="yes"],
html body .wv-header-shrunk .wv-shrink-hide-yes,
html body [data-wv-shrunk="1"] .wv-shrink-hide-yes {
	opacity: 0 !important;
	visibility: hidden !important;
	max-height: 0 !important;
	pointer-events: none !important;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	overflow: hidden !important;
	transition: opacity var(--wv-shrink-transition-duration, var(--wv-shrink-duration)) var(--wv-shrink-easing),
	            visibility var(--wv-shrink-transition-duration, var(--wv-shrink-duration)) var(--wv-shrink-easing),
	            max-height var(--wv-shrink-transition-duration, var(--wv-shrink-duration)) var(--wv-shrink-easing) !important;
}

/* Show elements ONLY on scroll (hidden by default on frontend, revealed on scroll) */
html body:not(.elementor-editor-active):not(.wv-scrolled) .wv-shrink-show-yes,
html body:not(.elementor-editor-active):not(.wv-scrolled) [data-wv-shrink-show="yes"],
html body:not(.elementor-editor-active) .wv-sticky-shrink-active:not(.wv-header-shrunk) .wv-shrink-show-yes,
html body:not(.elementor-editor-active) .wv-sticky-shrink-yes:not(.wv-header-shrunk) .wv-shrink-show-yes,
html body:not(.elementor-editor-active) .elementor-widget.wv-shrink-show-yes:not(.wv-header-shrunk .elementor-widget) {
	opacity: 0 !important;
	visibility: hidden !important;
	max-height: 0 !important;
	pointer-events: none !important;
	overflow: hidden !important;
	transition: opacity var(--wv-shrink-transition-duration, var(--wv-shrink-duration)) var(--wv-shrink-easing, cubic-bezier(0.16, 1, 0.3, 1)),
	            transform var(--wv-shrink-transition-duration, var(--wv-shrink-duration)) var(--wv-shrink-easing, cubic-bezier(0.16, 1, 0.3, 1)),
	            visibility var(--wv-shrink-transition-duration, var(--wv-shrink-duration)) var(--wv-shrink-easing, cubic-bezier(0.16, 1, 0.3, 1)),
	            max-height var(--wv-shrink-transition-duration, var(--wv-shrink-duration)) var(--wv-shrink-easing, cubic-bezier(0.16, 1, 0.3, 1)) !important;
}

/* In Elementor Editor, display scroll-only elements semi-transparently with dashed outline so they remain directly clickable & editable */
.elementor-editor-active .wv-shrink-show-yes,
.elementor-editor-active [data-wv-shrink-show="yes"],
body.elementor-editor-active .wv-shrink-show-yes,
body.elementor-editor-active [data-wv-shrink-show="yes"] {
	opacity: 0.65 !important;
	visibility: visible !important;
	max-height: none !important;
	pointer-events: auto !important;
	transform: scale(1) translateY(0) !important;
	outline: 2px dashed #3b82f6 !important;
	outline-offset: -2px !important;
}

html body:not(.elementor-editor-active):not(.wv-scrolled) .wv-shrink-show-yes[data-wv-shrink-show-effect="scale"],
html body:not(.elementor-editor-active) .wv-sticky-shrink-active:not(.wv-header-shrunk) .wv-shrink-show-yes[data-wv-shrink-show-effect="scale"],
html body:not(.elementor-editor-active) .wv-sticky-shrink-yes:not(.wv-header-shrunk) .wv-shrink-show-yes[data-wv-shrink-show-effect="scale"] {
	transform: scale(0) !important;
}

html body:not(.elementor-editor-active):not(.wv-scrolled) .wv-shrink-show-yes[data-wv-shrink-show-effect="slide_up"],
html body:not(.elementor-editor-active) .wv-sticky-shrink-active:not(.wv-header-shrunk) .wv-shrink-show-yes[data-wv-shrink-show-effect="slide_up"],
html body:not(.elementor-editor-active) .wv-sticky-shrink-yes:not(.wv-header-shrunk) .wv-shrink-show-yes[data-wv-shrink-show-effect="slide_up"] {
	transform: translateY(30px) !important;
}

html body:not(.elementor-editor-active):not(.wv-scrolled) .wv-shrink-show-yes[data-wv-shrink-show-effect="slide_down"],
html body:not(.elementor-editor-active) .wv-sticky-shrink-active:not(.wv-header-shrunk) .wv-shrink-show-yes[data-wv-shrink-show-effect="slide_down"],
html body:not(.elementor-editor-active) .wv-sticky-shrink-yes:not(.wv-header-shrunk) .wv-shrink-show-yes[data-wv-shrink-show-effect="slide_down"] {
	transform: translateY(-30px) !important;
}

html body .wv-header-shrunk .wv-shrink-show-yes,
html body [data-wv-shrunk="1"] .wv-shrink-show-yes,
html body .wv-header-shrunk [data-wv-shrink-show="yes"],
html body [data-wv-shrunk="1"] [data-wv-shrink-show="yes"] {
	opacity: 1 !important;
	transform: scale(1) translateY(0) !important;
	visibility: visible !important;
	max-height: 1000px !important;
	pointer-events: auto !important;
	transition: opacity var(--wv-shrink-transition-duration, var(--wv-shrink-duration)) var(--wv-shrink-easing, cubic-bezier(0.16, 1, 0.3, 1)),
	            transform var(--wv-shrink-transition-duration, var(--wv-shrink-duration)) var(--wv-shrink-easing, cubic-bezier(0.16, 1, 0.3, 1)),
	            visibility var(--wv-shrink-transition-duration, var(--wv-shrink-duration)) var(--wv-shrink-easing, cubic-bezier(0.16, 1, 0.3, 1)),
	            max-height var(--wv-shrink-transition-duration, var(--wv-shrink-duration)) var(--wv-shrink-easing, cubic-bezier(0.16, 1, 0.3, 1)) !important;
}

/* Hide Effects */
html body .wv-header-shrunk .wv-shrink-hide-yes[data-wv-shrink-hide-effect="scale"],
html body [data-wv-shrunk="1"] .wv-shrink-hide-yes[data-wv-shrink-hide-effect="scale"] {
	transform: scale(0) !important;
}

html body .wv-header-shrunk .wv-shrink-hide-yes[data-wv-shrink-hide-effect="slide_up"],
html body [data-wv-shrunk="1"] .wv-shrink-hide-yes[data-wv-shrink-hide-effect="slide_up"] {
	transform: translateY(-30px) !important;
}

html body .wv-header-shrunk .wv-shrink-hide-yes[data-wv-shrink-hide-effect="slide_down"],
html body [data-wv-shrunk="1"] .wv-shrink-hide-yes[data-wv-shrink-hide-effect="slide_down"] {
	transform: translateY(30px) !important;
}

/* Text / Typography size reduction on scroll */
html body .wv-header-shrunk .wv-shrink-element-font,
html body [data-wv-shrunk="1"] .wv-shrink-element-font,
html body .wv-header-shrunk [data-wv-shrink-font-size],
html body [data-wv-shrunk="1"] [data-wv-shrink-font-size] {
	font-size: var(--wv-shrink-font-val) !important;
	transition: font-size var(--wv-shrink-transition-duration, var(--wv-shrink-duration)) var(--wv-shrink-easing, cubic-bezier(0.16, 1, 0.3, 1)) !important;
}

/* Ensure smooth element transitions in normal state (both ways) */
.wv-shrink-element-scale,
.wv-shrink-element-hide,
.wv-shrink-show-yes,
.wv-shrink-hide-yes,
.wv-has-shrink-scale-yes,
.wv-shrink-element-font {
	transform-origin: var(--wv-shrink-origin, left center) !important;
	transition: zoom var(--wv-shrink-transition-duration, var(--wv-shrink-duration)) var(--wv-shrink-easing, cubic-bezier(0.16, 1, 0.3, 1)),
	            transform var(--wv-shrink-transition-duration, var(--wv-shrink-duration)) var(--wv-shrink-easing, cubic-bezier(0.16, 1, 0.3, 1)),
	            opacity var(--wv-shrink-transition-duration, var(--wv-shrink-duration)) var(--wv-shrink-easing, cubic-bezier(0.16, 1, 0.3, 1)),
	            max-height var(--wv-shrink-transition-duration, var(--wv-shrink-duration)) var(--wv-shrink-easing, cubic-bezier(0.16, 1, 0.3, 1)),
	            font-size var(--wv-shrink-transition-duration, var(--wv-shrink-duration)) var(--wv-shrink-easing, cubic-bezier(0.16, 1, 0.3, 1)) !important;
}