/* ===== EQUAL Mega Menu (Elementor) =====
Pannello che appare sotto la voce di menu in hover/click.
Strategia: il JS sposta il pannello in quando si apre, così
nessun parent può clipparlo (overflow:hidden, transform, ecc.).
*/
/* Forza la con mega menu a posizione relativa
(utile come ancora visiva anche se il portal usa coords assolute). */
.esai-mega-item{
position:relative !important;
}
/* Sub-menu nativo di WP: lo nascondiamo se la voce ha un mega panel,
per evitare doppia tendina. */
.esai-mega-item > .sub-menu{
display:none !important;
}
/* ===== Pannello mega (stato "dentro la ", PRIMA del portal) =====
Lo nascondiamo completamente: l'unico stato visibile è quello portaled in .
Senza questa regola si vedeva il "lampo" del pannello a sinistra/destra della
voce di menu prima che il JS lo spostasse e lo centrasse. */
.esai-mega-panel:not(.esai-mega-portaled){
display:none !important;
visibility:hidden !important;
opacity:0 !important;
pointer-events:none !important;
position:absolute !important;
width:0 !important;
height:0 !important;
overflow:hidden !important;
}
/* ===== Pannello quando è stato spostato in dal JS ===== */
body > .esai-mega-panel.esai-mega-portaled{
position:fixed !important;
display:block !important; /* visibile come box */
visibility:hidden; /* ma invisibile finché non .esai-mega-open */
opacity:0;
pointer-events:none;
z-index:2147483600 !important; /* sopra qualsiasi cosa */
margin:0 !important;
padding:0 !important;
background:#ffffff;
color:#0f172a;
border-radius:14px;
box-shadow:0 18px 50px -10px rgba(15,23,42,.25);
transform:translateY(8px);
transition:opacity .22s ease, transform .22s ease, visibility 0s linear .22s;
/* Defense contro CSS del tema che clippa */
overflow:visible !important;
clip:auto !important;
clip-path:none !important;
max-height:none !important;
height:auto !important;
}
body > .esai-mega-panel.esai-mega-portaled.esai-mega-open{
visibility:visible !important;
opacity:1 !important;
pointer-events:auto !important;
transform:translateY(0) !important;
transition-delay:0s !important;
}
/* Inner: protegge i contenuti Elementor dal clipping */
.esai-mega-panel__inner{
position:relative;
width:100% !important;
max-width:100% !important;
overflow:visible !important;
padding:0px;
box-sizing:border-box;
}
.esai-mega-open{
border-radius: 0px !Important;
}
/* Triangolino guida (decorazione opzionale) */
body > .esai-mega-panel.esai-mega-portaled::before{
content:"";
position:absolute;
top:-8px;
left:24px;
width:14px; height:14px;
background:inherit;
transform:rotate(45deg);
box-shadow:-3px -3px 8px -4px rgba(15,23,42,.12);
z-index:0;
pointer-events:none;
}
body > .esai-mega-panel.esai-mega-portaled[data-align="center"]::before,
body > .esai-mega-panel.esai-mega-portaled[data-align="full"]::before{
left:50%;
transform:translateX(-50%) rotate(45deg);
}
body > .esai-mega-panel.esai-mega-portaled[data-align="right"]::before{
left:auto; right:24px;
}
body > .esai-mega-panel.esai-mega-portaled[data-align="full"]::before{
display:none;
}
/* Corridoio invisibile sopra il pannello: aiuta visivamente a percepire
continuità tra voce e pannello. NESSUN pointer-events: usare auto qui causa
un loop di hit-test con la (il pseudo si sovrappone alla parte bassa
della voce e produce mouseleave/mouseenter alternati → flicker). */
body > .esai-mega-panel.esai-mega-portaled::after{
content:"";
position:absolute;
top:-12px; left:0; right:0; height:12px;
background:transparent;
pointer-events:none !important;
}
/* ===== Mobile (≤781px): bottom sheet ===== */
@media (max-width:781px){
body > .esai-mega-panel.esai-mega-portaled{
left:0 !important;
right:0 !important;
top:auto !important;
bottom:0 !important;
width:100vw !important;
max-width:100vw !important;
max-height:80vh !important;
overflow:auto !important;
border-radius:14px 14px 0 0 !important;
transform:translateY(100%) !important;
}
body > .esai-mega-panel.esai-mega-portaled.esai-mega-open{
transform:translateY(0) !important;
}
body > .esai-mega-panel.esai-mega-portaled::before{ display:none !important; }
body > .esai-mega-panel.esai-mega-portaled::after{ display:none !important; }
}
/* Reduced motion */
@media (prefers-reduced-motion: reduce){
body > .esai-mega-panel.esai-mega-portaled{ transition:none !important; transform:none !important; }
}
/* ===== Defense: forza overflow:visible sui contenitori più comuni del menu.
Serve solo quando il pannello NON è ancora portaled (transizione iniziale).
Una volta in body, è indipendente. */
.menu-item-has-children, .menu-item, .nav-menu, .menu, .nav, .navigation,
.elementor-nav-menu, .elementor-nav-menu--main, .elementor-nav-menu__container,
.elementor-widget-nav-menu, .elementor-widget-container,
.elementor-widget, .elementor-widget-wrap,
.elementor-element, .elementor-section, .elementor-row, .elementor-container,
.e-con, .e-con-inner, .e-flex,
header, .site-header, #site-header, #masthead{
overflow:visible !important;
}