/* Structure globale */
.flexit-osm-container-wrapper { position: relative; z-index: 1; max-width: 100%; }
.flexit-osm-container { position: relative; z-index: 1; max-width: 100%; }
.flexit-osm { position: relative; max-width: 100%; }

.flexit-osm .leaflet-marker-icon { }
.flexit-osm .leaflet-marker-icon.active { z-index: 999998 !important; } /* Méga gros z-index parce-que OSM force l'index individuellement sur chaqur marqueur  */

/* Popup */
.flexit-osm-popup { min-width: 200px; max-width: 45%; max-height: calc(100% - 20px); padding: 25px; background: #fff; position: absolute; z-index: 999; top: 10px; left: 10px; border-radius: 12px; box-shadow: 0 0 10px -5px #000;  display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; }
.flexit-osm-popup.inactive { display: none; }
.flexit-osm-popup-title { flex: 0 0 auto; padding: 5px 0; font-weight: bold; font-size: 16px; }
.flexit-osm-popup-content { flex: 0 1 calc( 100% - 20px ); overflow-y: auto; }
.flexit-osm-popup-content img { max-width: 100%; height: auto !important; }
.flexit-osm-popup-close { width: 20px; height: 20px; position: absolute; top: 5px; right: 5px; cursor: pointer }
.flexit-osm-popup-close:after,
.flexit-osm-popup-close:before { content: ''; position: absolute; top: 50%; left: 50%; height: 4px; width: 80%; background: #333; border-radius: 2px; }
.flexit-osm-popup-close:after { transform: translateX(-50%) translateY(-50%) rotateZ(-45deg); }
.flexit-osm-popup-close:before { transform: translateX(-50%) translateY(-50%) rotateZ(45deg); }


/* Windowed */
.flexit-osm-container-wrapper.leaflet-sleep-windowed-enabled > .flexit-osm-container { width: 1024px !important; height: 768px !important; max-width: 95%; max-height: 95%; }

/* Fullscreen */
body.flexit-osm-fullscreen-enabled * { z-index: inherit !important; }
body.flexit-osm-fullscreen-enabled .leaflet-pane.leaflet-map-pane { z-index: 1 !important;}
body.flexit-osm-fullscreen-enabled .leaflet-control-container { z-index: 2 !important;}
body.flexit-osm-fullscreen-enabled .leaflet-control-container > div { z-index: 1 !important;}
body.flexit-osm-fullscreen-enabled .flexit-osm-popup { z-index: 999 !important; }

.flexit-osm-container-wrapper.leaflet-sleep-fullscreen-enabled { z-index: 1000 !important; }
.flexit-osm-container-wrapper.leaflet-sleep-fullscreen-enabled > .flexit-osm-container {
    max-width: 100%; max-height: 100%; width: 100% !important; height: 100% !important; position: fixed; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 2px 12px 0; -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 2px 12px 0; box-shadow: rgba(0, 0, 0, 0.2) 0 2px 12px 0;
}
.flexit-osm-container-wrapper.leaflet-sleep-fullscreen-enabled > .flexit-osm-container > .flexit-osm { width: 100% !important; height: 100% !important; position: relative; z-index: 100 !important; }
.flexit-osm-container-wrapper.leaflet-sleep-fullscreen-enabled > .flexit-osm-container:after { display: block; content: ''; background: #fff; opacity: 0.85; position: fixed; width: 100vw; height: 100vh; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); z-index: 99; }

/* Controles FlexitOSM */
.leaflet-bar.leaflet-fosm-toolbar a { cursor: pointer; background-position: 0 0; background-repeat: no-repeat; background-size: 60px 30px; background-clip: padding-box; -moz-transition: none; -webkit-transition: none; -o-transition: none; transition: none; }

.leaflet-fosm-toolbar .leaflet-fosm-enable-fullscreen { background-image: url('/globalflexit/backoffice/modules/openstreetmap/front/templates/js/flexit-osm/medias/flexitosm-icons-sprite.png'); }
.leaflet-fosm-toolbar .leaflet-fosm-enable-fullscreen { background-image: url('/globalflexit/backoffice/modules/openstreetmap/front/templates/js/flexit-osm/medias/flexitosm-icons-sprite.png'); }

.leaflet-retina .leaflet-fosm-toolbar .leaflet-fosm-toggle-fullscreen { background-image: url('/globalflexit/backoffice/modules/openstreetmap/front/templates/js/flexit-osm/medias/flexitosm-icons-sprite-2x.png'); }

/* Controles FlexitOSM en mode fullscreen */
.flexit-osm-container-wrapper.leaflet-sleep-fullscreen-enabled .leaflet-bar.leaflet-fosm-toolbar .leaflet-fosm-enable-fullscreen { background-position: -30px 0; }


/* Tablettes et en dessous */
@media (max-width: 768px) {
    /* Sans le mode fullscreen si une popup est active (cas où on s'amuse avec la dimension du périphérique PC par ex) */
    .flexit-osm-popup { width: calc( 80% - 20px ); max-width: 100%; }
    .flexit-osm-popup-content { -webkit-overflow-scrolling: touch; }
    .flexit-osm-popup-close { width: 30px; height: 30px; }
    .flexit-osm-container-wrapper.leaflet-sleep-fullscreen-enabled .flexit-osm-popup { width: 100%; max-height: 100%; z-index: 1001; position: fixed; bottom: 0; left: 0; right: 0; top: auto; border-radius: 0; }
    .flexit-osm-container-wrapper.leaflet-sleep-fullscreen-enabled .flexit-osm-popup-content { width: 100%; max-height: 100%; }
    .flexit-osm-container-wrapper.leaflet-sleep-fullscreen-enabled .flexit-osm .leaflet-control-attribution { display: none; }
}