/* ============================================================
   DEFI-SEMAINE.CSS — Les Cahiers APC
   ============================================================ */

/* ── En-tête ──────────────────────────────────────────────── */
.defi-header {
  display: flex; align-items: center;
  justify-content: space-between;
  margin-bottom: 12px; flex-wrap: wrap; gap: 8px;
}
.defi-logo { font-size: 1.1rem; font-weight: 700; color: #D4AC0D; }
.defi-pseudo-pill {
  background: #1A5276; color: #fff;
  border-radius: 99px; padding: 4px 14px;
  font-size: 0.85rem; font-weight: 600;
}

/* ── Intro ────────────────────────────────────────────────── */
.defi-intro {
  background: #fefce8; border: 1.5px solid #D4AC0D;
  border-radius: 10px; padding: 12px 14px;
  font-size: 0.88rem; color: #713f12;
  margin-bottom: 14px;
}
.defi-intro p { margin: 3px 0; }

/* ── Choix du pseudonyme ──────────────────────────────────── */
.defi-pseudo-zone {
  background: #fff; border: 2px solid #D4AC0D;
  border-radius: 12px; padding: 16px;
  margin-bottom: 14px;
  animation: gam-fade-in 0.3s ease;
}
.defi-pseudo-titre { font-weight: 700; font-size: 1rem; color: #1A5276; margin-bottom: 6px; }
.defi-pseudo-info  { font-size: 0.85rem; color: #718096; margin-bottom: 12px; }
.defi-pseudo-row   { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; }
.defi-input {
  flex: 1; min-width: 160px;
  padding: 9px 13px; border: 1.5px solid #e2e8f0;
  border-radius: 9px; font-size: 1rem; color: #1c2833;
  outline: none; transition: border-color 0.15s;
}
.defi-input:focus { border-color: #D4AC0D; }
.defi-pseudo-erreur { font-size: 0.82rem; color: #922B21; min-height: 1em; }
.defi-pseudo-regles { font-size: 0.75rem; color: #94a3b8; margin-top: 6px; }

/* ── Section titre ────────────────────────────────────────── */
.defi-section-titre {
  font-size: 0.9rem; font-weight: 700; color: #1A5276;
  padding: 7px 14px; background: #eaf4fb;
  border-left: 4px solid #D4AC0D; border-radius: 0 8px 8px 0;
  margin-bottom: 10px;
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.defi-total-pill {
  background: #1A5276; color: #fff;
  border-radius: 99px; padding: 2px 10px;
  font-size: 0.75rem; font-weight: 600;
}

/* ── Liste des semaines ───────────────────────────────────── */
.defi-semaines-liste { display: flex; flex-direction: column; gap: 8px; }
.defi-sem-card {
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; background: #fff; border: 1.5px solid #e2e8f0;
  border-radius: 10px; padding: 10px 14px; cursor: pointer;
  transition: border-color 0.2s, box-shadow 0.15s;
}
.defi-sem-card:hover { border-color: #D4AC0D; box-shadow: 0 2px 8px rgba(212,172,13,0.15); }
.defi-sem-info { display: flex; align-items: center; gap: 10px; flex: 1; min-width: 0; }
.defi-mon-score { font-size: 0.85rem; font-weight: 700; white-space: nowrap; }
.defi-sem-new   { font-size: 0.78rem; color: #94a3b8; font-style: italic; }

/* ── Mon rang ─────────────────────────────────────────────── */
.defi-mon-rang {
  display: flex; align-items: center; justify-content: space-between;
  background: #fffbeb; border: 2.5px solid #D4AC0D;
  border-radius: 12px; padding: 14px 18px;
  margin-bottom: 12px;
  animation: gam-fade-in 0.4s ease;
}
.defi-mon-rang-num {
  font-size: 1.6rem; font-weight: 700; line-height: 1;
}
.defi-mon-rang-detail { font-size: 0.82rem; color: #92400e; margin-top: 3px; }
.defi-mon-rang-score  { font-size: 2rem; font-weight: 700; }

.defi-pas-encore {
  background: #f8fafc; border: 1.5px solid #e2e8f0;
  border-radius: 10px; padding: 12px 16px;
  font-size: 0.88rem; color: #718096;
  text-align: center; margin-bottom: 12px;
}

/* ── Tableau classement ───────────────────────────────────── */
.defi-tableau { display: flex; flex-direction: column; gap: 6px; }
.defi-ligne {
  display: flex; align-items: center; gap: 10px;
  background: #fff; border: 1px solid #e2e8f0;
  border-radius: 9px; padding: 9px 12px;
  transition: background 0.15s;
}
.defi-ligne:nth-child(1) { border-color: #D4AC0D; background: #fffbeb; }
.defi-ligne:nth-child(2) { border-color: #94a3b8; background: #f8fafc; }
.defi-ligne:nth-child(3) { border-color: #b45309; background: #fef3c7; }
.defi-moi { border-color: #1A5276 !important; background: #eaf4fb !important; }

.defi-rang { font-size: 1.1rem; min-width: 28px; text-align: center; }
.defi-pseudo-nom { flex: 1; font-weight: 600; color: #1c2833; font-size: 0.9rem; }
.defi-moi-texte  { color: #1A5276; }
.defi-diff-tag {
  font-size: 0.72rem; padding: 2px 8px;
  background: #f1f5f9; color: #64748b;
  border-radius: 99px; white-space: nowrap;
}
.defi-score-ligne { font-weight: 700; font-size: 0.95rem; min-width: 40px; text-align: right; }

.defi-nb-total {
  text-align: center; font-size: 0.8rem;
  color: #94a3b8; padding: 8px; font-style: italic;
}

/* ── Actions ──────────────────────────────────────────────── */
.defi-action-zone {
  display: flex; gap: 10px; flex-wrap: wrap;
  margin-top: 16px;
}
.defi-btn-changer-pseudo { font-size: 0.82rem; }

/* ── Chargement & alertes ─────────────────────────────────── */
.defi-chargement { text-align: center; color: #718096; padding: 20px; font-size: 0.9rem; }
.defi-alerte {
  background: #fef9c3; border: 1.5px solid #eab308;
  border-radius: 10px; padding: 10px 14px;
  color: #713f12; font-size: 0.88rem; margin-bottom: 10px;
}
.defi-score-local {
  background: #eaf4fb; border: 1.5px solid #1A5276;
  border-radius: 10px; padding: 10px 14px;
  font-size: 0.88rem; color: #1A5276;
}

/* ── Retour ───────────────────────────────────────────────── */
.defi-retour { margin-bottom: 10px; }