/*
 * WordPress integration fixes for the ported header.
 *
 * The header CSS came across verbatim from the Avada child theme, which means it
 * still carries three assumptions that are no longer true. Rather than edit the
 * ported file — it is deliberately byte-identical to its origin — the corrections
 * live here, each with the reason it exists.
 *
 * @package Fixfactor
 */

/* =============================================================================
   1. ADMIN BAR STACKING
   .fixfactor-header sits at z-index 999999. The WordPress admin bar sits at
   99999 — four digits shorter. So the header renders above the admin bar, and
   the bar's drop-down submenus open into that space and disappear behind it.
   That is the "submenus do not show" bug.
   The admin bar is chrome and belongs on top of everything the site draws.
   ========================================================================== */

#wpadminbar {
	z-index: 1000000;
}

/* =============================================================================
   2. FIXED HEADER vs ADMIN BAR
   Below 767px the header becomes position: fixed; top: 0. A fixed element is
   positioned against the viewport, so the `html { margin-top }` WordPress adds
   for the admin bar does not move it — the header slides underneath the bar.
   WordPress uses 46px for the bar below 783px and 32px above it.
   ========================================================================== */

@media screen and (max-width: 767px) {
	body.admin-bar .fixfactor-header {
		top: 46px;
	}
}

/*
 * NO desktop rule here, deliberately.
 *
 * Above 767px the header is position: relative, and `top` on a relative element
 * offsets it visually without freeing the space it occupied — which produced a
 * 32px band of white above the header for logged-in users. The offset is only
 * ever needed while the header is actually fixed, which is below 767px.
 */

/* =============================================================================
   3. CONTENT OFFSET UNDER THE FIXED HEADER
   The original rule was `#wrapper { padding-top: 70px }`. #wrapper was an Avada
   element and no longer exists, so on mobile the fixed header overlapped the top
   of every page with nothing reserving space for it.
   ========================================================================== */

@media screen and (max-width: 767px) {
	body {
		padding-top: 70px;
	}
}