/* dlg-markdown.css — companion styles for dlg-markdown.js output.
 *
 * Put the .dlg-md class on the element that receives the rendered HTML.
 * The rule set enforces ONE uniform font size throughout the rendered
 * content: headings, inline code and code blocks all render at the
 * container's own size (only weight, background and font family differ),
 * so an LLM's markdown can never introduce size jumps inside an answer.
 *
 * The Instruction wiki keeps its own document look (.dlg-doc) — this
 * class is for compact surfaces like chat bubbles and result boxes.
 */

.dlg-md {
    white-space: normal;
}

/* central-ui sets a fixed size on bare <p> (p { font-size: var(--app-text-
   base-size) }), which would make paragraphs deviate from the container.
   Restore inheritance so everything in the answer shares one size. */
.dlg-md p {
    font-size: 1em;
}

.dlg-md p,
.dlg-md ul,
.dlg-md ol,
.dlg-md pre,
.dlg-md blockquote,
.dlg-md table {
    margin: 0 0 8px;
}

.dlg-md > *:last-child {
    margin-bottom: 0;
}

.dlg-md h1,
.dlg-md h2,
.dlg-md h3,
.dlg-md h4,
.dlg-md h5,
.dlg-md h6 {
    font-size: 1em;
    font-weight: 600;
    line-height: inherit;
    margin: 10px 0 4px;
}

.dlg-md > h1:first-child,
.dlg-md > h2:first-child,
.dlg-md > h3:first-child,
.dlg-md > h4:first-child,
.dlg-md > h5:first-child,
.dlg-md > h6:first-child {
    margin-top: 0;
}

.dlg-md ul,
.dlg-md ol {
    padding-left: 18px;
}

.dlg-md code {
    font-family: var(--app-mono, ui-monospace, Consolas, monospace);
    font-size: 1em;
    background: rgba(0, 0, 0, 0.06);
    padding: 1px 4px;
    border-radius: 4px;
}

.dlg-md pre {
    font-family: var(--app-mono, ui-monospace, Consolas, monospace);
    font-size: 1em;
    background: rgba(0, 0, 0, 0.06);
    padding: 6px 8px;
    border-radius: 4px;
    overflow-x: auto;
}

.dlg-md pre code {
    background: none;
    padding: 0;
}

.dlg-md blockquote {
    border-left: 3px solid hsla(0, 0%, 40%, 0.2);
    padding-left: 10px;
    color: var(--app-text-secondary, #919191);
}

.dlg-md table {
    border-collapse: collapse;
}

.dlg-md th,
.dlg-md td {
    border: 1px solid hsla(0, 0%, 40%, 0.15);
    padding: 4px 8px;
    text-align: left;
}

.dlg-md hr {
    border: none;
    border-top: 1px solid hsla(0, 0%, 40%, 0.15);
    margin: 8px 0;
}

.dlg-md img {
    max-width: 100%;
}