#main-megamenu {
    anchor-name: --mm-nav;
}
#main-megamenu [popover] {
    position-anchor: --mm-nav;
    top: anchor(bottom);
    left: 0;
    right: 0;
    width: 100%;
    margin: 0;
    max-height: calc(100dvh - 4rem);
    overflow-y: auto;
    margin-top: 12px;
    
    /* Configuração para transição suave */
    opacity: 0;
    visibility: hidden;
    display: block !important; /* Mantém no fluxo para a transição de visibilidade funcionar */
    pointer-events: none;      /* Impede interações quando invisível */
    transition: opacity 0.2s ease, visibility 0.2s ease;
    transition-delay: 0.15s;   /* Atraso para sumir quando o mouse sai */
}

@media (hover: hover) {
    /* Quando passa o mouse no link ou no próprio popover */
    #main-megamenu a[popovertarget]:hover + [popover],
    #main-megamenu [popover]:hover {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto;
        transition-delay: 0s;  /* Aparece instantaneamente ao passar o mouse */
    }
}