#register {
  margin-right: 25px;
  margin-left: 10px;
}

#login {
  margin-left: 10px;
}

#projet {
  margin-right: 25px;
}

#disconnect {
  margin-left: 10px;
}
#contact {
  margin-right: 25px;
}

#codepromo {
  margin-right: 25px;
}

#tarification {
  margin-right: 25px;
}

#usersView {
  margin-right: 25px;
}

#listProjet {
  margin-right: 25px;
}

#notification {
  margin-left: 10px;
}
#logo {
  width: 200px; /* Ajustez la largeur selon vos besoins */
  height: auto; /* Conserve les proportions de l'image */
  display: inline; /* Assure que l'image est un élément en ligne */
  vertical-align: middle; /* Aligne verticalement l'image au milieu */
}
.button-container {
  display: flex;
  align-items: center; /* Centre les boutons verticalement */
  justify-content: flex-end; /* Aligne tous les boutons à droite */
  gap: 10px; /* Ajoute de l'espace entre chaque bouton */
  flex-grow: 1; /* Permet au conteneur de boutons de s'étendre et de remplir l'espace disponible */
}

/* Tablette */
@media (max-width: 1280px) {
  .button-container {
    font-size: 12px;
    line-height: 2;
    gap: 5px;
  }

  #register {
    margin-right: 15px;
    margin-left: 5px;
  }

  #login {
    margin-left: 10px;
  }

  #projet {
    margin-right: 15px;
  }

  #disconnect {
    margin-left: 5px;
  }
  #contact {
    margin-right: 15px;
  }

  #codepromo {
    margin-right: 15px;
  }

  #tarification {
    margin-right: 15px;
  }

  #usersView {
    margin-right: 15px;
  }

  #listProjet {
    margin-right: 15px;
  }

}
@media (max-width: 768px) {
  #hamburger-btn {
    display: block !important;
  }

  #hamburger-btn.active {
    background-color: #cccccc !important;
    color: #009688;
  }

  #hamburger-btn {
    background-color: transparent !important;
    transition: background-color 0.2s ease;
  }

  .button-container {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
    padding: 8px 0;
    max-height: 0;
    overflow: hidden;
    opacity: 0;

    transition: max-height 0.3s ease, opacity 0.25s ease;
  }

  .button-container.open {
    max-height: 500px;
    opacity: 1;  }

  .button-container button {
    width: 100%;
    text-align: left;
    margin: 2px 0;
  }
  .button-container button {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}