/* ══════════════════════════════════════════════════════
   PILLOLE — corpo libero (articolo)
   Da accodare a public_html/assets/css/style.css
   Il corpo usa class="art-body pill-body": eredita già
   titoli, code, pre e blockquote dagli stili .art-body.
   Qui si aggiunge solo ciò che il contenuto libero introduce:
   immagini, video, tabelle, figure.
══════════════════════════════════════════════════════ */

/* Immagini inserite nell'articolo */
.pill-body img {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  margin: 1.5rem 0;
}

.pill-body figure { margin: 1.5rem 0; }
.pill-body figure img { margin: 0; }
.pill-body figcaption {
  font-size: .85rem;
  color: var(--muted);
  text-align: center;
  margin-top: .5rem;
}

/* Video YouTube / Vimeo (iframe) responsive 16:9 */
.pill-body iframe {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  height: auto;
  border: 0;
  border-radius: 12px;
  margin: 1.5rem 0;
}

/* Tabelle nel corpo */
.pill-body table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.5rem 0;
  font-size: .9375rem;
}
.pill-body th,
.pill-body td {
  border: 1px solid var(--border);
  padding: .6rem .8rem;
  text-align: left;
}
.pill-body thead th {
  background: #F4F6F8;
  font-weight: 600;
}

/* Liste con respiro */
.pill-body ul,
.pill-body ol { margin: 1rem 0 1.25rem; padding-left: 1.4rem; }
.pill-body li { margin-bottom: .4rem; }

/* I blocchi <pre> di Prism: mantieni lo scroll orizzontale */
.pill-body pre[class*="language-"] {
  overflow-x: auto;
  border-radius: 12px;
  margin: 1.5rem 0;
}

.my-d-none {
  display: none;
}