/**
 * Orion Header & Footer – Elementor compatibility overrides
 * Styles not covered by Tailwind utilities or requiring Elementor scoping.
 *
 * @package Orion_Construction
 */

/* Elementor Orion Main Header – ensure widget CSS can override Tailwind utilities */
.elementor-widget-orion-main-header .elementor-widget-container {
    width: 100%;
}

.elementor-location-header .orion-html-header,
.elementor-location-footer .orion-html-footer {
    width: 100%;
}

.elementor-location-header .elementor-section-wrap > .elementor-section,
.elementor-location-header .e-con {
    --padding-top: 0;
    --padding-bottom: 0;
}

/* --------------------------------------------------------------------------
   Sticky header helper (JS adds .sticky-header)
   -------------------------------------------------------------------------- */
.orion-html-header .header.orion-sticky-enabled.sticky-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
}

body.admin-bar .orion-html-header .header.orion-sticky-enabled.sticky-header {
    top: 32px;
}

@media (max-width: 782px) {
    body.admin-bar .orion-html-header .header.orion-sticky-enabled.sticky-header {
        top: 46px;
    }
}

/* Menu link colours (default / hover / sticky / dropdown-open) are set
   per header template through the widget's own Elementor controls —
   menu_color, menu_hover_color, sticky_menu_color and
   menu_color_dropdown_open — so they stay editable in the builder.
   The sticky/dropdown-open black fallbacks live in
   orion-main-header-custom.css alongside the rest of the ported design. */

/* --------------------------------------------------------------------------
   Mobile nav panel – full-viewport drawer below the header bar
   (HTML: .mobile-nav is absolute top-full so logo + toggle stay visible.
    Covering top:0 at z-70 hid the entire style-3 header.)
   -------------------------------------------------------------------------- */
@media (max-width: 991px) {
	.orion-html-header .header.dropdown-open,
	.orion-html-header .header.orion-sticky-enabled.dropdown-open {
		z-index: 80;
	}

	/* Keep the pill (logo + close toggle) above the sliding drawer. */
	.orion-html-header .header.dropdown-open .oh3__inner-nav,
	.orion-html-header .header.dropdown-open .header-3,
	.orion-html-header .header.dropdown-open .oh3__logo-wrap,
	.orion-html-header .header.dropdown-open .mobile-toggle {
		position: relative;
		z-index: 81;
	}

	.orion-html-header .mobile-nav.open,
	.orion-html-header #navbar-default.open {
		position: fixed !important;
		/* JS openMobileMenu() sets --orion-mobile-nav-top from measured header bottom.
		   Hardcoded 87px !important caused a gap when the header is shorter (e.g. 52px). */
		top: var(--orion-mobile-nav-top, 52px) !important;
		left: 0 !important;
		right: 0 !important;
		width: 100vw !important;
		max-width: 100vw !important;
		height: calc(100vh - var(--orion-mobile-nav-top, 52px)) !important;
		margin: 0 !important;
		border-radius: 0 !important;
		z-index: 70;
		overflow-x: hidden;
		overflow-y: auto;
		background-color: #fff;
	}

	.orion-html-header .mobile-nav.open .navbar,
	.orion-html-header #navbar-default.open .navbar,
	.orion-html-header #navbar-default.open.oh3__menu {
		width: 100%;
		max-width: 100%;
		border-radius: 0;
		background-color: #fff;
	}
}

.orion-html-header .mobile-nav.open {
    z-index: 70;
}

/* Desktop open state — HTML .dropdown-menu.open uses overflow-visible so
   mega panels and Pages nested flyouts are not clipped after sticky/fixed. */
@media (min-width: 992px) {
	.orion-html-header .dropdown-menu.open {
		visibility: visible;
		opacity: 1;
		max-height: none;
		overflow: visible;
		pointer-events: auto;
	}
	/* Rounded mega panels keep overflow:hidden for corner clipping; Pages
	   override is handled via .oh3__pages-dropdown / .pages rules. */
	.orion-html-header .dropdown-menu.open.oh3__dropdown-round {
		overflow: hidden;
	}
	/* Sticky style-3 bar is square + full-bleed — drop radius clip. */
	.orion-html-header .header.sticky-header .dropdown-menu.open.oh3__dropdown-round {
		overflow: visible;
		border-radius: 0;
	}
}

.orion-html-header #pageOverlay:not(.hidden) {
    z-index: 40;
}

/* --------------------------------------------------------------------------
   Footer Tailwind renderer inside theme / Elementor
   -------------------------------------------------------------------------- */
.orion-tailwind-footer,
.elementor-footer .orion-html-footer {
    width: 100%;
}

.orion-html-footer footer {
    width: 100%;
}

.orion-html-header #searchIcon,
.orion-html-header .orion-search-submit svg {
    flex-shrink: 0;
}

.orion-html-header .orion-search-submit {
    background: transparent;
    border: 0;
    padding: 0;
    cursor: pointer;
    line-height: 24px;
    flex-shrink: 0;
}

/* --------------------------------------------------------------------------
   Search panel – match orion-2 HTML layout & animation hooks
   -------------------------------------------------------------------------- */
.orion-html-header #searchPanel {
    width: 100%;
}

.orion-html-header #searchBox {
    transition: all 0.3s ease-in-out;
}

.orion-html-header #searchCloseInside,
.orion-html-header #closeSearch {
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.orion-html-header #searchCloseInside.opacity-100,
.orion-html-header #closeSearch.opacity-100 {
    opacity: 1;
    pointer-events: auto;
}

.orion-html-header #searchSuggestions.search-suggestions-panel {
    z-index: 55;
}

.orion-html-header .header-three #searchPanel {
    margin-top: 0.75rem;
    border-top-left-radius: 9999px;
    border-top-right-radius: 9999px;
}

@media (min-width: 1024px) {
    .orion-html-header .header-three #searchPanel {
        margin-top: 0;
        border-top-left-radius: 9999px;
        border-top-right-radius: 9999px;
    }
}

.orion-html-header .header-three.sticky-header #searchPanel,
.orion-html-header .header-three.sticky-header .searchBox {
    border-radius: 0;
    margin-top: 0;
}

/* --------------------------------------------------------------------------
   Search form – WordPress search input reset inside Tailwind panel
   -------------------------------------------------------------------------- */
.orion-html-header #searchBox form[role="search"] {
    margin: 0;
}

.orion-html-header #searchBox input[type="search"] {
    border: 0;
    background: transparent;
    box-shadow: none;
    outline: none !important;
}

/* --------------------------------------------------------------------------
   Accessibility – focus visible for keyboard navigation
   -------------------------------------------------------------------------- */
.orion-html-header .nav-tab:focus-visible,
.orion-html-header .nav-tab-2:focus-visible,
.orion-html-header .mobile-toggle:focus-visible,
.orion-html-header #searchButton:focus-visible {
    outline: 2px solid var(--orion-primary);
    outline-offset: 2px;
}

/* --------------------------------------------------------------------------
   Performance – lazy-loaded images in mega menu
   -------------------------------------------------------------------------- */
.orion-html-header .dropdown-menu img[loading="lazy"] {
    content-visibility: auto;
}

/* --------------------------------------------------------------------------
   Preloader – Elementor → Site Settings → Preloader (background color,
   animation, custom image) and Customize → Preloader (GIF fallback);
   see includes/integrations/elementor-preloader-settings.php and header.php.
   .preloader-inner is a fixed 100x100px box (orion-tailwind.css).
   -------------------------------------------------------------------------- */
.preloader {
    background-color: var(--orion-preloader-bg, #fff);
}

.orion-preloader-icon {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
}

/* !important: the compiled Tailwind bundle's `.preloader-inner svg { animation:
   ...preloader-fx }` rule (element+class) outranks a single class selector
   on specificity alone — without this, picking any animation other than
   "Rotate & Scale" for the default SVG icon would be silently ignored. */
.orion-preloader-anim-rotate-scale { animation: orion-preloader-rotate-scale 3s linear infinite !important; }
.orion-preloader-anim-fade         { animation: orion-preloader-fade 1.4s ease-in-out infinite !important; }
.orion-preloader-anim-pulse        { animation: orion-preloader-pulse 1.4s ease-in-out infinite !important; }
.orion-preloader-anim-bounce       { animation: orion-preloader-bounce 1.2s ease-in-out infinite !important; }
.orion-preloader-anim-none         { animation: none !important; }

@keyframes orion-preloader-rotate-scale {
    0%   { transform: rotate(0) scale(1); }
    100% { transform: rotate(-360deg) scale(1.5); }
}

@keyframes orion-preloader-fade {
    0%, 100% { opacity: 1; }
    50%      { opacity: 0.25; }
}

@keyframes orion-preloader-pulse {
    0%, 100% { transform: scale(1); }
    50%      { transform: scale(1.2); }
}

@keyframes orion-preloader-bounce {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-14px); }
}