.calendar-day {
  transition: all 0.3s ease;
}
.calendar-day:hover:not(.disabled) {
  background-color: #ff6b00;
  color: white;
  cursor: pointer;
}
.selected {
  background-color: #ff6b00;
  color: white;
}
.disabled {
  color: #ccc;
  cursor: not-allowed;
}
.time-slot {
  transition: all 0.3s ease;
}
.time-slot:hover:not(.booked) {
  background-color: #ff6b00;
  color: white;
  cursor: pointer;
}
.time-slot.selected {
  background-color: #ff6b00;
  color: white;
}
.time-slot.booked {
  color: #ccc;
  cursor: not-allowed;
  text-decoration: line-through;
}
.form-section {
  display: none;
}
.form-section.active {
  display: block;
  animation: fadeIn 0.5s ease;
}
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.service-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}
.service-card {
  transition: all 0.3s ease;
}
/* Nouveaux styles pour la section "Nettoyage Professionnel" */
#accueil {
  height: 100vh; /* Prend toute la hauteur de la fenêtre */
}
#accueil video {
  width: 100%;
  height: 100%;
  object-fit: cover; /* Assure que la vidéo couvre toute la section */
}
.mobile-menu {
  display: none; /* Masquer le menu par défaut */
}
.mobile-menu.active {
  display: block; /* Afficher le menu lorsqu'il est actif */
}
/* Styles pour les vidéos */
.desktop-video {
  display: block;
}
.mobile-video {
  display: none;
}
@media (max-width: 768px) {
  .desktop-video {
    display: none;
  }
  .mobile-video {
    display: block;
  }
}