/**
 * Mega Menu Three — Elementor template layout fixes.
 * Theme .mega-menu3 is a 4-col grid for hardcoded columns; Elementor content
 * must use a single full-width panel with .grid-design handling columns.
 *
 * IMPORTANT: never force display:block here — mobile accordion relies on
 * display:none / .is-open toggling from header-two.css + JS.
 */

.mega-menu3:has(.elementor),
.mega-menu3:has(.grid-design),
.mega-menu:has(.elementor),
.mega-menu:has(.grid-design) {
    grid-template-columns: none !important;
    width: min(max(720px, calc(var(--mega-cols, 4) * 180px)), calc(100vw - 40px));
    max-width: calc(100vw - 40px);
}

@media (min-width: 1101px) {
    .mega-menu3:has(.elementor),
    .mega-menu3:has(.grid-design),
    .mega-menu:has(.elementor),
    .mega-menu:has(.grid-design) {
        display: block;
    }
}

.mega-menu3:has(.grid-design.three[data-mega-cols="1"]),
.mega-menu:has(.grid-design.three[data-mega-cols="1"]) { --mega-cols: 1; }
.mega-menu3:has(.grid-design.three[data-mega-cols="2"]),
.mega-menu:has(.grid-design.three[data-mega-cols="2"]) { --mega-cols: 2; }
.mega-menu3:has(.grid-design.three[data-mega-cols="3"]),
.mega-menu:has(.grid-design.three[data-mega-cols="3"]) { --mega-cols: 3; }
.mega-menu3:has(.grid-design.three[data-mega-cols="4"]),
.mega-menu:has(.grid-design.three[data-mega-cols="4"]) { --mega-cols: 4; }
.mega-menu3:has(.grid-design.three[data-mega-cols="5"]),
.mega-menu:has(.grid-design.three[data-mega-cols="5"]) { --mega-cols: 5; }
.mega-menu3:has(.grid-design.three[data-mega-cols="6"]),
.mega-menu:has(.grid-design.three[data-mega-cols="6"]) { --mega-cols: 6; }
.mega-menu3:has(.grid-design.three[data-mega-cols="7"]),
.mega-menu:has(.grid-design.three[data-mega-cols="7"]) { --mega-cols: 7; }
.mega-menu3:has(.grid-design.three[data-mega-cols="8"]),
.mega-menu:has(.grid-design.three[data-mega-cols="8"]) { --mega-cols: 8; }

.mega-menu3 .elementor,
.mega-menu3 .elementor-section,
.mega-menu3 .elementor-container,
.mega-menu3 .elementor-column,
.mega-menu3 .elementor-widget-wrap,
.mega-menu3 .elementor-widget,
.mega-menu3 .elementor-widget-container,
.mega-menu .elementor,
.mega-menu .elementor-section,
.mega-menu .elementor-container,
.mega-menu .elementor-column,
.mega-menu .elementor-widget-wrap,
.mega-menu .elementor-widget,
.mega-menu .elementor-widget-container {
    width: 100% !important;
    max-width: 100% !important;
}

.mega-menu3 .elementor-container,
.mega-menu .elementor-container {
    display: block !important;
    flex-wrap: nowrap;
}

.mega-menu3 .grid-design.three,
.mega-menu .grid-design.three,
.grid-design.three[data-mega-cols] {
    display: grid !important;
    width: 100%;
    box-sizing: border-box;
    grid-template-columns: repeat(var(--mega-cols, 4), minmax(0, 1fr));
    gap: 34px;
}

.mega-menu3 .grid-design.three > .mega-column,
.mega-menu .grid-design.three > .mega-column,
.grid-design.three[data-mega-cols] > .mega-column {
    min-width: 0;
    width: auto;
    max-width: none;
}

@media (max-width: 1100px) {
    .mega-menu3:has(.elementor),
    .mega-menu3:has(.grid-design),
    .mega-menu:has(.elementor),
    .mega-menu:has(.grid-design) {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
    }

    .mega-menu3 .grid-design.three,
    .mega-menu .grid-design.three,
    .grid-design.three[data-mega-cols] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
    }
}

@media (max-width: 767px) {
    .mega-menu3 .grid-design.three,
    .mega-menu .grid-design.three,
    .grid-design.three[data-mega-cols] {
        grid-template-columns: 1fr;
        gap: 14px;
    }
}
