#searchResults {
  background-color: #333; /* Sfondo grigio scuro */
  max-height: 700px; /* Altezza massima aumentata a 600px */
  overflow-y: auto; /* Aggiunge lo scroll se i risultati superano l'altezza massima */
  border-radius: 4px; /* Arrotonda gli angoli del contenitore dei risultati */
  color: white; /* Colore del testo bianco */
  display: grid; /* Utilizza Grid per disporre i risultati */
  grid-template-columns: repeat(2, minmax(250px, 1fr)); /* Colonne con larghezza minima di 300px */
  gap: 30px; /* Spazio aumentato tra le colonne a 30px */
  padding: 10px; /* Padding interno per il contenitore */
  width: 100%; /* Imposta la larghezza per evitare lo scroll orizzontale */
  max-width: 1000px; /* Imposta una larghezza massima per il contenitore */
  margin: 0 auto; /* Centra il contenitore nella pagina */
}

.search-result {
  padding: 10px; /* Aumento del padding per una migliore area cliccabile */
  cursor: pointer;
  background-color: #333; /* Sfondo dei risultati */
  color: white; /* Colore del testo bianco per i risultati */
  border: 1px solid transparent; /* Aggiungi un bordo trasparente per un effetto hover più fluido */
  border-radius: 4px; /* Arrotonda gli angoli dei risultati */
  /* Rimosso il white-space e overflow per consentire al testo di andare a capo */
  /* white-space: nowrap; */
  /* overflow: hidden; */
  /* text-overflow: ellipsis; */
}

.search-result:hover {
  background-color: #444; /* Sfondo leggermente più chiaro per l'hover */
  border: 1px solid #555; /* Aggiungi un bordo per evidenziare l'hover */
}

/* Media query per schermi più piccoli */
@media (max-width: 768px) {
  #searchResults {
    grid-template-columns: 1fr; /* Una sola colonna su schermi piccoli */
    width: 100%; /* Assicura che il contenitore occupi tutta la larghezza disponibile */
  }
}
