/* Style pour les boutons Zoom+ et Zoom- */
.leaflet-control-zoom-in,
.leaflet-control-zoom-out {
.leaflet-control-zoom {
    display: flex;
    flex-direction: column;
	width: 36px;
    height: 36px;

}
.leaflet-control-zoom-in,
.leaflet-control-zoom-out {
    background-color: white;
    border: 1px solid rgba(0,0,0,0.2);
    padding: 10px;
    margin: 0;
    cursor: pointer;
    text-align: center;
    font: bold 18px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
    color: #333;
    text-shadow: 0 1px 0 #fff;
}
.leaflet-control-zoom-in:hover,
.leaflet-control-zoom-out:hover {
    background-color: #f4f4f4;
}
}
/* Imposer un z-index pour le géocodeur */
.leaflet-control-geocoder {
    z-index: 1010;
}
/* Style pour le conteneur global */
.icon-container {
	position: absolute;
	top: 75px;
	left: 10px;	
	width: 32px; /* Ajustez la largeur si nécessaire */
	height: 500px; /* Ajustez la hauteur si nécessaire */
	z-index: 1000; 
}

/* Style pour les icônes */
.icon {
	position: absolute;
	width: 32px;
	height: 32px;

}

/* Positionnement des icônes basé sur leur ordre */
.icon:nth-child(1) { top: 0px; }
.icon:nth-child(2) { top: 32px; }
.icon:nth-child(3) { top: 64px; }
.icon:nth-child(4) { top: 96px; }
.icon:nth-child(5) { top: 128px; }
.icon:nth-child(6) { top: 160px; }
.icon:nth-child(7) { top: 192px; }
.icon:nth-child(8) { top: 224px; }
.icon:nth-child(9) { top: 256px; }
.icon:nth-child(10) { top: 288px; }

/* Style pour les boutons pour locker le zoom level */
#lockZoomButton {
	display: flex;
	align-items: center;
	justify-content: center;
    background-color: white;
    border: 1px solid rgba(0,0,0,0.2);
    padding: 10px;
    margin: 0;
    cursor: pointer;
    text-align: center;
    font: bold 18px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
    color: #333;
    text-shadow: 0 1px 0 #fff;
	width: 32px; 
	height: 32px;
}
#lockZoomButton img {
	width: 22px;
	height: 22px;
}
/* Style :hover pour le bouton */
#lockZoomButton:hover {
    background-color: #f4f4f4; /* Couleur de fond au survol */
    border-color: rgba(0,0,0,0.4); /* Couleur de bordure au survol */
    color: #000; /* Couleur du texte au survol */
}
/* Style pour le bouton verrouillé */
.locked {
    background-color: #f43551 !important; /* Couleur de fond lorsqu'il est verrouillé */
}

/* Style pour le bouton déverrouillé */
.unlocked {
    background-color: #7ae95c !important; /* Couleur de fond lorsqu'il est déverrouillé */
}
/* Style pour le bouton de vue générale - fitBoundsButton */
#fitBoundsButton {
    background-color: white;
    border: 1px solid black;
    padding: 0px;
    margin: 0px;
    cursor: pointer;
    text-align: center;
    font: bold 18px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
    color: #333;
    text-shadow: 0 1px 0 #fff;
    width: 32px; 
    height: 32px;
    display: flex; 
    align-items: center; 
    justify-content: center; 
}
#fitBoundsButton img {
    width: 24px;
    height: 24px;
}
#fitBoundsButton:hover {
    border-color: rgba(0,0,0,0.4); /* Couleur de bordure au survol */
    color: #000; /* Couleur du texte au survol */
}
/* Style pour le bouton impression */
#printmap {
    background-color: white;
    border: 1px solid black;
    padding: 0px;
    margin: 0px;
    cursor: pointer;
    text-align: center;
    font: bold 18px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
    color: #333;
    text-shadow: 0 1px 0 #fff;
    width: 32px; 
    height: 32px;
    display: flex; 
    align-items: center; 
    justify-content: center; 
}
#printmap img {
    width: 24px;
    height: 24px;
}
#printmap:hover {
    border-color: rgba(0,0,0,0.4); /* Couleur de bordure au survol */
    color: #000; /* Couleur du texte au survol */
}
/* Style pour le bouton impression HTML*/
#printHTML {
    background-color: white;
    border: 1px solid black;
    padding: 0px;
    margin: 0px;
    cursor: pointer;
    text-align: center;
    font: bold 18px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
    color: #333;
    text-shadow: 0 1px 0 #fff;
    width: 32px; 
    height: 32px;
    display: flex; 
    align-items: center; 
    justify-content: center; 
}
#printHTML img {
    width: 24px;
    height: 24px;
}
#printHTML:hover {
    border-color: rgba(0,0,0,0.4); /* Couleur de bordure au survol */
    color: #000; /* Couleur du texte au survol */
}
/* Style pour l'état actif du bouton printHTML*/
#printHTML.active {
    background-color: #7ae95c !important; /* Fond vert pour l'état actif */
    color: white; /* Couleur du texte pour l'état actif */
}
/* Style pour le bouton search1 */
#search1 {
    background-color: white;
    border: 1px solid black;
    padding: 0px;
    margin: 0px;
    cursor: pointer;
    text-align: center;
    font: bold 18px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
    color: #333;
    text-shadow: 0 1px 0 #fff;
    width: 32px; 
    height: 32px;
    display: flex; 
    align-items: center; 
    justify-content: center; 
}
#search1 img {
    width: 24px;
    height: 24px;
}
#search1:hover {
    border-color: rgba(0,0,0,0.4); /* Couleur de bordure au survol */
    color: #000; /* Couleur du texte au survol */
}
/* Style pour le bouton Legend */
#toggle-legend-btn {
    background-color: white;
    border: 1px solid black;
    padding: 0px;
    margin: 0px;
    cursor: pointer;
    text-align: center;
    font: bold 18px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
    color: #333;
    text-shadow: 0 1px 0 #fff;
    width: 32px; 
    height: 32px;
    display: flex; 
    align-items: center; 
    justify-content: center; 
}
#toggle-legend-btn img {
    width: 24px;
    height: 24px;
}
#toggle-legend-btn:hover {
    border-color: rgba(0,0,0,0.4); /* Couleur de bordure au survol */
    color: #000; /* Couleur du texte au survol */
}				
/* Style pour le bouton GPS */
#GPS {
    background-color: white;
    border: 1px solid black;
    padding: 0px;
    margin: 0px;
    cursor: pointer;
    text-align: center;
    font: bold 18px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
    color: #333;
    text-shadow: 0 1px 0 #fff;
    width: 32px; 
    height: 32px;
    display: flex; 
    align-items: center; 
    justify-content: center; 
}
#GPS img {
    width: 24px;
    height: 24px;
}
#GPS:hover {
    border-color: rgba(0,0,0,0.4); /* Couleur de bordure au survol */
    color: #000; /* Couleur du texte au survol */
}
/* Style pour le bouton Help */
#help {
    position: absolute;
    background-color: white;
    border: 1px solid black;
    padding: 0px;
    margin: 0px;
    cursor: pointer;
    text-align: center;
    font: bold 18px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
    color: #333;
    text-shadow: 0 1px 0 #fff;
    width: 32px; 
    height: 32px;
    display: flex; 
    align-items: center; 
    justify-content: center; 
}
#help img {
    width: 24px;
    height: 24px;
}
#help:hover {
    border-color: rgba(0,0,0,0.4); /* Couleur de bordure au survol */
    color: #000; /* Couleur du texte au survol */
}
/* Style pour le bouton search2 */
#search2 {
    background-color: white;
    border: 1px solid black;
    padding: 0px;
    margin: 0px;
    cursor: pointer;
    text-align: center;
    font: bold 18px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
    color: #333;
    text-shadow: 0 1px 0 #fff;
    width: 32px; 
    height: 32px;
    display: flex; 
    align-items: center; 
    justify-content: center; 
}
#search2 img {
    width: 32px;
    height: 32px;
}
#search2:hover {
    border-color: rgba(0,0,0,0.4); /* Couleur de bordure au survol */
    color: #000; /* Couleur du texte au survol */
}
/* Style pour le bouton showResume */
#showResume {
    background-color: white;
    border: 1px solid black;
    padding: 0px;
    margin: 0px;
    cursor: pointer;
    text-align: center;
    font: bold 18px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
    color: #333;
    text-shadow: 0 1px 0 #fff;
    width: 32px; 
    height: 32px;
    display: flex; 
    align-items: center; 
    justify-content: center; 
}
#showResume img {
    width: 28px;
    height: 28px;
}
#showResume:hover {
    border-color: rgba(0,0,0,0.4); /* Couleur de bordure au survol */
    color: #000; /* Couleur du texte au survol */
}
/* Style pour l'état actif du bouton showResume*/
#showResume.active {
    background-color: #7ae95c !important; /* Fond vert pour l'état actif */
    color: white; /* Couleur du texte pour l'état actif */
}