/* Emoji font fallbacks for consistent rendering */
:root {
  --emoji-fonts: "Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji","Twemoji Mozilla","EmojiOne Color","Segoe UI Symbol", system-ui, sans-serif;
}

.emoji-font, .emoji, .mud-typography .emoji, .mud-button .emoji,
.mud-menu .emoji, .mud-popover .emoji, .mud-dialog .emoji, .mud-menu * {
  font-family: var(--emoji-fonts) !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizelegibility;
}

/* Popover content often hosts the emoji picker */
.mud-popover, .mud-popover * {
  font-family: var(--emoji-fonts) !important;
}

/* Twemoji images sizing/alignment */
.twemoji, .emoji img.twemoji {
  width: 1em;
  height: 1em;
  vertical-align: -0.125em; /* similar to Bootstrap */
}

/* Also prefer color-emoji for any element explicitly requesting it */
[data-emoji], .use-emoji-font {
  font-family: var(--emoji-fonts) !important;
}