/* MU Emoji Color Fix
   - Ensure emojis keep their native color and don't inherit text styles
   - IMPORTANT: Use <span class="mu-icon">🐉</span> in your HTML (do NOT use data-icon anymore)
*/

/* 1) Stop using the old pseudo-element icon */
.mu-callout::before { content: none !important; }

/* 2) New emoji element that ignores parent text styling */
.mu-callout .mu-icon {
  /* Reset and then set only what we need */
  all: revert;
  display: inline-block;
  margin-right: .5rem;
  font-size: 1.4rem;
  line-height: 1;

  /* Force a color-emoji capable font stack */
  font-family: "Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji","Segoe UI Symbol", emoji !important;

  /* Ensure no inherited coloring effects */
  color: initial !important;
  -webkit-text-fill-color: initial !important;
  text-shadow: none !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}