/* Stile dei resoconti dei Consigli raccontati su Twitter (2013-2018).
   Sta qui e non in site.css perche' riguarda solo queste 46 pagine: cosi'
   una modifica non obbliga a rifare il cache-busting su tutto il sito.
   Le pagine caricano prima site.css, quindi qui ci sono solo le aggiunte. */

.resoconto {
  --tweet-bordo: #d9dde1;
  --tweet-tenue: #5a6570;
  margin-block: 24px 0;
}

.resoconto p.intro {
  color: var(--tweet-tenue);
  margin-block-end: 24px;
}

/* Ogni tweet e' una scheda, come lo si vedeva all'epoca. */
.tweet {
  border: 1px solid var(--tweet-bordo);
  border-radius: var(--radius, 8px);
  padding: 14px 16px;
  margin-block-end: 12px;
  background: #fff;
  /* Sono decine di schede per pagina: il browser salta il lavoro di disegno
     per quelle fuori schermo. L'altezza stimata evita che lo scorrimento
     salti. */
  content-visibility: auto;
  contain-intrinsic-size: auto 130px;
}

.tweet-testa {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px;
  margin-block-end: 6px;
}

.tweet-autore { font-weight: 700; }

.tweet-utente {
  color: var(--tweet-tenue);
  font-size: 0.875rem;
}

.tweet-testo {
  margin: 0;
  overflow-wrap: anywhere;
}

.tweet-foto {
  display: block;
  inline-size: 100%;
  block-size: auto;
  margin-block-start: 12px;
  border-radius: var(--radius, 8px);
  border: 1px solid var(--tweet-bordo);
}

.tweet-data {
  margin-block: 10px 0;
  font-size: 0.8125rem;
  color: var(--tweet-tenue);
}

/* Nel sito i link dentro il testo non si distinguono: qui la data e' un link
   al tweet originale, e deve vedersi che lo e'. */
.tweet-data a {
  color: var(--tweet-tenue);
  text-decoration: underline;
}

.tweet-data a:hover { color: var(--color-ink, #34495e); }

/* Commento scritto da noi durante la diretta, non un messaggio di Twitter:
   niente riquadro, si legge come testo della pagina. */
.resoconto .nota {
  margin-block: 20px;
  padding-inline-start: 14px;
  border-inline-start: 3px solid var(--color-accent, #95c3cf);
}