/* 
 * BREAKTHROUGH IMMERSIVE FULL-SCREEN MOBILE MENU
 * Style: Minimalist Neo-Glassmorphism (v7 - Safe Zone)
 */

/* 1. OVERLAY (DARK NAVY) */
.mfp-bg {
    background: #0a142a !important;
    opacity: 0.98 !important;
    backdrop-filter: blur(15px) !important;
    -webkit-backdrop-filter: blur(15px) !important;
}

/* 
 * 2. FORCE FULL SCREEN & TRANSPARENCY
 * Target the specific containers used by Flatsome Magnific Popup
 */

/* Force the wrapper and content container to be full-screen for the menu */
.mfp-wrap .mfp-content,
.mfp-wrap .mfp-content .mobile-sidebar,
.mfp-wrap .mfp-content .sidebar-menu,
.mfp-wrap .mfp-content .cenova-mobile-menu {
    background: transparent !important;
    background-color: transparent !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100vh !important;
    padding: 0 !important;
    margin: 0 !important;
    left: 0 !important;
    top: 0 !important;
    position: fixed !important;
    box-shadow: none !important;
    border: none !important;
}

/* 3. MENU COMPONENTS */
#main-menu, .cenova-mobile-menu {
    display: none !important;
}

/* Active State - Centered Grid */
.mfp-content #main-menu,
.mfp-content .cenova-mobile-menu {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important; /* Push down to clear X button */
    align-items: flex-start !important;
    width: 100vw !important;
    height: 100vh !important;
    background: transparent !important;
    z-index: 9999 !important;
    padding-top: 150px !important;
    box-sizing: border-box !important;
}

#main-menu .sidebar-menu {
    background: transparent !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    padding: 0 20px !important;
}

/* 4. CLOSE BUTTON (STYLIZED X) */
.mfp-close {
    width: 54px !important;
    height: 54px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(255, 255, 255, 0.1) !important;
    border: 1px solid rgba(212, 160, 23, 0.6) !important;
    border-radius: 50% !important;
    top: 30px !important;
    right: 30px !important;
    color: #d4a017 !important;
    font-size: 32px !important;
    font-weight: 300 !important;
    line-height: 1 !important;
    opacity: 1 !important;
    z-index: 10001 !important;
    text-align: center !important;
}

/* 5. HIDE ALL SEARCH BOXES ON MOBILE MENU ONLY */
#main-menu .searchform-wrapper, 
.cenova-mobile-menu .searchform-wrapper,
#main-menu .search-box, 
.cenova-mobile-menu .search-box,
#main-menu .header-search-form,
.cenova-mobile-menu .header-search-form {
    display: none !important;
}

/* 6. NAVIGATION ITEMS */
.nav-sidebar { width: 100% !important; padding: 100px 0 0 0 !important; margin: 0 !important; }
.nav-sidebar > li { 
    margin: 0 !important; 
    opacity: 0; 
    animation: menuFadeIn 0.5s forwards; 
    transform: translateY(10px); 
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important; 
}
.nav-sidebar > li.header-social-icons,
.nav-sidebar > li:last-child { border-bottom: none !important; }

/* Hide empty elements / errors */
.nav-sidebar > li:has(.element-error) { display: none !important; }

.nav-sidebar > li:nth-child(1) { animation-delay: 0.1s; }
.nav-sidebar > li:nth-child(2) { animation-delay: 0.15s; }
.nav-sidebar > li:nth-child(3) { animation-delay: 0.2s; }
.nav-sidebar > li:nth-child(4) { animation-delay: 0.25s; }
.nav-sidebar > li:nth-child(5) { animation-delay: 0.3s; }
.nav-sidebar > li:nth-child(6) { animation-delay: 0.35s; }
.nav-sidebar > li:nth-child(7) { animation-delay: 0.4s; }
.nav-sidebar > li:nth-child(8) { animation-delay: 0.45s; }

.nav-sidebar > li > a { 
    font-size: 14px !important; 
    font-weight: 500 !important; 
    color: #fff !important; 
    text-transform: uppercase !important; 
    letter-spacing: 0.5px !important; 
    padding: 14px 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    transition: all 0.3s ease !important;
}
.nav-sidebar > li > a:hover { color: #d4a017 !important; padding-left: 8px !important; }

/* 7. SOCIAL ICONS */
.nav-sidebar > li.header-social-icons {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}
.nav-sidebar .social-icons { 
    position: relative !important; 
    bottom: auto !important; 
    left: auto !important; 
    transform: none !important; 
    display: flex !important; 
    gap: 20px !important; 
    justify-content: flex-start !important;
}
.nav-sidebar .social-icons a { 
    color: rgba(255, 255, 255, 0.5) !important; 
    font-size: 20px !important; 
    padding: 0 !important;
    width: auto !important;
    display: inline-flex !important;
}
.nav-sidebar .social-icons a:hover {
    color: #d4a017 !important; 
    padding-left: 0 !important;
}

/* Animations */
@keyframes menuFadeIn { to { opacity: 1; transform: translateY(0); } }

/* Cleanup */
.sidebar-menu-close, .divider, .toggle, .nav-sidebar > li > a.element-error { display: none !important; }

/* 
 * 8. PREVENT MENU OPENING SHIFT (MAGNIFIC POPUP SPECIFIC)
 */
html.mfp-helper, 
html.mfp-zoom-out-cur,
body.mfp-active,
body.mfp-opened {
    margin-right: 0 !important;
    padding-right: 0 !important;
    overflow-x: hidden !important;
}