*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:'Poppins',sans-serif;
}

body{
    background:#0f0f0f;
    color:white;
}

.navbar{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:20px 8%;
    background:#111;
    border-bottom:2px solid gold;
}

.logo{
    font-size:28px;
    font-weight:700;
    color:gold;
}

nav a{
    color:white;
    text-decoration:none;
    margin-left:20px;
}

nav a:hover{
    color:gold;
}

.hero{
    min-height:85vh;
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    background:
    linear-gradient(
    rgba(0,0,0,.7),
    rgba(0,0,0,.8)
    );
}

.hero h1{
    font-size:60px;
    color:gold;
}

.hero p{
    margin-top:20px;
    font-size:20px;
}

.buttons{
    margin-top:30px;
}

.btn-gold,
.btn-dark{
    text-decoration:none;
    padding:15px 30px;
    border-radius:10px;
    margin:10px;
    display:inline-block;
}

.btn-gold{
    background:gold;
    color:black;
    font-weight:bold;
}

.btn-dark{
    border:2px solid gold;
    color:gold;
}

.games{
    padding:80px 8%;
    text-align:center;
}

.games h2{
    color:gold;
    margin-bottom:40px;
}

.cards{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
    gap:25px;
}

.card{
    background:#1b1b1b;
    padding:30px;
    border-radius:15px;
    border:1px solid #333;
}

.card h3{
    color:gold;
}

.card p{
    margin:20px 0;
}

.card button{
    background:gold;
    color:black;
    border:none;
    padding:12px 25px;
    border-radius:10px;
    cursor:pointer;
}

.features{
    padding:80px 8%;
    text-align:center;
}

.features h2{
    color:gold;
    margin-bottom:40px;
}

.feature-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
    gap:20px;
}

.feature{
    background:#1b1b1b;
    padding:25px;
    border-radius:12px;
}

footer{
    text-align:center;
    padding:50px;
    background:#111;
    border-top:2px solid gold;
}

.whatsapp{
    display:inline-block;
    margin-top:15px;
    color:gold;
    text-decoration:none;
}

@media(max-width:768px){

.navbar{
flex-direction:column;
gap:15px;
}

.hero h1{
font-size:40px;
}

    
    .profile,
    .wallet,
    .dashboard{
    padding:30px;
    }

}
/* ============================================================
   Ajouts : styles manquants (tournois, preuves, admin, chat,
   auth, salons de jeu). Beaucoup de ces classes étaient utilisées
   dans le HTML/JS mais n'avaient jamais été stylées.
   ============================================================ */

.page-title{ padding:40px 8% 10px; text-align:center; }
.page-title h1{ color:gold; font-size:38px; }
.page-title p{ color:#aaa; margin-top:10px; }

.creator-banner{
  display:flex; align-items:center; gap:20px;
  background:#1b1b1b; margin:20px 8%; padding:20px; border-radius:15px;
  border:1px solid #333;
}
.creator-banner img{ width:80px; height:80px; border-radius:50%; object-fit:cover; }
.creator-banner h2{ color:gold; }
.follow-btn{
  display:inline-block; margin-top:10px; background:gold; color:black;
  padding:8px 18px; border-radius:8px; text-decoration:none; font-weight:bold;
}
.follow-count{ margin-top:8px; color:#aaa; font-size:0.9em; }

section{ padding:20px 8%; }
section h2{ color:gold; margin-bottom:15px; }

.empty-state{ color:#888; padding:20px; text-align:center; }

.btn-gold-small{
  background:gold; color:black; border:none; padding:10px 20px;
  border-radius:8px; font-weight:bold; cursor:pointer;
}
.btn-gold-small:hover{ opacity:0.9; }

.btn-small{
  background:#333; color:gold; border:1px solid gold; padding:6px 12px;
  border-radius:6px; cursor:pointer; font-size:0.85em; margin-left:6px;
}
.btn-small:hover{ background:gold; color:black; }

/* Tournois */
#tournamentsList .tournament-card,
.item-row{
  background:#1b1b1b; border:1px solid #333; border-radius:12px;
  padding:15px 20px; margin-bottom:12px; display:flex; justify-content:space-between;
  align-items:center; flex-wrap:wrap; gap:10px;
}
.status-ouvert{ color:#3ddc84; }
.status-ferme{ color:#ff6b6b; }
.status-termine{ color:#888; }

/* Preuves de soutien */
.proof-form{
  background:#1b1b1b; border:1px solid #333; border-radius:12px;
  padding:20px; display:flex; flex-direction:column; gap:12px; max-width:500px;
}
.proof-form input, .proof-form textarea, .proof-form select{
  background:#0f0f0f; border:1px solid #333; color:white; padding:10px;
  border-radius:8px; font-family:inherit;
}
.proof-grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:15px; margin-top:20px;
}
.proof-grid img, .proof-grid video{ width:100%; border-radius:10px; }

/* Chat communautaire */
.chat-box{
  background:#1b1b1b; border:1px solid #333; border-radius:12px;
  padding:15px; max-width:600px;
}
.chat-messages{
  height:280px; overflow-y:auto; padding:10px; background:#0f0f0f;
  border-radius:8px; margin-bottom:10px; display:flex; flex-direction:column; gap:6px;
}
.chat-msg{ font-size:0.92em; color:#ddd; word-break:break-word; }
.chat-msg strong{ color:gold; }
.chat-msg-mine strong{ color:#3ddc84; }
.chat-form{ display:flex; gap:10px; }
.chat-form input{
  flex:1; background:#0f0f0f; border:1px solid #333; color:white;
  padding:10px; border-radius:8px;
}

/* Auth (register/login) */
.auth-msg{ margin-top:10px; font-size:0.9em; }

/* Admin dashboard */
.dash-wrap{ padding:30px 6%; }
.top-bar{ display:flex; justify-content:space-between; align-items:center; margin-bottom:20px; }
.logout-btn{
  background:#333; color:gold; border:1px solid gold; padding:8px 16px;
  border-radius:8px; cursor:pointer;
}
.tabs{ display:flex; gap:10px; margin-bottom:20px; flex-wrap:wrap; }
.tab-btn{
  background:#1b1b1b; color:#aaa; border:1px solid #333; padding:10px 18px;
  border-radius:8px; cursor:pointer;
}
.tab-btn.active{ background:gold; color:black; border-color:gold; }
.tab-content{ display:none; }
.tab-content.active{ display:block; }
.panel{
  background:#1b1b1b; border:1px solid #333; border-radius:12px;
  padding:20px; margin-bottom:20px;
}
.panel form{ display:flex; flex-direction:column; gap:12px; max-width:500px; }
.panel input, .panel textarea, .panel select{
  background:#0f0f0f; border:1px solid #333; color:white; padding:10px;
  border-radius:8px; font-family:inherit;
}
.submit-btn{
  background:gold; color:black; border:none; padding:12px; border-radius:8px;
  font-weight:bold; cursor:pointer;
}
.item-row .info h4{ color:gold; }
.item-row .info p{ color:#aaa; font-size:0.9em; margin-top:4px; }
.item-row .actions{ display:flex; align-items:center; flex-wrap:wrap; gap:6px; }
.pts-input{
  background:#0f0f0f; border:1px solid #333; color:white; padding:6px;
  border-radius:6px;
}

/* Salons de jeu (Ludo / Dames) */
.rooms-lobby{
  background:#1b1b1b; border:1px solid #333; border-radius:12px;
  padding:20px; max-width:600px; margin:20px auto;
}
.rooms-lobby h3{ color:gold; margin-bottom:10px; }
.room-actions{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:15px; }
.room-list-item{
  display:flex; justify-content:space-between; align-items:center;
  background:#0f0f0f; border:1px solid #333; border-radius:8px;
  padding:10px 15px; margin-bottom:8px;
}
.waiting-note{ color:#aaa; font-size:0.9em; margin-top:10px; }