/* Panacca theme: additions on top of the real Tailwind build (main.css,
   compiled via `npm run build:css` from src.css) for things that are ours,
   not Tailwind utilities: WP admin-bar offsets for our `position:fixed`
   elements. (sr-only/focus:not-sr-only etc. now come from Tailwind itself.) */

body.admin-bar header {
	top: 32px;
}

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

	/* The full-screen mobile menu dialog is its own `inset-0` fixed element
	   (not a child of <header> visually), so it needs the same offset the
	   header gets, shrinking from the top instead of the bottom. */
	body.admin-bar #panacca-mobile-menu:not([hidden]) {
		top: 46px;
	}
}

/* The mega-menu dropdown is a separate `position:fixed` element (not just
   `absolute` under <header>), so it needs its own admin-bar offset on top of
   its base 58px — it doesn't inherit the header's `top` shift above. Only
   needed at the lg+ breakpoint where the mega-menu can actually open (WP's
   admin bar is also fixed only from 783px up; below that it's static and
   the header offset above already stops applying). */
@media screen and (min-width: 783px) {
	body.admin-bar .panacca-mega-menu {
		top: calc(58px + 32px);
	}
}