/* ===== DA sobre + couleurs unies + accessibilité ===== */
:root{
  --bg:#0a0f1a;         /* fond plein unifié */
  --card:#0f131b;       /* cartes unies */
  --line:#232635;
  --text:#e5e7eb;
  --muted:#9aa3b2;

  --ok:#22c55e;         /* vert OK */
  --wait:#60a5fa;       /* bleu attente */
  --dq:#ef4444;         /* rouge DQ */

  /* accents UI */
  --acc-blue:#3b82f6;   /* Accueil */
  --acc-cyan:#06b6d4;   /* Tableau */
  --acc-cta:#06b6d4;    /* CTA Inscrire (cyan propre) */

  /* catégories */
  --cat-bas:#22d3ee;    /* BAS ELO (cyan) */
  --cat-mid:#a78bfa;    /* MID ELO (violet) */
  --cat-high:#f59e0b;   /* HAUT ELO (orange) */
}

*{box-sizing:border-box;}
html,body{height:100%; min-height:100%;}
body{
  margin:0;
  color:var(--text);
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background: var(--bg);             /* ✅ fond uni plein écran */
}

/* Topbar unie */
.topbar{
  background:#0b0d12;
  border-bottom:1px solid var(--line);
  position: sticky; top:0; z-index: 10;
}
.topbar-inner{
  max-width:1200px;
  margin:0 auto;
  padding:12px 16px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
}
.brand{display:flex;align-items:center;gap:10px;}
.brand img{width:36px;height:36px;border-radius:10px;border:1px solid #2a3148;object-fit:cover;}
.brand .title{font-weight:900;letter-spacing:.3px;}
.brand .handle{color:#87d7ff;}

.top-actions a{
  margin-left:8px;
  padding:8px 12px;
  border-radius:10px;
  background:#0f131b;
  border:1px solid var(--line);
  color:#dfe3f5;
  text-decoration:none;
  font-weight:800;
  transition: transform .06s ease, border-color .12s ease;
}
.top-actions a.user-home{ border-color: rgba(59,130,246,.35); }
.top-actions a.user-home:hover{ transform: translateY(-1px); border-color: var(--acc-blue); }
.top-actions a.user-table{ border-color: rgba(6,182,212,.35); }
.top-actions a.user-table:hover{ transform: translateY(-1px); border-color: var(--acc-cyan); }
/* Admin : sobre */
.top-actions a.admin-link:hover{ transform: translateY(-1px); }

/* Layout & cards */
.container{max-width:1200px;margin:20px auto;padding:12px;}
.card{
  background: var(--card);           /* ✅ uni */
  border:1px solid var(--line);
  border-radius:12px;
  padding:18px;
  margin-bottom:22px;                /* ✅ plus d’espace entre sections */
  transition: transform .06s ease, border-color .12s ease;
}
.card:hover{ transform: translateY(-1px); border-color:#2e3346; }

.grid{display:grid;grid-template-columns:1.1fr 0.9fr;gap:16px;}
@media (max-width: 980px){ .grid{ grid-template-columns:1fr; } }
.row{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:10px;}

h1,h2{margin:0 0 10px;}
h3{margin:8px 0 6px;}
.muted{color:var(--muted);}

/* Inputs + boutons */
.input{
  flex:1 1 280px; min-width:260px;
  background:#0b0f16; border:1px solid var(--line); color:var(--text);
  padding:10px 12px; border-radius:10px;
  transition: border-color .12s ease, transform .06s ease;
}
.input:hover{ transform: translateY(-1px); border-color:#2e3346; }
select.input{min-width:280px;}

.btn{
  padding:10px 14px; border-radius:10px;
  background:#131826; border:1px solid #2b2e3c;
  color:var(--text); font-weight:900; cursor:pointer;
  transition: transform .06s ease, border-color .12s ease;
}
.btn:hover{ transform: translateY(-1px); border-color:#3a425a; }
.btn.ghost{ background:transparent; border:1px dashed #2b2e3c; color:var(--muted); }
/* ✅ CTA cyan uni (plus de rouge moche) */
.btn.cta{
  background: var(--acc-cta);
  border-color: #0891b2;
  color: #001018;
}
.btn.cta:hover{ transform: translateY(-1px); border-color:#0ea5b3; }

/* Liens boutons */
.link-btn{
  padding:8px 12px; border:1px solid #2b2e3c; border-radius:10px;
  background:#0f131b; font-weight:800; color:#dfe3f5; text-decoration:none;
  transition: transform .06s ease, border-color .12s ease;
}
.link-btn:hover{ transform: translateY(-1px); border-color:#3a425a; }

/* Réseaux */
.social-row{display:flex;gap:10px;flex-wrap:wrap;margin:8px 0 12px;}
.social-btn{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:10px;border:1px solid #2b2e3c;font-weight:800;color:var(--text);text-decoration:none;transition: transform .06s ease, border-color .12s ease;}
.social-btn:hover{ transform: translateY(-1px); border-color:#3a425a; }
.social-btn.twitch{background:#1b1020;}
.social-btn.tiktok{background:#101820;}

/* Tables */
.table-responsive{overflow:auto;max-height:65vh;}
table{width:100%;border-collapse:collapse;min-width:880px;}
thead th{
  text-align:left; padding:12px;
  border-bottom:1px solid var(--line);
  position:sticky; top:0;
  background: var(--card);         /* ✅ uni */
  z-index:2; color:var(--muted); font-size:13px;
}
tbody td{ padding:12px; border-bottom:1px solid #15171b; vertical-align:middle; }
td.nowrap{ white-space: nowrap; }

/* Badges (agrandis) */
.badge{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 12px; border-radius:999px; font-weight:800; font-size:14px;
  border:1px solid #2b2e3c; line-height:1;
}
.dot{ width:8px; height:8px; border-radius:50%; display:inline-block; }
.ok   { background:rgba(34,197,94,.10);  color:#bbf7d0; }
.ok .dot{ background:var(--ok); }
.wait { background:rgba(96,165,250,.10); color:#cfe2ff; }
.wait .dot{ background:var(--wait); }
.dq   { background:rgba(239,68,68,.12); color:#fecaca; }
.dq .dot{ background:var(--dq); }

/* Catégories (index) — headers unis + listes aérées */
.cat-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;}
@media (max-width:980px){.cat-grid{grid-template-columns:1fr;}}
.cat-card{ border:1px solid var(--line); border-radius:12px; overflow:hidden; background: var(--card); }
.cat-head{
  padding:12px 14px; font-weight:900; letter-spacing:.3px; border-bottom:1px solid var(--line);
  display:flex; align-items:center; justify-content:space-between;
}
.cat-head .side{ font-weight:700; font-size:12px; color:#aab2c7; }
/* ✅ unis (pas de dégradés) */
.cat-card.bas  .cat-head{ background: rgba(34,211,238,.18); }
.cat-card.mid  .cat-head{ background: rgba(167,139,250,.18); }
.cat-card.high .cat-head{ background: rgba(245,158,11,.18); }

.twocol{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:14px;}
@media (max-width:640px){.twocol{grid-template-columns:1fr;}}
.block h4{ margin:0 0 8px 4px; color:#cbd5e1; }
ul.clean{list-style:none;padding-left:0;margin:6px 0;}
ul.clean li{
  padding:10px 12px;
  border:1px solid #2b2e3c; border-radius:10px; background:#0f131b;
  transition: transform .06s ease, border-color .12s ease;
  display:flex; align-items:center; gap:10px;
  margin-bottom:10px;                 /* ✅ plus d’espace vertical entre équipes */
}
ul.clean li:last-child{ margin-bottom:0; }
ul.clean li:hover{ transform: translateY(-1px); border-color:#3a425a; }
.bullet{ width:6px; height:6px; border-radius:50%; display:inline-block; }
.bullet.ok{ background: var(--ok); }
.bullet.dq{ background: var(--dq); }

/* Règlement — pas de surlignage agressif; juste une couleur pour mots clés */
.rule-strong{ color:#e5b567; font-weight:800; }
