/* ============================================================
   Liens vers les articles contextuels
   - mots cliquables dans le texte
   - aperçu flottant sur PC au survol / focus
   - aucun aperçu sur mobile
   ============================================================ */

.ja-inline-article-link{
  position:relative;
  display:inline;
  color:#254f7d!important;
  font-weight:750!important;
  text-decoration-line:underline!important;
  text-decoration-style:dotted!important;
  text-decoration-thickness:1.5px!important;
  text-decoration-color:#8ca8c6!important;
  text-underline-offset:4px!important;
  cursor:pointer;
}
.ja-inline-article-link:hover,
.ja-inline-article-link:focus-visible{
  color:#173d6f!important;
  text-decoration-style:solid!important;
  text-decoration-color:#cf3f47!important;
}

/* Aperçu intégré de secours, avant initialisation du JS. */
.ja-inline-article-preview{
  position:absolute!important;
  z-index:9999!important;
  left:50%!important;
  bottom:calc(100% + 12px)!important;
  display:grid!important;
  width:320px!important;
  max-width:calc(100vw - 32px)!important;
  grid-template-columns:104px minmax(0,1fr)!important;
  gap:12px!important;
  padding:10px!important;
  border:1px solid #d8e1eb!important;
  border-radius:15px!important;
  background:#fff!important;
  box-shadow:0 18px 45px rgba(17,37,66,.20)!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translate(-50%,8px)!important;
  transition:opacity .16s ease,transform .16s ease,visibility .16s ease!important;
  text-align:left!important;
  font-style:normal!important;
}
.ja-inline-article-link:hover .ja-inline-article-preview,
.ja-inline-article-link:focus-visible .ja-inline-article-preview{
  opacity:1!important;
  visibility:visible!important;
  transform:translate(-50%,0)!important;
}

.ja-inline-article-thumb{
  display:block!important;
  width:104px!important;
  height:72px!important;
  overflow:hidden!important;
  border-radius:10px!important;
  background:#edf2f7!important;
}
.ja-inline-article-thumb img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  object-fit:cover!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
}
.ja-inline-article-preview-copy{
  display:flex!important;
  min-width:0!important;
  flex-direction:column!important;
  justify-content:center!important;
}
.ja-inline-article-preview-copy small{
  display:block!important;
  margin:0 0 4px!important;
  color:#c53a42!important;
  font-size:9.5px!important;
  font-weight:900!important;
  letter-spacing:.09em!important;
  line-height:1.2!important;
}
.ja-inline-article-preview-copy strong{
  display:block!important;
  margin:0!important;
  color:#17233b!important;
  font-size:14px!important;
  font-weight:850!important;
  line-height:1.3!important;
}

/* Le JS déplace l'aperçu dans body pour éviter tout clipping par les cartes. */
html.ja-inline-preview-js .ja-inline-article-link > .ja-inline-article-preview{
  display:none!important;
}
.ja-inline-article-floating{
  position:fixed!important;
  z-index:99999!important;
  display:grid!important;
  width:min(340px,calc(100vw - 32px))!important;
  grid-template-columns:112px minmax(0,1fr)!important;
  gap:12px!important;
  padding:10px!important;
  border:1px solid #d8e1eb!important;
  border-radius:15px!important;
  background:#fff!important;
  box-shadow:0 20px 52px rgba(17,37,66,.24)!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translateY(6px)!important;
  transition:opacity .14s ease,transform .14s ease,visibility .14s ease!important;
  text-align:left!important;
}
.ja-inline-article-floating.is-visible{
  opacity:1!important;
  visibility:visible!important;
  transform:translateY(0)!important;
}
.ja-inline-article-floating .ja-inline-article-thumb{
  width:112px!important;
  height:76px!important;
}
.ja-inline-article-floating .ja-inline-article-preview-copy small{
  font-size:9.5px!important;
}
.ja-inline-article-floating .ja-inline-article-preview-copy strong{
  font-size:14px!important;
  line-height:1.3!important;
}

@media(max-width:760px){
  .ja-inline-article-preview,
  .ja-inline-article-floating{
    display:none!important;
  }
}
