/* ═══════════════════════════════════════════════════════════
   Carte de resultat du matching : le bloc prix et la bande
   d'informations  BoostDriving

   Ce fichier ajoute deux blocs a .bdm-card, il n'en modifie aucun :
   les regles existantes de assets/style/pages/matching.css restent
   valables telles quelles.

     .bdm-card__prix    les deux paliers de forfait, 20 h et 30 h, le
                        second ecrit plus petit a cote du premier ;
     .bdm-card__infos   ce qui prend la place du lien « Voir la fiche » :
                        taux de reussite, paiement en plusieurs fois,
                        prix de l'heure supplementaire.

   Mobile-first : tout est ecrit POUR 360 px, les paliers superieurs ne
   font qu'elargir. Le bloc prix tient sur une ligne a 360 px ; s'il ne
   tient pas (nombres a quatre chiffres et libelles longs), le second
   palier passe sous le premier plutot que de deborder.
   ═══════════════════════════════════════════════════════════ */

/* ─── Les paliers de prix ─────────────────────────────────── */
.matching-page .bdm-card__prix {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 12px;
  margin: 0 0 6px;
}
.matching-page .bdm-card__prixlot {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}
/* Le palier secondaire : meme information, moindre poids. Un filet le
   separe du principal, sans quoi les deux prix se lisent comme une
   fourchette (« de 1 296 a 1 696 € »), ce qu'ils ne sont pas. */
.matching-page .bdm-card__prixlot--sec {
  padding-left: 12px;
  border-left: 1px solid var(--bdm-line);
}
.matching-page .bdm-card__prixh {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .03em;
  text-transform: uppercase;
  color: var(--bdm-ink40);
}
.matching-page .bdm-card__prixv {
  font-size: 18px;
  font-weight: 800;
  line-height: 1.15;
  color: var(--bdm-ink);
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
  white-space: nowrap;
}
.matching-page .bdm-card__prixlot--sec .bdm-card__prixv {
  font-size: 14px;
  font-weight: 700;
  color: var(--bdm-ink60);
}
/* Palier que l'ecole ne propose pas. Il se dit, il ne se devine pas :
   une case vide se lirait comme un prix manquant, donc comme un defaut
   de la fiche. */
.matching-page .bdm-card__prixlot--absent .bdm-card__prixv {
  font-size: 13px;
  font-weight: 600;
  color: var(--bdm-ink20);
}
.matching-page .bdm-card__prixnote {
  margin: 0 0 10px;
  font-size: 12px;
  line-height: 1.4;
  color: var(--bdm-ink40);
}
/* Prix plein barre d'une promotion active, meme convention que
   l'affichage public des offres. */
.matching-page .bdm-card__prixbarre {
  margin-left: 6px;
  font-size: 12px;
  font-weight: 500;
  color: var(--bdm-ink20);
  text-decoration: line-through;
}

/* Ecole retenue par elargissement (D2, plan du 08/09/2026) : elle n'a pas
   le forfait de reference de la boite, la carte le dit avec le vrai
   forfait sur lequel elle est jugee, au meme rang que la note de boite
   ci-dessus. */
.matching-page .bdm-card__note--volume {
  margin: 0 0 10px;
  font-size: 12px;
  line-height: 1.4;
  color: var(--bdm-ink40);
}

/* ─── La bande d'informations ─────────────────────────────── */
.matching-page .bdm-card__infos {
  list-style: none;
  margin: 0 0 14px;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.matching-page .bdm-card__info {
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  padding: 6px 10px;
  border: 1px solid var(--bdm-line);
  border-radius: 999px;
  background: var(--bdm-card);
  font-size: 12px;
  line-height: 1.3;
  color: var(--bdm-ink60);
}
.matching-page .bdm-card__info strong {
  font-weight: 800;
  color: var(--bdm-ink);
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}
.matching-page .bdm-card__info span {
  font-size: 11px;
  color: var(--bdm-ink40);
}

/* ─── Palier superieur ────────────────────────────────────── */
@media (min-width: 640px) {
  .matching-page .bdm-card__prixv { font-size: 20px; }
  .matching-page .bdm-card__prixlot--sec .bdm-card__prixv { font-size: 15px; }
  .matching-page .bdm-card__info { font-size: 12.5px; }
}

/* ─── Bandeau d'elargissement au-dessus de la liste ────────── */
/* Cree par assets/js/matching.js (bandeauElargissement()), jamais present
   par defaut dans le gabarit : le secteur manquait de comparables, le
   moteur a aussi retenu des ecoles jugees sur un forfait plus long. */
.matching-page .bdm-results__note {
  margin: 0 0 16px;
  padding: 12px 14px;
  border-radius: var(--bdm-radius-sm);
  background: var(--bdm-blue-tint);
  border: 1px solid var(--bdm-blue-soft);
}
.matching-page .bdm-results__note p {
  margin: 0;
  font-size: 13px;
  line-height: 1.45;
  color: var(--bdm-blue-deep);
}
.matching-page .bdm-results__note[hidden] { display: none; }