/* Tipografia do conteúdo renderizado (respostas em Markdown) */

.msg__content h1, .msg__content h2, .msg__content h3, .msg__content h4 {
  font-family: var(--font-display);
  font-weight: 600;
  line-height: 1.3;
  margin: 1.1em 0 .5em;
  color: var(--text);
}
.msg__content h1 { font-size: 1.35em; }
.msg__content h2 { font-size: 1.2em; }
.msg__content h3 { font-size: 1.08em; }
.msg__content h4 { font-size: 1em; }

.msg__content p { margin: .65em 0; }
.msg__content ul, .msg__content ol { margin: .5em 0; padding-left: 1.4em; }
.msg__content li { margin: .25em 0; }
.msg__content li::marker { color: var(--text-faint); }

.msg__content a { color: var(--accent-strong); text-decoration: underline; text-underline-offset: 2px; }
.msg__content strong { color: var(--text); font-weight: 600; }
.msg__content hr { border: none; border-top: 1px solid var(--border); margin: 1.2em 0; }

.msg__content blockquote {
  margin: .8em 0;
  padding: 2px 14px;
  border-left: 3px solid var(--accent);
  color: var(--text-muted);
}

.msg__content table {
  width: 100%;
  border-collapse: collapse;
  margin: .9em 0;
  font-size: .92em;
  overflow-x: auto;
  display: block;
}
.msg__content th, .msg__content td {
  border: 1px solid var(--border);
  padding: 7px 10px;
  text-align: left;
}
.msg__content th {
  background: var(--surface-2);
  font-family: var(--font-mono);
  font-size: .85em;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--text-muted);
}

.msg__content code {
  font-family: var(--font-mono);
  font-size: .88em;
  background: var(--surface-3);
  padding: .15em .4em;
  border-radius: 4px;
}

.msg__content pre {
  margin: .8em 0;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: var(--surface-2);
  overflow: hidden;
}
.msg__content pre code {
  display: block;
  padding: 0;
  background: transparent;
  border-radius: 0;
  font-size: .85em;
}

.code-block { position: relative; }
.code-block__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 7px 12px;
  border-bottom: 1px solid var(--border);
  background: var(--surface-3);
}
.code-block__lang {
  font-family: var(--font-mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--text-faint);
}
.code-block__copy {
  display: flex;
  align-items: center;
  gap: 5px;
  background: transparent;
  border: none;
  color: var(--text-faint);
  font-family: var(--font-mono);
  font-size: 11px;
  cursor: pointer;
  padding: 3px 6px;
  border-radius: 5px;
}
.code-block__copy:hover { color: var(--accent-strong); background: var(--surface); }
.code-block pre {
  margin: 0;
  border: none;
  border-radius: 0;
  overflow-x: auto;
}
.code-block pre code { padding: 14px; }

/* Highlight.js — paleta ligada aos tokens do app (tema neutro, sem CSS externo) */
.hljs { color: var(--text); background: transparent; }
.hljs-comment, .hljs-quote { color: var(--text-faint); font-style: italic; }
.hljs-keyword, .hljs-selector-tag, .hljs-literal, .hljs-type { color: var(--accent-strong); }
.hljs-string, .hljs-attr, .hljs-template-tag { color: #d9b26a; }
.hljs-number, .hljs-symbol { color: #a58bde; }
.hljs-title, .hljs-section, .hljs-name { color: var(--live); }
.hljs-variable, .hljs-attribute, .hljs-property { color: #7fb0e0; }
.hljs-built_in, .hljs-class .hljs-title { color: var(--accent-strong); }
.hljs-deletion { color: var(--danger); }
.hljs-addition { color: var(--accent-strong); }
.hljs-emphasis { font-style: italic; }
.hljs-strong { font-weight: 600; }