.custom-card {
  border-radius: 0 !important; /* Rimuove l'arrotondamento */
  box-shadow: none !important; /* Rimuove eventuali ombre */
  border: none !important; /* Rimuove il bordo della card */
}

a.nav-link.text-white:hover {
  color: #d3d3d3 !important; /* Colore grigio chiaro all'hover */
}

header {
  position: relative;
  z-index: 10;
}

.navbar-toggler {
  z-index: 20; /* Un valore maggiore rispetto all'header o agli altri elementi */
}

.custom-button {
  background-color: #6c63ff; /* Colore di sfondo viola */
  color: #ffffff; /* Colore del testo bianco */
  border: 2px solid #4e47c2; /* Bordo con colore più scuro */
  border-radius: 30px; /* Bordo arrotondato */
  transition: all 0.3s ease; /* Transizione per l'effetto hover */
}

.custom-button:hover {
  background-color: #4e47c2; /* Cambia il colore di sfondo al passaggio del mouse */
  color: #f8f9fa; /* Colore del testo leggermente più chiaro */
  border-color: #3c369b; /* Colore del bordo al passaggio del mouse */
  transform: scale(1.05); /* Leggera espansione del pulsante per l'effetto hover */
}

#backgroundCarousel {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1; /* Mette il carosello dietro il contenuto principale */
  overflow: hidden;
}

.carousel-inner img {
  width: 100%;
  height: 100vh;
  object-fit: cover; /* Adatta l'immagine per coprire tutta l'area */
}

.carousel {
    z-index: 1;
}



.custom-carousel-overlay {
    z-index: 2; /* Inferiore al modale */
}      

/* Patina nera per creare l'effetto scuro */
.dark-patina {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.85); /* Overlay nero con opacità 85% */
  z-index: 1; /* Sopra le immagini del carosello */
}

/* Stile del contenuto principale */
.container {
  position: relative;
  z-index: 200000000000; /* Sopra il carosello e l'overlay */
  color: white; /* Colore del testo per essere leggibile sull'overlay */
  padding-top: 5vh; /* Aggiusta il padding per distanziare il contenuto dallo sfondo */
}

.modal {
  position: fixed !important; /* Usa fixed per sovraimpressione */
  z-index: 2000 !important; /* Valore corretto per la modale */
}

.modal-backdrop {
  position: fixed !important; /* Copre l'intero viewport */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1999 !important; /* Adeguato per il backdrop */
  background-color: rgba(0, 0, 0, 0.5); /* Opacità */
}