/* ============================================================
   markdown.css — Scoped Markdown Typography
   Applied inside .md-render wrappers only
   ============================================================ */

.md-render {
  color: var(--text-primary);
  font-family: var(--font-mono);
  font-size: var(--font-size);
  line-height: 1.7;
  padding: 4px 0 8px;
}

/* ── Headings ─────────────────────────────────────────────── */
.md-render h1,
.md-render h2,
.md-render h3,
.md-render h4 {
  color: var(--color-blue);
  font-weight: 700;
  margin: 12px 0 6px;
  line-height: 1.3;
}

.md-render h1 { font-size: 1.25em; }
.md-render h2 { font-size: 1.1em; }
.md-render h3 { font-size: 1em; color: var(--color-green); }
.md-render h4 { font-size: 0.95em; color: var(--text-muted); }

/* First heading removes top margin */
.md-render > :first-child {
  margin-top: 0;
}

/* ── Paragraphs ───────────────────────────────────────────── */
.md-render p {
  margin: 0 0 8px;
}

/* ── Lists ────────────────────────────────────────────────── */
.md-render ul,
.md-render ol {
  margin: 0 0 8px 20px;
  padding: 0;
}

.md-render li {
  margin-bottom: 3px;
}

.md-render li::marker {
  color: var(--color-blue);
}

/* ── Code ─────────────────────────────────────────────────── */
.md-render code {
  background-color: rgba(88, 166, 255, 0.08);
  color: var(--color-green);
  border: 1px solid var(--border-color);
  border-radius: 3px;
  padding: 1px 5px;
  font-family: var(--font-mono);
  font-size: 0.93em;
}

.md-render pre {
  background-color: rgba(22, 27, 34, 0.8);
  border: 1px solid var(--border-color);
  border-radius: 5px;
  padding: 12px 16px;
  margin: 8px 0;
  overflow-x: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--border-color) transparent;
}

.md-render pre code {
  background: none;
  border: none;
  padding: 0;
  color: var(--text-primary);
  font-size: 0.92em;
}

/* ── Blockquote ───────────────────────────────────────────── */
.md-render blockquote {
  border-left: 3px solid var(--color-blue);
  margin: 8px 0;
  padding: 4px 0 4px 14px;
  color: var(--text-muted);
  font-style: italic;
}

/* ── Horizontal rule ──────────────────────────────────────── */
.md-render hr {
  border: none;
  border-top: 1px solid var(--border-color);
  margin: 12px 0;
}

/* ── Links ────────────────────────────────────────────────── */
.md-render a {
  color: var(--color-blue);
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 0.15s ease;
}

.md-render a:hover {
  color: #79c0ff;
}

/* ── Tables ───────────────────────────────────────────────── */
.md-render table {
  border-collapse: collapse;
  margin: 8px 0;
  font-size: 0.93em;
  width: 100%;
}

.md-render th {
  background-color: var(--bg-titlebar);
  color: var(--color-blue);
  font-weight: 600;
  padding: 6px 12px;
  border: 1px solid var(--border-color);
  text-align: left;
}

.md-render td {
  padding: 5px 12px;
  border: 1px solid var(--border-color);
  color: var(--text-primary);
}

.md-render tr:nth-child(even) td {
  background-color: rgba(255, 255, 255, 0.02);
}

/* ── Strong / Em ──────────────────────────────────────────── */
.md-render strong {
  color: #e6edf3;
  font-weight: 600;
}

.md-render em {
  color: var(--color-purple);
  font-style: italic;
}