/*
 * Markdown output inside a MAIA message bubble (.maia-msg__body).
 *
 * The model always replies in Markdown (see Context::systemInstruction()),
 * marked.js parses it, and DOMPurify-free sanitization is handled by
 * maia-dom.js escaping everything BEFORE it reaches marked (see that file's
 * docblock) — this stylesheet only concerns layout, not safety.
 *
 * 2.0 rewrite: the old bubbles.js measured .bubble-content's offsetWidth to
 * size each bubble, which meant this file had to avoid `display:block` on
 * the content wrapper. .maia-msg__body has no such constraint — it's a
 * normal flex/block child — so every rule below is a plain, ordinary
 * markdown stylesheet.
 */

.maia-msg__body p,
.maia-msg__body ul,
.maia-msg__body ol,
.maia-msg__body pre,
.maia-msg__body blockquote,
.maia-msg__body table {
  margin: 0 0 .6em;
}

.maia-msg__body > *:first-child { margin-top: 0; }
.maia-msg__body > *:last-child  { margin-bottom: 0; }

.maia-msg__body h1,
.maia-msg__body h2,
.maia-msg__body h3,
.maia-msg__body h4,
.maia-msg__body h5,
.maia-msg__body h6 {
  margin: .9em 0 .35em;
  padding: 0;
  border: 0;
  font-weight: 600;
  line-height: 1.3;
  color: inherit;
}

.maia-msg__body h1 { font-size: 1.3em; }
.maia-msg__body h2 { font-size: 1.15em; }
.maia-msg__body h3 { font-size: 1.05em; }
.maia-msg__body h4 { font-size: 1em; }
.maia-msg__body h5,
.maia-msg__body h6 { font-size: .95em; opacity: .8; }

.maia-msg__body ul,
.maia-msg__body ol { padding-left: 1.4em; }
.maia-msg__body li { margin: .15em 0; }
.maia-msg__body li > ul,
.maia-msg__body li > ol { margin: .2em 0; }

.maia-msg__body blockquote {
  padding: .2em 0 .2em .8em;
  border-left: 3px solid var(--maia-border, rgba(0,0,0,.15));
  opacity: .85;
}

.maia-msg__body hr {
  height: 0;
  border: 0;
  border-top: 1px solid var(--maia-border, rgba(0,0,0,.15));
  margin: .9em 0;
}

.maia-msg__body table {
  display: block;
  width: auto;
  max-width: 100%;
  overflow-x: auto;
  border-collapse: collapse;
  font-size: .95em;
}
.maia-msg__body th,
.maia-msg__body td {
  border: 1px solid var(--maia-border, rgba(0,0,0,.15));
  padding: 4px 8px;
  text-align: left;
  vertical-align: top;
}
.maia-msg__body th {
  background: var(--maia-surface-2, rgba(0,0,0,.05));
  font-weight: 600;
}

.maia-msg__body a {
  color: var(--maia-link, #2271b1);
  text-decoration: underline;
}
.maia-msg__body a:hover { color: var(--maia-link-hover, #135e96); }

.maia-msg__body strong { font-weight: 600; }
.maia-msg__body em     { font-style: italic; }
.maia-msg__body del    { opacity: .7; }

.maia-msg__body :not(pre) > code {
  background: var(--maia-surface-2, rgba(0,0,0,.07));
  border-radius: 3px;
  padding: .1em .35em;
  font-size: .92em;
  word-break: break-word;
}

.maia-msg__body pre {
  background: var(--maia-surface-2, rgba(0,0,0,.06));
  border-radius: 6px;
  padding: .7em .9em;
  overflow-x: auto;
  position: relative;
}
.maia-msg__body pre code {
  background: none;
  padding: 0;
  font-size: .88em;
  line-height: 1.5;
}

.maia-msg__body p img {
  width: auto;
  max-width: 100%;
  margin: 0;
  display: inline-block;
  border-radius: 4px;
}

/* Copy button injected over a hovered <pre> — see maia-chat.js. */
.maia-msg__body pre .maia-copy-btn {
  position: absolute;
  top: 6px;
  right: 6px;
  font-size: .78em;
  padding: 2px 8px;
  border-radius: 4px;
  border: 1px solid var(--maia-border, rgba(0,0,0,.15));
  background: var(--maia-surface, #fff);
  color: var(--maia-text, #1e1e1e);
  cursor: pointer;
  opacity: 0;
  transition: opacity .15s ease;
}
.maia-msg__body pre:hover .maia-copy-btn { opacity: 1; }