/* ==================================================== Graphique Monde ======================================================== */


.diagram {
  flex: 1;
  width: 50%;

}

/* container qui regroupe les données du diagramme */

@media screen and (min-width: 1200px) {
  .text-container {
    width: 30%;
    max-width: 700px;
    background-color: #650093;
    padding: 10px;
    color: white;
    font-size: 0.9rem;
    text-align: left;
    border-radius: 15px;
    bottom: 300px;
    margin-right: 90px;
    margin-top: 10px;
    position: relative;
  }
  .container {
    display: flex;
  justify-content: space-between;
  gap: 5vw;
  align-items: center;
  }
  
  .center-container {
    display: flex;
    
  }

  .accordion{
    justify-content: center; /* Centre horizontalement */
    align-items: center;    /* Centre verticalement */
    margin: auto;  

  }




}



@media screen and (max-width: 1200px) {


  .diagram {
    width: 100%;
  }

  .text-container {
    margin-top: 20px;
    max-width: 700px;
    background-color: #650093;
    padding: 10px;
  color: white;
  font-size: 0.9rem;
  text-align: left;
  border-radius: 15px;
  margin: auto;  

  }

  .panel{
    display: flex;
  }

  .center-container {
    display: flex;
    margin: 0; 
   
  }

  .accordion{
    justify-content: center; /* Centre horizontalement */
    align-items: center;    /* Centre verticalement */
    margin: auto;  
  }

}


/* ==================================== TABLEAU =================================================== */

/* css du tableau pour les revenus dans le monde */
/* Conteneur centré */


/* Style pour le bouton accordion */
.accordion {
  background-color: #8c3aca;
  color: white;
  cursor: pointer;
  padding: 10px 20px;
  border: none;
  font-size: 1rem;
  border-radius: 5px;
  transition: background-color 0.3s;
  box-shadow: 0 4px 6px rgba(186, 49, 255, 0.1);
  margin-bottom: 10px;
}

.accordion:hover {
  background-color: #642892;
}


.styled-table{

  margin-left: 230px;
}




/* Description */


.description3{
  
  margin-left: 150px;
  margin-top: 50px  ;
  margin-bottom: 100px;
 

}

.description2 {
 
  margin-left: 200px;
  margin-top: -50px;
  margin-top: -50px;
}