/* Preloader Styles */
#preloader {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%; /*above select container*/
  z-index: 10001; /* Ensure it's higher than the dropdown menu */
  background-color: rgba(255, 255, 255, 1);
  display: flex;
  justify-content: center;
  align-items: center;
  pointer-events: auto; /* Allow the preloader to capture pointer events */
}

/* Spinner Styles */
.spinner {
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;
  width: 120px;
  height: 120px;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* General Reset */
html, body {
  margin: 0;
  padding: 0;
}

/* Map Styles */
#map {
  width: 100%;
  height: 100vh;
  margin: 0;
  padding: 0;
}

/* Dropdown Menu Styles */
#selectContainer {
  position: fixed;
  top: 0;
  z-index: 9999; /* below the preloader */
  width: 100%;
  padding: 11px 0;
  display: flex;
  justify-content: center;
  pointer-events: none; 
}

#countrySelect {
  width: 200px;
  pointer-events: auto; 
  z-index: 9999; /* below the preloader */
}

/* Additional Styles */
.form-label {
  font-weight: bold;
}

.text-end {
  font-weight: bold;
}

#flagImage img {
  max-width: 50%;
  height: auto;
  display: block;
  margin: 0 auto;
}

.bg-primary {
  background-color: purple !important;
}

.bg-blue {
  background-color: rgb(0, 170, 255) !important;
}

.leaflet-bar .easy-button-button {
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

.leaflet-bar .easy-button-button .fa {
  font-size: 20px;
}

.custom-icon {
  background: none;
}

.custom-icon svg {
  fill: blue;
}