#map{position:relative; height:600px; z-index:2;}

.maplibregl-control-container{display:none;}
a[href="https://www.maptiler.com"]{display:none;}

.leaflet-right .leaflet-control{margin:0;}
.leaflet-touch .leaflet-bar a{background-color:var(--cl-gris-fonce); color:var(--cl-blanc); width:62px; height:62px; border:none; display:flex; justify-content:center; align-items:center; font-size:120%;}
.leaflet-touch .leaflet-bar a:first-child{border-bottom:1px solid var(--cl-border);}
.leaflet-touch .leaflet-bar a:hover{background-color:var(--cl-blanc); color:var(--cl-gris-fonce);}

/* Map */
.map-container{position:relative; overflow:hidden;}

/* Filtres */
.map-filters{background-color:var(--cl-gris-fonce); color:var(--cl-blanc); padding:30px 45px; display:flex; justify-content:space-between;} 
.map-filters-container{display:flex; gap:2em;}
.map-filters-container label img{width:15px; height:18px; margin-right:2px}
.map-filters-container label[for='repair-shops'] img{filter:brightness(5);}
.map-filters-container label input{display:none;}
.square{position:relative; display:inline-block; height:12px; width:12px; border:1px solid var(--cl-blanc); border-radius:2px; margin-left:5px;}
.map-filters-container label input:checked + .square{background:var(--cl-noir) url(../images/check.svg) scroll no-repeat center / cover;}


/* Popup */
.custom-popup{position:absolute; bottom:0; right:0; padding:40px; background-color:var(--cl-rouge); color:var(--cl-blanc); z-index:4; width:320px; transition:0.3s all ease 0s;}
.custom-popup .title{font-size:120%; line-height:1.2; font-weight:bold; margin-bottom:15px; }
.custom-popup address{font-style:inherit; line-height:1; margin-bottom:15px; }
.custom-popup a{color:var(--cl-blanc);}
.custom-popup:before{content:url(../images/descote_arrows_bw.svg); position:absolute; top:0; left:40px; translate:0 -44%;}
/*.custom-popup.active{right:0;}*/
.marker-phone{padding-left:20px; background:url(../images/phone.svg) scroll no-repeat top left / auto 16px; font-size:90%;}
.marker-fax{padding-left:20px; background:url(../images/fax.svg) scroll no-repeat top left / auto 16px; font-size:90%;}
.marker-mail a{padding-left:20px; background:url(../images/email.svg) scroll no-repeat top left / 14px 14px; font-size:90%;}


.leaflet-control-attribution{display:none;} 


@media all and (max-width:1400px){
    .custom-popup{padding:30px 60px; width:auto;}
}

@media all and (max-width:991px){
    .map-filters{font-size:80%;}
    .custom-popup{font-size:80%; padding:30px;}
}

@media all and (max-width:781px){
    .map-filters{padding:15px; flex-wrap:wrap; gap:2em;}
    .map-filters > div:first-child{font-size:140%;}
    .map-filters-container{flex:0 0 100%;}

}


@media all and (max-width:600px){
    #map{height:400px;}
    
    .map-filters{position:relative;}
    .map-filters-container{flex-wrap:wrap;}
    .map-filters-container label{flex:0 0 100%;}
    
    .custom-popup{position:relative; width:100%; font-size:100%;}


    .leaflet-touch .leaflet-bar a{height:45px; width:45px;}
}

@media all and (max-width:450px){
    #map{height:300px;}
}