/* =============================================================
   LIQUID GLASS – Partageons la Forêt
   Surcharges visuelles pour nl-index.php et websim.php
   Charte : vert #327a35/#4CAF50, rouge #990047, jaune #F2F3AE
   Inclure EN DERNIER dans chaque page
   ============================================================= */

/* ----------------------------------------------------------
   NL-INDEX : panneaux et éléments de la page d'accueil
   ---------------------------------------------------------- */

/* Photo en fond sur tout le viewport */
.page-nl-index .container {
    background: url('../img/plf-foret1.jpg') no-repeat center center;
    background-size: cover;
    position: relative;
    flex-direction: row-reverse;
}

/* Masque la colonne image séparée (fond intégré au container) */
.page-nl-index .image {
    display: none !important;
}

/* Colonne droite (anciennement gauche) : verre par-dessus la photo */
.page-nl-index .information {
    width: 50% !important;
    background: rgba(255, 255, 255, 0.18);
    backdrop-filter: blur(4px) saturate(140%);
    -webkit-backdrop-filter: blur(22px) saturate(160%);
    border-left: 1px solid rgba(255, 255, 255, 0.30);
    box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.20),
                -4px 0 32px rgba(0, 0, 0, 0.12);
}

/* Header de la page d'accueil */
.page-nl-index .header-container {
    background: linear-gradient(
        90deg,
        rgba(35, 95, 38, 0.96) 0%,
        rgba(50, 122, 53, 0.82) 50%,
        rgba(80, 122, 40, 0.97) 100%
    ) !important;
    backdrop-filter: blur(22px) saturate(200%);
    -webkit-backdrop-filter: blur(22px) saturate(200%);
    border-bottom: 1px solid rgba(242, 243, 174, 0.35);
    box-shadow: 0 4px 28px rgba(0, 0, 0, 0.22),
                inset 0 1px 0 rgba(255, 255, 255, 0.28);
}

/* Bloc texte central */
.page-nl-index .text {
    background: rgba(255, 255, 255, 0.30);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.40);
    border-radius: 14px;
    padding: 1.2rem 1.8rem;
    margin: 0.5rem 2rem;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.10),
                inset 0 1px 0 rgba(255, 255, 255, 0.50);
    color: #1a3a1b;
}

/* Bouton "Accéder à la carte" */
.page-nl-index .button {
    background: rgba(50, 122, 53, 0.82) !important;
    backdrop-filter: blur(12px) saturate(180%);
    -webkit-backdrop-filter: blur(12px) saturate(180%);
    border: 1px solid rgba(242, 243, 174, 0.50) !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 24px rgba(50, 122, 53, 0.50),
                inset 0 1px 0 rgba(255, 255, 255, 0.30),
                inset 0 -1px 0 rgba(0, 0, 0, 0.10);
    transition: background 0.3s ease, box-shadow 0.3s ease, transform 0.2s ease;
}
.page-nl-index .button:hover {
    background: rgba(50, 122, 53, 0.98) !important;
    box-shadow: 0 6px 32px rgba(50, 122, 53, 0.70);
    transform: translateY(-1px);
}

/* Sélecteur de langue – page d'accueil */
.page-nl-index .language-selector.desktop-only {
    background: rgba(50, 122, 53, 0.58) !important;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(242, 243, 174, 0.32);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.20),
                inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

/* Logos partenaires : harmonisation taille sur le 3e logo (Wallonie) */
.page-nl-index .logos {
    background: rgba(255, 255, 255, 0.28);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.40);
    padding: 0.6rem 1.2rem;
    box-shadow: 0 2px 14px rgba(0, 0, 0, 0.08),
                inset 0 1px 0 rgba(255, 255, 255, 0.50);
    gap: 1rem;
    justify-content: space-around !important;
    align-items: center !important;
    margin-bottom: 10px;
}

/* Tous les logos à la même taille : alignés sur la hauteur du logo Wallonie */
.page-nl-index .logos img {
    height: 150px !important;
    width: auto !important;
    max-width: none !important;
    object-fit: contain;
    background: white;
    border-radius: 6px;
    padding: 4px 6px;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.10);
}

@media (max-width: 600px) {
    .page-nl-index .container {
        flex-direction: column !important;
        height: 100dvh;
        overflow: auto;
    }

    .page-nl-index .information {
        width: 100% !important;
        min-height: 100dvh;
        height: auto !important;
        overflow: visible !important;
        border-left: 0 !important;
        justify-content: flex-start !important;
        gap: 0.75rem;
        padding-bottom: calc(env(safe-area-inset-bottom) + 12px);
    }

    .page-nl-index .information {
        backdrop-filter: blur(4px) saturate(140%);
        -webkit-backdrop-filter: blur(8px) saturate(140%);
    }

    .page-nl-index .header-container {
        backdrop-filter: blur(10px) saturate(160%);
        -webkit-backdrop-filter: blur(10px) saturate(160%);
    }

    .page-nl-index .text {
        margin: 0.75rem 1rem !important;
        padding: 1rem 1rem !important;
    }

    .page-nl-index .text {
        backdrop-filter: blur(6px);
        -webkit-backdrop-filter: blur(6px);
    }

    .page-nl-index .button {
        position: sticky;
        bottom: calc(env(safe-area-inset-bottom) + 10px);
        z-index: 5;
        margin: 0 1rem 1rem 1rem !important;
    }

    .page-nl-index .footer {
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
        margin-top: auto;
    }

    .page-nl-index .logos {
        margin: 0 1rem !important;
        display: flex !important;
        flex-direction: row;
        justify-content: center !important;
        align-items: center !important;
        gap: 0.75rem;
        padding: 0.5rem 0.75rem;
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .page-nl-index .logos img {
        height: 42px !important;
        width: auto !important;
        max-width: none !important;
        flex: 0 0 auto;
        object-fit: contain;
    }
}

/* Footer page d'accueil */
.page-nl-index .footer {
    -webkit-backdrop-filter: blur(10px);
    width: 100%;
    padding: 0.6rem 0;
}

/* Backdrop des modales – flou sur le fond */
.modal {
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    background-color: rgba(0, 0, 0, 0.45);
}

/* Modale urgente (MESSAGE IMPORTANT) – verre ambré sombre, harmonieux avec la forêt */
.modal-content {
    background: linear-gradient(
        180deg,
        rgba(160, 40, 10, 0.45) 0%,
        rgba(50, 8, 2, 0.80) 100%
    ) !important;
    backdrop-filter: blur(32px) saturate(140%) brightness(0.85);
    -webkit-backdrop-filter: blur(32px) saturate(140%) brightness(0.85);
    border: 1px solid rgba(255, 160, 100, 0.30) !important;
    border-radius: 20px !important;
    box-shadow:
        0 24px 64px rgba(0, 0, 0, 0.60),
        inset 0 2px 0 rgba(255, 200, 150, 0.20),
        inset 0 -1px 0 rgba(0, 0, 0, 0.30) !important;
    overflow: hidden;
}

/* Reflet lumineux ambré en haut de la modale */
.modal-content::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255, 180, 100, 0.50) 30%,
        rgba(255, 220, 160, 0.80) 50%,
        rgba(255, 180, 100, 0.50) 70%,
        transparent 100%
    );
    border-radius: 20px 20px 0 0;
    pointer-events: none;
    z-index: 1;
}

/* Header de la modale – encadré ambre glass */
.modal-header {
    background: rgba(200, 80, 30, 0.35) !important;
    border: 1px solid rgba(255, 160, 80, 0.40) !important;
    border-radius: 12px !important;
    margin: 0.8rem 1rem 0 !important;
    padding: 0.9rem 1.2rem !important;
    box-shadow: 0 2px 14px rgba(0, 0, 0, 0.25),
                inset 0 1px 0 rgba(255, 200, 120, 0.35),
                inset 0 -1px 0 rgba(0, 0, 0, 0.15);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

/* Titre MESSAGE IMPORTANT */
.modal-title {
    font-size: 1.3rem !important;
    letter-spacing: 0.10em;
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.60),
                 0 0 20px rgba(255, 150, 80, 0.40);
    color: #ffe8c8 !important;
    text-align: center !important;
    margin: 0 !important;
    border-bottom: none !important;
}

/* Corps de la modale */
.modal-body1 {
    padding: 1.2rem 1.5rem !important;
    font-size: 0.95rem;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.95) !important;
}

/* Conteneur modal-body2 : neutre, pas de fond ni bordure */
.modal-body2 {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    display: flex;
    justify-content: center;
    padding: 0 !important;
    margin: 0.5rem 0 !important;
}

/* Conteneur affiche : cadre glass propre */
.affiche {
    background: rgba(255, 255, 255, 0.95) !important;
    border-radius: 12px !important;
    border: 2px solid rgba(255, 255, 255, 0.70) !important;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.45),
                inset 0 1px 0 rgba(255, 255, 255, 0.80),
                0 0 0 4px rgba(255, 255, 255, 0.12) !important;
    overflow: hidden !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 0 !important;
    margin: 0 auto !important;
    width: auto !important;
    max-width: 55% !important;
}

/* Image affiche : hauteur agrandie, centrée proprement */
.affiche img,
#affichesR {
    display: block !important;
    height: 240px !important;
    width: auto !important;
    max-width: 100% !important;
    object-fit: contain !important;
    border-radius: 0 !important;
}

/* Footer de la modale – encadré glass autour du bouton */
.modal-footer {
    background: none !important;
    border: none !important;
    padding: 0.8rem 1rem 1rem !important;
    margin-top: 0 !important;
}

/* Bouton J'AI COMPRIS – encadré glass vert avec relief (nl-index uniquement) */
.page-nl-index #informationModalBtn {
    background: linear-gradient(
        160deg,
        rgba(72, 165, 75, 0.92) 0%,
        rgba(42, 105, 45, 0.98) 100%
    ) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 2px solid rgba(242, 243, 174, 0.55) !important;
    border-radius: 12px !important;
    box-shadow:
        0 6px 24px rgba(40, 100, 43, 0.65),
        inset 0 2px 0 rgba(255, 255, 255, 0.35),
        inset 0 -2px 0 rgba(0, 0, 0, 0.20),
        0 0 0 4px rgba(242, 243, 174, 0.15);
    font-size: 1.05rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.10em;
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.40);
    transition: all 0.25s ease;
    cursor: pointer;
    width: 100%;
    padding: 0.85rem !important;
    color: #fff !important;
}
.page-nl-index #informationModalBtn:hover {
    background: linear-gradient(
        160deg,
        rgba(85, 185, 88, 1.0) 0%,
        rgba(50, 122, 53, 1.0) 100%
    ) !important;
    box-shadow:
        0 8px 32px rgba(50, 122, 53, 0.80),
        inset 0 2px 0 rgba(255, 255, 255, 0.45),
        0 0 0 4px rgba(242, 243, 174, 0.25);
    transform: translateY(-2px);
}


/* ----------------------------------------------------------
   WEBSIM : carte interactive
   ---------------------------------------------------------- */

/* Fond body et content : blanc pur au lieu du gris #f4f4f4 */
body {
    background-color: #ffffff !important;
}
[data-theme="dark"] body {
    background-color: #1a241a !important;
}

/* Zone content : fond blanc pour combler les gaps */
.content {
    background-color: #ffffff !important;
}
[data-theme="dark"] .content {
    background-color: #1a241a !important;
}

/* Header */
header {
    background: linear-gradient(
        90deg,
        rgba(35, 95, 38, 0.96) 0%,
        rgba(50, 122, 53, 0.82) 50%,
        rgba(80, 122, 40, 0.97) 100%
    ) !important;
    backdrop-filter: blur(22px) saturate(200%);
    -webkit-backdrop-filter: blur(22px) saturate(200%);
    border-bottom: 1px solid rgba(255, 200, 100, 0.30);
    box-shadow: 0 4px 28px rgba(0, 0, 0, 0.22),
                inset 0 1px 0 rgba(255, 220, 160, 0.25),
                inset 0 -1px 0 rgba(0, 0, 0, 0.15);
}
[data-theme="dark"] header {
    background: linear-gradient(
        90deg,
        rgba(70, 15, 4, 0.96) 0%,
        rgba(100, 22, 6, 0.82) 50%,
        rgba(60, 12, 3, 0.97) 100%
    ) !important;
    border-bottom: 1px solid rgba(200, 80, 40, 0.25) !important;
    box-shadow: 0 4px 28px rgba(0, 0, 0, 0.50),
                inset 0 1px 0 rgba(255, 160, 100, 0.10),
                inset 0 -1px 0 rgba(0, 0, 0, 0.30) !important;
}
[data-theme="dark"] .hamburger-menu {
    z-index: 1100 !important;
    position: absolute !important;
}
[data-theme="dark"] .hamburger-menu .bar {
    background-color: rgba(255, 215, 190, 0.95) !important;
}

 @media (max-width: 768px) {
     /* (désactivé ici) */
 }


 @media screen and (min-width: 601px) {
     .hamburger-menu {
         display: none !important;
     }
     .plf-fs-fab {
         display: none !important;
     }
 }

 .map-container {
     flex-grow: 1;
     position: relative;
     min-height: 0;
 }



 #map {
     height: 100%;
     width: 100%;
 }

/* Barre de navigation / onglets */
nav {
    position: relative;
    background: linear-gradient(
        180deg,
        rgba(230, 245, 228, 0.97) 0%,
        rgba(205, 232, 200, 0.95) 100%
    ) !important;
    backdrop-filter: blur(18px) saturate(170%);
    -webkit-backdrop-filter: blur(18px) saturate(170%);
    border-bottom: 2px solid rgba(255, 180, 100, 0.40);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.14),
                inset 0 -2px 0 rgba(255, 160, 60, 0.25),
                inset 0 1px 0 rgba(255, 255, 255, 0.80);
}

[data-theme="dark"] nav,
[data-theme="dark"] #mainMenu {
    background: linear-gradient(
        180deg,
        rgba(80, 18, 5, 0.92) 0%,
        rgba(35, 6, 2, 0.97) 100%
    ) !important;
    backdrop-filter: blur(20px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(160%) !important;
    border-bottom: 1px solid rgba(200, 80, 40, 0.20) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.55),
                inset 0 1px 0 rgba(255, 160, 100, 0.08) !important;
}

/* Onglets – tous identiques au repos */
.tabs a {
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.90) 0%,
        rgba(220, 240, 218, 0.82) 100%
    ) !important;
    border: 1px solid rgba(76, 175, 80, 0.50) !important;
    border-radius: 8px !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.10),
                inset 0 1px 0 rgba(255, 255, 255, 0.90),
                inset 0 -1px 0 rgba(76, 175, 80, 0.15);
    transition: all 0.25s ease;
    color: #1e4d20 !important;
    font-weight: 600;
}
.tabs a:hover {
    background: linear-gradient(
        180deg,
        rgba(200, 235, 200, 0.95) 0%,
        rgba(160, 215, 160, 0.90) 100%
    ) !important;
    border-color: rgba(76, 175, 80, 0.80) !important;
    box-shadow: 0 4px 18px rgba(76, 175, 80, 0.35),
                inset 0 1px 0 rgba(255, 255, 255, 0.80);
    color: #1a3a1b !important;
}
.tabs a.active {
    background: linear-gradient(
        180deg,
        rgba(76, 175, 80, 0.90) 0%,
        rgba(40, 110, 43, 0.98) 100%
    ) !important;
    border-color: rgba(76, 175, 80, 0.80) !important;
    box-shadow: 0 4px 22px rgba(50, 122, 53, 0.55),
                inset 0 2px 0 rgba(255, 255, 255, 0.25),
                inset 0 -2px 0 rgba(0, 0, 0, 0.15);
    color: #fff !important;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.30);
}

[data-theme="dark"] .tabs a {
    background: linear-gradient(
        180deg,
        rgba(80, 18, 5, 0.75) 0%,
        rgba(40, 8, 2, 0.88) 100%
    ) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border: 1px solid rgba(200, 80, 40, 0.28) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.35),
                inset 0 1px 0 rgba(255,160,100,0.07) !important;
    color: rgba(255, 215, 190, 0.90) !important;
}
[data-theme="dark"] .tabs a:hover {
    background: linear-gradient(
        180deg,
        rgba(120, 28, 8, 0.88) 0%,
        rgba(60, 12, 3, 0.96) 100%
    ) !important;
    border-color: rgba(220, 100, 50, 0.45) !important;
    color: #fff !important;
}
[data-theme="dark"] .tabs a.active {
    background: linear-gradient(
        180deg,
        rgba(160, 40, 10, 0.95) 0%,
        rgba(80, 15, 5, 1.0) 100%
    ) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border: 1px solid rgba(220, 100, 50, 0.55) !important;
    box-shadow: 0 4px 18px rgba(0,0,0,0.50),
                inset 0 1px 0 rgba(255,180,120,0.18),
                inset 0 -2px 0 rgba(0,0,0,0.20) !important;
    color: #fff !important;
    text-shadow: 0 1px 4px rgba(0,0,0,0.40);
}

/* Badges */
.badge {
    background: linear-gradient(
        135deg,
        rgba(76, 175, 80, 0.35) 0%,
        rgba(50, 122, 53, 0.50) 100%
    );
    border: 1px solid rgba(255, 200, 100, 0.45);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    box-shadow: inset 0 1px 0 rgba(255, 220, 160, 0.30);
    color: #fff !important;
    font-weight: 700;
}
[data-theme="dark"] .badge {
    background: #F2F3AE!important;
    border: 1px solid rgba(255, 210, 50, 0.55) !important;
    color: #3a1a00 !important;
    font-weight: 700;
}

/* Sidebar liquid glass */
.sidebar {
    background: rgba(255, 255, 255, 0.96) !important;
    backdrop-filter: blur(20px) saturate(140%);
    -webkit-backdrop-filter: blur(20px) saturate(140%);
    margin: 0 !important;
    border-radius: 0 !important;
    border: none !important;
    border-right: 1px solid rgba(0, 0, 0, 0.08) !important;
    box-shadow: 6px 0 32px rgba(0, 0, 0, 0.18) !important;
    min-height: 100% !important;
    align-self: stretch !important;
}

/* Quand le JS rend une sidebar visible (display:block → on surcharge en flex)
   Les sidebars display:none ne sont PAS affectées car leur display:none est inline */
.sidebar[style*="display: block"],
.sidebar[style*="display:block"] {
    display: flex !important;
    flex-direction: column !important;
}

[data-theme="dark"] .sidebar {
    background: linear-gradient(
        180deg,
        rgba(80, 18, 5, 0.95) 0%,
        rgba(55, 12, 3, 0.97) 40%,
        rgba(30, 5, 1, 0.99) 100%
    ) !important;
    backdrop-filter: blur(22px) saturate(140%) !important;
    -webkit-backdrop-filter: blur(22px) saturate(140%) !important;
    border-right: 1px solid rgba(255, 100, 60, 0.18) !important;
    box-shadow: 6px 0 32px rgba(0, 0, 0, 0.55),
                inset -1px 0 0 rgba(255, 255, 255, 0.04) !important;
}

/* Bloc informations générales – carte glass neutre */
.generalInfo {
    background: rgba(255, 255, 255, 0.75) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(50, 122, 53, 0.22) !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08),
                inset 0 1px 0 rgba(255, 255, 255, 0.90);
    margin: 0.6rem !important;
    padding: 0.8rem !important;
}

[data-theme="dark"] .generalInfo {
    background: rgba(30, 40, 30, 0.55) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    border-color: rgba(200, 80, 40, 0.28) !important; !important;
    box-shadow: 0 2px 16px rgba(0,0,0,0.35),
                inset 0 1px 0 rgba(255,255,255,0.05) !important;
}

/* Footer sidebar – collé au bas de la sidebar */
.sidebar-footer {
    background: transparent !important;
    border-top: 1px solid rgba(0, 0, 0, 0.08) !important;
    margin-top: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 0 !important;
    padding: 0.8rem !important;
}

[data-theme="dark"] .sidebar-footer {
    border-top-color: rgba(255, 255, 255, 0.08) !important;
}

/* hunt-options : layout colonne centrée */
.hunt-options {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 0.5rem !important;
    padding: 0.4rem 0.6rem !important;
}

/* Date : champ glass compact, largeur auto */
.hunt-date {
    background: rgba(255, 255, 255, 0.80) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(50, 122, 53, 0.30) !important;
    border-radius: 20px !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08),
                inset 0 1px 0 rgba(255, 255, 255, 0.90);
    padding: 0.35rem 1rem !important;
    text-align: center;
    font-size: 0.88rem;
    width: auto !important;
    width: 250px !important;
    color: #1e4d20 !important;
    font-weight: 500;
}

body[data-theme="dark"] .hunt-options input.hunt-date,
body[data-theme="dark"] .hunt-options .hunt-date,
body[data-theme="dark"] .sidebar .hunt-date {
    background: linear-gradient(
        180deg,
        rgba(80, 18, 5, 0.85) 0%,
        rgba(40, 8, 2, 0.95) 100%
    ) !important;
    border: 1px solid rgba(200, 80, 40, 0.35) !important;
    border-radius: 20px !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.45),
                inset 0 1px 0 rgba(255,160,100,0.10) !important;
    color: white !important;
    font-weight: 600 !important;
    font-size: 0.88rem !important;
    width: 250px !important;
    padding: 0.35rem 1rem !important;
    text-align: center !important;
    text-shadow: 0 1px 3px rgba(0,0,0,0.55) !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}


/* Inputs, selects, boutons dans la sidebar */
.hunt-options input:not(.hunt-date),
.hunt-options select {
    background: rgba(255, 255, 255, 0.58) !important;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border: 1px solid rgba(76, 175, 80, 0.32) !important;
    border-radius: 8px !important;
    transition: background 0.2s, box-shadow 0.2s;
}
.hunt-options input:focus,
.hunt-options select:focus {
    
    box-shadow: 0 0 0 2px rgba(76, 175, 80, 0.38);
    outline: none;
}

body[data-theme="dark"] .hunt-options input,
body[data-theme="dark"] .hunt-options select {
    background: rgba(40, 55, 40, 0.50) !important;
    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
   border: 1px solid rgba(200, 80, 40, 0.35) !important;
    color: rgba(255, 215, 190, 0.95) !important;
}

/* Boutons sidebar – largeur uniforme 250px */
.hunt-options button {
    background: linear-gradient(
        180deg,
        rgba(76, 175, 80, 0.85) 0%,
        rgba(45, 115, 48, 0.97) 100%
    ) !important;
    border: 1px solid rgba(50, 122, 53, 0.50) !important;
    border-radius: 20px !important;
    box-shadow: 0 3px 12px rgba(50, 122, 53, 0.28),
                inset 0 1px 0 rgba(255, 255, 255, 0.35),
                inset 0 -1px 0 rgba(0, 0, 0, 0.12);
    color: #fff !important;
    font-weight: 600;
    font-size: 0.85rem !important;
    padding: 0.45rem 0 !important;
    width: 250px !important;
    text-align: center !important;
    display: block !important;
    transition: all 0.22s ease;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
    cursor: pointer;
}
.hunt-options button:hover {
    background: linear-gradient(
        180deg,
        rgba(90, 190, 94, 0.95) 0%,
        rgba(55, 130, 58, 1.0) 100%
    ) !important;
    box-shadow: 0 5px 18px rgba(50, 122, 53, 0.45),
                inset 0 1px 0 rgba(255, 255, 255, 0.40);
    transform: translateY(-1px);
}

[data-theme="dark"] .hunt-options button {
    background: linear-gradient(
        180deg,
        rgba(80, 18, 5, 0.85) 0%,
        rgba(40, 8, 2, 0.95) 100%
    ) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(200, 80, 40, 0.35) !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.45),
                inset 0 1px 0 rgba(255,160,100,0.10) !important;
    color: rgba(255, 215, 190, 0.95) !important;
    text-shadow: 0 1px 3px rgba(0,0,0,0.55) !important;
}
[data-theme="dark"] .hunt-options button:hover {
    background: linear-gradient(
        180deg,
        rgba(160, 40, 10, 0.92) 0%,
        rgba(80, 15, 5, 0.99) 100%
    ) !important;
    border-color: rgba(255, 120, 70, 0.50) !important;
}

/* Select commune – glass, largeur 200px comme les boutons */
.hunt-options select,
#commune-select {
    background: rgba(255, 255, 255, 0.88) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(50, 122, 53, 0.35) !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08),
                inset 0 1px 0 rgba(255, 255, 255, 0.90);
    padding: 0.40rem 0.8rem !important;
    width: 250px !important;
    font-size: 0.85rem !important;
    color: #1e4d20 !important;
    font-weight: 500;
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23327a35' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 0.7rem center !important;
    cursor: pointer;
    transition: box-shadow 0.2s, border-color 0.2s;
}

 #itinerairesSidebar .hunt-options,
 #cantonnementsSidebar .hunt-options,
 #conseilsSidebar .hunt-options {
     display: flex !important;
     flex-direction: column !important;
     align-items: stretch !important;
    
 }

 #itinerairesSidebar .hunt-options,
 #cantonnementsSidebar .hunt-options,
 #conseilsSidebar .hunt-options {
     position: sticky !important;
     top: 0 !important;
     z-index: 10 !important;
     background: inherit !important;
 }

 #itinerairesSidebar .hunt-options button,
 #cantonnementsSidebar .hunt-options button,
 #conseilsSidebar .hunt-options button {
     width: 100% !important;
     max-width: 100% !important;
 }

 #itinerairesSidebar #localite-select,
 #itinerairesSidebar #parcours-select,
 #cantonnementsSidebar #canton-select,
 #conseilsSidebar #conseil-select {
     width: 100% !important;
     max-width: 100% !important;
     margin-left: 0 !important;
     margin-right: 0 !important;
     box-sizing: border-box !important;
 }
.hunt-options select:focus,
#commune-select:focus {
    border-color: rgba(50, 122, 53, 0.65) !important;
    box-shadow: 0 0 0 3px rgba(76, 175, 80, 0.20),
                inset 0 1px 0 rgba(255, 255, 255, 0.90) !important;
    outline: none;
}

[data-theme="dark"] .hunt-options select,
[data-theme="dark"] #commune-select {
    background: linear-gradient(
           180deg,
           rgba(255, 245, 235, 0.16) 0%,
           rgba(255, 200, 160, 0.08) 100%
         ) !important;
    color: rgba(255, 215, 190, 0.95) !important;
    border-color: rgba(255, 215, 190, 0.95) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23FFD7BE' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 0.7rem center !important;
}

/* Nom du canton / parcours / conseil – titre résultat */
#cantonName, #parcoursNameInfo, #conseilName,
#localiteNameInfo, #parcoursName {
    font-size: 1rem !important;
    font-weight: 700 !important;
    color: #1e4d20 !important;
    text-align: center;
    padding: 0.3rem 0.5rem 0.1rem;
    letter-spacing: 0.01em;
}

[data-theme="dark"] #cantonName,
[data-theme="dark"] #parcoursNameInfo,
[data-theme="dark"] #conseilName,
[data-theme="dark"] #localiteNameInfo {
   color: rgba(255, 215, 190, 0.95) !important;
}

/* Panels de résultats – identiques à .generalInfo */
#cantonInfoDetails, #parcoursInfoDetails,
#resultatParcours, #resultatParcoursName,
.sub-info, #conseilInfoDetails {
    background: rgba(255, 255, 255, 0.75) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(50, 122, 53, 0.22) !important;
    border-radius: 12px !important;
    margin: 0.6rem !important;
    padding: 0.8rem !important;
    font-size: 0.85rem !important;
    color: var(--text-color) !important;
    line-height: 1.65;
}

/* Icônes FA dans cantonInfoDetails */
#cantonInfoDetails i,
#conseilInfoDetails i {
    color: #327a35 !important;
    width: 1.1em;
    margin-right: 0.25rem;
    margin-top: auto;
    flex-shrink: 0;
}

/* Ligne email en flex pour aligner icône + lien */
#cantonEmail {
    display: flex !important;
    align-items: flex-start;
    gap: 0.3rem;
}

/* Lien email – couleur texte, coupure propre */
#cantonEmail a,
#conseilInfoDetails a {
    color: var(--text-color) !important;
    text-decoration: underline;
    text-decoration-color: var(--text-color);
    overflow-wrap: break-word;
    word-break: break-word;
    display: inline-block;
    max-width: 100%;
    font-size: 0.80rem !important;
    vertical-align: middle;
}
#cantonEmail a:hover,
#conseilInfoDetails a:hover {
    color: #1e4d20 !important;
    text-decoration-color: #1e4d20;
}

[data-theme="dark"] #cantonInfoDetails,
[data-theme="dark"] #parcoursInfoDetails,
[data-theme="dark"] #resultatParcours,
[data-theme="dark"] #resultatParcoursName,
[data-theme="dark"] .sub-info,
[data-theme="dark"] #conseilInfoDetails {
    background: rgba(0, 0, 0, 0.28) !important;
    border-color:rgba(200, 80, 40, 0.28) !important;
}

[data-theme="dark"] #cantonInfoDetails i,
[data-theme="dark"] #conseilInfoDetails i {
    color: white !important;
}

/* Liste des dates de chasse */
.huntingDateList {
    background: rgba(255, 255, 255, 0.28) !important;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border: 1px solid rgba(76, 175, 80, 0.22) !important;
    border-radius: 6px;
}

[data-theme="dark"] .huntingDateList {
    background: rgba(0, 0, 0, 0.22) !important;
}

/* Tooltip de légende */
.legend-tooltip {
    background: rgba(255, 255, 255, 0.85) !important;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(76, 175, 80, 0.28);
    border-radius: 10px;
    box-shadow: 0 6px 28px rgba(0, 0, 0, 0.16);
    color: #333;
}

[data-theme="dark"] .legend-tooltip {
    background: rgba(40, 40, 40, 0.88) !important;
    color: #f4f4f4;
    border-color: rgba(76, 175, 80, 0.20);
}
.legend-tooltip::before {
    border-color: transparent transparent rgba(255, 255, 255, 0.85) transparent;
}
[data-theme="dark"] .legend-tooltip::before {
    border-color: transparent transparent rgba(40, 40, 40, 0.88) transparent;
}

/* Séparateur footer sidebar */
.sidebar-footer {
    border-top: 1px solid rgba(76, 175, 80, 0.22);
}

/* ============================================================
   Modales — liquid glass (contact, info, RGPD)
   ============================================================ */

.modal-content-info,
.modal-content-contact,
.modal-content-RGPD {
    position: absolute !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border: 1px solid rgba(255, 255, 255, 0.65) !important;
    border-radius: 22px !important;
    box-shadow: 0 20px 64px rgba(0, 0, 0, 0.22),
                inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
    padding: 36px 32px 28px !important;
}

/* Surcharge individuelle pour battre websim.css */
.modal-content-contact {
    background-color: rgba(255, 255, 255, 0.25) !important;
    background: rgba(255, 255, 255, 0.25) !important;
    border: 1px solid rgba(255, 255, 255, 0.65) !important;
    border-radius: 22px !important;
    padding: 36px 32px 28px !important;
}
.modal-content-info {
    background-color: rgba(255, 255, 255, 0.25) !important;
    background: rgba(255, 255, 255, 0.25) !important;
    border: 1px solid rgba(255, 255, 255, 0.65) !important;
    border-radius: 22px !important;
    padding: 36px 32px 28px !important;
}
.modal-content-RGPD {
    background-color: rgba(255, 255, 255, 0.25) !important;
    background: rgba(255, 255, 255, 0.25) !important;
    border: 1px solid rgba(255, 255, 255, 0.65) !important;
    border-radius: 22px !important;
    padding: 36px 32px 28px !important;
}

[data-theme="dark"] .modal-content-info,
[data-theme="dark"] .modal-content-contact,
[data-theme="dark"] .modal-content-RGPD {
    background-color: rgba(160, 40, 10, 0.65) !important;
    background: rgba(160, 40, 10, 0.65) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}

/* × bouton — positionné en haut à droite du modal */
.closeContact, .closeInfo, .closeRGPD {
    position: absolute !important;
    top: 14px !important;
    right: 18px !important;
    float: none !important;
    color: white !important;
    font-size: 1.5rem !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    opacity: 0.65 !important;
    cursor: pointer !important;
    z-index: 10 !important;
    transition: opacity 0.15s !important;
}
.closeContact:hover, .closeInfo:hover, .closeRGPD:hover {
    opacity: 1 !important;
}

/* Header — centré avec margin négatif pour compenser le padding du parent */
.modal-content-contact .modal-header,
.modal-content-info .modal-header {
    background: linear-gradient(
        180deg,
        rgba(76, 175, 80, 0.85) 0%,
        rgba(45, 115, 48, 0.97) 100%
    ) !important;
    border: 1px solid rgba(50, 122, 53, 0.45) !important;
    border-radius: 12px !important;
    color: white!important;
    font-size: 1.55rem !important;
    font-weight: 700 !important;
    text-align: center !important;
    padding: 14px 16px !important;
    margin: 0 0 22px 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    letter-spacing: 0.01em !important;
    display: block !important;
    border-radius: 12px !important;
}

/* Titre modal info */
.modal-content-info .modal-title {
    font-size: 1.55rem !important;
    font-weight: 700 !important;
    text-align: center !important;
    color: white !important;
    letter-spacing: 0.01em !important;
    text-shadow: none !important;
    margin: 0 !important;
}

/* Fallback contenu modal information */
.download-all-container {
    text-align: center;
    margin: 20px 0;
}

.btn-download {
    display: inline-block;
    padding: 10px 20px;
    background-color: var(--button-color);
    color: var(--text-color);
    text-decoration: none;
    border-radius: 5px;
    font-weight: bold;
    transition: background-color 0.3s ease;
}

.btn-download:hover {
    background-color: var(--button-hover);
}

body.dark-theme .btn-download {
    background-color: var(--button-color);
    color: var(--text-color);
}

body.dark-theme .btn-download:hover {
    background-color: var(--button-hover);
}

.fr-only-notice {
    margin: 12px 0;
    padding: 8px 12px;
    border-left: 4px solid #f39c12;
    background: rgba(243, 156, 18, 0.12);
    color: #c2902b;
    font-size: 0.95rem;
}

body.dark-theme .fr-only-notice {
    background: rgba(243, 156, 18, 0.18);
    color: #f0c674;
}

/* Bouton télécharger toutes les fiches */
.modal-content-info .btn-download {
    display: inline-block !important;
    background: linear-gradient(160deg,
        rgba(76, 175, 80, 0.85) 0%,
        rgba(40, 110, 43, 0.95) 100%
    ) !important;
    color: #fff !important;
    border: 1px solid rgba(50, 122, 53, 0.45) !important;
    border-radius: 10px !important;
    padding: 9px 20px !important;
    font-weight: 600 !important;
    font-size: 0.9rem !important;
    text-decoration: none !important;
    box-shadow: 0 3px 12px rgba(50, 122, 53, 0.28) !important;
    transition: all 0.20s ease !important;
    cursor: pointer !important;
}
.modal-content-info .btn-download:hover {
    background: linear-gradient(160deg,
        rgba(90, 190, 94, 0.92) 0%,
        rgba(52, 130, 55, 1.0) 100%
    ) !important;
    box-shadow: 0 5px 18px rgba(50, 122, 53, 0.40) !important;
    transform: translateY(-1px) !important;
}

[data-theme="dark"] .modal-content-contact .modal-header,
[data-theme="dark"] .modal-content-info .modal-header {
    background: linear-gradient(
        180deg,
        rgba(160, 40, 10, 0.65) 0%,
        rgba(50, 8, 2, 0.80) 100%
    ) !important;
    border: 1px solid rgba(50, 122, 53, 0.45) !important;
    border-radius: 12px !important;
    color: white!important;
    font-size: 1.55rem !important;
    font-weight: 700 !important;
    text-align: center !important;
    padding: 14px 16px !important;
    margin: 0 0 22px 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    letter-spacing: 0.01em !important;
    display: block !important;
    border-radius: 12px !important;
}

[data-theme="dark"] .modal-content-info .btn-download {
    background: linear-gradient(
            180deg,
            rgba(80, 18, 5, 0.85) 0%,
            rgba(40, 8, 2, 0.95) 100%
    ) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(200, 80, 40, 0.35) !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.45),
                inset 0 1px 0 rgba(255,160,100,0.10) !important;
    color: rgba(255, 215, 190, 0.95) !important;
    text-shadow: 0 1px 3px rgba(0,0,0,0.55) !important;
}

[data-theme="dark"] .modal-content-info .btn-download:hover{
    background: linear-gradient(180deg, rgba(160, 40, 10, 0.92) 0%, rgba(80, 15, 5, 0.99) 100%) !important;
    border-color: rgba(255, 120, 70, 0.50) !important;
}
/* Bouton Télécharger la brochure */
[data-theme="dark"] .modal-content-info .download-link {
    display: inline-block !important;
    background: linear-gradient(
            180deg,
            rgba(80, 18, 5, 0.85) 0%,
            rgba(40, 8, 2, 0.95) 100%
    ) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(200, 80, 40, 0.35) !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.45),
                inset 0 1px 0 rgba(255,160,100,0.10) !important;
    color: rgba(255, 215, 190, 0.95) !important;
    text-shadow: 0 1px 3px rgba(0,0,0,0.55) !important;
}
[data-theme="dark"] .modal-content-info .download-link:hover {
    background: linear-gradient(180deg, rgba(160, 40, 10, 0.92) 0%, rgba(80, 15, 5, 0.99) 100%) !important;
    border-color: rgba(255, 120, 70, 0.50) !important;
}

.modal-content-info .download-link {
    display: inline-block !important;
    background: linear-gradient(160deg,
        rgba(76, 175, 80, 0.85) 0%,
        rgba(40, 110, 43, 0.95) 100%
    ) !important;
    color: #fff !important;
    border: 1px solid rgba(50, 122, 53, 0.45) !important;
    border-radius: 10px !important;
    padding: 10px 24px !important;
    font-weight: 600 !important;
    font-size: 0.95rem !important;
    text-decoration: none !important;
    box-shadow: 0 3px 12px rgba(50, 122, 53, 0.28),
                inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
    transition: all 0.20s ease !important;
    cursor: pointer !important;
    text-align: center !important;
}
.modal-content-info .download-link:hover {
    background: linear-gradient(160deg,
        rgba(90, 190, 94, 0.92) 0%,
        rgba(52, 130, 55, 1.0) 100%
    ) !important;
    box-shadow: 0 5px 18px rgba(50, 122, 53, 0.40) !important;
    transform: translateY(-1px) !important;
}

/* Bouton Mentions légales */
.modal-content-info .RGPDModalBtn {
    color: #2a5c2d !important;
    font-weight: 600 !important;
    font-size: 0.85rem !important;
    text-decoration: underline !important;
    cursor: pointer !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    transition: color 0.15s !important;
}
.modal-content-info .RGPDModalBtn:hover {
    color: #1a4d1c !important;
}

/* Labels */
.modal-content-contact .form-label {
    color: #2a5c2d !important;
    font-weight: 600 !important;
    font-size: 0.88rem !important;
}

[data-theme="dark"] .modal-content-contact .form-label {
    color: white !important;
    font-weight: 600 !important;
    font-size: 0.88rem !important;
}

/* Inputs & textarea */
.modal-content-contact .form-control,
.modal-content-contact input[type="text"],
.modal-content-contact input[type="email"],
.modal-content-contact textarea {
    background: rgba(255, 255, 255, 0.50) !important;
    border: 1px solid rgba(50, 122, 53, 0.28) !important;
    border-radius: 10px !important;
    color: #1e3d20 !important;
    padding: 10px 14px !important;
    font-size: 0.95rem !important;
    box-shadow: inset 0 1px 3px rgba(0,0,0,0.05) !important;
    transition: border-color 0.18s, box-shadow 0.18s !important;
    width: 100% !important;
}
.modal-content-contact .form-control:focus,
.modal-content-contact input[type="text"]:focus,
.modal-content-contact input[type="email"]:focus,
.modal-content-contact textarea:focus {
    border-color: rgba(50, 122, 53, 0.65) !important;
    box-shadow: 0 0 0 3px rgba(50, 122, 53, 0.14) !important;
    outline: none !important;
    background: rgba(255, 255, 255, 0.72) !important;
}

/* Checkbox */
.modal-content-contact .form-check-label {
    color: #2a5c2d !important;
    font-size: 0.88rem !important;
}
.modal-content-contact .form-check-input:checked {
    background-color: #327a35 !important;
    border-color: #327a35 !important;
}

[data-theme="dark"] .modal-content-contact .form-check-label {
    color: white !important;
    font-size: 0.88rem !important;
}

/* Bouton Envoyer */
.contactModalBtn {
    background: linear-gradient(160deg,
        rgba(76, 175, 80, 0.92) 0%,
        rgba(40, 110, 43, 0.98) 100%
    ) !important;
    border: 1px solid rgba(50, 122, 53, 0.45) !important;
    border-radius: 12px !important;
    color: #fff !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
    padding: 11px 0 !important;
    width: 100% !important;
    box-shadow: 0 4px 18px rgba(50, 122, 53, 0.28),
                inset 0 1px 0 rgba(255, 255, 255, 0.28) !important;
    cursor: pointer !important;
    transition: all 0.20s ease !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.20) !important;
}
.contactModalBtn:hover {
    background: linear-gradient(160deg,
        rgba(90, 190, 94, 0.95) 0%,
        rgba(52, 130, 55, 1.0) 100%
    ) !important;
    box-shadow: 0 6px 24px rgba(50, 122, 53, 0.42) !important;
    transform: translateY(-1px) !important;
}

[data-theme="dark"] .contactModalBtn {
    display: inline-block !important;
    background: linear-gradient(
            180deg,
            rgba(80, 18, 5, 0.85) 0%,
            rgba(40, 8, 2, 0.95) 100%
    ) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(200, 80, 40, 0.35) !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.45),
                inset 0 1px 0 rgba(255,160,100,0.10) !important;
    color: rgba(255, 215, 190, 0.95) !important;
    text-shadow: 0 1px 3px rgba(0,0,0,0.55) !important;
}

[data-theme="dark"] i.fa-paper-plane {
    color: rgba(255, 215, 190, 0.95) !important;
}


[data-theme="dark"] .contactModalBtn:hover {
    background: linear-gradient(180deg, rgba(160, 40, 10, 0.92) 0%, rgba(80, 15, 5, 0.99) 100%) !important;
    border-color: rgba(255, 120, 70, 0.50) !important;
}
/* Backdrop des modales */
.modal {
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

 .flatpickr-calendar {
     z-index: 200000 !important;
 }


/* Download button Excel – même style que les boutons sidebar */
.download-button {
    background: linear-gradient(
        180deg,
        rgba(76, 175, 80, 0.85) 0%,
        rgba(45, 115, 48, 0.97) 100%
    ) !important;
    border: 1px solid rgba(50, 122, 53, 0.50) !important;
    border-radius: 20px !important;
    box-shadow: 0 3px 12px rgba(50, 122, 53, 0.28),
                inset 0 1px 0 rgba(255, 255, 255, 0.35);
    color: #fff !important;
    font-weight: 600;
    font-size: 0.85rem !important;
    padding: 0.45rem 1.2rem !important;
    width: 250px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5rem !important;
    cursor: pointer;
    text-shadow: 0 1px 3px rgba(0,0,0,0.25);
    transition: all 0.22s ease;
}
.download-button:hover {
    background: linear-gradient(
        180deg,
        rgba(90, 190, 94, 0.95) 0%,
        rgba(55, 130, 58, 1.0) 100%
    ) !important;
    box-shadow: 0 5px 18px rgba(50, 122, 53, 0.45);
    transform: translateY(-1px);
}
.download-button img {
    filter: brightness(0) invert(1);
    width: 18px !important;
    height: 18px !important;
}

[data-theme="dark"] .download-button {
    background: linear-gradient(
        180deg,
        rgba(80, 18, 5, 0.85) 0%,
        rgba(40, 8, 2, 0.95) 100%
    ) !important;
    border: 1px solid rgba(50, 122, 53, 0.50) !important;
    border-radius: 20px !important;
    box-shadow: 0 3px 12px rgba(50, 122, 53, 0.28),
                inset 0 1px 0 rgba(255, 255, 255, 0.35);
    color: rgba(255, 215, 190, 0.95)!important;
    font-weight: 600;
    font-size: 0.85rem !important;
    padding: 0.45rem 1.2rem !important;
    width: 250px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5rem !important;
    cursor: pointer;
    text-shadow: 0 1px 3px rgba(0,0,0,0.25);
    transition: all 0.22s ease;
}
[data-theme="dark"] .download-button:hover {
    background: linear-gradient(180deg, rgba(160, 40, 10, 0.92) 0%, rgba(80, 15, 5, 0.99) 100%) !important;
    box-shadow: 0 5px 18px rgba(50, 122, 53, 0.45);
    transform: translateY(-1px);
}
[data-theme="dark"] .download-button img {
    filter: none;
    width: 18px !important;
    height: 18px !important;
}

/* Contrôles Leaflet – harmonisation */
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
    background: rgba(255, 255, 255, 0.72) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.40) !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.14);
}

/* Zone GPX upload – même marges que generalInfo, aucune bordure propre */
#resultatGPX {
    margin: 0.6rem !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
    box-shadow: none !important;
}

.drop-section {
    background: rgba(255, 255, 255, 0.75) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(50, 122, 53, 0.22) !important;
    border-radius: 12px !important;
    padding: 0.4rem 0.8rem 0.5rem !important;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.15rem;
    text-align: center;
}

[data-theme="dark"] .drop-section {
    background: rgba(30, 40, 30, 0.55) !important;
    border: 1px solid rgba(200, 80, 40, 0.28) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-radius: 12px !important;
    padding: 0.4rem 0.8rem 0.5rem !important;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.15rem;
    text-align: center;
}

/* Titre CHARGER LE FICHIER – masqué (redondant avec infoGPXMenu) */
#titleNameGPX {
    display: none !important;
}

/* Icone cloud – vert charte, taille compacte */
.cloud-icon {
    font-size: 1.4rem;
    line-height: 1;
    margin: 0.1rem 0;
}
.cloud-icon i,
.cloud-icon .fa-cloud-arrow-up,
.cloud-icon .fas {
    color: #327a35 !important;
    filter: drop-shadow(0 1px 3px rgba(50, 122, 53, 0.25));
    font-size: 2rem !important;
}

[data-theme="dark"] .cloud-icon i,
[data-theme="dark"] .cloud-icon .fa-cloud-arrow-up,
[data-theme="dark"] .cloud-icon .fas {
    color: rgba(255, 215, 190, 0.95) !important;
    filter: drop-shadow(0 1px 3px rgba(50, 122, 53, 0.25));
    font-size: 2rem !important;
}


/* Bouton Parcourir – capsule sobre */
#gpxFileInputButton {
    background: rgba(255, 255, 255, 0.90) !important;
    border: 1px solid rgba(50, 122, 53, 0.40) !important;
    border-radius: 20px !important;
    box-shadow: 0 2px 8px rgba(50, 122, 53, 0.15),
                inset 0 1px 0 rgba(255, 255, 255, 0.95);
    color: #1e4d20 !important;
    font-size: 0.82rem !important;
    font-weight: 600;
    padding: 0.35rem 1.2rem !important;
    width: auto !important;
    cursor: pointer;
    transition: all 0.20s ease;
}
#gpxFileInputButton:hover {
    background: rgba(240, 252, 240, 0.98) !important;
    border-color: rgba(50, 122, 53, 0.65) !important;
    box-shadow: 0 3px 12px rgba(50, 122, 53, 0.22);
}

[data-theme="dark"] #gpxFileInputButton {
    background: rgba(255,215,190,0.1) !important;
    border-radius: 20px !important;
    box-shadow: none !important;
    border-color: rgba(200, 80, 40, 0.28) !important;
    color: rgba(255, 215, 190, 0.95) !important;
    font-size: 0.82rem !important;
    font-weight: 600;
    padding: 0.35rem 1.2rem !important;
    width: auto !important;
    cursor: pointer;
    transition: all 0.20s ease;
}
[data-theme="dark"] #gpxFileInputButton:hover {
    background: rgba(200, 80, 40, 0.28) !important;
    border: none !important;
    color: rgba(255, 215, 190, 0.95) !important;
}

[data-theme="dark"] #titleNameGPX {
    color: rgba(255, 215, 190, 0.95) !important;
}
[data-theme="dark"] .cloud-icon {
    color: rgba(255, 215, 190, 0.95) !important; 
}

.zoneInfo {
    color: #1e4d20 ;
}
[data-theme="dark"] .zoneInfo {
    color: #F2F3AE !important;
}


.parcoursLocalite.active{
    background: linear-gradient(180deg, rgba(160, 40, 10, 0.65) 0%, rgba(50, 8, 2, 0.80) 100%) !important;
    border: none !important;
}

/* ============================================================
   LAYER CONTROL
   ============================================================ */

/* Conteneur replié : transparent, sans padding — seul le toggle est visible */
.leaflet-control-layers:not(.leaflet-control-layers-expanded) {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
}

/* Conteneur déplié (liste visible) : glass */
.leaflet-control-layers-expanded {
    background: rgba(255, 255, 255, 0.88) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    border: 1px solid rgba(50, 122, 53, 0.22) !important;
    border-radius: 14px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12),
                inset 0 1px 0 rgba(255, 255, 255, 0.90) !important;
    padding: 10px 14px !important;
    color: #1e4d20 !important;
}

/* Labels */
.leaflet-control-layers-base label {
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    font-size: 0.85rem !important;
    font-weight: 500 !important;
    color: var(--input-border) !important; 
    padding: 4px 0 !important;
    cursor: pointer !important;
}

/* Radio */
.leaflet-control-layers-selector {
    accent-color: var(--input-border) !important; 
    cursor: pointer !important;
    margin: 0 !important;
}

[data-theme="dark"] .leaflet-control-layers-expanded {
    background: rgba(255, 255, 255, 0.18) !important;
    border-color: rgba(76, 175, 80, 0.30) !important;
}
[data-theme="dark"] .leaflet-control-layers-base label {
    color: var(--input-border) !important; 
}

/* ============================================================
   3 BOUTONS TOPRIGHT uniformes 44x44 : layers + Points-Nœuds + RainViewer
   ============================================================ */

/* --- Style glass commun appliqué sur le bon élément --- */

/* 1. Layers toggle : élément direct */
.leaflet-control-layers-toggle,
.leaflet-touch .leaflet-control-layers-toggle {
    width: 44px !important;
    height: 44px !important;
    background-color: rgba(255, 255, 255, 0.82) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    border: 1px solid rgba(50, 122, 53, 0.22) !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12),
                inset 0 1px 0 rgba(255, 255, 255, 0.90) !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
    transition: background-color 0.20s ease !important;
}
.leaflet-control-layers-toggle:hover {
    background-color: rgba(240, 252, 240, 0.95) !important;
}

/* 2. RainViewer toggle : <a> affiché seulement quand panneau fermé */
/* Le natif cache déjà le <a> via .leaflet-control-rainviewer-active a { display:none } */
/* On style uniquement le bouton replié */
.leaflet-control-rainviewer:not(.leaflet-control-rainviewer-active) a.leaflet-control-rainviewer-button {
    width: 44px !important;
    height: 44px !important;
    background-color: rgba(255, 255, 255, 0.82) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    border: 1px solid rgba(50, 122, 53, 0.22) !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12),
                inset 0 1px 0 rgba(255, 255, 255, 0.90) !important;
    box-sizing: border-box !important;
    display: block !important;
}
.leaflet-control-rainviewer:not(.leaflet-control-rainviewer-active) a.leaflet-control-rainviewer-button:hover {
    background-color: rgba(240, 252, 240, 0.95) !important;
}
/* Neutraliser le .leaflet-touch .leaflet-bar générique sur le conteneur rainviewer */
.leaflet-touch .leaflet-control-rainviewer.leaflet-bar,
.leaflet-control-rainviewer.leaflet-bar {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

/* 3. Points-Nœuds : conteneur div.leaflet-bar */
.leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl {
    width: 44px !important;
    height: 44px !important;
    background: rgba(255, 255, 255, 0.82) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    border: 1px solid rgba(50, 122, 53, 0.22) !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12),
                inset 0 1px 0 rgba(255, 255, 255, 0.90) !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    opacity: 1 !important;
    padding: 0 !important;
}
.leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl:hover {
    background: rgba(240, 252, 240, 0.95) !important;
}
.leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl .plf-nodepoints-btn {
    width: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    background-size: 26px 26px !important;
    background-position: center !important;
}
.plf-nodepoints-ctl.is-active {
    border-color: rgba(50, 122, 53, 0.55) !important;
}

/* Dark mode icônes : background-color uniquement pour préserver les background-image */
[data-theme="dark"] .leaflet-control-layers-toggle,
[data-theme="dark"] .leaflet-touch .leaflet-control-layers-toggle {
    background-color: rgba(255, 255, 255, 0.88) !important;
    border-color: rgba(0, 0, 0, 0.15) !important;
}
[data-theme="dark"] .leaflet-control-rainviewer .leaflet-control-rainviewer-button {
    background-color: rgba(255, 255, 255, 0.88) !important;
    border-color: rgba(0, 0, 0, 0.15) !important;
}
[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl {
    background-color: rgba(255, 255, 255, 0.88) !important;
    border-color: rgba(0, 0, 0, 0.15) !important;
}

/* ============================================================
   MINIMAP – Liquid Glass border
   ============================================================ */
.leaflet-control-minimap {
    border: 2px solid rgba(50, 122, 53, 0.35) !important;
    border-radius: 10px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.18),
                inset 0 1px 0 rgba(255, 255, 255, 0.50) !important;
    overflow: hidden !important;
    backdrop-filter: blur(2px) !important;
}

[data-theme="dark"] .leaflet-control-minimap {
    border-color: rgba(76, 175, 80, 0.40) !important;
}

/* ============================================================
   RAINVIEWER – liquid glass
   ============================================================ */

/* Neutraliser le .leaflet-bar générique sur le conteneur replié */
.leaflet-touch .leaflet-control-rainviewer.leaflet-bar,
.leaflet-control-rainviewer.leaflet-bar {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Panneau actif – mode clair */
.leaflet-touch .leaflet-control-rainviewer.leaflet-bar.leaflet-control-rainviewer-active,
.leaflet-touch .leaflet-control-rainviewer-active,
.leaflet-control-rainviewer-active {
    position: relative !important;
    overflow: visible !important;
    background: rgba(255, 255, 255, 0.18) !important;
    backdrop-filter: blur(16px) saturate(100%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(160%) !important;
    border: 1px solid rgba(50, 122, 53, 0.25) !important;
    border-radius: 14px !important;
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.15),
                inset 0 1px 0 rgba(255, 255, 255, 0.90) !important;
    color: #1e4d20 !important;
    padding: 20px 20px !important;
}

/* Boutons prev / start-stop / next */
.leaflet-control-rainviewer-prev,
.leaflet-control-rainviewer-startstop,
.leaflet-control-rainviewer-next {
    background: linear-gradient(180deg, rgba(76,175,80,0.85) 0%, rgba(45,115,48,0.97) 100%) !important;
    border: 1px solid rgba(50, 122, 53, 0.50) !important;
    border-radius: 20px !important;
    color: #fff !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    padding: 6px 12px !important;
    transition: background 0.18s ease !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.25) !important;
}
.leaflet-control-rainviewer-prev:hover,
.leaflet-control-rainviewer-startstop:hover,
.leaflet-control-rainviewer-next:hover {
    background: linear-gradient(180deg, rgba(90,190,94,0.95) 0%, rgba(55,130,58,1.0) 100%) !important;
}

/* Labels */
.leaflet-control-rainviewer-label {
    color: #1e4d20 !important;
    font-size: 0.82rem !important;
    font-weight: 600 !important;
}

/* Sliders */
.leaflet-control-rainviewer-positionslider,
.leaflet-control-rainviewer-opacityslider {
    accent-color: #327a35 !important;
    width: 100% !important;
}

/* Timestamp */
.leaflet-control-rainviewer-timestamp {
    color: #1e4d20 !important;
    font-size: 0.80rem !important;
    font-weight: 500 !important;
}

/* Fermeture × */
.leaflet-control-rainviewer-close {
    z-index: 10 !important;
    pointer-events: auto !important;
    cursor: pointer !important;
    opacity: 0.6 !important;
}
.leaflet-control-rainviewer-close:hover { opacity: 1 !important; }
.leaflet-control-rainviewer-close:before,
.leaflet-control-rainviewer-close:after {
    background-color: #1e4d20 !important;
}

/* ── Dark mode ── */
[data-theme="dark"] .leaflet-control-rainviewer-active {
    background: linear-gradient(180deg, rgba(55,12,3,0.97) 0%, rgba(30,5,1,0.99) 100%) !important;
    backdrop-filter: blur(20px) saturate(140%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(140%) !important;
    border: 1px solid rgba(200, 80, 40, 0.22) !important;
    box-shadow: 0 8px 32px rgba(0,0,0,0.55) !important;
    color: rgba(255, 215, 190, 0.95) !important;
}
[data-theme="dark"] .leaflet-control-rainviewer-prev,
[data-theme="dark"] .leaflet-control-rainviewer-startstop,
[data-theme="dark"] .leaflet-control-rainviewer-next {
    background: linear-gradient(180deg, rgba(80,18,5,0.85) 0%, rgba(40,8,2,0.95) 100%) !important;
    border: 1px solid rgba(200, 80, 40, 0.38) !important;
    border-radius: 20px !important;
    color: rgba(255, 215, 190, 0.95) !important;
    text-shadow: 0 1px 3px rgba(0,0,0,0.55) !important;
}
[data-theme="dark"] .leaflet-control-rainviewer-prev:hover,
[data-theme="dark"] .leaflet-control-rainviewer-startstop:hover,
[data-theme="dark"] .leaflet-control-rainviewer-next:hover {
    background: linear-gradient(180deg, rgba(160,40,10,0.92) 0%, rgba(80,15,5,0.99) 100%) !important;
}
[data-theme="dark"] .leaflet-control-rainviewer-label,
[data-theme="dark"] .leaflet-control-rainviewer-timestamp {
    color: rgba(160,40,10,0.92) !important;
    font-weight: 600 !important;
}
[data-theme="dark"] .leaflet-control-rainviewer-positionslider,
[data-theme="dark"] .leaflet-control-rainviewer-opacityslider {
    accent-color: rgba(200, 80, 40, 1) !important;
}
[data-theme="dark"] .leaflet-control-rainviewer-close:before,
[data-theme="dark"] .leaflet-control-rainviewer-close:after {
    background-color: rgba(160,40,10,0.92) !important;
}

/* ── Mobile hunt-date : couleurs date + icone calendrier ── */

/* ========== MOBILE STYLES (max-width: 600px) ========== */
@media screen and (max-width: 600px) {
     /* Hamburger (mobile uniquement) */
     .hamburger-menu,
     [data-theme="dark"] .hamburger-menu {
         position: fixed !important;
         top: 18px !important;
         right: 18px !important;
         z-index: 99999 !important;
         display: flex !important;
         pointer-events: auto !important;
     }

     nav {
         background: transparent !important;
         border-bottom: 0 !important;
         box-shadow: none !important;
         backdrop-filter: none !important;
         -webkit-backdrop-filter: none !important;
         padding: 0 !important;
         margin: 0 !important;
     }

     body > #mainMenu.tabs.active {
         position: fixed !important;
     }

     header,
     nav {
         overflow: visible !important;
     }

     body.plf-chasses-hud #chassesSidebar .generalInfo {
         display: none !important;
     }

     body.plf-chasses-hud #chassesSidebar {
         display: none !important;
     }

     body.plf-itineraires-hud #itinerairesSidebar .generalInfo {
         display: none !important;
     }

     body.plf-itineraires-hud #itinerairesSidebar {
         display: none !important;
     }

     body.plf-cantonnements-hud #cantonnementsSidebar .generalInfo {
         display: none !important;
     }

     body.plf-cantonnements-hud #cantonnementsSidebar {
         display: none !important;
     }

     body.plf-conseils-hud #conseilsSidebar .generalInfo {
         display: none !important;
     }

     body.plf-conseils-hud #conseilsSidebar {
         display: none !important;
     }

     body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud {
         position: fixed !important;
         top: calc(210px + env(safe-area-inset-top, 0px)) !important;
         left: 12px !important;
         right: 12px !important;
         z-index: 1201 !important;
         display: grid !important;
         position: fixed !important;
         isolation: isolate !important;
         grid-template-columns: 1fr 1fr !important;
         grid-template-areas:
           "date gps"
           "commune mapos"
           "select select"
           "coords coords" !important;
         grid-auto-rows: auto !important;
         grid-auto-flow: row !important;
         gap: 8px !important;
         padding: 10px !important;
         padding-right: 44px !important;
         border-radius: 18px !important;
         background: linear-gradient(
            180deg,
            rgba(35, 95, 38, 0.78) 0%,
            rgba(80, 122, 40, 0.52) 100%
         ) !important;
         backdrop-filter: blur(14px) saturate(160%) !important;
         -webkit-backdrop-filter: blur(14px) saturate(160%) !important;
         border: 1px solid rgba(255, 160, 100, 0.18) !important;
         box-shadow: 0 16px 40px rgba(0,0,0,0.35) !important;
         pointer-events: auto !important;
         box-sizing: border-box !important;
     }

     body.plf-itineraires-hud .map-container .hunt-options.plf-hunt-options-hud {
         grid-template-areas:
           "date localite"
           "parcours gpx"
           "localiteSel localiteSel"
           "parcoursSel parcoursSel" !important;
     }

     body.plf-itineraires-hud .map-container .hunt-options.plf-hunt-options-hud.plf-itineraires-detail-hud {
         display: block !important;
         max-height: calc(100vh - 250px) !important;
         overflow-y: auto !important;
         padding-right: 48px !important;
     }

     body.plf-itineraires-hud .map-container .hunt-options.plf-hunt-options-hud.plf-itineraires-detail-hud .plf-route-detail-close {
         position: absolute !important;
         top: 10px !important;
         right: 10px !important;
         width: 34px !important;
         height: 34px !important;
         min-width: 34px !important;
         border-radius: 50% !important;
         padding: 0 !important;
         line-height: 1 !important;
         font-size: 22px !important;
     }

     body.plf-itineraires-hud .map-container .hunt-options.plf-hunt-options-hud.plf-itineraires-detail-hud .plf-route-detail-card {
         color: rgba(255, 245, 235, 0.96) !important;
         font-size: 13px !important;
         line-height: 1.35 !important;
     }

     body.plf-itineraires-hud .map-container .hunt-options.plf-hunt-options-hud.plf-itineraires-detail-hud .plf-route-detail-title {
         margin: 0 0 8px 0 !important;
         font-weight: 800 !important;
         font-size: 15px !important;
     }

     body.plf-itineraires-hud .map-container .hunt-options.plf-hunt-options-hud.plf-itineraires-detail-hud .plf-route-detail-lines > div {
         margin: 3px 0 !important;
     }

     body.plf-itineraires-hud .map-container .hunt-options.plf-hunt-options-hud.plf-itineraires-detail-hud .plf-route-detail-lines a {
         color: rgba(255, 245, 235, 0.98) !important;
         text-decoration: underline !important;
     }

     body.plf-cantonnements-hud .map-container .hunt-options.plf-hunt-options-hud {
         grid-template-areas:
           "date canton"
           "select select" !important;
     }

     body.plf-conseils-hud .map-container .hunt-options.plf-hunt-options-hud {
         grid-template-areas:
           "date conseil"
           "select select" !important;
     }

     body.plf-itineraires-hud .map-container .hunt-options.plf-hunt-options-hud #hunt-date-itineraires {
         grid-area: date !important;
     }

     body.plf-itineraires-hud .map-container .hunt-options.plf-hunt-options-hud #sartLocalite {
         grid-area: localite !important;
     }

     body.plf-itineraires-hud .map-container .hunt-options.plf-hunt-options-hud #sartParcours {
         grid-area: parcours !important;
     }

     body.plf-itineraires-hud .map-container .hunt-options.plf-hunt-options-hud #GPX-Import {
         grid-area: gpx !important;
     }

     body.plf-itineraires-hud .map-container .hunt-options.plf-hunt-options-hud #localite-select {
         grid-area: localiteSel !important;
     }

     body.plf-itineraires-hud .map-container .hunt-options.plf-hunt-options-hud #parcours-select {
         grid-area: parcoursSel !important;
     }

     body.plf-cantonnements-hud .map-container .hunt-options.plf-hunt-options-hud #hunt-date-cantons {
         grid-area: date !important;
     }

     body.plf-cantonnements-hud .map-container .hunt-options.plf-hunt-options-hud #canton {
         grid-area: canton !important;
     }

     body.plf-cantonnements-hud .map-container .hunt-options.plf-hunt-options-hud #canton-select {
         grid-area: select !important;
     }

     body.plf-conseils-hud .map-container .hunt-options.plf-hunt-options-hud #hunt-date-conseils {
         grid-area: date !important;
     }

     body.plf-conseils-hud .map-container .hunt-options.plf-hunt-options-hud #conseil {
         grid-area: conseil !important;
     }

     body.plf-conseils-hud .map-container .hunt-options.plf-hunt-options-hud #conseil-select {
         grid-area: select !important;
     }

     body.plf-gpx-import-loaded #chassesSidebar .generalInfo,
     body.plf-gpx-import-loaded #chassesSidebar .zoneInfo,
     body.plf-gpx-import-loaded #chassesSidebar .sectionInfoChemins,
     body.plf-gpx-import-loaded #chassesSidebar .sidebar-footer {
         display: none !important;
     }

     body.plf-gpx-import-loaded .zoneInfo,
     body.plf-gpx-import-loaded .sectionInfoChemins,
     body.plf-gpx-import-loaded #squareOpen,
     body.plf-gpx-import-loaded #squareStalking,
     body.plf-gpx-import-loaded #squareClose,
     body.plf-gpx-import-loaded .cheminsOuverts,
     body.plf-gpx-import-loaded .cheminsFermesAffuts,
     body.plf-gpx-import-loaded .cheminsFermesBattues,
     body.plf-gpx-import-loaded #mobileItinerairesOverlay,
     body.plf-gpx-import-loaded .mobile-chasses-overlay {
         display: none !important;
     }

     body.plf-itineraires-hud .map-container .hunt-options.plf-hunt-options-hud,
     body.plf-cantonnements-hud .map-container .hunt-options.plf-hunt-options-hud,
     body.plf-conseils-hud .map-container .hunt-options.plf-hunt-options-hud {
         position: fixed !important;
         top: calc(210px + env(safe-area-inset-top, 0px)) !important;
         left: 12px !important;
         right: 12px !important;
         z-index: 1201 !important;
         display: grid !important;
         isolation: isolate !important;
         grid-template-columns: 1fr 1fr !important;
         gap: 8px !important;
         padding: 10px !important;
         padding-right: 44px !important;
         border-radius: 18px !important;
         background: linear-gradient(
            180deg,
            rgba(35, 95, 38, 0.78) 0%,
            rgba(80, 122, 40, 0.52) 100%
         ) !important;
         backdrop-filter: blur(14px) saturate(160%) !important;
         -webkit-backdrop-filter: blur(14px) saturate(160%) !important;
         border: 1px solid rgba(255, 160, 100, 0.18) !important;
         box-shadow: 0 16px 40px rgba(0,0,0,0.35) !important;
         pointer-events: auto !important;
         box-sizing: border-box !important;
     }

     body[data-theme="dark"].plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud {
         background: linear-gradient(
           180deg,
           rgba(60, 12, 3, 0.78) 0%,
           rgba(25, 5, 1, 0.52) 100%
         ) !important;
         border-color: rgba(255, 160, 100, 0.22) !important;
         box-shadow: 0 18px 46px rgba(0,0,0,0.55) !important;
     }

     body[data-theme="dark"].plf-itineraires-hud .map-container .hunt-options.plf-hunt-options-hud,
     body[data-theme="dark"].plf-cantonnements-hud .map-container .hunt-options.plf-hunt-options-hud,
     body[data-theme="dark"].plf-conseils-hud .map-container .hunt-options.plf-hunt-options-hud {
         background: linear-gradient(
           180deg,
           rgba(60, 12, 3, 0.78) 0%,
           rgba(25, 5, 1, 0.52) 100%
         ) !important;
         border-color: rgba(255, 160, 100, 0.22) !important;
         box-shadow: 0 18px 46px rgba(0,0,0,0.55) !important;
     }

     body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud .plf-hud-close {
         position: absolute !important;
         top: 10px !important;
         right: 10px !important;
         width: 34px !important;
         height: 34px !important;
         border-radius: 12px !important;
         border: 1px solid rgba(255, 255, 255, 0.18) !important;
         background: rgba(0, 0, 0, 0.18) !important;
         background-color: rgba(0, 0, 0, 0.18) !important;
         background-image: none !important;
         color: rgba(255, 255, 255, 0.95) !important;
         cursor: pointer !important;
         display: grid !important;
         place-items: center !important;
         line-height: 1 !important;
         font-size: 18px !important;
         z-index: 2 !important;
     }

     body.plf-itineraires-hud .map-container .hunt-options.plf-hunt-options-hud .plf-hud-close,
     body.plf-cantonnements-hud .map-container .hunt-options.plf-hunt-options-hud .plf-hud-close,
     body.plf-conseils-hud .map-container .hunt-options.plf-hunt-options-hud .plf-hud-close {
         position: absolute !important;
         top: 10px !important;
         right: 10px !important;
         width: 34px !important;
         height: 34px !important;
         border-radius: 12px !important;
         border: 1px solid rgba(255, 255, 255, 0.18) !important;
         background: rgba(0, 0, 0, 0.28) !important;
         color: rgba(255, 255, 255, 0.95) !important;
         cursor: pointer !important;
         display: grid !important;
         place-items: center !important;
         line-height: 1 !important;
         font-size: 18px !important;
         z-index: 2 !important;
     }

     body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud .plf-hud-close:hover,
     body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud .plf-hud-close:active,
     body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud .plf-hud-close:focus {
         background: rgba(0, 0, 0, 0.28) !important;
         border-color: rgba(255, 255, 255, 0.26) !important;
     }

     body.plf-itineraires-hud .map-container .hunt-options.plf-hunt-options-hud .plf-hud-close:hover,
     body.plf-cantonnements-hud .map-container .hunt-options.plf-hunt-options-hud .plf-hud-close:hover,
     body.plf-conseils-hud .map-container .hunt-options.plf-hunt-options-hud .plf-hud-close:hover,
     body.plf-itineraires-hud .map-container .hunt-options.plf-hunt-options-hud .plf-hud-close:active,
     body.plf-cantonnements-hud .map-container .hunt-options.plf-hunt-options-hud .plf-hud-close:active,
     body.plf-conseils-hud .map-container .hunt-options.plf-hunt-options-hud .plf-hud-close:active,
     body.plf-itineraires-hud .map-container .hunt-options.plf-hunt-options-hud .plf-hud-close:focus,
     body.plf-cantonnements-hud .map-container .hunt-options.plf-hunt-options-hud .plf-hud-close:focus,
     body.plf-conseils-hud .map-container .hunt-options.plf-hunt-options-hud .plf-hud-close:focus {
         background: rgba(0, 0, 0, 0.28) !important;
         border-color: rgba(255, 255, 255, 0.26) !important;
     }

     .plf-hud-reopen-btn,
     button.plf-hud-reopen-btn,
     #plfHudReopenBtn {
         position: fixed;
         top: calc(env(safe-area-inset-top, 0px) + clamp(210px, 24vh, 280px));
         left: 50%;
         transform: translateX(-50%);
         z-index: 9999;

         width: 45px;
         height: 45px;
         border-radius: 12px;

         border: 1px solid rgba(200, 80, 40, 0.38) !important;
         background: rgba(0, 0, 0, 0.28) !important;
         background-color: rgba(65, 26, 18, 0.50) !important;
         background-image: none !important;
         color: rgba(255, 255, 255, 0.95) !important;

         backdrop-filter: none !important;
         -webkit-backdrop-filter: none !important;

         box-shadow: none !important;

         display: none;
         place-items: center;
         line-height: 1 !important;
         font-size: 18px !important;
         cursor: pointer !important;
         appearance: none !important;
         -webkit-appearance: none !important;
     }

     .plf-hud-reopen-btn:hover,
     .plf-hud-reopen-btn:active,
     .plf-hud-reopen-btn:focus {
         background: rgba(0, 0, 0, 0.28) !important;
         border-color: rgba(255, 255, 255, 0.26) !important;
     }

     body:not([data-theme="dark"]) .plf-hud-reopen-btn,
     body:not([data-theme="dark"]) button.plf-hud-reopen-btn,
     body:not([data-theme="dark"]) #plfHudReopenBtn {
         background: rgba(255, 255, 255, 0.65) !important;
         background-color: rgba(70, 107, 50, 0.5) !important;
         background-image: none !important;
         border-color: rgba(0, 0, 0, 0.12) !important;
         color: white !important;
     }

     body:not([data-theme="dark"]) .plf-hud-reopen-btn:hover,
     body:not([data-theme="dark"]) .plf-hud-reopen-btn:active,
     body:not([data-theme="dark"]) .plf-hud-reopen-btn:focus {
         background: rgba(255, 255, 255, 0.78) !important;
         border-color: rgba(0, 0, 0, 0.18) !important;
     }

     .plf-hud-reopen-btn.is-visible {
         display: grid;
     }

     #plfHudReopenBtn.is-visible {
         display: grid !important;
     }

     .plf-hud-reopen-btn:active {
         transform: translateX(-50%) scale(0.98);
     }

     body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud button,
     body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud input,
     body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud select {
         width: 100% !important;
         margin: 0 !important;
         justify-self: stretch !important;
         box-sizing: border-box !important;
     }

     body.plf-itineraires-hud .map-container .hunt-options.plf-hunt-options-hud button,
     body.plf-itineraires-hud .map-container .hunt-options.plf-hunt-options-hud input,
     body.plf-itineraires-hud .map-container .hunt-options.plf-hunt-options-hud select,
     body.plf-cantonnements-hud .map-container .hunt-options.plf-hunt-options-hud button,
     body.plf-cantonnements-hud .map-container .hunt-options.plf-hunt-options-hud input,
     body.plf-cantonnements-hud .map-container .hunt-options.plf-hunt-options-hud select,
     body.plf-conseils-hud .map-container .hunt-options.plf-hunt-options-hud button,
     body.plf-conseils-hud .map-container .hunt-options.plf-hunt-options-hud input,
     body.plf-conseils-hud .map-container .hunt-options.plf-hunt-options-hud select {
         width: 100% !important;
         margin: 0 !important;
         box-sizing: border-box !important;
     }

     body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud button,
     body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud input {
         min-height: 44px !important;
     }

     body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud .hunt-date-display {
         display: none !important;
     }

     body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud #hunt-date-chasses {
         grid-area: date !important;
         width: 100% !important;
         margin: 0 !important;
     }

     body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud #zone-search-GPS {
         grid-area: gps !important;
         width: 100% !important;
         margin: 0 !important;
     }

     body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud #territory-search-btn {
         grid-area: commune !important;
         width: 100% !important;
         margin: 0 !important;
     }

     body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud #maPosition-btn {
         grid-area: mapos !important;
         width: 100% !important;
         margin: 0 !important;
     }

     body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud #commune-select {
         grid-area: select !important;
         width: 100% !important;
         margin: 0 !important;
     }

     body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud #coordinates-input {
         grid-area: coords !important;
         width: 100% !important;
         margin: 0 !important;
     }

     body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud #coordinates-input input,
     body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud #coordinates-input button {
         width: 100% !important;
     }

     body[data-theme="dark"].plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud #hunt-date-chasses,
     body[data-theme="dark"].plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud #commune-select,
     body[data-theme="dark"].plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud #coordinates-input input {
         background: linear-gradient(
           180deg,
           rgba(255, 245, 235, 0.16) 0%,
           rgba(255, 200, 160, 0.08) 100%
         ) !important;
         border: 1px solid rgba(255, 180, 130, 0.22) !important;
         box-shadow:
           0 10px 24px rgba(0,0,0,0.35),
           inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
         color: rgba(255, 235, 220, 0.95) !important;
         text-shadow: 0 1px 2px rgba(0,0,0,0.35) !important;
     }

     body[data-theme="dark"].plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud #commune-select option {
         color: #1a0b06;
     }

     .container {
        min-height: 100vh !important;
        display: flex !important;
        flex-direction: column !important;
    }

    html,
    body {
        height: 100dvh !important;
     }

     body {
         min-height: 100dvh !important;
     }

     .content {
         display: flex !important;
         flex-grow: 1 !important;
         width: 100% !important;
         min-height: 0 !important;
         flex-direction: column !important;
         flex: 1 1 auto !important;
     }

     .sidebar {
         order: 2;
         margin: 0.5rem 1rem;
         width: 93%;
     }

     .sidebar[style*="display: block"],
     .sidebar[style*="display:block"] {
         max-height: 40vh;
         overflow-y: auto;
     }

     .map-container {
         order: 1 !important;
         flex: 1 1 auto !important;
         min-height: 0 !important;
         height: 100% !important;
         display: block !important;
     }

     #map {
         height: 100% !important;
         min-height: 0 !important;
     }

     /* Pas de hamburger en plein écran carte */
     body.map-fullscreen .hamburger-menu {
         display: none !important;
     }

     .hamburger-menu .bar {
         background-color: rgba(255, 255, 255, 0.92) !important;
     }

     [data-theme="dark"] .hamburger-menu .bar {
         background-color: rgba(255, 215, 190, 0.95) !important;
     }

     #menuBackdrop {
         display: none;
         position: fixed;
         inset: 0;
         background: rgba(255, 255, 255, 0.35);
         backdrop-filter: blur(10px) saturate(120%);
         -webkit-backdrop-filter: blur(10px) saturate(120%);
         z-index: 100000;
     }

     [data-theme="dark"] #menuBackdrop {
         background: rgba(10, 4, 2, 0.35);
     }

     body.menu-open #menuBackdrop {
         display: block;
     }

     #mainMenu.tabs {
         display: none;
     }

     #mainMenu.tabs.active {
         display: flex !important;
         flex-direction: column !important;
         position: fixed !important;
         inset: auto !important;
         left: 50vw !important;
         top: 50vh !important;
         right: auto !important;
         bottom: auto !important;
         transform: translate(-50%, -50%) !important;
         width: min(92vw, 360px) !important;
         max-height: 70vh !important;
         overflow: auto !important;
         -webkit-overflow-scrolling: touch;
         box-sizing: border-box !important;
         padding: 14px 12px !important;
         border-radius: 18px !important;
         z-index: 100001 !important;
         background: linear-gradient(
           180deg,
           rgba(245, 255, 248, 0.92) 0%,
           rgba(210, 240, 215, 0.88) 100%
         ) !important;
         border: 1px solid rgba(50, 122, 53, 0.22) !important;
         box-shadow: 0 24px 70px rgba(0,0,0,0.55);
         pointer-events: auto !important;
     }

     [data-theme="dark"] #mainMenu.tabs.active {
         background: linear-gradient(
           180deg,
           rgba(80, 18, 5, 0.92) 0%,
           rgba(35, 6, 2, 0.97) 100%
         ) !important;
         border: 1px solid rgba(255, 215, 190, 0.14) !important;
     }

     #mainMenu.tabs li {
         margin: 0 !important;
         border-bottom: none !important;
     }

     #mainMenu.tabs li + li a {
         margin-top: 10px !important;
     }

     #mainMenu.tabs a {
         display: flex !important;
         align-items: center !important;
         justify-content: space-between !important;
         gap: 10px !important;
         padding: 12px 12px !important;
         border-radius: 14px !important;
         background: rgba(50, 122, 53, 0.10) !important;
         border: 1px solid rgba(50, 122, 53, 0.20) !important;
         color: #1e4d20 !important;
         box-shadow: none !important;
         transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease !important;
     }

     #mainMenu.tabs a:hover,
     #mainMenu.tabs a:active,
     #mainMenu.tabs a:focus {
         background: rgba(50, 122, 53, 0.16) !important;
         border-color: rgba(50, 122, 53, 0.28) !important;
         box-shadow: 0 10px 22px rgba(0, 0, 0, 0.16),
                     inset 0 1px 0 rgba(255, 255, 255, 0.55) !important;
         transform: translateY(-1px) !important;
     }

     [data-theme="dark"] #mainMenu.tabs a {
         background: rgba(255, 255, 255, 0.06) !important;
         border: 1px solid rgba(255, 215, 190, 0.10) !important;
         color: rgba(255, 215, 190, 0.92) !important;
     }

     [data-theme="dark"] #mainMenu.tabs a:hover,
     [data-theme="dark"] #mainMenu.tabs a:active,
     [data-theme="dark"] #mainMenu.tabs a:focus {
         background: rgba(255, 255, 255, 0.10) !important;
         border-color: rgba(255, 215, 190, 0.18) !important;
         box-shadow: 0 10px 22px rgba(0, 0, 0, 0.35),
                     inset 0 1px 0 rgba(255, 200, 160, 0.10) !important;
         transform: translateY(-1px) !important;
     }

     #mainMenu.tabs a:active,
     [data-theme="dark"] #mainMenu.tabs a:active {
         transform: translateY(0) scale(0.99) !important;
     }

     #mainMenu.tabs a .tab-content {
         width: 100% !important;
         display: flex !important;
         align-items: center !important;
         justify-content: space-between !important;
         gap: 10px !important;
     }

     #mainMenu.tabs a .content-wrapper {
         display: flex !important;
         align-items: center !important;
         gap: 10px !important;
         min-width: 0;
     }

     #mainMenu.tabs a .content-wrapper span {
         font-size: 1rem !important;
         font-weight: 650 !important;
         white-space: nowrap;
         overflow: hidden;
         text-overflow: ellipsis;
     }

     #mainMenu.tabs a i {
         opacity: 0.9;
         font-size: 1.05rem !important;
     }

     #mainMenu.tabs .badge {
         min-width: 56px;
         text-align: center;
         padding: 6px 10px !important;
         border-radius: 999px !important;
         font-weight: 800 !important;
         background: rgba(242, 243, 174, 0.95) !important;
         color: rgba(35, 6, 2, 0.95) !important;
         box-shadow: 0 6px 18px rgba(0,0,0,0.25);
     }

     .map-container,
     #map,
     .leaflet-container {
         z-index: 1 !important;
     }
     .mobile-chasses-overlay {
         display: none;
         position: fixed;
         left: 12px;
         right: 12px;
         bottom: calc(20px + env(safe-area-inset-bottom, 0px));
         z-index: 1200;
         max-height: 30vh;
         background: linear-gradient(
            180deg,
            rgba(35, 95, 38, 0.78) 0%,
            rgba(80, 122, 40, 0.52) 100%
        ); 
       
         border: 1px solid rgba(255, 160, 100, 0.18);
         border-radius: 18px;
         box-shadow: 0 18px 50px rgba(0,0,0,0.55);
         padding: 12px;
         pointer-events: auto;
     }

     .mobile-gpx-overlay {
         display: none;
         position: fixed;
         inset: 0;
         z-index: 1400;
         padding: 16px;
         box-sizing: border-box;
         background: rgba(0, 0, 0, 0.38);
         backdrop-filter: blur(4px);
         -webkit-backdrop-filter: blur(4px);
         align-items: center;
         justify-content: center;
         pointer-events: auto;
     }

     .mobile-gpx-overlay .plf-gpx-modal {
         width: min(94vw, 560px);
         max-height: min(78vh, 720px);
         overflow: auto;
         position: relative;
         border-radius: 18px;
         padding: 14px;
         background: linear-gradient(
            180deg,
            rgba(35, 95, 38, 0.86) 0%,
            rgba(80, 122, 40, 0.62) 100%
         );
         border: 1px solid rgba(255, 160, 100, 0.18);
         box-shadow: 0 18px 50px rgba(0,0,0,0.55);
     }

     [data-theme="dark"] .mobile-gpx-overlay .plf-gpx-modal {
         background: linear-gradient(
           180deg,
           rgba(60, 12, 3, 0.78) 0%,
           rgba(25, 5, 1, 0.52) 100%
         );
         border-color: rgba(255, 160, 100, 0.22);
         box-shadow: 0 18px 46px rgba(0,0,0,0.55);
     }

     .mobile-gpx-overlay .plf-gpx-close {
         position: absolute;
         top: 10px;
         right: 10px;
         width: 34px;
         height: 34px;
         border-radius: 12px;
         border: 1px solid rgba(255, 255, 255, 0.18);
         background: rgba(0, 0, 0, 0.18);
         color: rgba(255, 255, 255, 0.95);
         cursor: pointer;
         display: grid;
         place-items: center;
         line-height: 1;
         font-size: 18px;
         z-index: 2;
     }

     .mobile-gpx-overlay .plf-gpx-close:hover,
     .mobile-gpx-overlay .plf-gpx-close:active,
     .mobile-gpx-overlay .plf-gpx-close:focus {
         background: rgba(0, 0, 0, 0.28);
         border-color: rgba(255, 255, 255, 0.26);
     }

     [data-theme="dark"] .mobile-chasses-overlay {
         background: linear-gradient(
             180deg,
             rgba(60, 12, 3, 0.78) 0%,
             rgba(25, 5, 1, 0.52) 100%
         );
         border-color: rgba(255, 160, 100, 0.22);
         box-shadow: 0 18px 50px rgba(0,0,0,0.55);
     }

     [data-theme="dark"] .zoneInfo {
        color: rgba(25, 5, 1, 0.9);
     }
     .zoneInfo {    
        color: #F2F3AE !important;
     }

     #chassesSidebar .hunt-options {
         display: none !important;
     }
     #chassesSidebar[style*="display: block"] .hunt-options,
     #chassesSidebar[style*="display:block"] .hunt-options {
         display: block !important;
     }
    body[data-theme="dark"].plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud #hunt-date-chasses,
    body[data-theme="dark"].plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud #commune-select {
        background: linear-gradient(
          180deg,
          rgba(255, 245, 235, 0.16) 0%,
          rgba(255, 200, 160, 0.08) 100%
        ) !important;
        border: 1px solid rgba(255, 180, 130, 0.22) !important;
        box-shadow:
          0 10px 24px rgba(0,0,0,0.35),
          inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
        border-radius: 20px !important;
        color: rgba(255, 235, 220, 0.95) !important;
        text-shadow: 0 1px 2px rgba(0,0,0,0.35) !important;
    }
    #contactModal {
        position: fixed !important;
        inset: 0 !important;
        display: none !important;
        align-items: center !important;
        justify-content: center !important;
        height: 100dvh !important;
        padding: 16px !important;
        box-sizing: border-box !important;
    }

    #contactModal.is-open {
        display: flex !important;
    }

    #contactModal .modal-content-contact {
        width: min(92vw, 420px) !important;
        max-height: calc(100dvh - 32px) !important;
        overflow: auto !important;
        position: relative !important;
        left: auto !important;
        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        transform: translateY(-4vh) !important;
        margin: 0 !important;
        border-radius: 22px !important;
        padding: 18px 16px 16px !important;
        box-sizing: border-box !important;
    }

    #contactModal .modal-content-contact .modal-header {
        margin: 0 0 14px 0 !important;
        padding: 14px 14px !important;
        border-radius: 16px !important;
        font-size: 1.35rem !important;
        line-height: 1.15 !important;
        letter-spacing: 0.2px !important;
        text-transform: none !important;
    }

    #contactModal .closeContact {
        width: 40px !important;
        height: 40px !important;
        display: grid !important;
        place-items: center !important;
        border-radius: 12px !important;
        top: 12px !important;
        right: 12px !important;
    }

    #contactModal .modal-content-contact .form {
        margin: 10px 0 12px !important;
    }

    #contactModal .modal-content-contact .form-label {
        font-size: 0.95rem !important;
        opacity: 0.95 !important;
        margin-bottom: 6px !important;
    }

    #contactModal .modal-content-contact .form-control {
        width: 100% !important;
        border-radius: 14px !important;
        padding: 12px 12px !important;
        font-size: 1rem !important;
    }

    #contactModal .modal-content-contact textarea.form-control {
        min-height: 120px !important;
        resize: vertical;
    }

    #contactModal .modal-content-contact .form-check {
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        margin: 12px 0 14px !important;
    }

    #contactModal .modal-content-contact .modal-footer {
        padding-top: 6px !important;
    }

    #contactModal .modal-content-contact .modal-footer .contactModalBtn {
        width: 100% !important;
        border-radius: 14px !important;
        padding: 12px 14px !important;
        font-size: 1.05rem !important;
        justify-content: center !important;
        gap: 10px !important;
    }
    /* ── Mode sombre ── */
    body[data-theme="dark"].plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud #hunt-date-chasses,
    body[data-theme="dark"].plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud input.hunt-date,
    body[data-theme="dark"].plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud .hunt-date.flatpickr-input {
        background: linear-gradient(
          180deg,
          rgba(255, 245, 235, 0.16) 0%,
          rgba(255, 200, 160, 0.08) 100%
        ) !important;
        border: 1px solid rgba(255, 180, 130, 0.22) !important;
        box-shadow:
          0 10px 24px rgba(0,0,0,0.35),
          inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
        border-radius: 20px !important;
        color: rgba(255, 235, 220, 0.95) !important;
        text-shadow: 0 1px 2px rgba(0,0,0,0.35) !important;
        color-scheme: dark !important;
    }

    body[data-theme="dark"].plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud #hunt-date-chasses,
    body[data-theme="dark"].plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud input.hunt-date,
    body[data-theme="dark"].plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud .hunt-date.flatpickr-input {
        padding-right: 44px !important;
        background:
          url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M7 2a1 1 0 0 1 1 1v1h8V3a1 1 0 1 1 2 0v1h1a3 3 0 0 1 3 3v13a3 3 0 0 1-3 3H5a3 3 0 0 1-3-3V7a3 3 0 0 1 3-3h1V3a1 1 0 0 1 1-1Zm12 8H5v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V10ZM6 6a1 1 0 0 0-1 1v1h14V7a1 1 0 0 0-1-1H6Z' fill='%23ffffff' fill-opacity='0.92'/%3E%3C/svg%3E") no-repeat right 14px center / 16px 16px,
          linear-gradient(180deg, rgba(255, 245, 235, 0.16) 0%, rgba(255, 200, 160, 0.08) 100%) !important;
        background-clip: padding-box !important;
        color-scheme: dark !important;
    }

    body[data-theme="dark"].plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud #hunt-date-chasses::-webkit-calendar-picker-indicator,
    body[data-theme="dark"].plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud input.hunt-date::-webkit-calendar-picker-indicator,
    body[data-theme="dark"].plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud .hunt-date.flatpickr-input::-webkit-calendar-picker-indicator {
        display: none !important;
        opacity: 0 !important;
        filter: invert(1) !important;
    }

    /* ── Mode clair ── */
    body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud #hunt-date-chasses,
    body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud input.hunt-date,
    body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud .hunt-date.flatpickr-input {
        color-scheme: light !important;
        padding-right: 44px !important;
        background:
          url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M7 2a1 1 0 0 1 1 1v1h8V3a1 1 0 1 1 2 0v1h1a3 3 0 0 1 3 3v13a3 3 0 0 1-3 3H5a3 3 0 0 1-3-3V7a3 3 0 0 1 3-3h1V3a1 1 0 0 1 1-1Zm12 8H5v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V10ZM6 6a1 1 0 0 0-1 1v1h14V7a1 1 0 0 0-1-1H6Z' fill='%231e4d20' fill-opacity='0.92'/%3E%3C/svg%3E") no-repeat right 14px center / 16px 16px,
          rgba(255, 255, 255, 0.80) !important;
        background-clip: padding-box !important;
    }

    body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud #hunt-date-chasses::-webkit-calendar-picker-indicator,
    body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud input.hunt-date::-webkit-calendar-picker-indicator,
    body.plf-chasses-hud .map-container .hunt-options.plf-hunt-options-hud .hunt-date.flatpickr-input::-webkit-calendar-picker-indicator {
        display: none !important;
        opacity: 0 !important;
    }
    .leaflet-control-container .elevation-control.elevation-expanded {
        width: calc(100vw - 24px) !important;
        left: 12px !important;
        margin-left: 0 !important;
        margin-bottom: 24px !important;
    }

    .legend-item.legend-altitude{
        display: none !important
    }

    .elevation-control.lime-theme.leaflet-control.elevation-expanded {
        max-width: 100% !important;
    }

    .leaflet-control-container .elevation-control.elevation-expanded .legend {
        margin: 0 auto !important;
        text-align: center !important;
    }

    .leaflet-control-container .elevation-control.elevation-expanded .download {
        display: none !important;
    }

    .leaflet-control-container .elevation-control.elevation-expanded .elevation-summary {
        font-size: 11px !important;
      
        overflow: hidden !important;
       
    }

    .leaflet-control-container .elevation-control.elevation-summary {
        background-color: var(--ele-bg, rgba(70, 130, 180, 0.2));
    }

    body {
        --plf-mobile-control-bg-light: rgba(70, 107, 50, 0.50);
        --plf-mobile-control-border-light: rgba(0, 0, 0, 0.12);
        --plf-mobile-control-icon-light: #ffffff;
        --plf-mobile-control-bg-dark-base: rgba(0, 0, 0, 0.28);
        --plf-mobile-control-bg-dark: rgba(65, 26, 18, 0.35);
        --plf-mobile-control-border-dark: rgba(200, 80, 40, 0.38);
        --plf-mobile-control-icon-dark: #ffffff;
    }

    .leaflet-control-zoom {
        border: 1px solid var(--plf-mobile-control-border-light) !important;
        border-radius: 12px !important;
        overflow: hidden !important;
        box-shadow: none !important;
        background: transparent !important;
    }

    body[data-theme="dark"] .leaflet-control-zoom {
        border-color: var(--plf-mobile-control-border-dark) !important;
    }

    .leaflet-control-zoom a {
        width: 34px !important;
        height: 34px !important;
        line-height: 34px !important;
        border: 0 !important;
        border-radius: 0 !important;
        font-weight: 700 !important;
        background-image: none !important;
    }

    .leaflet-control-zoom-in {
        border-radius: 12px 12px 0 0 !important;
        border-bottom: 1px solid var(--plf-mobile-control-border-light) !important;
    }

    body[data-theme="dark"] .leaflet-control-zoom-in {
        border-bottom-color: var(--plf-mobile-control-border-dark) !important;
    }

    .leaflet-control-zoom-out {
        border-radius: 0 0 12px 12px !important;
    }

    .leaflet-control-layers-toggle {
        position: relative !important;
        background-image: none !important;
        background-size: 0 0 !important;
    }

    .leaflet-control-layers-toggle::after {
        content: '\00a0';
        position: absolute;
        top: 50%;
        left: 50%;
        width: 24px;
        height: 24px;
        transform: translate(-50%, -50%);
        background-color: #ffffff;
        -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 3 8l9 5 9-5-9-5Z'/%3E%3Cpath d='m3 12 9 5 9-5'/%3E%3Cpath d='m3 16 9 5 9-5'/%3E%3C/svg%3E");
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-position: center;
        -webkit-mask-size: 24px 24px;
        mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 3 8l9 5 9-5-9-5Z'/%3E%3Cpath d='m3 12 9 5 9-5'/%3E%3Cpath d='m3 16 9 5 9-5'/%3E%3C/svg%3E");
        mask-repeat: no-repeat;
        mask-position: center;
        mask-size: 24px 24px;
        pointer-events: none;
    }

    .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl .plf-nodepoints-btn {
        position: relative !important;
        background-image: none !important;
        background-size: 0 0 !important;
    }

    .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl .plf-nodepoints-btn::after {
        content: '\00a0';
        position: absolute;
        top: 50%;
        left: 50%;
        width: 24px;
        height: 24px;
        transform: translate(-50%, -50%);
        background-color: #ffffff;
        -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='6' cy='6' r='2.2'/%3E%3Ccircle cx='18' cy='6' r='2.2'/%3E%3Ccircle cx='12' cy='18' r='2.2'/%3E%3Cpath d='M8 7.5 11 16'/%3E%3Cpath d='M16 7.5 13 16'/%3E%3Cpath d='M8.2 6h7.6'/%3E%3C/svg%3E");
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-position: center;
        -webkit-mask-size: 24px 24px;
        mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='6' cy='6' r='2.2'/%3E%3Ccircle cx='18' cy='6' r='2.2'/%3E%3Ccircle cx='12' cy='18' r='2.2'/%3E%3Cpath d='M8 7.5 11 16'/%3E%3Cpath d='M16 7.5 13 16'/%3E%3Cpath d='M8.2 6h7.6'/%3E%3C/svg%3E");
        mask-repeat: no-repeat;
        mask-position: center;
        mask-size: 24px 24px;
        pointer-events: none;
    }

    .leaflet-top.leaflet-right .leaflet-control-rainviewer,
    .leaflet-top.leaflet-right .leaflet-control-rainviewer-active {
        margin-top: 6px !important;
        margin-right: 10px !important;
        clear: both !important;
        display: block !important;
        width: 44px !important;
        height: 44px !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        overflow: visible !important;
        position: relative !important;
    }

    .leaflet-top.leaflet-right .leaflet-control-rainviewer a.leaflet-control-rainviewer-button,
    .leaflet-top.leaflet-right .leaflet-control-rainviewer-active a.leaflet-control-rainviewer-button {
        width: 44px !important;
        height: 44px !important;
        border-radius: 12px !important;
        display: block !important;
        position: relative !important;
        top: 0 !important;
        left: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        background-image: none !important;
    }

    body:not([data-theme="dark"]) .leaflet-control-zoom a,
    body:not([data-theme="dark"]) .leaflet-control-zoom a:hover,
    body:not([data-theme="dark"]) .leaflet-control-zoom a:active,
    body:not([data-theme="dark"]) .leaflet-control-zoom a:focus,
    body:not([data-theme="dark"]) .leaflet-control-layers-toggle,
    body:not([data-theme="dark"]) .leaflet-control-layers-toggle:hover,
    body:not([data-theme="dark"]) .leaflet-control-layers-toggle:active,
    body:not([data-theme="dark"]) .leaflet-control-layers-toggle:focus,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl .plf-nodepoints-btn,
    body:not([data-theme="dark"]) .plf-fs-fab,
    body:not([data-theme="dark"]) .plf-fs-fab:hover,
    body:not([data-theme="dark"]) .plf-fs-fab:active,
    body:not([data-theme="dark"]) .plf-fs-fab:focus,
    body:not([data-theme="dark"]) .plf-fs-fab:focus-visible,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-control-rainviewer a.leaflet-control-rainviewer-button,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-control-rainviewer a.leaflet-control-rainviewer-button:hover,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-control-rainviewer a.leaflet-control-rainviewer-button:active,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-control-rainviewer a.leaflet-control-rainviewer-button:focus {
        background: var(--plf-mobile-control-bg-light) !important;
        background-color: var(--plf-mobile-control-bg-light) !important;
        border: 1px solid var(--plf-mobile-control-border-light) !important;
        color: var(--plf-mobile-control-icon-light) !important;
        box-shadow: none !important;
        outline: none !important;
        opacity: 1 !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    body[data-theme="dark"] .leaflet-control-zoom a,
    body[data-theme="dark"] .leaflet-control-zoom a:hover,
    body[data-theme="dark"] .leaflet-control-zoom a:active,
    body[data-theme="dark"] .leaflet-control-zoom a:focus,
    body[data-theme="dark"] .leaflet-control-layers-toggle,
    body[data-theme="dark"] .leaflet-control-layers-toggle:hover,
    body[data-theme="dark"] .leaflet-control-layers-toggle:active,
    body[data-theme="dark"] .leaflet-control-layers-toggle:focus,
    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl,
    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl .plf-nodepoints-btn,
    body[data-theme="dark"] .plf-fs-fab,
    body[data-theme="dark"] .plf-fs-fab:hover,
    body[data-theme="dark"] .plf-fs-fab:active,
    body[data-theme="dark"] .plf-fs-fab:focus,
    body[data-theme="dark"] .plf-fs-fab:focus-visible,
    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-control-rainviewer a.leaflet-control-rainviewer-button,
    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-control-rainviewer a.leaflet-control-rainviewer-button:hover,
    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-control-rainviewer a.leaflet-control-rainviewer-button:active,
    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-control-rainviewer a.leaflet-control-rainviewer-button:focus {
        background: var(--plf-mobile-control-bg-dark-base) !important;
        background-color: var(--plf-mobile-control-bg-dark) !important;
        border: 1px solid var(--plf-mobile-control-border-dark) !important;
        color: var(--plf-mobile-control-icon-dark) !important;
        box-shadow: none !important;
        outline: none !important;
        opacity: 1 !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    .leaflet-top.leaflet-right .leaflet-control-rainviewer a.leaflet-control-rainviewer-button::after,
    .leaflet-top.leaflet-right .leaflet-control-rainviewer-active a.leaflet-control-rainviewer-button::after {
        content: '\00a0';
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 26px;
        height: 26px;
        background-color: #fff;
        -webkit-mask-image: url("../src/css/images/rainviewer.png");
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-position: center;
        -webkit-mask-size: 26px 26px;
        mask-image: url("../src/css/images/rainviewer.png");
        mask-repeat: no-repeat;
        mask-position: center;
        mask-size: 26px 26px;
        pointer-events: none;
        z-index: 2;
    }

    .leaflet-top.leaflet-right .leaflet-control-rainviewer-active .leaflet-control-rainviewer-container,
    .leaflet-top.leaflet-right .leaflet-control-rainviewer-active .leaflet-control-rainviewer-prev,
    .leaflet-top.leaflet-right .leaflet-control-rainviewer-active .leaflet-control-rainviewer-startstop,
    .leaflet-top.leaflet-right .leaflet-control-rainviewer-active .leaflet-control-rainviewer-next,
    .leaflet-top.leaflet-right .leaflet-control-rainviewer-active .leaflet-control-rainviewer-label,
    .leaflet-top.leaflet-right .leaflet-control-rainviewer-active .leaflet-control-rainviewer-positionslider,
    .leaflet-top.leaflet-right .leaflet-control-rainviewer-active .leaflet-control-rainviewer-opacityslider,
    .leaflet-top.leaflet-right .leaflet-control-rainviewer-active .leaflet-control-rainviewer-timestamp,
    .leaflet-top.leaflet-right .leaflet-control-rainviewer-active .leaflet-control-rainviewer-close {
        display: none !important;
    }

    .leaflet-control-zoom,
    .leaflet-control-zoom:hover,
    .leaflet-control-zoom:active,
    .leaflet-control-zoom:focus {
        background: transparent !important;
        background-color: transparent !important;
        border: 1px solid var(--plf-mobile-control-border-light) !important;
        border-radius: 12px !important;
        box-shadow: none !important;
        outline: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        overflow: hidden !important;
    }

    body[data-theme="dark"] .leaflet-control-zoom,
    body[data-theme="dark"] .leaflet-control-zoom:hover,
    body[data-theme="dark"] .leaflet-control-zoom:active,
    body[data-theme="dark"] .leaflet-control-zoom:focus {
        border-color: var(--plf-mobile-control-border-dark) !important;
    }

    .leaflet-control-zoom a,
    .leaflet-control-zoom a:hover,
    .leaflet-control-zoom a:active,
    .leaflet-control-zoom a:focus {
        border-left: 0 !important;
        border-right: 0 !important;
        border-top: 0 !important;
        border-radius: 0 !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    .leaflet-control-zoom-in,
    .leaflet-control-zoom-in:hover,
    .leaflet-control-zoom-in:active,
    .leaflet-control-zoom-in:focus {
        border-radius: 12px 12px 0 0 !important;
        border-bottom: 1px solid var(--plf-mobile-control-border-light) !important;
    }

    body[data-theme="dark"] .leaflet-control-zoom-in,
    body[data-theme="dark"] .leaflet-control-zoom-in:hover,
    body[data-theme="dark"] .leaflet-control-zoom-in:active,
    body[data-theme="dark"] .leaflet-control-zoom-in:focus {
        border-bottom-color: var(--plf-mobile-control-border-dark) !important;
    }

    .leaflet-control-zoom-out,
    .leaflet-control-zoom-out:hover,
    .leaflet-control-zoom-out:active,
    .leaflet-control-zoom-out:focus {
        border-radius: 0 0 12px 12px !important;
        border-bottom: 0 !important;
    }

    body[data-theme="dark"] .leaflet-control-layers-toggle,
    body[data-theme="dark"] .leaflet-control-layers-toggle:hover,
    body[data-theme="dark"] .leaflet-control-layers-toggle:active,
    body[data-theme="dark"] .leaflet-control-layers-toggle:focus,
    body[data-theme="dark"] .leaflet-control-layers-toggle:focus-visible {
        background: var(--plf-mobile-control-bg-dark) !important;
        background-color: var(--plf-mobile-control-bg-dark) !important;
        border: 1px solid var(--plf-mobile-control-border-dark) !important;
        border-radius: 12px !important;
        color: var(--plf-mobile-control-icon-dark) !important;
        opacity: 1 !important;
        box-shadow: none !important;
        outline: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    body:not([data-theme="dark"]) .leaflet-control-layers-toggle,
    body:not([data-theme="dark"]) .leaflet-control-layers-toggle:hover,
    body:not([data-theme="dark"]) .leaflet-control-layers-toggle:active,
    body:not([data-theme="dark"]) .leaflet-control-layers-toggle:focus,
    body:not([data-theme="dark"]) .leaflet-control-layers-toggle:focus-visible {
        background: var(--plf-mobile-control-bg-light) !important;
        background-color: var(--plf-mobile-control-bg-light) !important;
        border: 1px solid var(--plf-mobile-control-border-light) !important;
        border-radius: 12px !important;
        color: var(--plf-mobile-control-icon-light) !important;
        opacity: 1 !important;
        box-shadow: none !important;
        outline: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl,
    .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl .plf-nodepoints-btn,
    .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl .plf-nodepoints-btn:hover,
    .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl .plf-nodepoints-btn:active,
    .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl .plf-nodepoints-btn:focus,
    .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl .plf-nodepoints-btn:focus-visible {
        border-radius: 12px !important;
        opacity: 1 !important;
        box-shadow: none !important;
        outline: none !important;
        background-image: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl,
    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl .plf-nodepoints-btn,
    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl .plf-nodepoints-btn:hover,
    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl .plf-nodepoints-btn:active,
    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl .plf-nodepoints-btn:focus,
    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl .plf-nodepoints-btn:focus-visible {
        background: var(--plf-mobile-control-bg-dark) !important;
        background-color: var(--plf-mobile-control-bg-dark) !important;
        border: 1px solid var(--plf-mobile-control-border-dark) !important;
    }

    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl .plf-nodepoints-btn,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl .plf-nodepoints-btn:hover,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl .plf-nodepoints-btn:active,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl .plf-nodepoints-btn:focus,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl .plf-nodepoints-btn:focus-visible {
        background: var(--plf-mobile-control-bg-light) !important;
        background-color: var(--plf-mobile-control-bg-light) !important;
        border: 1px solid var(--plf-mobile-control-border-light) !important;
    }

    body[data-theme="dark"] .leaflet-touch .leaflet-control-zoom.leaflet-bar,
    body[data-theme="dark"] .leaflet-control-zoom.leaflet-bar.leaflet-control {
        background: var(--plf-mobile-control-bg-dark) !important;
        background-color: var(--plf-mobile-control-bg-dark) !important;
        border: 1px solid var(--plf-mobile-control-border-dark) !important;
        border-radius: 12px !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        overflow: hidden !important;
    }

    body:not([data-theme="dark"]) .leaflet-touch .leaflet-control-zoom.leaflet-bar,
    body:not([data-theme="dark"]) .leaflet-control-zoom.leaflet-bar.leaflet-control {
        background: var(--plf-mobile-control-bg-light) !important;
        background-color: var(--plf-mobile-control-bg-light) !important;
        border: 1px solid var(--plf-mobile-control-border-light) !important;
        border-radius: 12px !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        overflow: hidden !important;
    }

    body[data-theme="dark"] .leaflet-control-layers .leaflet-control-layers-toggle,
    body[data-theme="dark"] .leaflet-touch .leaflet-control-layers-toggle,
    body[data-theme="dark"] .leaflet-control-layers-toggle {
        background: var(--plf-mobile-control-bg-dark) !important;
        background-color: var(--plf-mobile-control-bg-dark) !important;
        border: 1px solid var(--plf-mobile-control-border-dark) !important;
        border-radius: 12px !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    body:not([data-theme="dark"]) .leaflet-control-layers .leaflet-control-layers-toggle,
    body:not([data-theme="dark"]) .leaflet-touch .leaflet-control-layers-toggle,
    body:not([data-theme="dark"]) .leaflet-control-layers-toggle {
        background: var(--plf-mobile-control-bg-light) !important;
        background-color: var(--plf-mobile-control-bg-light) !important;
        border: 1px solid var(--plf-mobile-control-border-light) !important;
        border-radius: 12px !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-control-layers-toggle,
    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl,
    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl .plf-nodepoints-btn,
    body[data-theme="dark"] .leaflet-top.leaflet-right .plf-fs-fab,
    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-control-rainviewer a.leaflet-control-rainviewer-button {
        width: 44px !important;
        height: 44px !important;
        background: var(--plf-mobile-control-bg-dark) !important;
        background-color: var(--plf-mobile-control-bg-dark) !important;
        background-image: none !important;
        border: 1px solid var(--plf-mobile-control-border-dark) !important;
        border-radius: 12px !important;
        color: var(--plf-mobile-control-icon-dark) !important;
        box-shadow: none !important;
        opacity: 1 !important;
        outline: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        overflow: hidden !important;
    }

    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-control-layers-toggle,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-bar.plf-nodepoints-ctl .plf-nodepoints-btn,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .plf-fs-fab,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-control-rainviewer a.leaflet-control-rainviewer-button {
        width: 44px !important;
        height: 44px !important;
        background: var(--plf-mobile-control-bg-light) !important;
        background-color: var(--plf-mobile-control-bg-light) !important;
        background-image: none !important;
        border: 1px solid var(--plf-mobile-control-border-light) !important;
        border-radius: 12px !important;
        color: var(--plf-mobile-control-icon-light) !important;
        box-shadow: none !important;
        opacity: 1 !important;
        outline: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        overflow: hidden !important;
    }

    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-control-layers-toggle,
    body[data-theme="dark"] .leaflet-top.leaflet-right .plf-fs-fab {
        background: rgba(65, 26, 18, 0.35) !important;
        background-color: rgba(65, 26, 18, 0.35) !important;
        border-color: rgba(200, 80, 40, 0.38) !important;
    }

    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-control-layers-toggle,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .plf-fs-fab,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-control-rainviewer a.leaflet-control-rainviewer-button {
        background: var(--plf-mobile-control-bg-light) !important;
        background-color: var(--plf-mobile-control-bg-light) !important;
        border-color: var(--plf-mobile-control-border-light) !important;
    }

    body.map-mode-a .leaflet-top.leaflet-right {
        z-index: 5001 !important;
        pointer-events: auto !important;
    }

    body.map-mode-a .leaflet-top.leaflet-right .leaflet-control,
    body.map-mode-a .leaflet-top.leaflet-right .leaflet-control-layers,
    body.map-mode-a .leaflet-top.leaflet-right .leaflet-control-layers-toggle,
    body.map-mode-a .leaflet-top.leaflet-right .plf-fs-control,
    body.map-mode-a .leaflet-top.leaflet-right .plf-fs-fab,
    body.map-mode-a .leaflet-top.leaflet-right .leaflet-control-rainviewer,
    body.map-mode-a .leaflet-top.leaflet-right .leaflet-control-rainviewer-button {
        z-index: 5002 !important;
        pointer-events: auto !important;
    }

    body.map-mode-a .hunt-options.plf-hunt-options-hud,
    body.map-mode-a .plf-hud-close {
        z-index: 1000 !important;
    }

    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-control-layers,
    body[data-theme="dark"] .leaflet-top.leaflet-right .plf-fs-control,
    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-control-rainviewer {
        width: 44px !important;
        height: 44px !important;
        background: rgba(65, 26, 18, 0.35) !important;
        background-color: rgba(65, 26, 18, 0.35) !important;
        border: 0 !important;
        border-radius: 12px !important;
        box-shadow: none !important;
        overflow: hidden !important;
    }

    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-control-layers-toggle,
    body[data-theme="dark"] .leaflet-top.leaflet-right .plf-fs-fab,
    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-control-rainviewer a.leaflet-control-rainviewer-button {
        width: 44px !important;
        height: 44px !important;
        background: rgba(65, 26, 18, 0.35) !important;
        background-color: rgba(65, 26, 18, 0.35) !important;
        border: 1px solid rgba(200, 80, 40, 0.38) !important;
        border-radius: 12px !important;
        box-shadow: none !important;
        opacity: 1 !important;
        overflow: hidden !important;
        isolation: auto !important;
    }

    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-control-layers-toggle::before,
    body[data-theme="dark"] .leaflet-top.leaflet-right .plf-fs-fab::before,
    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-control-rainviewer a.leaflet-control-rainviewer-button::before {
        content: none !important;
        display: none !important;
    }

    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-control-layers-toggle::after,
    body[data-theme="dark"] .leaflet-top.leaflet-right .leaflet-control-rainviewer a.leaflet-control-rainviewer-button::after {
        position: absolute !important;
        z-index: 2 !important;
    }

    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-control-layers,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .plf-fs-control,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-control-rainviewer {
        width: 44px !important;
        height: 44px !important;
        background: var(--plf-mobile-control-bg-light) !important;
        background-color: var(--plf-mobile-control-bg-light) !important;
        border: 0 !important;
        border-radius: 12px !important;
        box-shadow: none !important;
        overflow: hidden !important;
    }

    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-control-layers-toggle,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .plf-fs-fab,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-control-rainviewer a.leaflet-control-rainviewer-button {
        width: 44px !important;
        height: 44px !important;
        background: var(--plf-mobile-control-bg-light) !important;
        background-color: var(--plf-mobile-control-bg-light) !important;
        border: 1px solid var(--plf-mobile-control-border-light) !important;
        border-radius: 12px !important;
        color: var(--plf-mobile-control-icon-light) !important;
        box-shadow: none !important;
        opacity: 1 !important;
        overflow: hidden !important;
        isolation: auto !important;
    }

    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-control-layers-toggle::before,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .plf-fs-fab::before,
    body:not([data-theme="dark"]) .leaflet-top.leaflet-right .leaflet-control-rainviewer a.leaflet-control-rainviewer-button::before {
        content: none !important;
        display: none !important;
    }

}
