body, html {
  margin: 0;
  height: 100%;
  overflow-x: hidden;
  font-family: system-ui, -apple-system;
  background: #00ad57;
}

*{ margin: 0; padding: 0; list-style: none; box-sizing: border-box; }

.init_app{ position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: #00ad57; z-index: 500; }


/*
* SECTION Get Location User
*/
.sec_getlocation_user{ position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; display: none; }
.wrapper_content{ position: relative; left: 0px; top: 0px; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: #e0f9db; z-index: 500; }





#app {
  position: relative;
  width: 100%;
  height: 100%;
}

.view {
  position: absolute;
  inset: 0;
  background: #00ad57;
  color: #000;
  transform: translateX(100%);
  transition: transform 0.3s ease;
  padding: 20px;
}

.view.active {
  transform: translateX(0) !important;
}

.view.exit-left {
  transform: translateX(-30%);
}


#map {
  height: 80vh;
  width: 100%;
}
#controls {
  padding: 10px;
}
.leaflet-control-attribution{ display: none; }