/* 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;
}
}
/* 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; /* Ajustez la largeur en fonction de vos besoins */
	height: 32px; /* Ajustez la hauteur en fonction de vos besoins */
	position: absolute;
	top: 76px;
	left: 10px;
	z-index: 1000;			
}
#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é */
}