/* Les premiers pas d'un nouveau coureur (U9), dans Mes données. Feuille chargée avant `rp.css`
   (ordre alphabétique) : seulement des classes nouvelles `rp-premiers-…`, avec ses variables. */

.rp-premiers-etapes {
  list-style: none;
  margin: var(--rp-espace-3) 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--rp-espace-3);
}
.rp-premiers-etape { display: flex; gap: var(--rp-espace-3); align-items: flex-start; }
.rp-premiers-marque {
  flex: 0 0 28px;
  height: 28px;
  border-radius: var(--rp-rayon-pastille);
  border: 1px solid var(--rp-sombre-ligne);
  color: var(--rp-sombre-texte-secondaire);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--rp-police-chiffres);
  font-size: var(--rp-taille-secondaire);
}
.rp-premiers-texte { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.rp-premiers-titre { font-weight: 600; }
.rp-premiers-phrase { color: var(--rp-sombre-texte-secondaire); font-size: var(--rp-taille-secondaire); }
.rp-premiers-action { font-weight: 600; margin-top: var(--rp-espace-1); }

/* Fait : la coche, accent ; maintenant ou en cours : la pastille pleine ; à venir : discret. */
.rp-premiers-fait .rp-premiers-marque { border-color: var(--rp-sombre-accent); color: var(--rp-sombre-accent); }
.rp-premiers-maintenant .rp-premiers-marque,
.rp-premiers-en-cours .rp-premiers-marque {
  background: var(--rp-sombre-accent);
  border-color: var(--rp-sombre-accent);
  color: var(--rp-sombre);
  font-weight: 600;
}
.rp-premiers-a-venir .rp-premiers-titre { color: var(--rp-sombre-texte-secondaire); font-weight: 500; }

/* Quoi apporter : une source par bloc. */
.rp-premiers-source { display: flex; flex-direction: column; gap: var(--rp-espace-1); }

/* Le bilan du premier import : ce qui est arrivé, ce que ça vaut (carte sombre). */
.rp-premiers-bilan {
  margin-top: var(--rp-espace-4);
  padding-top: var(--rp-espace-3);
  border-top: 1px solid var(--rp-sombre-ligne);
  display: flex;
  flex-direction: column;
  gap: var(--rp-espace-3);
}
.rp-premiers-bilan-titre { font-weight: 600; }
.rp-premiers-groupe { display: flex; flex-direction: column; gap: var(--rp-espace-1); }
.rp-premiers-lignes {
  margin: 0;
  padding-left: 1.1em;
  font-size: var(--rp-taille-secondaire);
  color: var(--rp-sombre-texte-secondaire);
}
.rp-premiers-texte .rp-bouton { align-self: flex-start; margin-top: var(--rp-espace-1); }