/* V21 — Correction strictement ciblée du bandeau des quatre indicateurs.
   Périmètre : pages de détail des programmes, affichage ordinateur uniquement.
   Cette feuille neutralise les dimensions rigides héritées sans modifier les
   données, la bannière, les pages logicielles ni les règles tablette/mobile. */

@media (min-width: 981px) {
  body.fb-v18-program-detail .formation-kpis.fb-v18-kpis.fb-v19-kpis {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    gap: 0 !important;
    width: min(calc(100% - 36px), 1040px) !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: -48px auto 44px !important;
    padding: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
    border: 1px solid #e1e6ee !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: 0 8px 22px rgba(7, 34, 86, 0.1) !important;
  }

  body.fb-v18-program-detail .formation-kpis.fb-v19-kpis .fb-v19-kpi {
    position: relative !important;
    display: grid !important;
    grid-template-columns: clamp(46px, 4vw, 58px) minmax(0, 1fr) !important;
    grid-template-rows: auto auto auto 1fr !important;
    column-gap: clamp(10px, 1.1vw, 14px) !important;
    align-content: start !important;
    align-items: start !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 258px !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 20px clamp(14px, 1vw, 16px) 22px !important;
    overflow: visible !important;
    box-sizing: border-box !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
    text-align: left !important;
  }

  body.fb-v18-program-detail .formation-kpis.fb-v19-kpis .fb-v19-kpi:not(:last-child)::after {
    content: "" !important;
    position: absolute !important;
    top: 20px !important;
    right: 0 !important;
    bottom: 20px !important;
    width: 1px !important;
    background: #d9dee7 !important;
    pointer-events: none !important;
  }

  /* display:contents permet à la description d'occuper la largeur complète de
     la colonne, au lieu de rester comprimée dans la seule zone à droite de l'icône. */
  body.fb-v18-program-detail .formation-kpis.fb-v19-kpis .fb-v19-kpi-copy {
    display: contents !important;
    min-width: 0 !important;
  }

  body.fb-v18-program-detail .formation-kpis.fb-v19-kpis .fb-v19-kpi-icon {
    grid-column: 1 !important;
    grid-row: 1 / span 3 !important;
    align-self: start !important;
    width: clamp(46px, 4vw, 58px) !important;
    height: clamp(46px, 4vw, 58px) !important;
    min-width: 0 !important;
    flex: none !important;
    margin: 0 !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 50% !important;
    font-size: 0 !important;
  }

  body.fb-v18-program-detail .formation-kpis.fb-v19-kpis .fb-v19-kpi-svg {
    display: block !important;
    width: clamp(25px, 2.3vw, 30px) !important;
    height: clamp(25px, 2.3vw, 30px) !important;
  }

  body.fb-v18-program-detail .formation-kpis.fb-v19-kpis .fb-v19-kpi b {
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: end !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 1px 0 4px !important;
    overflow: visible !important;
    color: inherit;
    font-size: clamp(18px, 1.55vw, 20px) !important;
    line-height: 1.05 !important;
    font-weight: 950 !important;
    letter-spacing: -0.025em !important;
    text-align: left !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
  }

  /* L'ancien trait décoratif généré sur <b> est neutralisé : le composant V19
     possède déjà son propre élément de trait, correctement positionnable. */
  body.fb-v18-program-detail .formation-kpis.fb-v19-kpis .fb-v19-kpi b::after {
    content: none !important;
    display: none !important;
  }

  body.fb-v18-program-detail .formation-kpis.fb-v19-kpis .fb-v19-kpi-label {
    grid-column: 2 !important;
    grid-row: 2 !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    color: #102654 !important;
    font-size: clamp(9px, 0.78vw, 10.5px) !important;
    line-height: 1.22 !important;
    font-weight: 900 !important;
    letter-spacing: -0.01em !important;
    text-align: left !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
  }

  body.fb-v18-program-detail .formation-kpis.fb-v19-kpis .fb-v19-kpi-3 .fb-v19-kpi-label {
    font-size: clamp(8px, 0.7vw, 9px) !important;
  }

  body.fb-v18-program-detail .formation-kpis.fb-v19-kpis .fb-v19-kpi-rule {
    grid-column: 2 !important;
    grid-row: 3 !important;
    display: block !important;
    width: 34px !important;
    height: 2px !important;
    margin: 13px 0 0 !important;
    background: #12255a !important;
    border: 0 !important;
    border-radius: 999px !important;
  }

  body.fb-v18-program-detail .formation-kpis.fb-v19-kpis .fb-v19-kpi small {
    grid-column: 1 / -1 !important;
    grid-row: 4 !important;
    align-self: start !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 20px 0 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    color: #33415e !important;
    font-size: clamp(11px, 0.92vw, 13px) !important;
    line-height: 1.48 !important;
    font-weight: 500 !important;
    text-align: left !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
    hyphens: none !important;
  }

  body.fb-v18-program-detail .formation-kpis.fb-v19-kpis .fb-v19-kpi-4 small {
    line-height: 1.42 !important;
  }
}

/* ===== V22 — suppression ultra-ciblée des 8 éléments parasites =====
   Ne modifie ni dimensions, ni typographie, ni espacements, ni couleurs utiles.
   - les 4 petits pictogrammes secondaires correspondent aux SVG V19 imbriqués ;
   - les 4 ovales correspondent au fond hérité des libellés V19.
   Les grands pictogrammes legacy actuellement visibles restent strictement conservés. */
@media (min-width: 981px) {
  body.fb-v18-program-detail .formation-kpis.fb-v19-kpis .fb-v19-kpi-icon > .fb-v19-kpi-svg {
    display: none !important;
  }

  body.fb-v18-program-detail .formation-kpis.fb-v19-kpis .fb-v19-kpi-label {
    background: transparent !important;
    border-radius: 0 !important;
  }
}


/* ===== V27 — remontée réelle du groupe « trait + description » =====
   Base : V25 validée. Périmètre strict : uniquement le petit trait horizontal
   et le contenu descriptif inférieur des 4 cellules du bandeau institutionnel.

   Le groupe complet est remonté d’environ 30 px par rapport à la V25 :
   - le trait passe de -6 px à -36 px ;
   - la description passe de -12 px à -42 px.

   Les deux éléments effectuent donc le MÊME déplacement supplémentaire (-30 px),
   ce qui conserve leur relation visuelle tout en rapprochant nettement le groupe
   du bloc supérieur. Les icônes, valeurs, intitulés, dimensions et séparateurs
   ne sont pas modifiés. */
@media (min-width: 981px) {
  body.fb-v18-program-detail .formation-left .formation-kpis.fb-v19-kpis .fb-v19-kpi-rule {
    transform: translateY(-36px) !important;
  }

  body.fb-v18-program-detail .formation-left .formation-kpis.fb-v19-kpis .fb-v19-kpi small {
    transform: translateY(-42px) !important;
  }
}


/* ===== V28 — raccourcissement EXCLUSIF de la carte par le bas =====
   Base : V27 validée et figée pour tout le positionnement interne.

   Objectif : supprimer le vide blanc inférieur sans déplacer aucun élément
   visible de la carte. La quatrième colonne « ATTESTATION — RECONNUE », qui
   possède le contenu inférieur le plus long, détermine naturellement la
   nouvelle hauteur commune.

   Technique :
   - suppression du min-height rigide de 258 px qui maintenait le grand vide ;
   - récupération de 60 px de hauteur de flux sous les descriptions, sans
     modifier leur position visuelle (leurs transformations V27 restent intactes) ;
   - les séparateurs verticaux conservent top:20px et bottom:20px : leur hauteur
     se raccourcit automatiquement avec la carte et ils ne touchent toujours
     ni le haut ni le bas.

   Aucun réglage V27 des icônes, valeurs, intitulés, traits horizontaux,
   descriptions, couleurs, typographies, largeur ou position de la carte
   n'est modifié. */
@media (min-width: 981px) {
  body.fb-v18-program-detail .formation-kpis.fb-v19-kpis .fb-v19-kpi {
    min-height: 0 !important;
  }

  body.fb-v18-program-detail .formation-kpis.fb-v19-kpis .fb-v19-kpi small {
    margin-bottom: -60px !important;
  }
}


/* ===== V29 — équilibrage final de la marge basse + séparateurs légèrement renforcés =====
   Base : V28 validée et figée pour toutes les positions internes.

   Objectif :
   - ne déplacer AUCUN contenu interne ;
   - rallonger très légèrement la carte uniquement vers le bas ;
   - obtenir une marge inférieure visuelle proche de la marge supérieure de 21 px ;
   - assombrir très légèrement les trois séparateurs verticaux sans changer
     leur épaisseur ni leurs retraits top/bottom.

   La V28 utilisait margin-bottom:-60px sur les descriptions et produisait
   environ 16,64 px sous la dernière ligne du bloc ATTESTATION. Ici, seule cette
   réserve de flux passe à -55,5px, ce qui ajoute environ 4,5px au bord inférieur
   sans modifier les coordonnées visuelles des textes, traits, valeurs ou icônes. */
@media (min-width: 981px) {
  body.fb-v18-program-detail .formation-kpis.fb-v19-kpis .fb-v19-kpi small {
    margin-bottom: -55.5px !important;
  }

  body.fb-v18-program-detail .formation-kpis.fb-v19-kpis .fb-v19-kpi:not(:last-child)::after {
    background: #cbd2dc !important;
  }
}