/* Appliquer la police "Inter" à toute la page */
body {
    margin: 0;
    font-family: 'Inter', sans-serif;
    overflow: hidden; /* Empêche le défilement global */
}

html {
    height: 100%;
}

/* Conteneur de la barre de recherche */
#searchContainer {
    position: sticky; /* La barre de recherche reste visible */
    top: 0; /* Fixée en haut */
    z-index: 10; /* Passe au-dessus des autres éléments */
    background-color: white; /* Couleur de fond pour couvrir le contenu en dessous */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Ajoute une ombre pour la mettre en relief */
    padding: 10px;
}

/* Champ de recherche */
#searchInput {
    width: 100%;
    max-width: 300px;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-size: 16px;
}

/* Conteneur du tableau */
#tableContainer {
    width: 100%; /* Assurez-vous que le conteneur prend toute la largeur de la page */
    overflow-x: auto; /* Permettre le défilement horizontal si nécessaire */
    max-height: calc(100vh - 60px); /* Ajuste la hauteur du tableau pour occuper l'espace restant */
    overflow-y: auto; /* Permettre un défilement vertical */
}

/* Style général du tableau */
table {
    width: 100%; /* Occupe toute la largeur disponible */
    border-collapse: collapse;
    margin-top: 0; /* Pas d'espace supplémentaire au-dessus */
    table-layout: auto; /* Ajuste automatiquement la largeur des colonnes au contenu */
}

th, td {
    padding: 10px;
    text-align: left;
    border: 1px solid #ddd;
    white-space: nowrap; /* Empêche les retours à la ligne dans les cellules */
}

th {
    background-color: #f9f9f9;
    font-weight: 600; /* Gras pour les en-têtes */
}

tr:nth-child(even) {
    background-color: #f9f9f9;
}