/**
 * Robes : le nom courant, puis le détail en plus discret (« Palomino
 * alezan crème ») ; aide au choix de la robe (« Ajouter un cheval »).
 */
.robe__detail {
  margin-left: .25em;
  color: var(--bootstrap_barrio_giguellerie-gris-moyen, #7d8983);
  font-size: .9em;
}

.robe-choix .fg-radios-puces {
  margin-bottom: .75rem;
}

.robe-choix__apercu {
  margin: .25rem 0 0;
  padding: .6rem .8rem;
  background: var(--bootstrap_barrio_giguellerie-creme, #f4f6ef);
}

/* « Couleur et génétique » (fiche étalon, 1.26.0) : une phrase, l'alerte
   LWO s'il y a lieu, et le détail dans un seul déroulant. */
.genetique__phrase {
  margin: 0 0 .75rem;
}
.genetique__phrase .poulain-ouvrir {
  font-weight: 600;
}

.genetique__alerte {
  margin: 0 0 .75rem;
  padding: .7rem .9rem;
  background: #fdf1d8;
  color: #6b4511;
}

.genetique__details {
  margin: 0;
  border: 0;
}
.genetique__details > summary {
  cursor: pointer;
  padding: .3rem 0;
  color: var(--bootstrap_barrio_giguellerie-vert-foret, #2e5d0e);
}
.genetique__details[open] > summary {
  margin-bottom: .5rem;
}

/* Ce qu'il transmet : de simples paragraphes. */
.genetique__etage {
  margin: 0 0 .5rem;
}

/* Chaque code, ce qu'il fait chez lui. */
.genetique__codes {
  margin: .75rem 0 .5rem;
  padding-top: .25rem;
  border-top: 1px solid #eef0eb;
}
.genetique__ligne {
  display: grid;
  grid-template-columns: 6.5rem 1fr;
  gap: .5rem;
  padding: .3rem 0;
}
.genetique__ligne dt {
  margin: 0;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-weight: 600;
  color: var(--bootstrap_barrio_giguellerie-vert-feuillage, #153604);
}
.genetique__ligne dd {
  margin: 0;
}
.genetique__complet {
  margin: 0;
  font-size: .85rem;
  color: var(--bootstrap_barrio_giguellerie-gris-moyen, #7d8983);
}

@media (max-width: 575.98px) {
  .genetique__ligne {
    grid-template-columns: 1fr;
    gap: .1rem;
  }
}