@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&display=swap');

/* Generic bubble container */
.bubble {
  word-break: break-word;
  max-width: 100%;
  box-sizing: border-box;
}

/* Pre/code in assistant message bubbles, including highlighted blocks */
.bubble pre,
.bubble pre code,
.bubble pre code.hljs,
.bubble pre.hljs {
  white-space: pre-wrap !important;
  word-break: break-word !important;
  overflow-x: auto !important;
  max-width: 100%;
  box-sizing: border-box;
  background: #f5f5f5 !important;
  padding: 1em !important;
  border-radius: 4px !important;
  overflow: auto;
  white-space: pre;
  font-family: "IBM Plex Mono", "Fira Mono", "Consolas", "Menlo", "Monaco", "Courier New", monospace !important;
  font-size: 13px !important;
  color: inherit;
}

/* The code itself (catch-all, including highlighted and inline) */
.bubble code,
.bubble code.hljs {
  font-family: "IBM Plex Mono", "Fira Mono", "Consolas", "Menlo", "Monaco", "Courier New", monospace !important;
  font-size: 13px !important;
  background: none !important;
  color: inherit;
}

/* Inline code (not in pre) */
.bubble :not(pre) > code,
.bubble :not(pre) > code.hljs {
  background: #f5f5f5 !important;
  padding: 0 0.2em !important;
  border-radius: 3px !important;
  font-family: "IBM Plex Mono", "Fira Mono", "Consolas", "Menlo", "Monaco", "Courier New", monospace !important;
  font-size: 13px !important;
}

.bubble pre code.hljs,
.bubble pre.hljs,
.bubble code.hljs,
.bubble pre code[class~="hljs"],
.bubble code[class~="hljs"] {
  font-family: "IBM Plex Mono", "Fira Mono", "Consolas", "Menlo", "Monaco", "Courier New", monospace !important;
  font-size: 13px !important;
}