/* ============================================= CHAT TEXT STYLING ============================================= */ .chat-thinking { margin-bottom: 10px; padding: 10px 12px; border-radius: 10px; border: 1px dashed rgba(255, 255, 255, 0.18); background: rgba(255, 255, 255, 0.04); color: var(--muted); font-size: 12px; line-height: 1.4; } :root[data-theme="light"] .chat-thinking { border-color: rgba(16, 24, 40, 0.25); background: rgba(16, 24, 40, 0.04); } .chat-text { font-size: 14px; line-height: 1.5; word-wrap: break-word; overflow-wrap: break-word; } .chat-text :where(p, ul, ol, pre, blockquote, table) { margin: 0; } .chat-text :where(p + p, p + ul, p + ol, p + pre, p + blockquote) { margin-top: 0.75em; } .chat-text :where(ul, ol) { padding-left: 1.5em; } .chat-text :where(li + li) { margin-top: 0.25em; } .chat-text :where(a) { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; } .chat-text :where(a:hover) { opacity: 0.8; } .chat-text :where(code) { font-family: var(--mono); font-size: 0.9em; } .chat-text :where(:not(pre) > code) { background: rgba(0, 0, 0, 0.15); padding: 0.15em 0.4em; border-radius: 4px; } .chat-text :where(pre) { background: rgba(0, 0, 0, 0.15); border-radius: 6px; padding: 10px 12px; overflow-x: auto; } .chat-text :where(pre code) { background: none; padding: 0; } .chat-text :where(blockquote) { border-left: 3px solid var(--border-strong); padding-left: 12px; margin-left: 0; color: var(--muted); background: rgba(255, 255, 255, 0.02); padding: 8px 12px; border-radius: 0 var(--radius-sm) var(--radius-sm) 0; } .chat-text :where(blockquote blockquote) { margin-top: 8px; border-left-color: var(--border-hover); background: rgba(255, 255, 255, 0.03); } .chat-text :where(blockquote blockquote blockquote) { border-left-color: var(--muted-strong); background: rgba(255, 255, 255, 0.04); } :root[data-theme="light"] .chat-text :where(blockquote) { background: rgba(0, 0, 0, 0.03); } :root[data-theme="light"] .chat-text :where(blockquote blockquote) { background: rgba(0, 0, 0, 0.05); } :root[data-theme="light"] .chat-text :where(blockquote blockquote blockquote) { background: rgba(0, 0, 0, 0.04); } :root[data-theme="light"] .chat-text :where(:not(pre) > code) { background: rgba(0, 0, 0, 0.08); border: 1px solid rgba(0, 0, 0, 0.1); } :root[data-theme="light"] .chat-text :where(pre) { background: rgba(0, 0, 0, 0.05); border: 1px solid rgba(0, 0, 0, 0.1); } .chat-text :where(hr) { border: none; border-top: 1px solid var(--border); margin: 1em 0; }