/* 2.8.43.95 — La tarjeta de un enlace, escrita una sola vez.

   Sale de un reporte concreto: en el compositor la vista previa se veia de una forma y al
   publicarla se veia de otra. Eran dos maquetados con dos hojas de estilo distintas, asi que
   cualquier retoque en uno dejaba al otro atras.

   Ahora los dos llevan la clase .cs2795-link-card:
     - la tarjeta publicada  -> .cs2766-post-card__link  (cs2766PostCard.php)
     - la vista previa       -> .cs2764-url-preview      (cs2764ProfilePosts.php)

   Esta hoja se carga DESPUES de las suyas a proposito: es la que manda. Es el mismo aspecto
   que en la app (el mixin cs2795-link-card de src/theme/link-card.scss).

   El alto de la foto se fija solo para la vista previa, y con la cifra de la tarjeta del
   feed: la publicada la ajusta por contexto (feed, detalle, modal) desde hojas anteriores y
   no se toca aqui.                                                                          */

.cs2795-link-card{display:block;overflow:hidden;border:1px solid var(--cs2766-line,#e6dde1);border-radius:14px;background:#fff;color:inherit;text-align:left;text-decoration:none}
.cs2795-link-card>img{display:block;width:100%;object-fit:cover;object-position:center}
.cs2795-link-card>span{display:block;padding:13px 15px}
.cs2795-link-card small{display:block;overflow:hidden;margin:0;color:var(--cs2766-muted,#7d7580);font-size:9px;letter-spacing:.06em;line-height:1.35;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}
.cs2795-link-card strong{display:block;overflow:hidden;margin:4px 0 0;color:#302b38;font:14px gilroy-semibold,Arial,sans-serif;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}
.cs2795-link-card p{display:-webkit-box;overflow:hidden;margin:5px 0;color:var(--cs2766-muted,#69616d);font-size:12px;line-height:1.5;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.cs2795-link-card b{display:block;margin-top:7px;color:var(--cs2766-red,#ce0039);font:11px gilroy-semibold,Arial,sans-serif}

/* Lo unico propio del compositor: donde se coloca, y que empiece oculta. La imagen la
   enciende y la apaga site.js con estilo en linea, que gana a esto. */
.cs2764-url-preview.cs2795-link-card{display:none;margin:14px 0 0}
.cs2764-url-preview.cs2795-link-card>img{display:none}

/* El alto de la foto es el de la tarjeta del feed, que es donde va a aparecer. Las dos
   cifras son las de .cs2766-post-card--feed .cs2766-post-card__link>img en 2768.css; la
   prueba del navegador compara las dos y se pone roja si una cambia sin la otra. */
.cs2764-url-preview.cs2795-link-card>img{height:380px!important;max-height:380px!important}
@media(max-width:700px){.cs2764-url-preview.cs2795-link-card>img{height:320px!important;max-height:320px!important}}

/* Mientras se busca, no hay tarjeta que ensenar todavia: solo el aviso. */
.cs2764-url-preview.cs2795-link-card.is-loading>img,
.cs2764-url-preview.cs2795-link-card.is-loading p,
.cs2764-url-preview.cs2795-link-card.is-loading b{display:none!important}

/* 2.8.43.99 — «Este vídeo ya no está disponible».

   Sale donde antes se pedía un reproductor o una miniatura a Mux. No es un error: es un
   vídeo que se subió a un servicio que ya no está contratado y del que no queda copia
   referenciada. Ocupa el mismo hueco que ocupaba el vídeo, para que la tarjeta no salte. */
.cs2799-video-off{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;width:100%;min-height:160px;padding:18px;border:1px dashed var(--cs2766-line,#e6dde1);border-radius:12px;background:#f8f5f6;color:var(--cs2766-muted,#7d7580);text-align:center}
.cs2799-video-off i{font-size:22px;opacity:.55}
.cs2799-video-off span{font-size:12px;line-height:1.4}