.leaflet-control-basemap {
  position: relative;
  width: 90px;
  height: 90px;
  border-radius: 16px;
  border: 2px solid transparent;
  box-shadow: 0 0 5px rgb(0 0 0 / 0.4);
 
}

/* Hover = thicker outline */
.leaflet-control-basemap:hover {
  border-width: 3px;
}

/* Active basemap outline colors */
.leaflet-control-basemap.vector-active {
  border-color: #ffffff;
}

.leaflet-control-basemap.satellite-active {
  border-color: #000000;
}

.basemap-img {
  width: 100%;
  height: 100%;
  border-radius: 10px;
  background-size: cover;
  background-position: center;
  cursor: pointer;
  transition: opacity 0.4s ease, transform 0.4s ease;
}

/* Loading animation */
.basemap-img.loading {
  opacity: 0;
  transform: scale(0.95);
}