/**
 * Styling for rendered Markdown.
 *
 * Only what themes usually have no rule for — tables, footnotes, definition
 * lists, task lists, fenced code. Everything a theme already styles (headings,
 * paragraphs, links) is left alone, so the block inherits the site's voice.
 *
 * The editor's preview panes are matched as well as the published block, so
 * the preview looks like the page rather than merely rendering the same HTML.
 */

.markdown table,
.editor-preview table,
.editor-preview-side table {
    border-collapse: collapse;
    margin: 1em 0;
    width: 100%;
}

.markdown th,
.markdown td,
.editor-preview th,
.editor-preview td,
.editor-preview-side th,
.editor-preview-side td {
    border: 1px solid rgba(127, 127, 127, .4);
    padding: .4em .6em;
    text-align: left;
}

.markdown th,
.editor-preview th,
.editor-preview-side th {
    background: rgba(127, 127, 127, .1);
    font-weight: bold;
}

.markdown pre,
.editor-preview pre,
.editor-preview-side pre {
    background: rgba(127, 127, 127, .1);
    overflow-x: auto;
    padding: .8em 1em;
}

.markdown code,
.editor-preview code,
.editor-preview-side code {
    font-size: .9em;
}

.markdown dt,
.editor-preview dt,
.editor-preview-side dt {
    font-weight: bold;
    margin-top: .6em;
}

.markdown dd,
.editor-preview dd,
.editor-preview-side dd {
    margin-left: 1.5em;
}

/* Task lists sit in ordinary <ul>s, so the marker has to go item by item. */
.markdown li:has(> input[type="checkbox"]),
.editor-preview li:has(> input[type="checkbox"]),
.editor-preview-side li:has(> input[type="checkbox"]) {
    list-style: none;
    margin-left: -1.2em;
}

.markdown input[type="checkbox"],
.editor-preview input[type="checkbox"],
.editor-preview-side input[type="checkbox"] {
    margin-right: .4em;
}

/* Footnotes: a smaller block at the end, separated by the extension's <hr>. */
.markdown .footnotes,
.editor-preview .footnotes,
.editor-preview-side .footnotes {
    font-size: .9em;
}

.markdown .footnote-ref,
.editor-preview .footnote-ref,
.editor-preview-side .footnote-ref {
    text-decoration: none;
    vertical-align: super;
    font-size: .8em;
}