/* =========================================================================
   OmniWorx global header — structural only.
   Colours, fonts, spacing and backgrounds live in the Elementor templates
   (Site Settings + element settings) so the client can edit them in Elementor.
   This file covers only what element controls cannot express cleanly:
   the Home overlay, the 8-column mega panel layout, and responsive behaviour.
   ========================================================================= */

/* ---- Home header: transparent, floating over the hero slider ------------ */
.elementor-location-header .ow-header--home {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 1000;
    /* subtle scrim so white nav stays legible over a bright hero */
    background-image: linear-gradient(180deg, rgba(6, 6, 7, 0.55), rgba(6, 6, 7, 0));
}

/* Inner-page header sits in normal flow so page content starts below it.
   (Overrides a legacy `.omniworx-site .ow-header{position:absolute}` rule from
   the OmniWorx plugin that otherwise pulls it out of flow and overlaps content.) */
.elementor-location-header .ow-header.ow-header--inner {
    position: relative !important;
}

/* ---- Logo --------------------------------------------------------------- */
.ow-header .ow-header-logo img {
    width: clamp(200px, 16vw, 284px);
    height: auto;
    display: block;
}

/* ---- Search box --------------------------------------------------------- */
.ow-header .ow-header-search .elementor-search-form__container {
    height: 38px;
    min-height: 38px;
    border: 1px solid rgba(255, 255, 255, 0.25);
    background: rgba(255, 255, 255, 0.14);
}
.ow-header--inner .ow-header-search .elementor-search-form__container {
    background: rgba(255, 255, 255, 0.07);
}
.ow-header .ow-header-search .elementor-search-form__input,
.ow-header .ow-header-search .elementor-search-form__submit,
.ow-header .ow-header-search .elementor-search-form__icon {
    color: #fff !important;
}
.ow-header .ow-header-search .elementor-search-form__input::placeholder {
    color: rgba(255, 255, 255, 0.7);
}
/* Lighter/thinner search icon: replace the heavy fa-solid glyph with a
   thin-stroke magnifier. */
.ow-header .ow-header-search .elementor-search-form__icon svg,
.ow-header .ow-header-search .elementor-search-form__icon i {
    display: none !important;
}
.ow-header .ow-header-search .elementor-search-form__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.ow-header .ow-header-search .elementor-search-form__icon::before {
    content: "";
    width: 30px;
    height: 30px;
    background: no-repeat center / contain
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
}

/* ---- Submenu (SERVICES) dropdown chevron: inline with text, white -------- */
.ow-header .ow-header-menu .e-n-menu-title {
    flex-direction: row !important;
    align-items: center !important;
}
.ow-header .ow-header-menu .e-n-menu-title .e-n-menu-title-container {
    display: inline-flex;
    align-items: center;
}
/* Dropdown chevron: hidden on desktop, shown only in the mobile (collapsed)
   menu — see the max-width: 1024px block below. */
.ow-header .ow-header-menu .e-n-menu-title .e-n-menu-dropdown-icon {
    display: none !important;
}
.ow-header .ow-header-menu .e-n-menu-title .e-n-menu-dropdown-icon svg,
.ow-header .ow-header-menu .e-n-menu-title .e-n-menu-dropdown-icon i {
    display: block;
    width: 11px;
    height: 11px;
    color: #fff !important;
    fill: #fff !important;
    /* nudge up so the chevron optically centres on the uppercase cap height */
    transform: translateY(-2px);
}

/* ---- Mega panel: 8 equal columns with hairline dividers ----------------- */
.ow-mm-grid {
    display: flex;
    flex-wrap: nowrap;
}
.ow-mm-grid > .ow-mm-cell {
    flex: 1 1 0;
    min-width: 0;
}
.ow-mm-grid > .ow-mm-cell:first-child {
    border-left: 0 !important;
}
.ow-mm-cell {
    transition: opacity 0.15s ease;
}
.ow-mm-cell:hover {
    opacity: 0.72;
}
.ow-mm-cell-icon img {
    width: auto;
    height: 48px;
    max-width: 54px;
    object-fit: contain;
}

/* Panel padding already set on the container; ensure it never sits flush left */
.ow-mm-section-title {
    padding-left: 4px;
}

/* ---- Responsive --------------------------------------------------------- */
@media (max-width: 1024px) {
    .elementor-location-header .ow-header--home {
        position: relative;
        background: #111113;
    }
    .ow-header .ow-header-search {
        display: none;
    }
    .ow-mm-grid {
        flex-wrap: wrap;
    }
    .ow-mm-grid > .ow-mm-cell {
        flex: 1 1 33.333%;
        border-left: 0 !important;
        padding: 14px !important;
    }

    /* -------- Native Mega Menu, mobile (collapsed) state -------- */
    /* Dropdown chevron: show it here (mobile only), inline with the item text. */
    .ow-header .ow-header-menu .e-n-menu-title .e-n-menu-dropdown-icon {
        position: relative !important;
        display: inline-flex !important;
        align-items: center;
        width: auto !important;
        height: auto !important;
        margin-left: 8px !important;
        color: #fff !important;
    }

    /* Hamburger toggle icon: white so it shows on the dark header bar. */
    .ow-header .ow-header-menu .e-n-menu-toggle,
    .ow-header .ow-header-menu .e-n-menu-toggle-icon,
    .ow-header .ow-header-menu .e-n-menu-toggle svg {
        color: #fff !important;
        fill: #fff !important;
    }

    /* The collapsed dropdown panel: solid dark background so items read. */
    .ow-header .ow-header-menu .e-n-menu-wrapper {
        background: #111113 !important;
        padding: 6px 0 12px !important;
    }

    /* Menu item rows: transparent row, WHITE text (was white-on-white). */
    .ow-header .ow-header-menu .e-n-menu-heading .e-n-menu-item,
    .ow-header .ow-header-menu .e-n-menu-title,
    .ow-header .ow-header-menu .e-n-menu-title-container {
        width: 100%;
        background: transparent !important;
    }
    .ow-header .ow-header-menu .e-n-menu-title-text,
    .ow-header .ow-header-menu .e-n-menu-title-text a,
    .ow-header .ow-header-menu .e-n-menu-title a {
        color: #fff !important;
        justify-content: flex-start;
        padding: 12px 22px !important;
    }
    /* Row divider + active/hover feedback. */
    .ow-header .ow-header-menu .e-n-menu-heading .e-n-menu-item {
        border-top: 1px solid rgba(255, 255, 255, 0.08);
    }
    .ow-header .ow-header-menu .e-n-menu-title:hover .e-n-menu-title-text,
    .ow-header .ow-header-menu .e-n-menu-title[aria-expanded="true"] .e-n-menu-title-text {
        background: rgba(255, 255, 255, 0.06) !important;
    }

    /* Services dropdown panel inside the collapsed menu: keep it dark. */
    .ow-header .ow-header-menu .e-n-menu-content {
        background: #0a0a0b !important;
    }
}

@media (max-width: 767px) {
    .ow-header .ow-header-logo img {
        width: 180px;
    }
    .ow-mm-grid > .ow-mm-cell {
        flex: 1 1 50%;
    }
}