/* student/dashboard.css

   Tableau de bord élève : action du moment, niveau, exercices à faire.

   Chargé par index.html, dans l'ordre de css/README.md. Ne pas changer cet
   ordre sans relire la section « Ordre de chargement ».

   Une seule carte mise en avant, l'action du moment. Le niveau et les
   exercices sont des listes groupées, sans carte par élément. */

.home-block { max-width: var(--w-read); margin: 0 0 var(--s-6); }

.home-block:last-child { margin-bottom: 0; }

.home-see-all { margin: var(--s-3) 0 0; }

/* ---------- action du moment : la seule carte mise en avant ---------- */

.home-hero {
  max-width: var(--w-read);
  margin: 0 0 var(--s-6);
  padding: var(--s-5);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-card);
  display: flex;
  flex-direction: column;
  gap: var(--s-2);
}

.home-hero-label { margin: 0; font-size: var(--fs-2); font-weight: 600; color: var(--primary); }

.home-hero-title { margin: 0; font-size: var(--fs-6); font-weight: 650; letter-spacing: -0.015em; line-height: 1.25; text-wrap: balance; }

.home-hero-progress { display: flex; flex-direction: column; gap: 6px; margin: var(--s-2) 0 var(--s-1); }

.home-hero-progress .bar { display: block; margin: 0; background: var(--surface-2); }

.home-hero .btn-block { height: 48px; margin-top: var(--s-2); font-size: var(--fs-4); font-weight: 600; border-radius: var(--r-md); }

/* ---------- liste groupée : niveau, exercices à faire ---------- */

.home-group {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  overflow: hidden;
}

.home-row {
  display: flex;
  align-items: center;
  gap: var(--s-3);
  width: 100%;
  min-height: 60px;
  padding: 10px var(--s-4);
  background: none;
  border: 0;
  border-top: 1px solid var(--border);
  font: inherit;
  color: var(--text);
  text-align: left;
  cursor: pointer;
}

.home-row:first-child { border-top: 0; }

.home-row:hover { background: var(--surface-2); }

.home-row-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }

.home-row-title { font-size: var(--fs-4); font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.home-row-go { font-size: var(--fs-6); line-height: 1; color: var(--muted); }

.home-dot { width: 18px; height: 18px; flex: 0 0 auto; border-radius: 50%; border: 2px solid var(--border-strong); }

.home-dot.half { border-color: var(--primary); background: linear-gradient(90deg, var(--primary) 50%, transparent 50%); }
