.search-bar {
  position: absolute;
  top: 40px; /* Posizione dalla parte superiore */
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center; /* Allinea gli elementi verticalmente */
  gap: 10px; /* Spaziatura tra i pulsanti e l'input */
  background-color: rgba(0, 0, 0, 0.7); /* Sfondo semi-trasparente */
  padding: 10px; /* Padding interno */
  border-radius: 10px; /* Bordo arrotondato */
  z-index: 10; /* Porta la barra in primo piano */
  width: 350px; /* Imposta una larghezza fissa per la barra */
}

.search-bar input {
  padding: 5px; /* Padding interno */
  background-color: #333; /* Colore di sfondo dell'input */
  color: white; /* Colore del testo */
  border: none; /* Nessun bordo */
  border-radius: 5px; /* Bordo arrotondato */
  flex: 1; /* Occupa tutto lo spazio disponibile */
}

.menu-btn,
.filter-btn {
  background: none; /* Rimuove lo sfondo */
  border: none; /* Rimuove il bordo */
  color: white; /* Colore dell'icona */
  cursor: pointer; /* Cambia il cursore al passaggio del mouse */
  font-size: 1.2em; /* Dimensione dell'icona */
}

.filter-btn {
  padding: 0; /* Rimuove il padding per rendere il pulsante più piccolo */
}

.filter-btn:hover,
.menu-btn:hover {
  color: #61dafb; /* Colore al passaggio del mouse */
}

.find-location-btn {
  position: absolute;
  bottom: 30px; /* Posizione dalla parte inferiore */
  left: 50%;
  transform: translateX(-35%);
  z-index: 10; /* Porta il pulsante in primo piano */
  width: 300px;
}

.find-location-btn button {
  background-color: #007bff; /* Colore di sfondo del pulsante */
  color: white; /* Colore del testo */
  border: none; /* Nessun bordo */
  padding: 10px 20px; /* Padding interno */
  border-radius: 20px; /* Bordo arrotondato */
  cursor: pointer; /* Cambia il cursore al passaggio del mouse */
}

.find-location-btn button:hover {
  background-color: #0056b3; /* Colore di sfondo al passaggio del mouse */
}