/* Shared editorial typography for the public site and TinyMCE. */
:where(.rich-content) {
    --rich-ink: var(--gov-ink, #1f2b3d);
    --rich-title: var(--gov-title, var(--color-primary, #173a63));
    --rich-accent: var(--gov-teal, var(--color-accent, #17999b));
    --rich-muted: var(--gov-muted, #667182);
    --rich-border: var(--gov-border, #e5e9f0);
    --rich-surface: var(--gov-surface, #ffffff);
    --rich-tint: color-mix(in srgb, var(--rich-title) 5%, var(--rich-surface));
    color: var(--rich-ink);
    font-family: var(--font-family, 'PT Sans', system-ui, -apple-system, 'Segoe UI', sans-serif);
    font-size: 1.025rem;
    line-height: 1.75;
    overflow-wrap: break-word;
    text-wrap: pretty;
}

:where(.rich-content) > :first-child { margin-block-start: 0; }
:where(.rich-content) > :last-child { margin-block-end: 0; }

:where(.rich-content) h2,
:where(.rich-content) h3,
:where(.rich-content) h4,
:where(.rich-content) h5,
:where(.rich-content) h6 {
    margin-block: 1.8em .65em;
    color: var(--rich-title);
    font-family: var(--font-heading, 'PT Serif', Georgia, serif);
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: 0;
    text-wrap: balance;
    scroll-margin-block-start: 7rem;
}

:where(.rich-content) h2 { font-size: 1.75rem; }
:where(.rich-content) h3 { font-size: 1.4rem; }
:where(.rich-content) h4 { font-size: 1.18rem; }
:where(.rich-content) h5,
:where(.rich-content) h6 { font-size: 1rem; }

:where(.rich-content) p { margin-block: 0 1.1em; }
:where(.rich-content) strong { color: var(--rich-title); font-weight: 700; }
:where(.rich-content) small { color: var(--rich-muted); font-size: .875em; }
:where(.rich-content) sub,
:where(.rich-content) sup { position: relative; font-size: .72em; line-height: 0; }
:where(.rich-content) sup { inset-block-start: -.45em; }
:where(.rich-content) sub { inset-block-end: -.2em; }

:where(.rich-content) a {
    color: var(--rich-accent);
    font-weight: 600;
    text-decoration-thickness: .08em;
    text-underline-offset: .2em;
    text-decoration-skip-ink: auto;
}

:where(.rich-content) a:hover { text-decoration-thickness: .14em; }
:where(.rich-content) a:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--rich-accent) 45%, transparent);
    outline-offset: 3px;
    border-radius: 2px;
}

:where(.rich-content) ul,
:where(.rich-content) ol { margin-block: 0 1.25em; padding-inline-start: 1.45em; }
:where(.rich-content) li { padding-inline-start: .25em; }
:where(.rich-content) li + li { margin-block-start: .42em; }
:where(.rich-content) li::marker { color: var(--rich-accent); font-weight: 700; }
:where(.rich-content) li > ul,
:where(.rich-content) li > ol { margin-block: .5em 0; }

:where(.rich-content) blockquote {
    position: relative;
    margin-block: 1.65em;
    padding: 1.35rem 3.75rem 1.35rem 1.6rem;
    border-inline-start: 4px solid var(--rich-accent);
    border-radius: 0 8px 8px 0;
    background: var(--rich-tint);
    color: var(--rich-title);
    font-family: var(--font-heading, 'PT Serif', Georgia, serif);
    font-size: 1.08em;
    font-style: normal;
    line-height: 1.6;
}

:where(.rich-content) blockquote::before {
    content: "\201C";
    position: absolute;
    inset-block-start: .25rem;
    inset-inline-end: 1rem;
    color: var(--rich-accent);
    font-family: Georgia, serif;
    font-size: 3.75rem;
    line-height: 1;
    opacity: .22;
    pointer-events: none;
}

:where(.rich-content) blockquote > :last-child { margin-block-end: 0; }
:where(.rich-content) blockquote cite {
    display: block;
    margin-block-start: .8rem;
    color: var(--rich-muted);
    font-family: var(--font-family, 'PT Sans', system-ui, sans-serif);
    font-size: .84rem;
    font-style: normal;
    font-weight: 600;
}

:where(.rich-content) figure { margin: 1.6em 0; }
:where(.rich-content) img {
    display: block;
    max-inline-size: 100%;
    block-size: auto;
    border-radius: 8px;
}

:where(.rich-content) figcaption,
:where(.rich-content) table caption {
    margin-block-start: .65rem;
    color: var(--rich-muted);
    font-size: .84rem;
    line-height: 1.5;
    text-align: start;
}

:where(.rich-content) table {
    inline-size: 100%;
    margin-block: 1.6em;
    border: 1px solid var(--rich-border);
    border-collapse: separate;
    border-spacing: 0;
    border-radius: 8px;
    background: var(--rich-surface);
    font-size: .94rem;
    line-height: 1.45;
}

:where(.rich-content) th,
:where(.rich-content) td {
    padding: .8rem .9rem;
    border-block-end: 1px solid var(--rich-border);
    border-inline-end: 1px solid var(--rich-border);
    text-align: start;
    vertical-align: top;
}

:where(.rich-content) th:last-child,
:where(.rich-content) td:last-child { border-inline-end: 0; }
:where(.rich-content) tr:last-child > td { border-block-end: 0; }
:where(.rich-content) thead th { background: var(--rich-tint); color: var(--rich-title); font-weight: 700; }
:where(.rich-content) tbody tr:nth-child(even) { background: color-mix(in srgb, var(--rich-title) 2.5%, transparent); }
:where(.rich-content) tbody tr:hover { background: color-mix(in srgb, var(--rich-accent) 7%, transparent); }

:where(.rich-content) pre {
    margin-block: 1.5em;
    padding: 1rem 1.15rem;
    overflow-x: auto;
    border: 1px solid color-mix(in srgb, var(--rich-title) 76%, #000000);
    border-radius: 8px;
    background: color-mix(in srgb, var(--rich-title) 88%, #000000);
    color: #f4f7fb;
    font: .9rem/1.65 ui-monospace, 'Cascadia Code', Consolas, monospace;
    tab-size: 4;
}

:where(.rich-content) :not(pre) > code {
    padding: .12em .35em;
    border: 1px solid var(--rich-border);
    border-radius: 4px;
    background: var(--rich-tint);
    color: var(--rich-title);
    font-family: ui-monospace, 'Cascadia Code', Consolas, monospace;
    font-size: .88em;
}

:where(.rich-content) hr { margin-block: 2em; border: 0; border-block-start: 1px solid var(--rich-border); }
:where(.rich-content) mark { padding-inline: .15em; background: color-mix(in srgb, #ffd84d 52%, transparent); color: inherit; }

.newsdetail-article__content.rich-content > p:first-child {
    color: var(--rich-title);
    font-size: 1.1rem;
    font-weight: 500;
}

@media (max-width: 720px) {
    :where(.rich-content) { font-size: 1rem; }
    :where(.rich-content) h2 { font-size: 1.5rem; }
    :where(.rich-content) h3 { font-size: 1.28rem; }
    :where(.rich-content) blockquote { padding: 1.1rem 2.8rem 1.1rem 1.15rem; }
    :where(.rich-content) blockquote::before { inset-inline-end: .65rem; font-size: 3rem; }
    :where(.rich-content) table { display: block; max-inline-size: 100%; overflow-x: auto; scrollbar-width: thin; }
    :where(.rich-content) th,
    :where(.rich-content) td { min-inline-size: 8rem; }
}

@media (forced-colors: active) {
    :where(.rich-content) blockquote,
    :where(.rich-content) table,
    :where(.rich-content) th,
    :where(.rich-content) td { border-color: CanvasText; }
}

@media print {
    :where(.rich-content) { color: #000000; }
    :where(.rich-content) a { color: #000000; }
    :where(.rich-content) table { display: table; overflow: visible; }
    :where(.rich-content) pre { white-space: pre-wrap; }
}