/*
 * ============================================================================
 * LINE DANCE CLUB - COUNTRY MEETS MODERN (STYLESHEET)
 * ============================================================================
 * 
 * @package     ldc
 * @module      Design / Styles
 * @component   menue/navi
 * 
 * @description Alles was fuer das Menue wichtig ist
 * 
 * @status      Refactoring
 * @open        ldc Namespace verwenden und alles pruefen
 * @ticket      #90
 * @version     1.0.0
 * @created     2026-07-04
 * @last_change 2026-07-04
 * 
 * @export-to-schorsch
 * ============================================================================
 */
/** Ende LDC Header *//* menue.css - Zentrale Navigation mit ldc Namespace & Montserrat Font */
.ldc-nav {
    width: 100%;
    background: var(--ldc-nav-bg, rgba(0, 0, 0, 0.3));
    backdrop-filter: blur(10px);
    position: sticky;
    top: 0;
    z-index: 1000;
    box-sizing: border-box;
    padding: 5px;
}

.ldc-nav .nav-container {
    margin: 0 auto;
    display: flex;
    justify-content: flex-end;
    /* Desktop rechtsbündig */
    align-items: center;
    padding: 5px 20px;
}

/* Der Hamburger-Button */
.ldc-nav .menu-toggle {
    display: none;
    background: none;
    border: 2px solid var(--ldc-color-light);
    color: var(--ldc-color-light);
    cursor: pointer;
    margin-left: auto;
    border-radius: 3px;
    padding: 2px 10px;
    transition: all 0.3s ease;
}

/* Die Liste der Links */
.ldc-nav .nav-links {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 15px;
}

.ldc-nav .nav-links a {
    /* Moderne Schriftart für Überschriften-Look */
    font-family: var(--ldc-font-family);
    color: var(--ldc-text-light);
    text-decoration: none;
    letter-spacing: 1px;
    padding: 5px 10px;
    transition: all 0.3s ease;
}

.ldc-nav .nav-links a:hover {
    color: var(--ldc-color-link-hover) !important; /* Goldener Text */
}

/* MOBILE ANSICHT (Kachel-Design) */
@media (max-width: 768px) {

        .ldc-nav {
        background: rgba(0, 0, 0, 0.2);
        padding: 3px;
    }

    .ldc-nav .menu-toggle {
        display: block;
        /* Hamburger anzeigen */
    }

    .ldc-nav .nav-links {
        display: none;
        /* Standardmäßig aus */
        flex-direction: column;

        /* Glassmorphism / Kachel-Look */
        background: var(--ldc-card-bg);
        backdrop-filter: blur(15px);

        /* Rahmen und Schatten wie bei Login/VHS-Kacheln */
        border: 2px solid var(--ldc-color-light);
        border-radius: var(--ldc-border-radius);
        box-shadow: var(--ldc-shadow);

        /* Positionierung: Knapp unter der Leiste */
        position: fixed;
        top: 50px;
        right: 15px;
        width: 250px;
        padding: 10px 0;
        z-index: 9999;
    }

    /* Wird durch JS geschaltet */
    .ldc-nav .nav-links.active {
        display: flex !important;
    }

    .ldc-nav .nav-links li {
        width: 100%;
    }

    .ldc-nav .nav-links a {
        padding: 15px 20px;
        border-bottom: 1px solid rgba(230, 126, 34, 0.1);
        color: var(--ldc-text-light, #ffffff);
        text-align: left;
        font-size: 1rem;
    }

    /* Hover-Effekt in der Kachel (Orange Akzent) */
    .ldc-nav .nav-links a:hover {
        background: rgba(230, 126, 34, 0.15);
        color: var(--ldc-color-light-hover);
        padding-left: 25px;
        /* Kleiner Einrück-Effekt */
    }

    .ldc-nav .nav-links li:last-child a {
        border-bottom: none;
    }
}