/* Twemoji - emoji vykreslená obrázkem místo systémového fontu.
   Obrázek musí sedět do řádku jako písmeno: vysoký jako okolní text,
   na účaří, s malými mezerami po stranách. */

.twemoji {
  height: 1em;
  width: 1em;
  /* Globální img { max-width: 100% } z forum.css by v pružném (flex)
     rodiči obrázek srazil na nulu - viz .rx-icon v post.css. */
  max-width: none;
  flex: 0 0 auto;
  /* Kreslené emoji stojí na účaří o kousek níž než písmeno - bez posunu
     vypadá text pod ním "nadskočený". */
  vertical-align: -0.16em;
  margin: 0 0.05em;
  display: inline-block;
  object-fit: contain;
}

/* Obrázky v příspěvku jsou blokové a mají odsazení i rámeček. Emoji je
   ale písmeno v řádku, ne fotka - tohle ho z toho pravidla vyjímá. */
.post-content img.twemoji,
.ql-editor img.twemoji,
.preview-panel img.twemoji {
  display: inline-block;
  margin: 0 0.05em;
  border-radius: 0;
  max-width: none;
  height: 1em;
  width: 1em;
  vertical-align: -0.16em;
}

/* Emoji v nadpisu roste s nadpisem - 1em je velikost toho nadpisu. */

/* Ikona sekce v pravidlech a na informačních stránkách: větší než text,
   vlevo od nadpisu. */
.section-emoji {
  height: 1.5em;
  width: 1.5em;
  vertical-align: -0.28em;
  margin-right: 0.4rem;
}
h1 .section-emoji, h2 .section-emoji, h3 .section-emoji,
.post-content h1 .section-emoji, .post-content h2 .section-emoji {
  /* V nadpisu je 1.5em už moc - nadpis je sám o sobě velký. */
  height: 1.1em;
  width: 1.1em;
  vertical-align: -0.18em;
}

/* Emoji picker v editoru: v dlaždici je obrázek, ne znak. */
.emoji-grid button img.twemoji {
  height: 20px;
  width: 20px;
  vertical-align: middle;
  margin: 0;
}

/* Zápatí s licencí a kontaktem. */
.foot-credit { color: var(--text-faint, #7c7f88); }
.foot-link { color: var(--text-muted, #a5a7ad); margin-right: 0.9rem; }