/* Aperçu de partage (outils/lib/pd/apercu.php) : maquettes claires des vignettes de chaque réseau.
   Typo système dans les maquettes, comme sur les vrais réseaux. */
.pda-grille { display: grid; gap: 1.4em 1.2em; grid-template-columns: repeat(auto-fill, minmax(19em, 1fr)); }
.pda-carte { margin: 0; min-width: 0; }
.pda-carte.pda-large { grid-column: 1 / -1; }
.pda-carte figcaption { margin-bottom: 0.5em; font: 500 0.75em/1.3 var(--mono); letter-spacing: 0.08em; text-transform: uppercase; color: var(--gris); }
.pda-grille [class^="pda-"] { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; }
.pda-img { display: block; width: 100%; aspect-ratio: 1.91 / 1; object-fit: cover; background: #eef1f4; }
.pda-sans-image { display: grid; place-items: center; aspect-ratio: 1.91 / 1; background: repeating-linear-gradient(45deg, #eef1f4 0 0.6em, #e6eaee 0.6em 1.2em); color: var(--gris); font-size: 0.85em; }

/* Facebook */
.pda-fb { overflow: hidden; border: 1px solid #dadde1; border-radius: 0.5em; background: #fff; }
.pda-fb-texte { display: flex; flex-direction: column; gap: 0.15em; padding: 0.65em 0.8em 0.75em; background: #f0f2f5; }
.pda-fb-hote { color: #65676b; font-size: 0.75em; }
.pda-fb strong { color: #050505; font-size: 1em; line-height: 1.25; }
.pda-fb-desc { color: #65676b; font-size: 0.85em; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
/* Image trop petite : vignette carrée à gauche */
.pda-petite { display: grid; grid-template-columns: 7.5em 1fr; }
.pda-petite .pda-img { aspect-ratio: 1; height: 100%; }

/* LinkedIn */
.pda-li { overflow: hidden; border: 1px solid #e0dfdc; border-radius: 0.5em; background: #fff; }
.pda-li-texte { display: flex; flex-direction: column; gap: 0.2em; padding: 0.7em 0.8em; background: #eef3f8; }
.pda-li strong { color: #191919; font-size: 0.92em; line-height: 1.3; font-weight: 600; }
.pda-li span { color: #666; font-size: 0.75em; }

/* X */
.pda-x { position: relative; overflow: hidden; border: 1px solid #cfd9de; border-radius: 1em; }
.pda-x-etiquette { position: absolute; left: 0.8em; bottom: 0.7em; padding: 0.1em 0.45em; border-radius: 0.3em; background: #000000a6; color: #fff; font-size: 0.8em; }
.pda-x-sous { margin: 0.3em 0 0; color: #536471; font-size: 0.82em; }
.pda-x-petit { display: grid; grid-template-columns: 8em 1fr; overflow: hidden; border: 1px solid #cfd9de; border-radius: 1em; background: #fff; }
.pda-x-petit img, .pda-x-petit .pda-sans-image { width: 100%; height: 100%; aspect-ratio: 1; object-fit: cover; border-right: 1px solid #cfd9de; }
.pda-x-petit > div:last-child { display: flex; flex-direction: column; justify-content: center; gap: 0.15em; padding: 0.6em 0.8em; font-size: 0.88em; color: #536471; min-width: 0; }
.pda-x-petit strong { color: #0f1419; font-weight: 400; }

/* iMessage / WhatsApp */
.pda-bulle-zone { display: flex; justify-content: flex-end; padding: 0.9em; border-radius: 1em; background: #f4f6f8; }
.pda-bulle { width: min(100%, 16em); overflow: hidden; border-radius: 1.1em; background: #e9e9eb; }
.pda-bulle-texte { display: flex; flex-direction: column; gap: 0.1em; padding: 0.55em 0.8em 0.65em; }
.pda-bulle strong { color: #000; font-size: 0.88em; line-height: 1.25; font-weight: 600; }
.pda-bulle span { color: #8a8a8e; font-size: 0.75em; }

/* Slack / Discord */
.pda-slack { display: flex; flex-direction: column; gap: 0.2em; padding: 0.2em 0 0.2em 0.8em; border-left: 0.25em solid #dddddd; font-size: 0.9em; color: #1d1c1d; }
.pda-slack-site { font-weight: 700; font-size: 0.9em; }
.pda-slack strong { color: #1264a3; }
.pda-slack .pda-img { max-width: 22em; margin-top: 0.4em; border-radius: 0.5em; }

/* Google */
.pda-google { max-width: 40em; padding: 1em 1.1em; border-radius: 0.8em; background: #fff; border: 1px solid var(--trait); }
.pda-g-site { display: flex; align-items: center; gap: 0.7em; }
.pda-g-rond { display: grid; place-items: center; width: 1.75em; height: 1.75em; border-radius: 50%; background: #f1f3f4; border: 1px solid #dadce0; color: #5f6368; font-size: 0.85em; font-weight: 700; }
.pda-g-site > div { display: flex; flex-direction: column; min-width: 0; }
.pda-g-nom { color: #202124; font-size: 0.88em; }
.pda-g-fil { color: #4d5156; font-size: 0.78em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pda-g-titre { margin: 0.35em 0 0.2em; color: #1a0dab; font-size: 1.25em; line-height: 1.3; }
.pda-g-desc { margin: 0; color: #4d5156; font-size: 0.88em; line-height: 1.55; }

/* Bloc sans texte d'introduction : un peu d'air sous le titre */
.res-bloc-tete + .pda-grille, .res-bloc-tete + .controle { margin-top: 1.2em; }