/* ───────────────────────────────────────
   Elementor Mega Menu – Frontend Styles
   ─────────────────────────────────────── */

/* Parent <li> must be static so the container
   isn't constrained by it */
.emm-has-mega-menu {
    position: static !important;
}

.emm-has-mega-menu > a {
    cursor: pointer;
}

/* ── The mega-menu wrapper ──
   Positioned by JS to sit directly below the header/nav
   and span the full viewport width.                       */
.emm-mega-menu-container {
    position: fixed;
    left: 0;
    right: 0;
    width: 100vw;
    z-index: 99999;
    box-sizing: border-box;

    /* Hidden by default */
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-6px);

    transition: opacity 0.25s ease,
                transform 0.25s ease,
                visibility 0.25s;
}

/* ── Show on hover ── */
.emm-has-mega-menu:hover > .emm-mega-menu-container,
.emm-has-mega-menu.emm-mega-open > .emm-mega-menu-container {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

/* ── Inner wrapper ──
   Solid background so page content doesn't bleed through.
   Matches the apps.sincecode.com panel look.              */
.emm-mega-menu-inner {
    background: #f0fafa; /* light teal tint — adjust to match your theme */
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.10);
    border-radius: 0 0 12px 12px;
    overflow: hidden;
    max-width: 100%;
    margin: 0 auto;
}

/* Let Elementor sections breathe inside */
.emm-mega-menu-inner > .elementor {
    width: 100%;
}

/* Boxed sections get a sensible max-width */
.emm-mega-menu-inner .elementor-section.elementor-section-boxed > .elementor-container {
    max-width: 1400px;
    margin: 0 auto;
}

/* Full-width sections fill the panel */
.emm-mega-menu-inner .elementor-section.elementor-section-full_width > .elementor-container {
    max-width: 100%;
}

/* ── Hide native WP sub-menus on mega items ── */
.emm-has-mega-menu > .sub-menu {
    display: none !important;
}

/* ── Responsive ── */
@media (max-width: 1024px) {
    .emm-mega-menu-container {
        position: relative !important;
        top: auto !important;
        left: auto;
        right: auto;
        width: 100%;
        transform: none;
        visibility: hidden;
        opacity: 0;
        max-height: 0;
        overflow: hidden;
        transition: opacity 0.3s ease, max-height 0.35s ease, visibility 0.3s;
    }

    .emm-has-mega-menu.emm-mega-open > .emm-mega-menu-container {
        visibility: visible;
        opacity: 1;
        max-height: 3000px;
    }

    /* Disable hover-open on touch */
    .emm-has-mega-menu:hover > .emm-mega-menu-container {
        visibility: hidden;
        opacity: 0;
    }
    .emm-has-mega-menu.emm-mega-open > .emm-mega-menu-container {
        visibility: visible !important;
        opacity: 1 !important;
    }

    .emm-mega-menu-inner {
        border-radius: 0;
    }
}