/* AI Score — badge de correspondance IA (Brique 2, AC14.3/AC14.4).
   Styles dupliqués du mockup validé client mockups/shared/_match_badge
   (design « Grille de Match », 16/07/2026). Partial : shared/_ai_score. */

.tsm-badge{display:inline-flex;align-items:center;gap:6px;font-family:'Geist',system-ui,sans-serif;font-weight:600;line-height:1;border-radius:var(--r-pill);border:1px solid transparent;white-space:nowrap;letter-spacing:-.01em;}
.tsm-badge--sm{font-size:11px;padding:4px 9px;}
.tsm-badge--md{font-size:12.5px;padding:6px 13px;}
.tsm-badge__gem{flex-shrink:0;}
.tsm-badge--sm .tsm-badge__gem{width:12px;height:12px;}
.tsm-badge--md .tsm-badge__gem{width:14px;height:14px;}
.tsm-badge__pct{font-weight:700;}
.tsm-badge--perfect{color:#2D7A4F;background:var(--green-50);border-color:var(--green-200);}
.tsm-badge--strong{color:#C0651F;background:#FBEFE2;border-color:#EBC9A6;}
.tsm-badge--match{color:var(--gold-500);background:var(--gold-50);border-color:var(--gold-200);}

/* ── Explication du match (audit engagements IA 06/08, écart E4) ──
   Le badge devient survolable / focusable et déplie « Pourquoi cette offre »
   à partir des composantes réelles du moteur. Sans JS : :hover / :focus-within.
   La bulle s'ouvre vers le bas-gauche, à l'intérieur de la card, pour ne pas
   dépendre de l'overflow de chaque surface. */
.tsm-why{position:relative;display:inline-flex;cursor:help;}
.tsm-why:focus{outline:2px solid var(--gold-500);outline-offset:2px;border-radius:var(--r-pill);}
.tsm-why-pop{
  position:absolute;top:calc(100% + 7px);right:0;z-index:40;
  width:max-content;max-width:min(268px,74vw);
  display:none;flex-direction:column;gap:5px;
  padding:10px 12px;border-radius:var(--r-md);
  background:#FFFDF8;border:1px solid var(--gold-200);
  box-shadow:0 10px 30px rgba(30,28,24,.18);
  font-family:'Geist',system-ui,sans-serif;text-align:left;
  white-space:normal;line-height:1.35;color:#3A342A;
  cursor:default;
}
.tsm-why:hover .tsm-why-pop,
.tsm-why:focus .tsm-why-pop,
.tsm-why:focus-within .tsm-why-pop{display:flex;}
.tsm-why-head{font-size:11.5px;font-weight:700;letter-spacing:-.01em;color:#1E1C18;}
.tsm-why-grade{font-size:10.5px;font-weight:600;color:var(--gold-500);}
.tsm-why-list{display:flex;flex-direction:column;gap:3px;margin-top:2px;}
.tsm-why-item{font-size:11px;display:block;}
.tsm-why-key{font-weight:600;color:var(--n-700);}
.tsm-why-val{color:#3A342A;}

/* Languettes de match : elles rognent la pastille (border-radius) et posent leur
   propre contexte d'empilement, dont la bulle ne peut pas sortir. On lève donc
   l'overflow ET le z-index sur la languette elle-même, pour que la bulle passe
   au-dessus du corps de la card. Le radius est porté par .tsm-badge. */
.ts-card .ts-card-mtab:has(.tsm-why-pop),
.rxs-card-mtab:has(.tsm-why-pop),
.eo-opp-mtab:has(.tsm-why-pop),
.te-opp-mtab:has(.tsm-why-pop){overflow:visible;z-index:60;}
/* Card mission expert : la pastille est posée DANS la photo (overflow:hidden). */
.eo-opp-photo:has(.tsm-why-pop){overflow:visible;}
.eo-opp-photo:has(.tsm-why-pop) img{border-radius:14px 14px 0 0;}

/* La photo des cards porte son propre contexte d'empilement, au même niveau que
   le corps : la bulle y resterait enfermée, et le texte de la card lui passerait
   dessus. On élève ce contexte UNIQUEMENT pendant l'ouverture, pour ne rien
   changer au rendu validé le reste du temps. */
.te-opp-photo:has(.tsm-why:hover), .te-opp-photo:has(.tsm-why:focus-within),
.ts-card .ts-card-photo:has(.tsm-why:hover), .ts-card .ts-card-photo:has(.tsm-why:focus-within),
.rxs-card-img:has(.tsm-why:hover), .rxs-card-img:has(.tsm-why:focus-within),
.eo-opp-photo:has(.tsm-why:hover), .eo-opp-photo:has(.tsm-why:focus-within){z-index:70;}

/* ── Séparation « correspondances fortes / autres profils » (#2616, 06/08/2026) ──
   Le seuil de 70 % ne retire plus de résultats : il ne fait plus que décider du
   badge. Les résultats sous le seuil sont rangés derrière cet intertitre, rendu
   par shared/_ai_others_divider. Plein largeur dans une grille comme dans une
   liste, sobre : un filet, un libellé, rien d'autre. */
.ts-ai-others{
  grid-column:1/-1;width:100%;
  display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 12px;
  margin:10px 0 2px;padding-top:16px;border-top:1px solid var(--gold-200);
  font-family:'Geist',system-ui,sans-serif;
}
.ts-ai-others-label{
  font-size:13px;font-weight:700;letter-spacing:-.01em;color:#1E1C18;
}
.ts-ai-others-hint{font-size:12px;color:var(--n-500);}

/* #2616 — explication du match sous le seuil : pas de badge, juste la phrase.
   Volontairement neutre (aucune couleur de niveau, aucun pourcentage). */
.tsm-why-plain{
  display:block;font-family:'Geist',system-ui,sans-serif;
  font-size:11.5px;line-height:1.4;color:var(--n-700);
}
