/* Article surfaces need a matched background/text pair in both themes.
   Older posts store mint callouts as inline styles. Support those known
   variants without overriding arbitrary editorial backgrounds or images. */
.sidebar .sidebar__menu, .eapd-mobile-links .sidebar__menu { animation: none; }
.eapd-article-body {
    --article-callout-bg: #e9fff6;
    --article-callout-text: #24483d;
    --article-callout-link: #12614f;
    --article-label-green: #146b61;
    --article-label-yellow: #80520d;
}
[data-theme="dark"] .eapd-article-body {
    --article-callout-bg: #14332b;
    --article-callout-text: #d4e6e1;
    --article-callout-link: #97fce4;
    --article-label-green: #97fce4;
    --article-label-yellow: #f3c97a;
}
.eapd-article-body .title.green { color: var(--article-label-green) !important; }
.eapd-article-body .title.yellow { color: var(--article-label-yellow) !important; }
.main__content .content__container.eapd-article-body > p[style*="color"],
.main__content .content__container.eapd-article-body > p > em[style*="color"] {
    color: var(--text-muted) !important;
}
.main__content .content__container.eapd-article-body :is(.eapd-article-callout, div[style*="#e9fff6" i], div[style*="rgba(151,252,228,0.08)" i]) {
    /* Important only where required to override the legacy inline paint. */
    background: var(--article-callout-bg) !important;
    border-left-color: var(--accent) !important;
    color: var(--article-callout-text);
    padding: 20px 24px !important;
    border-radius: 10px !important;
}
.main__content .content__container.eapd-article-body :is(.eapd-article-callout, div[style*="#e9fff6" i], div[style*="rgba(151,252,228,0.08)" i]) :is(p, li, strong, em) {
    color: var(--article-callout-text);
}
.main__content .content__container.eapd-article-body :is(.eapd-article-callout, div[style*="#e9fff6" i], div[style*="rgba(151,252,228,0.08)" i]) p {
    font-size: 1.06rem;
    line-height: 1.75;
    margin: 0 0 1em;
}
.main__content .content__container.eapd-article-body :is(.eapd-article-callout, div[style*="#e9fff6" i], div[style*="rgba(151,252,228,0.08)" i]) p:last-child { margin-bottom: 0; }
.main__content .content__container.eapd-article-body :is(.eapd-article-callout, div[style*="#e9fff6" i], div[style*="rgba(151,252,228,0.08)" i]) a {
    /* Override the old article-a/white rules and their many :not selectors. */
    color: var(--article-callout-link) !important;
    background: none !important;
    text-decoration: underline;
    text-decoration-color: currentColor;
    text-underline-offset: .2em;
    text-decoration-thickness: 1px;
}
.main__content .content__container.eapd-article-body :is(.eapd-article-callout, div[style*="#e9fff6" i], div[style*="rgba(151,252,228,0.08)" i]) a:hover { text-decoration-thickness: 2px; color: var(--article-callout-link); }
.main__content .content__container.eapd-article-body :is(.eapd-article-callout, div[style*="#e9fff6" i], div[style*="rgba(151,252,228,0.08)" i]) a::before,
.main__content .content__container.eapd-article-body :is(.eapd-article-callout, div[style*="#e9fff6" i], div[style*="rgba(151,252,228,0.08)" i]) a::after { content: none; }
@media (max-width: 600px) {
    .main__content .content__container.eapd-article-body :is(.eapd-article-callout, div[style*="#e9fff6" i], div[style*="rgba(151,252,228,0.08)" i]) { padding: 16px 18px !important; }
    .main__content .content__container.eapd-article-body :is(.eapd-article-callout, div[style*="#e9fff6" i], div[style*="rgba(151,252,228,0.08)" i]) p { font-size: 1rem; }
}
