/**
 * PWD Elementor Theme Pro — Sticky Header CSS
 *
 * position:fixed is applied inline by JS. These rules handle state classes,
 * transitions, and the hide-on-scroll animation. Shrink-on-scroll (JS) only
 * ever touches padding and <img> width/height — never transform — so it can
 * never distort anything inside the element or narrow its width, and it
 * never conflicts with the translateY() this file uses for hide-on-scroll.
 *
 * @package PWD_Elementor_Theme_Pro
 */

/* ── Base ──────────────────────────────────────────────────────────────────── */

[data-pwd-sticky] {
	box-sizing: border-box;
}

/* ── Active (fixed) state ──────────────────────────────────────────────────── */

.pwd-sticky-active {
	margin-top: 0    !important;
	margin-bottom: 0 !important;
}

/* ── Fixed (engaged) state — force true full viewport width ─────────────────
 * Applied whenever JS has taken the element out of flow with position:fixed
 * (immediately for "Start Transparent" overlay elements, or once scrolled
 * past the offset for normal ones). Elementor's "Boxed" content-width
 * containers constrain max-width via a CSS custom property on a rule that
 * can beat a plain inline style, so these are forced with !important to
 * guarantee the fixed bar always spans the full viewport regardless of
 * whatever Boxed/Full-Width setting the element normally uses in flow.
 * This only targets the element JS has marked as fixed, so any deliberately
 * boxed content *inside* it (e.g. a centered nav-items group) is untouched.
 */
.pwd-sticky-fixed {
	left:         0    !important;
	right:        0    !important;
	width:        100% !important;
	max-width:    100% !important;
	margin-left:  0    !important;
	margin-right: 0    !important;
}

/* ── Hide on scroll down ────────────────────────────────────────────────────── */
/*
 * The only place this stylesheet or the JS uses `transform` — shrink-on-
 * scroll (JS) only ever changes padding and <img> width/height, so there's
 * nothing for this to conflict with. !important guarantees hide always wins.
 */
.pwd-sticky-hidden {
	transform:      translateY( -110% ) !important;
	pointer-events: none;
}
