/* ===========================================================================
   Markdown renderer — src/widgets/markdown.js

   This renderer is shared: the Chat app's answer bubbles, the Transcript and
   anything else that turns markdown into Preact elements goes through it, so
   these rules are element-shaped rather than belonging to one window.

   The blockquote rule is written as `blockquote.md-blockquote` on purpose:
   /css/theme.css carries a plain `blockquote` rule (and a dark-theme variant of
   it) for markdown that arrives without a class, and the renderer's own,
   plainer treatment has to keep beating both of them exactly as the inline
   style it replaced did.
   =========================================================================== */

.md-code-block {
  background: #1e1e1e;
  color: #d4d4d4;
  padding: 12px;
  border-radius: 6px;
  overflow: auto;
  /* overflow alone does not shrink an intrinsic min-content contribution;
     the box must also refuse to outgrow its container. */
  max-width: 100%;
  font-family: var(--font-code);
  font-size: 12px;
  line-height: 1.4;
  margin: 8px 0;
}

/* The <code> inside a block must not pick up the inline-code ground. */
.md-code-inner {
  background: transparent;
  padding: 0;
}

.md-code {
  background: rgba(0, 0, 0, 0.15);
  padding: 1px 4px;
  border-radius: 3px;
  font-family: var(--font-code);
  font-size: 0.9em;
}

/* LaTeX — `$…$` inline, `$$…$$` display. The renderer consumes the delimiters the
   way it consumes a code span's backticks. `.md-math` is the RAW path: every host
   that installs no engine (the server's render previews, a page whose /katex
   sheet never arrived) and every fragment the typesetter refuses mid-stream shows
   the TeX its author wrote, set in a math face so it reads as an expression and
   not as prose the model forgot to escape. */
.md-math {
  font-family: 'Cambria Math', 'STIX Two Math', 'Latin Modern Math', Georgia, 'Times New Roman', serif;
  font-style: italic;
  letter-spacing: 0.01em;
}

/* Display math keeps the shape it was written in (an `aligned` body is laid out
   by its newlines) and centres itself in the bubble; a line too wide for the
   column scrolls rather than stretching it, exactly as `.md-code-block` refuses
   to outgrow its container. */
.md-math-block {
  display: block;
  margin: 10px 0;
  padding: 2px 0;
  text-align: center;
  white-space: pre-wrap;
  overflow-x: auto;
  max-width: 100%;
  font-size: 1.05em;
  line-height: 1.5;
}

/* The typeset path. KaTeX owns typography inside `.katex` — its own font stack,
   its own italics and spacing — so the raw-source face above must not skew it,
   and `.md-math-typeset` only ever exists around engine output. Display output
   brings its own `.katex-display` margins; two sets stack visibly, so the block's
   own margin is what holds the rhythm. A formula wider than its bubble scrolls
   sideways instead of widening the column — the `.md-code-block` rule again. */
.md-math-typeset {
  font-family: inherit;
  font-style: normal;
  letter-spacing: normal;
  white-space: normal;
}

.md-math-typeset .katex-display {
  margin: 0;
  overflow-x: auto;
  overflow-y: hidden;
}

.md-link {
  color: #3498db;
  text-decoration: underline;
}

.md-image {
  max-width: 100%;
  height: auto;
  border-radius: 6px;
  margin: 8px 0;
  display: block;
}

/* Headings keep the UA size scale, written out so a heading looks the same in
   every host regardless of the surrounding font size. */
.md-heading {
  font-weight: bold;
  margin-top: 0.67em;
  margin-bottom: 0.67em;
  line-height: 1.2;
}

.md-h1 { font-size: 2em; }
.md-h2 { font-size: 1.5em; }
.md-h3 { font-size: 1.17em; }
.md-h4 { font-size: 1em; }
.md-h5 { font-size: 0.83em; }
.md-h6 { font-size: 0.67em; }

blockquote.md-blockquote {
  border-left: 4px solid #ccc;
  margin: 1em 0;
  padding-left: 1em;
  color: #666;
  font-style: italic;
}

.md-task-check {
  margin-right: 8px;
  accent-color: #3498db;
  vertical-align: middle;
}

.md-table {
  border-collapse: collapse;
  width: 100%;
  margin-bottom: 1em;
  font-size: 12px;
  overflow: auto;
}

.md-tr {
  border-bottom: 1px solid #e9ecef;
}

.md-th {
  padding: 8px 12px;
  text-align: left;
  border-bottom: 2px solid #dee2e6;
  font-weight: 600;
  font-size: 12px;
}

.md-td {
  padding: 6px 12px;
  font-size: 12px;
}

.md-p {
  margin: 0 0 1em 0;
  line-height: 1.6;
}

/* A rule inside an inline paragraph (`---`) sits tighter than a block-level
   one, which is how the two differ in the source. */
.md-hr {
  border: none;
  border-top: 1px solid #ddd;
  margin: 0.5em 0;
}

.md-hr-block {
  border: none;
  border-top: 1px solid #ccc;
  margin: 1em 0;
}
