/* ============================================
   PAGE PROFIL UTILISATEUR
   ============================================ */

/* Container principal */
.profil-container {
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* Titre et pseudo */
.profil-container h2,
#user-pseudo {
    color: #2c5f2d;
    font-size: 2.5rem; /* xx-large → valeur fixe */
    margin-top: 5rem;
    margin-bottom: 6rem;
}

/* Sections communes (infos, stats, badges) */
.infos-utilisateur,
.statistiques,
.badges {
    margin-bottom: 2rem;
    padding: 3rem;
    background-color: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    width: 100%;
    max-width: 900px; /* Limite la largeur sur grand écran */
}

/* Container des informations */
.informations {
    display: flex;
    flex-direction: row;
    gap: 3rem;
    flex-wrap: wrap; /* Important pour le responsive */
}

/* Cartes individuelles */
.info-card {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    flex: 1; /* Prend l'espace disponible */
    min-width: 200px; /* Largeur minimale */
}

/* Valeurs des statistiques */
.stat-value {
    text-align: center;
    font-size: 1.2rem;
    font-weight: bold;
    color: #2c5f2d;
}