/* ==========================================================================
   md.giit.ch - the document page: the preview, the HTML file and printing.
   Light and dark like the editor (data-theme on <html>, or the system
   setting); printing is always light.
   ========================================================================== */

.md-doc {
    --d-bg: #ffffff;
    --d-text: #1f2328;
    --d-leise: #59636e;
    --d-linie: #d1d9e0;
    --d-flaeche: #f6f8fa;
    --d-code: #eff1f3;
    --d-link: #0969da;
    --d-mark: #fff8c5;
    --d-quelle: rgba(26, 115, 232, 0.55);
    --d-quelle-bg: rgba(26, 115, 232, 0.07);
    color-scheme: light;
}
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .md-doc {
        --d-bg: #0d1117;
        --d-text: #e6edf3;
        --d-leise: #9198a1;
        --d-linie: #3d444d;
        --d-flaeche: #151b23;
        --d-code: #262c36;
        --d-link: #4493f8;
        --d-mark: #5c4a12;
        --d-quelle: rgba(90, 162, 255, 0.6);
        --d-quelle-bg: rgba(90, 162, 255, 0.1);
        color-scheme: dark;
    }
}
:root[data-theme="dark"] .md-doc {
    --d-bg: #0d1117;
    --d-text: #e6edf3;
    --d-leise: #9198a1;
    --d-linie: #3d444d;
    --d-flaeche: #151b23;
    --d-code: #262c36;
    --d-link: #4493f8;
    --d-mark: #5c4a12;
    --d-quelle: rgba(90, 162, 255, 0.6);
    --d-quelle-bg: rgba(90, 162, 255, 0.1);
    color-scheme: dark;
}

.md-doc {
    box-sizing: border-box;
    max-width: 820px; margin: 0 auto; padding: 40px 48px;
    background: var(--d-bg); color: var(--d-text);
    font: 16px/1.65 -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif;
    overflow-wrap: break-word; word-wrap: break-word;
}
.md-doc *, .md-doc *::before, .md-doc *::after { box-sizing: border-box; }
.md-doc > :first-child { margin-top: 0 !important; }
.md-doc > :last-child { margin-bottom: 0 !important; }
.md-doc p, .md-doc blockquote, .md-doc ul, .md-doc ol, .md-doc dl, .md-doc table, .md-doc pre, .md-doc details, .md-doc .md-math-block { margin: 0 0 16px; }
.md-doc h1, .md-doc h2, .md-doc h3, .md-doc h4, .md-doc h5, .md-doc h6 { margin: 24px 0 16px; font-weight: 600; line-height: 1.25; }
.md-doc h1 { font-size: 2em; padding-bottom: .3em; border-bottom: 1px solid var(--d-linie); }
.md-doc h2 { font-size: 1.5em; padding-bottom: .3em; border-bottom: 1px solid var(--d-linie); }
.md-doc h3 { font-size: 1.25em; }
.md-doc h4 { font-size: 1em; }
.md-doc h5 { font-size: .875em; }
.md-doc h6 { font-size: .85em; color: var(--d-leise); }
.md-doc a { color: var(--d-link); text-decoration: underline; text-underline-offset: .2em; }
.md-doc strong, .md-doc b { font-weight: 600; }
.md-doc hr { height: .25em; margin: 24px 0; padding: 0; border: 0; background: var(--d-linie); }
.md-doc ul, .md-doc ol { padding-left: 2em; }
.md-doc li + li { margin-top: .25em; }
.md-doc li > p { margin-top: 16px; }
.md-doc li > ul, .md-doc li > ol { margin: .25em 0 0; }
.md-doc ul.task-list { list-style: none; padding-left: 1.6em; }
.md-doc .task-item { position: relative; }
.md-doc .task-item > .md-task { position: absolute; left: -1.5em; top: .35em; margin: 0; width: 1em; height: 1em; accent-color: var(--d-link); cursor: pointer; }
.md-doc .task-item > .md-task[disabled] { cursor: default; }
.md-doc blockquote { padding: 0 1em; color: var(--d-leise); border-left: .25em solid var(--d-linie); }
.md-doc code, .md-doc kbd, .md-doc pre, .md-doc samp, .md-doc tt { font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace; }
.md-doc code { padding: .2em .4em; font-size: 85%; white-space: break-spaces; background: var(--d-code); border-radius: 6px; }
.md-doc pre { padding: 16px; overflow: auto; font-size: 85%; line-height: 1.45; background: var(--d-flaeche); border-radius: 6px; }
.md-doc pre code { padding: 0; font-size: 100%; white-space: pre; background: transparent; border-radius: 0; }
.md-doc kbd { display: inline-block; padding: 3px 5px; font-size: 11px; line-height: 10px; vertical-align: middle; background: var(--d-flaeche); border: 1px solid var(--d-linie); border-bottom-width: 2px; border-radius: 6px; }
.md-doc table { display: block; width: max-content; max-width: 100%; overflow: auto; border-spacing: 0; border-collapse: collapse; font-variant: tabular-nums; }
.md-doc th { font-weight: 600; }
.md-doc th, .md-doc td { padding: 6px 13px; border: 1px solid var(--d-linie); }
.md-doc tr:nth-child(2n) { background: var(--d-flaeche); }
.md-doc img { max-width: 100%; height: auto; box-sizing: content-box; }
.md-doc mark { background: var(--d-mark); color: inherit; }
.md-doc del, .md-doc s { color: var(--d-leise); }
.md-doc details summary { cursor: pointer; }
.md-doc dl dt { font-weight: 600; margin-top: 16px; }
.md-doc dl dd { margin: 0 0 16px; padding: 0 16px; }
.md-doc sup.footnote-ref a { text-decoration: none; }
.md-doc .footnotes { font-size: 85%; color: var(--d-leise); }
.md-doc hr.footnotes-sep { height: 1px; margin-top: 32px; }
.md-doc .footnotes-list { padding-left: 1.5em; }
.md-doc .footnote-backref { text-decoration: none; }
.md-doc .md-math-block { overflow-x: auto; overflow-y: hidden; }
.md-doc .md-bild-fehlt, .md-doc .md-datei {
    display: inline-flex; align-items: center; min-height: 3em; padding: .4em .8em; vertical-align: middle;
    color: var(--d-leise); font: 13px ui-monospace, Menlo, Consolas, monospace;
    border: 1px dashed var(--d-linie); border-radius: 6px; background: var(--d-flaeche);
}
.md-doc .md-bild-fehlt::before { content: "\26A0\FE0E\00a0"; color: #c62f2f; }
.md-doc .md-datei::before { content: "PDF\00a0"; font-weight: 700; color: #c62f2f; }

/* The editor's marks in the preview */
.md-doc .quelle { outline: 2px solid var(--d-quelle); outline-offset: 3px; border-radius: 2px; background: var(--d-quelle-bg); }
.md-doc .t.bearbeiten { outline: 2px solid rgba(26, 115, 232, 0.8); outline-offset: 1px; border-radius: 2px; background: rgba(26, 115, 232, 0.1); white-space: pre-wrap; caret-color: #1a73e8; }
.md-doc .t:hover { background: var(--d-quelle-bg); border-radius: 2px; }
.md-doc .t.bearbeiten:hover { background: rgba(26, 115, 232, 0.1); }

@media (max-width: 600px) {
    .md-doc { padding: 22px 18px; }
}

@media print {
    .md-doc {
        --d-bg: #ffffff; --d-text: #1f2328; --d-leise: #59636e; --d-linie: #d1d9e0; --d-flaeche: #f6f8fa; --d-code: #eff1f3; --d-link: #0969da; --d-mark: #fff8c5;
        color-scheme: light; max-width: none; padding: 0; font-size: 11pt;
    }
    .md-doc .quelle { outline: 0; background: none; }
    .md-doc pre, .md-doc blockquote, .md-doc table, .md-doc img, .md-doc .md-math-block { break-inside: avoid; }
    .md-doc h1, .md-doc h2, .md-doc h3, .md-doc h4 { break-after: avoid; }
    @page { size: A4; margin: 18mm 16mm; }
}