/* ============================================================================
   MEETennis — assets/links.css
   Liens dans les textes de membres, cartes d'aperçu Open Graph, et panneau
   de repli du lecteur intégré.

   Chargé par partials/header.php, donc partout : un lien apparaît aussi bien
   dans le fil que dans un sujet du forum ou un commentaire de ressource, et
   il doit avoir la même tête aux trois endroits.
   ============================================================================ */

/* ---- Le lien à l'intérieur d'un texte ------------------------------------ */
.in-link{
  color:var(--brand);font-weight:700;text-decoration:none;
  border-bottom:1px solid rgba(225,94,1,.35);
  word-break:break-word;overflow-wrap:anywhere;
}
.in-link:hover{border-bottom-color:var(--brand)}
.in-link:active{opacity:.7}

/* ---- La carte d'aperçu ---------------------------------------------------
   Deux états. « loading » : le serveur n'avait pas encore l'aperçu en cache,
   links.js le récupère. On affiche déjà le domaine et la carte est déjà
   cliquable — l'attente ne bloque jamais l'utilisateur.                    */
.og-card{
  display:block;margin:10px 0 2px;overflow:hidden;text-decoration:none;
  background:var(--surface);border:1px solid var(--line);border-radius:16px;
  transition:border-color .18s,transform .15s;
}
.og-card:hover{border-color:var(--brand)}
.og-card:active{transform:scale(.99)}

.og-card .og-img{
  display:block;aspect-ratio:1.91/1;background:#efeae6;
  border-bottom:1px solid var(--line);
}
.og-card .og-img[hidden]{display:none}
.og-card .og-img img{width:100%;height:100%;object-fit:cover;display:block}

.og-card .og-txt{padding:11px 14px 13px;min-width:0}
.og-card .og-host{
  display:block;font-size:11px;font-weight:700;letter-spacing:.4px;
  text-transform:uppercase;color:var(--ink-faint);margin-bottom:4px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.og-card .og-title{
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  font:800 14.5px/1.35 'Montserrat',sans-serif;color:var(--ink);
}
.og-card .og-desc{
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  margin-top:5px;font-size:13px;line-height:1.45;color:var(--ink-soft);font-weight:500;
}
.og-card .og-desc[hidden]{display:none}

/* Pendant la récupération : un titre gris pâle plutôt qu'un vide qui saute
   de dix pixels quand la réponse arrive. */
.og-card.loading .og-title{color:var(--ink-faint)}
.og-card.bare{border-style:dashed}

/* Dans le fil, la carte s'aligne sur les marges du corps de publication. */
.post-body + .og-card,
.post .og-card{margin-left:14px;margin-right:14px}
.cmt-body .og-card,.s-cmt-body .og-card{margin:8px 0 0}

/* ---- Panneau de repli du lecteur intégré ---------------------------------
   Quand le site distant refuse l'iframe (X-Frame-Options), on ne montre pas
   un rectangle blanc : on montre ce qu'on sait de la page, et un bouton.  */
.reader-body iframe[hidden]{display:none}

.reader-load{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  color:var(--ink-faint);font-weight:600;font-size:14px;background:#fff;
}
.reader-load[hidden]{display:none}

.reader-preview{
  position:absolute;inset:0;overflow-y:auto;background:#fff;
  padding:0 22px 28px;-webkit-overflow-scrolling:touch;
}
.reader-preview[hidden]{display:none}
.reader-preview .rp-img{
  margin:0 -22px 18px;aspect-ratio:1.91/1;background:#efeae6;overflow:hidden;
}
.reader-preview .rp-img[hidden]{display:none}
.reader-preview .rp-img img{width:100%;height:100%;object-fit:cover;display:block}
.reader-preview .rp-host{
  display:block;font-size:11.5px;font-weight:700;letter-spacing:.5px;
  text-transform:uppercase;color:var(--brand);margin-bottom:8px;
}
.reader-preview h3{
  font:800 20px/1.3 'Montserrat',sans-serif;color:var(--ink);margin:0 0 10px;
}
.reader-preview p{
  font-size:14.5px;line-height:1.6;color:var(--ink-soft);margin:0 0 22px;font-weight:500;
}
.reader-preview p[hidden]{display:none}
.reader-preview .rp-cta{
  display:flex;align-items:center;justify-content:center;gap:9px;
  background:var(--brand);color:#fff;text-decoration:none;
  font:800 15px/1 'Montserrat',sans-serif;padding:16px;border-radius:14px;
}
.reader-preview .rp-cta:active{transform:scale(.98)}
.reader-preview .rp-note{
  margin:14px 0 0;font-size:12.5px;color:var(--ink-faint);text-align:center;font-weight:600;
}

/* Le lecteur occupait toute la largeur sur grand écran : une page web dans
   une colonne de 460 px est illisible dès qu'on quitte le mobile. */
@media (min-width:900px){
  .reader-panel{max-width:920px;height:92vh;margin:4vh auto;border-radius:20px;overflow:hidden}
  .reader-preview{padding:0 34px 34px}
  .reader-preview .rp-img{margin:0 -34px 22px}
}