/*
 * Sticky navbar for FamousTube theme.
 *
 * The whole top bar (#wrapper-navbar) is permanently `position: fixed`
 * at the top of the viewport (or under the admin bar). The page body
 * is given an equivalent `margin-top` on first load so that the rest of
 * the content does not slide under the navbar and no black/empty band
 * appears at the top.
 *
 *  @package wpst
 */

html.wpst-sticky-navbar-ready {
	scroll-behavior: smooth;
}

/* Always-fixed navbar layout */
#wrapper-navbar.wpst-sticky-navbar {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 1030;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
	transition: box-shadow 200ms ease-in-out;
}

body.admin-bar #wrapper-navbar.wpst-sticky-navbar {
	top: 32px;
}

@media screen and (max-width: 782px) {
	body.admin-bar #wrapper-navbar.wpst-sticky-navbar {
		top: 46px;
	}
}

/* The body needs to be shifted down by the navbar height so that the
   content does not slide under the floating bar. The JS measures the
   real height and applies it. */
body.wpst-sticky-navbar-pushed {
	margin-top: var(--wpst-navbar-height, 0px);
}
