.megamenu-body {
    --mega-menu-body-item-width: theme('screens.2xl');
    --mega-menu-body-heading-wght: theme('fontWeight.extrabold');
    --mega-menu-body-heading-size: theme('fontSize.2xl');
    --mega-menu-body-item-px: theme('space.4');
    --mega-menu-body-item-list-columns: 1;
    --mega-menu-body-item-elem-focus-color: theme('colors.sky.500');

    @apply shadow;
}

@screen lg {
    .megamenu-body {
        --mega-menu-body-item-px: theme('space.8');
    }
}

@screen 2xl {
    .megamenu-body {
        --mega-menu-body-heading-size: theme('fontSize.4xl');
    }
}


.mega-menu-body__item {
    @apply @lg:gap-x-10 @3xl:gap-x-16 flex-wrap @3xl:flex-nowrap gap-y-8;

    .menu__item {
        @apply mb-3;
    }

    > .mega-menu__sub-menu {
        @apply grid grid-cols-1 @lg:grid-cols-3 @3xl:grid-cols-4 gap-y-4;
    }

    .mega-menu__sub-menu .mega-menu__sub-menu {
        @apply space-y-2;
    }

    .mega-menu__link {
        @apply hover:text-sky-500 focus-visible:text-sky-500;
    }

}


.mega-menu__item--level-2 {
    @apply border-l pl-4;

    > .mega-menu__link {
        @apply font-semibold text-xl underline underline-offset-4;
    }

    > .mega-menu__sub-menu {
        @apply mt-5;
    }
}

.mega-menu-body__close {
    @apply absolute focus-visible:absolute top-4 right-4 z-10 whitespace-nowrap;
}