body {
    font-family: Arial, sans-serif; /* Police de la page */
    background-color: #f4f4f4; /* Couleur de fond de la page */
    margin: 0; /* Supprime la marge par défaut */
    padding: 20px; /* Ajoute un rembourrage autour de la page */
}

table {
    width: 100%; /* Largeur du tableau à 100% */
    border-collapse: collapse; /* Supprime l'espace entre les cellules */
    margin-bottom: 20px; /* Espace en bas du tableau */
    background-color: #fff; /* Couleur de fond du tableau */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); /* Ombre pour un effet de profondeur */
    margin-top: 10px;
}

th {
    background-color: #040249; /* Couleur de fond des en-têtes */
    color: white; /* Couleur du texte des en-têtes */
    padding: 12px; /* Rembourrage des cellules d'en-tête */
    text-align: left; /* Alignement du texte à gauche */
}

td {
    padding: 12px; /* Rembourrage des cellules */
    text-align: left; /* Alignement du texte à gauche */
    border-bottom: 1px solid #ddd; /* Bordure en bas des cellules */
}

tr:hover {
    background-color: #f1f1f1; /* Couleur de fond des lignes au survol */
}

.btn {
    padding: 8px 12px; /* Rembourrage des boutons */
    border: none; /* Supprime la bordure des boutons */
    border-radius: 5px; /* Coins arrondis */
    color: white; /* Couleur du texte des boutons */
    text-decoration: none; /* Supprime le soulignement */
    font-weight: bold; /* Met en gras le texte des boutons */
    transition: background-color 0.3s; /* Ajoute une transition pour le survol */
}

.btn-primary {
    background-color: #007bff; /* Couleur de fond pour le bouton de modification */
}

.btn-primary:hover {
    background-color: #0056b3; /* Couleur de fond au survol du bouton de modification */
}

.btn-danger {
    background-color: #dc3545; /* Couleur de fond pour le bouton de suppression */
}

.btn-danger:hover {
    background-color: #c82333; /* Couleur de fond au survol du bouton de suppression */
}

.utilisateurs {
    text-align: right; /* Aligne le lien à droite */
    margin-bottom: 20px; /* Ajoute un espacement en bas */
}

.utilisateurs a {
    display: inline-block; /* Permet d'ajouter du rembourrage */
    padding: 10px 20px; /* Rembourrage autour du texte */
    background-color: #09035f; /* Couleur de fond */
    color: white; /* Couleur du texte */
    text-decoration: none; /* Supprime le soulignement */
    border-radius: 5px; /* Coins arrondis */
    transition: background-color 0.3s; /* Transition pour l'effet au survol */
}

.utilisateurs a:hover {
    background-color: #050464; /* Couleur de fond au survol */
}

@media (max-width: 600px) {
    table {
        font-size: 14px; /* Taille de police pour les petits écrans */
    }

    th, td {
        padding: 8px; /* Rembourrage des cellules pour les petits écrans */
    }
}
