/*
 * Markdown izlaz unutar chat bubble-a.
 *
 * Model uvek odgovara u Markdown-u (Context::systemPrompt()), marked.js to
 * parsira, a HTML zavrsava u span.bubble-content. Do sada nista nije stilizovalo
 * taj izlaz osim pre/code u maia.css, pa su naslovi, tabele i liste padali na
 * ono sto tema ili admin stylesheet slucajno definisu.
 *
 * Ucitava se POSLEDNJI (vidi Assets::enqueueMaiaAssets) da bi pobedio i
 * vendorovane chat-bubble stilove u says.css / setup.css pri istoj specificnosti.
 *
 * NAMERNO ne postavljamo display:block na .bubble-content: bubbles.js meri
 * bubbleContent.offsetWidth da bi odredio sirinu balona (bubbles.js:267-268),
 * pa bi block naterao svaki odgovor na punu 65% sirinu.
 */

/* --- vertikalni ritam --------------------------------------------------- */
#maia-chat-bubble .bubble-content p,
#maia-chat-bubble .bubble-content ul,
#maia-chat-bubble .bubble-content ol,
#maia-chat-bubble .bubble-content pre,
#maia-chat-bubble .bubble-content blockquote,
#maia-chat-bubble .bubble-content table {
  margin: 0 0 .6em;
}

#maia-chat-bubble .bubble-content > *:first-child { margin-top: 0; }
#maia-chat-bubble .bubble-content > *:last-child  { margin-bottom: 0; }

/* --- naslovi ------------------------------------------------------------ */
#maia-chat-bubble .bubble-content h1,
#maia-chat-bubble .bubble-content h2,
#maia-chat-bubble .bubble-content h3,
#maia-chat-bubble .bubble-content h4,
#maia-chat-bubble .bubble-content h5,
#maia-chat-bubble .bubble-content h6 {
  margin: .9em 0 .35em;
  padding: 0;
  border: 0;
  font-weight: 600;
  line-height: 1.3;
  text-align: left;
  text-transform: none;
  letter-spacing: normal;
  color: inherit;
}

#maia-chat-bubble .bubble-content h1 { font-size: 1.35em; }
#maia-chat-bubble .bubble-content h2 { font-size: 1.2em; }
#maia-chat-bubble .bubble-content h3 { font-size: 1.1em; }
#maia-chat-bubble .bubble-content h4 { font-size: 1em; }
#maia-chat-bubble .bubble-content h5,
#maia-chat-bubble .bubble-content h6 { font-size: .95em; opacity: .8; }

/* --- liste -------------------------------------------------------------- */
#maia-chat-bubble .bubble-content ul,
#maia-chat-bubble .bubble-content ol { padding-left: 1.4em; }
#maia-chat-bubble .bubble-content li { margin: .15em 0; }
#maia-chat-bubble .bubble-content li > ul,
#maia-chat-bubble .bubble-content li > ol { margin: .2em 0; }

/* --- citat i separator -------------------------------------------------- */
#maia-chat-bubble .bubble-content blockquote {
  padding: .2em 0 .2em .8em;
  border-left: 3px solid rgba(0,0,0,.15);
  opacity: .85;
}

#maia-chat-bubble .bubble-content hr {
  height: 0;
  border: 0;
  border-top: 1px solid rgba(0,0,0,.15);
  margin: .9em 0;
}

/* --- tabele ------------------------------------------------------------- */
/* display:block + overflow-x daje horizontalni scroll umesto probijanja balona */
#maia-chat-bubble .bubble-content table {
  display: block;
  width: auto;
  max-width: 100%;
  overflow-x: auto;
  border-collapse: collapse;
  font-size: .95em;
}
#maia-chat-bubble .bubble-content th,
#maia-chat-bubble .bubble-content td {
  border: 1px solid rgba(0,0,0,.15);
  padding: 4px 8px;
  text-align: left;
  vertical-align: top;
}
#maia-chat-bubble .bubble-content th {
  background: rgba(0,0,0,.05);
  font-weight: 600;
}

/* --- inline elementi ---------------------------------------------------- */
#maia-chat-bubble .bubble-content a {
  color: #2271b1;
  text-decoration: underline;
}
#maia-chat-bubble .bubble-content a:hover { color: #135e96; }

#maia-chat-bubble .bubble-content strong { font-weight: 600; }
#maia-chat-bubble .bubble-content em     { font-style: italic; }
#maia-chat-bubble .bubble-content del    { opacity: .7; }

/* :not(pre) > code — blokovi koda ostaju na pravilima iz maia.css */
#maia-chat-bubble .bubble-content :not(pre) > code {
  background: rgba(0,0,0,.07);
  border-radius: 3px;
  padding: .1em .35em;
  font-size: .92em;
  word-break: break-word;
}

/* --- markdown slike ----------------------------------------------------- */
/* says.css:41 daje SVAKOM img u balonu full-bleed "photo message" tretman
   (width: calc(100% + 32px), negativne margine). marked wrapuje inline sliku u
   <p>, sto je siguran diskriminator: vracamo je u normalan tok, a kartice iz
   maia_show_image / maia_generate_image ostaju netaknute. */
#maia-chat-bubble .bubble-content p img {
  width: auto;
  max-width: 100%;
  margin: 0;
  display: inline-block;
  border-radius: 4px;
}