/**
 * Secondary header (black bar): horizontal layout, flyouts below triggers.
 * Loaded late in wp_head so it wins over bundled reference CSS + Max Mega Menu defaults.
 *
 * @see airband_output_secondary_header_nav_css_last in functions.php
 */

@media (min-width: 1200px) {
	/*
	 * Top-level dropdown panels only — direct-child > keeps nested column menus working.
	 */
	#mega-menu-wrap-secondary-nav #mega-menu-secondary-nav > li > ul.mega-sub-menu {
		visibility: hidden !important;
		opacity: 0 !important;
		pointer-events: none !important;
	}

	#mega-menu-wrap-secondary-nav #mega-menu-secondary-nav > li.mega-toggle-on > ul.mega-sub-menu,
	#mega-menu-wrap-secondary-nav #mega-menu-secondary-nav > li:hover > ul.mega-sub-menu {
		visibility: visible !important;
		opacity: 1 !important;
		pointer-events: auto !important;
	}

	#mega-menu-wrap-secondary-nav #mega-menu-secondary-nav .mega-sub-menu > li:hover > ul.mega-sub-menu,
	#mega-menu-wrap-secondary-nav #mega-menu-secondary-nav .mega-sub-menu > li.mega-toggle-on > ul.mega-sub-menu {
		visibility: visible !important;
		opacity: 1 !important;
		pointer-events: auto !important;
	}

	#mega-menu-wrap-secondary-nav #mega-menu-secondary-nav.mega-no-js > li > ul.mega-sub-menu {
		visibility: hidden !important;
		opacity: 0 !important;
		pointer-events: none !important;
	}

	#mega-menu-wrap-secondary-nav #mega-menu-secondary-nav.mega-no-js > li.mega-toggle-on > ul.mega-sub-menu,
	#mega-menu-wrap-secondary-nav #mega-menu-secondary-nav.mega-no-js > li:hover > ul.mega-sub-menu {
		visibility: visible !important;
		opacity: 1 !important;
		pointer-events: auto !important;
	}

	/*
	 * Hang panels below the bar — overrides plugin “bottom” alignment / mega-align-* so nothing sits on top of the trigger.
	 */
	#mega-menu-wrap-secondary-nav #mega-menu-secondary-nav > li > ul.mega-sub-menu,
	#mega-menu-wrap-secondary-nav #mega-menu-secondary-nav > li.mega-menu-flyout > ul.mega-sub-menu,
	#mega-menu-wrap-secondary-nav #mega-menu-secondary-nav > li.mega-align-bottom-left > ul.mega-sub-menu {
		top: 100% !important;
		bottom: auto !important;
		margin-top: 0 !important;
		transform: none !important;
		left: 0 !important;
		right: auto !important;
	}

	/* Left: Residential/Business | Right: Locations… + Trustpilot */
	.site-header .secondary-header .secondary-header__nav {
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: wrap !important;
		justify-content: space-between !important;
		align-items: center !important;
		width: 100%;
		gap: 0.5rem 1rem;
		min-height: 44px;
	}

	.site-header .secondary-header .menu-top-nav-business-type-container,
	.site-header .secondary-header nav.menu-top-nav-business-type-container {
		flex: 0 0 auto !important;
	}

	.site-header .secondary-header .secondary-header__right {
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		align-items: center !important;
		justify-content: flex-end !important;
		flex: 0 1 auto !important;
		min-width: 0 !important;
		gap: 20px !important;
	}

	#mega-menu-wrap-secondary-nav .mega-menu-toggle {
		display: none !important;
	}

	#mega-menu-wrap-secondary-nav #mega-menu-secondary-nav.mega-menu-horizontal,
	#mega-menu-wrap-secondary-nav > ul#mega-menu-secondary-nav {
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		align-items: center !important;
		justify-content: flex-end !important;
		width: auto !important;
		margin: 0 !important;
		padding: 0 !important;
		list-style: none !important;
	}

	#mega-menu-wrap-secondary-nav #mega-menu-secondary-nav.mega-menu-horizontal > li.mega-menu-item,
	#mega-menu-wrap-secondary-nav > ul#mega-menu-secondary-nav > li.mega-menu-item,
	#mega-menu-wrap-secondary-nav #mega-menu-secondary-nav > li {
		display: inline-flex !important;
		flex: 0 0 auto !important;
		float: none !important;
		vertical-align: middle !important;
		position: relative !important;
	}

	/*
	 * Plain wp_nav_menu fallback (bare ul.menu) or hybrid markup — plugin targets .mega-sub-menu.
	 */
	.site-header .secondary-header .secondary-header__right > ul.menu[id^="menu-"],
	.site-header .secondary-header .secondary-header__right > ul.menu {
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		align-items: center !important;
		justify-content: flex-end !important;
		list-style: none !important;
		margin: 0 !important;
		padding: 0 !important;
		width: auto !important;
		max-width: 100% !important;
	}

	.site-header .secondary-header .secondary-header__right > ul.menu > li,
	.site-header .secondary-header .secondary-header__right > ul.menu > li.mega-menu-item,
	.site-header .secondary-header .secondary-header__right > ul.menu > li.mega-menu-flyout {
		float: none !important;
		clear: none !important;
		position: relative !important;
		display: inline-flex !important;
		align-items: center !important;
		flex: 0 0 auto !important;
		list-style: none !important;
	}

	.site-header .secondary-header .secondary-header__right > ul.menu > li > ul.sub-menu,
	.site-header .secondary-header .secondary-header__right > ul.menu > li > ul.mega-sub-menu,
	.site-header .secondary-header .secondary-header__right > ul.menu > li > ul.sub-menu.mega-sub-menu,
	.site-header .secondary-header .secondary-header__right > ul.menu > li.mega-menu-flyout > ul.mega-sub-menu {
		display: none !important;
		visibility: hidden !important;
		opacity: 0 !important;
		pointer-events: none !important;
		position: absolute !important;
		top: 100% !important;
		bottom: auto !important;
		left: 0 !important;
		right: auto !important;
		margin-top: 0 !important;
		transform: none !important;
		min-width: 14rem !important;
		z-index: 10001 !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		float: none !important;
		height: auto !important;
		max-height: none !important;
	}

	.site-header .secondary-header .secondary-header__right > ul.menu > li:hover > ul.sub-menu,
	.site-header .secondary-header .secondary-header__right > ul.menu > li:hover > ul.mega-sub-menu,
	.site-header .secondary-header .secondary-header__right > ul.menu > li:focus-within > ul.sub-menu,
	.site-header .secondary-header .secondary-header__right > ul.menu > li.mega-toggle-on > ul.sub-menu {
		display: block !important;
		visibility: visible !important;
		opacity: 1 !important;
		pointer-events: auto !important;
	}

	.site-header .secondary-header {
		overflow: visible !important;
	}
}
