/* ── Markdown Viewer ── */
.markdown-viewer {
    font-family: var(--md-font, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);
    font-size: 15px;
    line-height: 1.7;
    color: var(--md-text);
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* Headings */
.markdown-viewer h1,
.markdown-viewer h2,
.markdown-viewer h3,
.markdown-viewer h4,
.markdown-viewer h5,
.markdown-viewer h6 {
    margin-top: 1.5em;
    margin-bottom: 0.5em;
    font-weight: 600;
    line-height: 1.3;
    color: var(--md-heading);
}

.markdown-viewer h1 {
    font-size: 1.75em;
    border-bottom: 1px solid var(--md-border);
    padding-bottom: 0.3em;
}

.markdown-viewer h2 {
    font-size: 1.4em;
    border-bottom: 1px solid var(--md-border);
    padding-bottom: 0.25em;
}

.markdown-viewer h3 {
    font-size: 1.2em;
}

.markdown-viewer h4 {
    font-size: 1.05em;
}

/* Paragraphs */
.markdown-viewer p {
    margin: 0 0 1em 0;
}

/* Links */
.markdown-viewer a {
    color: var(--md-link);
    text-decoration: none;
}

.markdown-viewer a:hover {
    text-decoration: underline;
}

/* Code */
.md-inline-code {
    padding: 2px 6px;
    border-radius: 4px;
    background: var(--md-code-bg);
    font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', monospace;
    font-size: 0.88em;
}

.md-code-block {
    padding: 16px;
    border-radius: 6px;
    background: var(--md-code-block-bg);
    overflow-x: auto;
    margin: 1em 0;
}

.md-code-block code {
    font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', monospace;
    font-size: 0.88em;
    color: var(--md-code-text);
}

/* Lists */
.markdown-viewer ul,
.markdown-viewer ol {
    padding-left: 2em;
    margin: 0.5em 0 1em 0;
}

.markdown-viewer li {
    margin: 0.25em 0;
}

/* Blockquote */
.markdown-viewer blockquote {
    margin: 1em 0;
    padding: 0.5em 1em;
    border-left: 4px solid var(--md-quote-border);
    background: var(--md-quote-bg);
    color: var(--md-text-muted);
}

/* Horizontal rule */
.markdown-viewer hr {
    border: none;
    height: 1px;
    background: var(--md-border);
    margin: 2em 0;
}

/* Images */
.markdown-viewer .md-image {
    max-width: 100%;
    border-radius: 6px;
    margin: 1em 0;
}

/* ── Theme Variables ── */
@layer components {
    .markdown-viewer {
        --md-text: #1f2937;
        --md-heading: #111827;
        --md-link: #2563eb;
        --md-border: #e5e7eb;
        --md-code-bg: #f3f4f6;
        --md-code-block-bg: #1e1e1e;
        --md-code-text: #d4d4d4;
        --md-quote-border: #3b82f6;
        --md-quote-bg: #eff6ff;
        --md-text-muted: #6b7280;
    }

    :is(.jsgui-dark-mode, [data-theme="dark"]) .markdown-viewer {
        --md-text: #e5e7eb;
        --md-heading: #f9fafb;
        --md-link: #60a5fa;
        --md-border: #374151;
        --md-code-bg: #1f2937;
        --md-code-block-bg: #0d1117;
        --md-code-text: #c9d1d9;
        --md-quote-border: #3b82f6;
        --md-quote-bg: #172033;
        --md-text-muted: #9ca3af;
    }
}

/* GitHub theme */
.markdown-viewer[data-theme="github"] {
    --md-code-block-bg: #0d1117;
    --md-code-text: #c9d1d9;
}

/* Minimal theme  */
.markdown-viewer[data-theme="minimal"] {
    font-size: 14px;
    line-height: 1.6;
}

.markdown-viewer[data-theme="minimal"] h1 {
    font-size: 1.5em;
    border: none;
}

.markdown-viewer[data-theme="minimal"] h2 {
    font-size: 1.25em;
    border: none;
}