<div class="container">
    <h1>Gérer les Classes</h1>
    <!-- Boutons de sélection des classes -->
    <button id="btn3eme">Classe de 3ème</button>
    <button id="btn4eme">Classe de 4ème</button>

    <!-- Modale Classe 3ème -->
    <div id="modale3eme" class="modale">
      <div class="modale-content">
        <h2>Élèves de la Classe de 3ème</h2>
        <button class="eleve" data-idBdd="i4xdhdgWv9gPkDZMWw33" onclick="afficherEleve(this)">Leslie C</button>
        <button class="eleve" data-idBdd="yEInDwc1661VTikWgTBn" onclick="afficherEleve(this)">Enzo C</button>
        <button class="eleve" data-idBdd="YWtn18tzop3PxBStKJxg" onclick="afficherEleve(this)">D'shawn C</button>
        <button class="eleve" data-idBdd="Ry2bh0iEobD2Wj98Necj" onclick="afficherEleve(this)">Naïla G</button>
        <button class="eleve" data-idBdd="jUAAfmDSWk9aB9hS1HAP" onclick="afficherEleve(this)">Clara M</button>
        <button class="eleve" data-idBdd="MVxyRVgsVWucJDURqf0n" onclick="afficherEleve(this)">Manon P</button>
        <button onclick="fermerModale('modale3eme')">Fermer</button>
      </div>
    </div>

    <!-- Modale Classe 4ème -->
    <div id="modale4eme" class="modale">
      <div class="modale-content">
        <h2>Classe de 4ème</h2>
        <button id="btnGroupe1">Groupe 1</button>
        <button id="btnGroupe2">Groupe 2</button>
        <button onclick="fermerModale('modale4eme')">Fermer</button>
      </div>
    </div>

    <!-- Modale Groupe 1 de 4ème -->
    <div id="modaleGroupe1" class="modale">
      <div class="modale-content">
        <h2>Élèves du Groupe 1 (4ème)</h2>
        <button class="eleve" data-idBdd="w7OEKgfupysL0jXDmxor" onclick="afficherEleve(this)">Saona B</button>
        <button class="eleve" data-idBdd="iiijS0LcQHhX7kuqucgV" onclick="afficherEleve(this)">Tommy H</button>
        <button class="eleve" data-idBdd="mWk0o1uV41DYOaEIYiWr" onclick="afficherEleve(this)">Sayan P</button>
        <button class="eleve" data-idBdd="8Ja2nFkpku4AFnpTtfT4" onclick="afficherEleve(this)">Sory T</button>
        <button class="eleve" data-idBdd="NrcEDpGBBoYyFnGSqL9X" onclick="afficherEleve(this)">Jeanne V</button>
        <button class="eleve" data-idBdd="5qE4ZltFiySY33oNE7Ue" onclick="afficherEleve(this)">Mohamed Y</button>
        <button onclick="fermerModale('modaleGroupe1')">Fermer</button>
      </div>
    </div>

    <!-- Modale Groupe 2 de 4ème -->
    <div id="modaleGroupe2" class="modale">
      <div class="modale-content">
        <h2>Élèves du Groupe 2 (4ème)</h2>
        <button class="eleve" data-idBdd="MeOVEtBRarr3znfWu2rJ" onclick="afficherEleve(this)">Naïla D</button>
        <button class="eleve" data-idBdd="ZbsMMj8y14CJGwOKWNVj" onclick="afficherEleve(this)">Lyséane G</button>
        <button class="eleve" data-idBdd="YnOO2ZdbhQ9yz0lWlyTT" onclick="afficherEleve(this)">Rafael L</button>
        <button class="eleve" data-idBdd="LwRjHyvvJ90poX7oSCgz" onclick="afficherEleve(this)">Huseyin M</button>
        <button class="eleve" data-idBdd="io1bMbHWPUItV1RnL8LH" onclick="afficherEleve(this)">Mamadou T</button>
        <button class="eleve" data-idBdd="B6h7gWRL0pyfpPCMlgOH" onclick="afficherEleve(this)">Alyzé T</button>
        <button onclick="fermerModale('modaleGroupe2')">Fermer</button>
      </div>
    </div>
  </div>