/* Mega Menu - Panel & Columns 
 * Updated to match Figma design specifications
 */

.hafo-elementor-nav .has-mega-menu>.submenu-wrapper {
    left: 50%;
    transform: translateX(-50%);
    width: max-content;
    max-width: 1200px;
    background-color: #fcfcfc;
    border-top: 0.5px solid #bcc8d9;
    border-bottom: 0.5px solid #bcc8d9;
    border-left: none;
    border-right: none;
    border-radius: 0;
    padding: 24px;
    margin-top: 0;
    box-shadow: 0 4px 40px rgb(39 80 136 / 8%);
}

.hafo-elementor-nav .has-mega-menu .sub-menu {
    display: grid;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 32px;
}

/* Grid Columns */
.hafo-elementor-nav .mega-columns-2 .sub-menu {
    grid-template-columns: repeat(2, 1fr);
}

.hafo-elementor-nav .mega-columns-3 .sub-menu {
    grid-template-columns: repeat(3, 1fr);
}

.hafo-elementor-nav .mega-columns-4 .sub-menu {
    grid-template-columns: repeat(4, 1fr);
}

.hafo-elementor-nav .mega-columns-5 .sub-menu {
    grid-template-columns: repeat(5, 1fr);
}

.hafo-elementor-nav .has-mega-menu .sub-menu>.menu-item {
    margin: 0;
    padding: 0;
}

.hafo-elementor-nav .has-mega-menu .sub-menu .menu-link {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 12px;
    gap: 8px;
    border-radius: 8px;
    color: #171717;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.hafo-elementor-nav .has-mega-menu .sub-menu .menu-link:hover {
    background-color: rgb(30 49 94 / 5%);
    transform: translateY(-2px);
}

.hafo-elementor-nav .menu-item-image {
    width: 60px;
    height: 60px;
    border-radius: 8px;
    overflow: hidden;
    background-color: #f3f4f6;
    flex-shrink: 0;
}

.hafo-elementor-nav .menu-item-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hafo-elementor-nav .has-mega-menu .menu-item-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 15px;
    font-weight: 400;
    color: #171717;
}

.hafo-elementor-nav .menu-item-description {
    font-size: 13px;
    font-weight: 300;
    color: #6b7280;
    line-height: 1.4;
    margin-top: 2px;
}

/* Top-level items in mega panel content */
.hafo-elementor-nav .has-mega-menu .mega-menu-content .menu-item[data-depth="0"] .menu-link,
.hafo-elementor-nav .has-mega-menu .mega-menu-content .menu-item.menu-item-top-level .menu-link {
    font-size: 16px;
}

.hafo-elementor-nav .has-mega-menu .mega-menu-content .menu-item[data-depth="0"] .menu-item-text,
.hafo-elementor-nav .has-mega-menu .mega-menu-content .menu-item.menu-item-top-level .menu-item-text {
    font-size: 16px;
    font-weight: 600;
}

/* Nested items in mega panel content */
.hafo-elementor-nav .has-mega-menu .mega-menu-content .menu-item[data-depth="1"] .menu-link,
.hafo-elementor-nav .has-mega-menu .mega-menu-content .menu-item.menu-item-child .menu-link {
    font-size: 14px;
    font-weight: 400;
}

.hafo-elementor-nav .has-mega-menu .mega-menu-content .menu-item[data-depth="1"] .menu-item-text,
.hafo-elementor-nav .has-mega-menu .mega-menu-content .menu-item.menu-item-child .menu-item-text {
    font-size: 14px;
    font-weight: 400;
}