/* KRITISCHER MENU FIX - Höchste Priorität */

/* Stelle sicher dass das aktive Menü IMMER sichtbar ist */
@media (max-width: 768px) {
    /* Wenn Menü aktiv ist - FORCE VISIBILITY */
    .nav-menu.active,
    ul.nav-menu.active,
    #navMenu.active,
    ul#navMenu.active {
        /* Position - HÖHER POSITIONIEREN */
        position: fixed !important;
        left: 20px !important;
        right: 20px !important;
        top: 70px !important; /* War 80px, jetzt höher */
        width: auto !important;
        
        /* Sichtbarkeit - ALLES AUF MAXIMUM */
        visibility: visible !important;
        opacity: 1 !important;
        display: flex !important;
        z-index: 999999 !important; /* Extrem hoher z-index */
        
        /* Aussehen */
        background: rgba(255, 255, 255, 0.98) !important;
        backdrop-filter: blur(20px) !important;
        -webkit-backdrop-filter: blur(20px) !important;
        border-radius: 24px !important;
        padding: 20px !important;
        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2) !important;
        
        /* Keine Transformationen oder Clipping */
        transform: none !important;
        -webkit-transform: none !important;
        clip: auto !important;
        clip-path: none !important;
        -webkit-clip-path: none !important;
        
        /* Scrollbar wenn nötig */
        max-height: calc(100vh - 120px) !important;
        overflow-y: auto !important;
        
        /* Animation */
        transition: none !important; /* Keine Animation die buggen könnte */
    }
    
    /* Dark mode support */
    [data-theme="dark"] .nav-menu.active,
    [data-theme="dark"] ul.nav-menu.active,
    [data-theme="dark"] #navMenu.active {
        background: rgba(28, 28, 30, 0.98) !important;
        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5) !important;
    }
    
    /* Hamburger Menu Button */
    .nav-toggle {
        position: relative !important;
        z-index: 1000000 !important; /* Noch höher als das Menü */
        cursor: pointer !important;
        pointer-events: auto !important;
        display: flex !important;
    }
    
    /* Body wenn Menü offen */
    body.menu-open {
        overflow: hidden !important; /* Verhindere Scrollen wenn Menü offen */
    }
    
    /* Overlay hinter dem Menü */
    body.menu-open::before {
        content: "";
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.3);
        z-index: 999998;
    }
}

/* Debug entfernt - Menü sollte jetzt funktionieren */