/**
 * Navigation Frontend - Version Simple et Fonctionnelle
 * Desktop : Hover / Mobile : Modal simple avec JavaScript
 */

/* ========================================
   STYLES COMMUNS
======================================== */

.navbar {
    background-color: #ff7300 !important;
    height: 76px;
    padding: 0.5rem 0;
}

body {
    /* padding-top: 76px; */
}

/* ========================================
   DESKTOP - Vos styles conservés
======================================== */

/* Liens navbar Desktop */
.navbar-nav .nav-link {
    color: white !important;
    border-radius: 8px;
    font-weight: 500;
    padding: 0.5rem 1rem !important;
    transition: background-color 0.3s ease;
}

.navbar-nav .nav-link:hover {
    background-color: rgba(0, 0, 0, 0.3);
    border-radius: 8px;
}

/* Dropdown Desktop */
.dropdown-menu {
    background-color: #ff7300;
    border-radius: 8px;
    border: none;
    padding: 14px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.dropdown-item {
    color: white !important;
    border-radius: 8px;
    padding: 0.5rem 1rem;
}

.dropdown-item:hover,
.dropdown-item:focus {
    background-color: rgba(0, 0, 0, 0.3) !important;
    border-radius: 8px;
    color: white !important;
}

.dropdown-divider {
    border-color: rgba(255, 255, 255, 0.2);
}

/* Hover dropdown Desktop uniquement */
@media (min-width: 992px) {
    .dropdown:hover .dropdown-menu {
        display: block;
    }

    .dropdown-menu {
        margin-top: 0;
    }
}

/* ========================================
   MOBILE - Nouvelle approche simple
======================================== */

/* Bouton toggler mobile */
.navbar-toggler {
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.8%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* Modal mobile */
.modal-content {
    background-color: #ff7300;
    border: none;
}

.modal-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

/* Liste mobile */
.list-group-item {
    background-color: transparent;
    border: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.mobile-link {
    color: white !important;
    padding: 0.75rem 1.5rem;
    display: block;
    text-decoration: none;
    transition: background-color 0.3s ease;
}

.mobile-link:hover {
    background-color: rgba(0, 0, 0, 0.2);
    color: white !important;
}

/* Section mobile */
.mobile-section {
    padding: 0;
}

.mobile-section-header {
    padding: 1rem 1.5rem;
    cursor: pointer;
    color: white;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.mobile-section-header:hover {
    background-color: rgba(0, 0, 0, 0.1);
}

.mobile-submenu {
    background-color: rgba(0, 0, 0, 0.1);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.mobile-submenu .mobile-link {
    padding: 0.6rem 2rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.mobile-submenu hr {
    border-color: rgba(255, 255, 255, 0.2);
    margin: 0.5rem 1.5rem;
}

/* Icône toggle */
.toggle-icon {
    transition: transform 0.3s ease;
}

/* Bouton close modal */
.btn-close-white {
    filter: invert(1) grayscale(100%) brightness(200%);
}