/* ============================================================
   LG Navbar Widget — Supplementary CSS
   Core styles (.lg-nav, .lg-mobile, etc.) live in mu-plugin
   la-gritta-theme.php. This file handles only widget-specific
   additions and the hamburger → X animation.
   ============================================================ */

/* Hamburger → X animation
   ------------------------------------------------------------ */
.lg-nav__burger .lg-burger__top,
.lg-nav__burger .lg-burger__mid,
.lg-nav__burger .lg-burger__bot {
    transition: transform 0.3s ease, opacity 0.2s ease;
    transform-origin: 12px 12px;
}

.lg-nav.mobile-open .lg-nav__burger .lg-burger__top {
    transform: rotate(45deg) translateY(6px);
}
.lg-nav.mobile-open .lg-nav__burger .lg-burger__mid {
    opacity: 0;
}
.lg-nav.mobile-open .lg-nav__burger .lg-burger__bot {
    transform: rotate(-45deg) translateY(-6px);
}

/* Ensure the widget wrapper itself doesn't interfere with fixed positioning */
.elementor-widget-lg_navbar {
    position: static !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* In Elementor editor: make navbar visible for editing */
.elementor-editor-active .lg-nav {
    position: relative;
    background: rgba(12, 12, 12, 0.9);
}
.elementor-editor-active .lg-mobile {
    display: none !important;
}

/* Body overflow lock class set by JS */
body.lg-menu-open {
    overflow: hidden !important;
}