@include color-mode(dark) {}

#map-menu {
  z-index: 1001;
}

.offcanvas {
  top: 56px !important;
  transition: transform 0.5s ease-in-out !important;
  z-index: 1000 !important;
}

.offcanvas-start {
  left: 60px !important;
}

.active-sidebar {
  width: 350px !important;
}

.maplibregl-popup-content {
  background-color: var(--bs-body-bg) !important;
}

.maplibregl-popup-tip {
  border-top-color: var(--bs-body-bg) !important;
  /* For upward pointing popup */
  border-bottom-color: var(--bs-body-bg) !important;
  /* For downward pointing popup */
}

.maplibregl-ctrl-html-widget {
  background-color: var(--bs-body-bg) !important;
  color: var(--bs-body-color) !important;
}

.colorbar-widget {
  background: var(--bs-body-bg) !important;
}

.colorbar-tick {
  color: var(--bs-body-color) !important;
}