/*
 * Pagina articolo (design «La Griglia», ADR-0009; RF-08, RF-10, RF-22, RF-29, RF-40): ciò che si aggiunge alle
 * fondamenta di ingnews.css, che già disegna .articolo, .articolo__testata, .articolo__dati, .nota-revisione,
 * .in-breve, figure, tabelle, condivisione, citazione, scheda autore e la stampa. Caricato solo da
 * articolo_page.html e articolo_ritirato.html.
 */

/* --- Testata ---------------------------------------------------------------------------------------- */

.articolo__rubrica {
  margin: 0;
}

/* Il dl su una riga: ogni coppia dt/dd sta in un .articolo__dato inline e il « · » lo mette il CSS fra una
   coppia e l'altra, così le voci nascoste agli occhi (dt «Identificativo») non lasciano buchi né doppi punti. */
.articolo__dato {
  display: inline;
}

.articolo__dato + .articolo__dato::before {
  content: " · ";
}

.articolo__dato dt,
.articolo__dato dd {
  display: inline;
  margin: 0;
}

.articolo__dato a {
  color: var(--blu);
}

.articolo__dato .pillola {
  vertical-align: middle;
  margin-inline-start: 0.125rem;
}

.articolo__dato--apparato dt {
  font-weight: 600;
}

.articolo .nota-revisione {
  margin: 1rem 0 0;
}

.articolo__avviso {
  margin: 0 0 1rem;
}

/* --- Copertina e figure (la cornice con hairline, .cornice, è nelle fondamenta) ---------------------- */

.copertina figcaption,
.figura figcaption,
.formula figcaption,
.video figcaption {
  font-family: var(--font-ui);
  font-size: var(--t1);
  line-height: 1.45;
  color: var(--secondario);
  margin-top: 0.5rem;
}

.tabella .didascalia {
  font-family: var(--font-ui);
  font-size: var(--t1);
  font-weight: 600;
  line-height: 1.45;
  color: var(--inchiostro);
  margin: 0 0 0.5rem;
}

.figura__link {
  display: block;
}

.figura__ingrandisci {
  color: var(--blu);
  padding: 0 0.25rem;
  margin-inline-start: 0.25rem;
}

.formula figcaption {
  text-align: start;
}

.formula figcaption .numero {
  font-weight: 600;
  color: var(--inchiostro);
}

.allegato__descrizione {
  color: var(--secondario);
}

/* --- Corpo ------------------------------------------------------------------------------------------ */

.articolo__corpo blockquote {
  margin: 1.5rem 0;
  padding: 0 0 0 1rem;
  border-inline-start: 4px solid var(--bordo-forte);
  font-style: italic;
  color: var(--secondario);
}

.articolo__corpo li::marker {
  color: var(--secondario);
}

/* --- Tag: kicker e pillole sulla stessa riga -------------------------------------------------------- */

.tag {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

.tag__kicker {
  margin-inline-end: 0.25rem;
}

.tag .tag-elenco {
  margin: 0;
}

/* --- Piede: «Condividi» in riga con i pulsanti, «Segnala un'imprecisione» a destra ------------------ */

.condivisione {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
}

.articolo__piede .condivisione__titolo {
  margin: 0;
  font-size: var(--t2);
}

.condivisione__pulsanti {
  flex: 1 1 auto;
}

/* Link testuale (fuori dalla lista dei pulsanti), spinto a destra */
.condivisione__segnala {
  padding: 0 0.25rem;
  margin-inline-start: auto;
}

.condivisione .esito {
  flex-basis: 100%;
  margin: 0;
}

.condivisione .esito:empty {
  display: none;
}

.come-citare__contatto {
  margin: 0.5rem 0 0;
}

.articolo--ritirato .articolo__testata {
  margin-bottom: 1rem;
}

/* «Da leggere anche» è un figlio diretto di <main>: la distanza la dà il gap del contenitore. */
.correlati {
  margin-top: 0;
}

/* --- Stampa (A4 dall'iPad): completa la regola del sistema in ingnews.css -------------------------- */

@media print {
  .articolo__corpo,
  .articolo__corpo p,
  .abstract,
  .in-breve__punti li {
    font-size: 11pt;
    line-height: 1.5;
  }

  .articolo__testata h1 {
    font-size: 22pt;
  }

  .figura__ingrandisci,
  .condivisione__segnala,
  .come-citare__contatto {
    display: none;
  }

  .articolo__dato a,
  .articolo__corpo a {
    color: #000;
  }

  .nota-revisione,
  .avviso {
    background: transparent;
    border: 1px solid #000;
  }
}