/* Styling for admin-authored HTML - the editor's own body and every pane that previews it.
 *
 * This exists because of ONE bug: MudBlazor's reset flattens ul/ol (no marker, no indent), so a
 * bulleted or numbered list typed into the editor rendered its markers hard against the left edge
 * of the box, clipped and half off-screen. It looked like an editor bug and is not - it bites any
 * list inside a MudBlazor surface, which is why the class is also on the preview panes rather than
 * only on the editable node. Mail clients never load MudBlazor's CSS, so the SENT message was
 * always fine; only our own screens were lying about it. */
.sf-html-content ul,
.sf-html-content ol {
    padding-left: 1.75rem;
    margin: 0.5rem 0;
    list-style-position: outside;
}

.sf-html-content ul { list-style-type: disc; }
.sf-html-content ol { list-style-type: decimal; }
.sf-html-content li { display: list-item; }

/* The reset flattens these the same way, and an authored body leans on all of them. */
.sf-html-content p { margin: 0 0 0.75rem; }
.sf-html-content h1,
.sf-html-content h2,
.sf-html-content h3,
.sf-html-content h4 { margin: 0.75rem 0 0.5rem; font-weight: 600; line-height: 1.25; }
.sf-html-content h1 { font-size: 1.6rem; }
.sf-html-content h2 { font-size: 1.4rem; }
.sf-html-content h3 { font-size: 1.2rem; }
.sf-html-content blockquote {
    margin: 0.5rem 0;
    padding-left: 1rem;
    border-left: 3px solid var(--mud-palette-lines-default);
}

.sf-html-content a { color: var(--mud-palette-primary); text-decoration: underline; }

/* Authored tables (the wayfinding pages are full of them) need visible structure to be editable. */
.sf-html-content table { border-collapse: collapse; }
.sf-html-content th,
.sf-html-content td { border: 1px solid var(--mud-palette-lines-default); padding: 0.25rem 0.5rem; }

/* The editable node itself: a wide authored table must scroll inside the box, never widen it. */
.sf-html-editor-body {
    outline: none;
    overflow: auto;
}