/* ---------------------------------------------------------
 * _local-overrides.css
 * Patches for issues only visible in static (file://) build.
 *
 * Mobile header is rebuilt in _mobile-fixes.js (much more reliable
 * than trying to override the frozen Elementor inline styles with
 * CSS alone). This file only contains:
 *   - Desktop menu arrow de-duplication
 *   - Image/body safety rules
 *   - Universal swiper reset on mobile
 * --------------------------------------------------------- */

/* ==========================================================
 * Desktop nav dropdown — pure CSS hover fallback
 * SmartMenus JS may not re-init properly on the saved DOM,
 * so we ensure submenus always show on hover via CSS alone.
 * ========================================================== */
/* Unified nav arrow — always visible, regardless of page-specific CSS */
.mfix-nav-arrow {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: inherit !important;
    margin-left: 6px !important;
    font-size: .78em !important;
    line-height: 1 !important;
    vertical-align: middle !important;
}
/* In nested submenu, rotate arrow to point right (matching original Elementor behavior) */
.elementor-nav-menu--dropdown .mfix-nav-arrow {
    transform: rotate(-90deg);
    margin-left: auto;
    float: right;
    margin-top: 4px;
}

@media (min-width: 1025px) {
    .elementor-nav-menu--main .menu-item-has-children,
    .elementor-nav-menu--main li.menu-item.has-children {
        position: relative;
    }
    .elementor-nav-menu--main li:hover > ul.sub-menu,
    .elementor-nav-menu--main li:hover > ul.elementor-nav-menu--dropdown,
    .elementor-nav-menu--main li.menu-item-has-children:hover > ul,
    .elementor-nav-menu li.has-children:hover > ul,
    .elementor-nav-menu--main li.highlighted > ul,
    .elementor-nav-menu--main a:focus + ul {
        display: block !important;
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        min-width: 220px !important;
        background: #fff !important;
        box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12) !important;
        border-radius: 4px !important;
        padding: 6px 0 !important;
        z-index: 999 !important;
        list-style: none !important;
        margin: 0 !important;
    }
    /* 二级菜单的子菜单 (3rd level) — flyout to the right */
    .elementor-nav-menu--main li:hover > ul li:hover > ul {
        position: absolute !important;
        top: 0 !important;
        left: 100% !important;
        margin-left: 2px !important;
    }
    /* 子菜单链接 padding */
    .elementor-nav-menu--main ul.sub-menu li a,
    .elementor-nav-menu--main ul.elementor-nav-menu--dropdown li a {
        display: block !important;
        padding: 10px 18px !important;
        font-size: 14px !important;
        color: #333 !important;
        text-decoration: none !important;
        white-space: nowrap !important;
    }
    .elementor-nav-menu--main ul.sub-menu li a:hover,
    .elementor-nav-menu--main ul.elementor-nav-menu--dropdown li a:hover {
        background: #f0f4f8 !important;
        color: #0054a6 !important;
    }
}

/* Hide duplicate .sub-arrow siblings (smartmenus re-init) */
.elementor-nav-menu a > .sub-arrow ~ .sub-arrow,
.elementor-nav-menu li > a .sub-arrow + .sub-arrow {
    display: none !important;
}

/* When elementor renders an inline SVG icon next to the original <i>,
   hide the original Font Awesome <i> tag so only the SVG shows. */
.sub-arrow > svg + i,
.sub-arrow > i + svg,
.sub-arrow > svg ~ i {
    display: none !important;
}

/* Language switcher duplicate-caret fix */
.trp-language-switcher .sub-arrow ~ .sub-arrow {
    display: none !important;
}

/* Hide empty reCAPTCHA placeholders (neutered to about:blank) */
iframe[src="about:blank"][title="reCAPTCHA"] {
    display: none !important;
}

/* Hide the empty Elementor Slides widget on contact-us page.
   Chrome saved it without any slide content (background images lost),
   so it renders as an invisible blank box with stray pagination dots. */
.elementor-element-852df53 {
    display: none !important;
}

/* Hide reCAPTCHA v3 badge and all its container wrappers.
   Chrome saved DOM residue has invisible containers that still occupy
   layout space on mobile as a phantom white rectangle. */
.elementor-field-type-recaptcha_v3,
.elementor-g-recaptcha,
.grecaptcha-badge,
.grecaptcha-logo,
.grecaptcha-error {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    left: -9999px !important;
}

/* Kill any iframe-with-about:blank anywhere — they're residue from
   Chrome's live page save and never produce meaningful output */
iframe[src="about:blank"] {
    display: none !important;
}

/* =========================================================
 * Universal safety (all viewports)
 * ========================================================= */

html, body {
    max-width: 100%;
    overflow-x: hidden;
}
img {
    max-width: 100%;
    height: auto;
}

/* =========================================================
 * Mobile / tablet viewports: the static page has no usable
 * mobile header — _mobile-fixes.js builds one. We just make
 * sure swiper carousels don't break the layout.
 * ========================================================= */
@media (max-width: 1024px) {
    /* Nuclear swiper reset - kills frozen desktop inline translate/width */
    .swiper-wrapper,
    .elementor-image-carousel.swiper-wrapper {
        transform: none !important;
        width: 100% !important;
        display: block !important;
    }
    .swiper-slide {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
    }
    .swiper-slide img {
        width: 100% !important;
        height: auto !important;
    }
    /* Wipe desktop's hardcoded pixel widths */
    [style*="width: 2677px"],
    [style*="width:2677px"],
    [style*="width: 1920px"],
    [style*="width:1920px"],
    [style*="width: 1600px"] {
        width: 100% !important;
    }
    /* The big negative translate3d values */
    .swiper-wrapper[style*="translate3d"] {
        transform: none !important;
    }

    /* Content breathing room */
    .e-con, .elementor-container {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
    h1, h2, h3, h4 {
        word-break: break-word;
    }
}

/* =========================================================
 * Mobile-specific <=767px
 * ========================================================= */
@media (max-width: 767px) {
    /* Hide the original buried header - JS will also set display:none
       but CSS as a safety belt */
    body > .elementor-location-header,
    .elementor-location-header {
        /* JS sets display:none when it runs. If JS fails for any reason,
           we at least keep the page usable: */
    }

    /* Ensure our injected mobile header has room */
    #mfix-mobile-header {
        display: block !important;
    }

    /* Nav arrows inside elementor swiper buttons - recolor */
    .elementor-swiper-button i {
        color: #0054a6 !important;
    }
}
