/**
 * AI 内容专用样式
 *
 * 从 aiastockonline 项目移植的 AI 内容格式化样式
 * 支持段落、列表、代码块、流式输出等各种元素
 *
 * @author AIAStock Project
 * @version 1.0.0
 */

/* ================================
   AI 内容容器基础样式
   ================================ */

.ai-content {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: 15px;
    line-height: 1.8;
    color: #333;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* 确保文本节点保留换行 */
.ai-content {
    white-space: normal;
}

/* 代码块和pre保留格式 */
.ai-content pre {
    white-space: pre-wrap !important;
}

/* 聊天消息特殊样式（覆盖容器padding的影响）*/
.chat-message.ai-content,
.ai-chat-message.ai-content,
.lumina-message.ai-content {
    /* 重置内部元素的margin，让它们正常显示 */
    /* 🔥 聊天窗口使用深色主题，文字颜色改为浅色 */
    color: #e2e8f0 !important;
}

.chat-message.ai-content > *:first-child,
.ai-chat-message.ai-content > *:first-child,
.lumina-message.ai-content > *:first-child {
    margin-top: 0 !important;
}

.chat-message.ai-content > *:last-child,
.ai-chat-message.ai-content > *:last-child,
.lumina-message.ai-content > *:last-child {
    margin-bottom: 0 !important;
}

/* 确保聊天窗口中的标题正确显示换行 */
.chat-message.ai-content h1,
.chat-message.ai-content h2,
.chat-message.ai-content h3,
.ai-chat-message.ai-content h1,
.ai-chat-message.ai-content h2,
.ai-chat-message.ai-content h3,
.lumina-message.ai-content h1,
.lumina-message.ai-content h2,
.lumina-message.ai-content h3 {
    display: block !important;
    clear: both !important;
}

/* 🔥 聊天窗口标题颜色 - 深色主题浅色文字 */
.chat-message.ai-content h1,
.ai-chat-message.ai-content h1,
.lumina-message.ai-content h1 {
    color: #f0f0f0 !important;
    border-bottom-color: rgba(99, 102, 241, 0.5) !important;
}

.chat-message.ai-content h2,
.ai-chat-message.ai-content h2,
.lumina-message.ai-content h2 {
    color: #e2e8f0 !important;
    border-bottom-color: rgba(99, 102, 241, 0.3) !important;
}

.chat-message.ai-content h3,
.ai-chat-message.ai-content h3,
.lumina-message.ai-content h3 {
    color: #cbd5e1 !important;
}

/* 确保聊天窗口中的列表正确缩进 */
.chat-message.ai-content ul,
.ai-chat-message.ai-content ul,
.lumina-message.ai-content ul {
    display: block !important;
    margin-left: 0 !important;
    padding-left: 2.5em !important;
    list-style-position: outside !important;
}

.chat-message.ai-content ul li,
.ai-chat-message.ai-content ul li,
.lumina-message.ai-content ul li {
    display: list-item !important;
    margin-left: 0 !important;
    color: #e2e8f0 !important;
}

/* 🔥 聊天窗口列表标记颜色 - 使用highlight颜色 */
.chat-message.ai-content ul li::marker,
.ai-chat-message.ai-content ul li::marker,
.lumina-message.ai-content ul li::marker {
    color: #818cf8 !important;  /* 紫色高亮 */
}

/* 确保聊天窗口中的数字列表正确显示 */
.chat-message.ai-content .numbered-item,
.ai-chat-message.ai-content .numbered-item,
.lumina-message.ai-content .numbered-item {
    display: flex !important;
    margin: 1em 0 !important;
    color: #e2e8f0 !important;
}

.chat-message.ai-content .numbered-item .number,
.ai-chat-message.ai-content .numbered-item .number,
.lumina-message.ai-content .numbered-item .number {
    flex-shrink: 0 !important;
    color: #a78bfa !important;  /* 紫色高亮数字 */
}

.chat-message.ai-content .numbered-item .content,
.ai-chat-message.ai-content .numbered-item .content,
.lumina-message.ai-content .numbered-item .content {
    flex: 1 !important;
    color: #e2e8f0 !important;
}

/* 确保聊天窗口中的换行和段落正确显示 */
.chat-message.ai-content br,
.ai-chat-message.ai-content br,
.lumina-message.ai-content br {
    display: block !important;
    content: "" !important;
    margin: 0.3em 0 !important;
}

.chat-message.ai-content p,
.ai-chat-message.ai-content p,
.lumina-message.ai-content p {
    display: block !important;
    margin: 0.8em 0 !important;
    color: #e2e8f0 !important;
}

/* 🔥 聊天窗口粗体和斜体颜色 */
.chat-message.ai-content strong,
.ai-chat-message.ai-content strong,
.lumina-message.ai-content strong {
    color: #f0f0f0 !important;
}

.chat-message.ai-content em,
.ai-chat-message.ai-content em,
.lumina-message.ai-content em {
    color: #cbd5e1 !important;
}

.ai-content.dark-mode {
    color: #e0e0e0;
}

/* ================================
   段落样式
   ================================ */

.ai-content p {
    margin: 1.2em 0;
    padding: 0;
    line-height: 1.8;
}

.ai-content p:first-child {
    margin-top: 0;
}

.ai-content p:last-child {
    margin-bottom: 0;
}

/* ================================
   标题样式
   ================================ */

.ai-content h1 {
    font-size: 1.8em;
    font-weight: 700;
    margin: 1.5em 0 0.8em 0;  /* 增加上下间距 */
    color: #1a1a1a;
    border-bottom: 2px solid #e0e0e0;
    padding-bottom: 0.4em;
}

.ai-content h2 {
    font-size: 1.5em;
    font-weight: 600;
    margin: 1.2em 0 0.6em 0;  /* 增加上下间距 */
    color: #2c2c2c;
    border-bottom: 1px solid #e8e8e8;
    padding-bottom: 0.3em;
}

.ai-content h3 {
    font-size: 1.3em;
    font-weight: 600;
    margin: 1em 0 0.5em 0;  /* 增加上下间距 */
    color: #3c3c3c;
}

/* 标题后紧跟列表时，增加视觉间距 */
.ai-content h1 + ul,
.ai-content h1 + .numbered-item,
.ai-content h2 + ul,
.ai-content h2 + .numbered-item,
.ai-content h3 + ul,
.ai-content h3 + .numbered-item {
    margin-top: 1em;
}

.ai-content.dark-mode h1,
.ai-content.dark-mode h2,
.ai-content.dark-mode h3 {
    color: #f0f0f0;
}

.ai-content.dark-mode h1 {
    border-bottom-color: #404040;
}

.ai-content.dark-mode h2 {
    border-bottom-color: #383838;
}

/* ================================
   列表样式
   ================================ */

/* 无序列表 */
.ai-content ul {
    display: block;  /* 确保列表显示为块级元素 */
    margin: 0.8em 0;
    padding-left: 2.5em;  /* 增加缩进 */
    list-style-type: disc;
    list-style-position: outside;  /* 确保标记在外部 */
}

.ai-content ul li {
    display: list-item;  /* 确保显示为列表项 */
    margin: 0.5em 0;
    padding-left: 0.5em;  /* 增加项目缩进 */
    line-height: 1.7;
    text-indent: 0;  /* 确保文本不被缩进 */
}

.ai-content ul li::marker {
    color: #6366f1;
    font-size: 1em;  /* 增大标记符号 */
    font-weight: bold;
}

.ai-content.dark-mode ul li::marker {
    color: #818cf8;
}

/* 段落后的说明性列表：额外缩进一层，强调从属关系 */
.ai-content p + ul {
    padding-left: 3em;
}

/* 数字序号下的说明列表：默认不显示圆点，只保留缩进，让层级关系通过缩进体现 */
.ai-content ol + ul {
    list-style-type: none;
    padding-left: 2.5em;
}

.ai-content ol + ul li {
    padding-left: 0;
}

/* 有序列表（数字列表） */
.ai-content ol {
    display: block;
    margin: 0.8em 0;
    padding-left: 2.5em;  /* 与无序列表保持一致缩进 */
    list-style-position: outside;
}

.ai-content ol li {
    display: list-item;
    margin: 0.5em 0;
    padding-left: 0.5em;
    line-height: 1.7;
    text-indent: 0;
}

.ai-content ol li::marker {
    font-size: 1em;
    font-weight: bold;
}

.ai-content.dark-mode ol li::marker {
    color: #e5e7eb;
}

/* 数字列表（特殊样式）*/
.ai-content .numbered-item {
    display: flex;
    align-items: flex-start;
    margin: 1em 0;  /* 增加上下间距 */
    padding: 0.5em 0 0.5em 2em;  /* 左侧缩进 2em */
}

.ai-content .numbered-item .number {
    font-weight: 700;
    font-size: 1.1em;  /* 增大数字 */
    color: #6366f1;
    margin-right: 0.8em;  /* 增加间距 */
    min-width: 2em;  /* 增加最小宽度 */
    flex-shrink: 0;
}

.ai-content .numbered-item .content {
    flex: 1;
    line-height: 1.7;
    padding-left: 0.5em;  /* 内容额外缩进 */
    white-space: normal;  /* 确保正常换行 */
}

/* 数字列表内的段落和换行 */
.ai-content .numbered-item .content br {
    display: block;  /* 确保 br 标签生效 */
    content: "";
    margin: 0.3em 0;
}

.ai-content.dark-mode .numbered-item .number {
    color: #818cf8;
}

/* ================================
   嵌套列表样式
   ================================ */

/* 嵌套列表缩进和间距 */
.ai-content ul ul,
.ai-content ul ol,
.ai-content ol ul,
.ai-content ol ol {
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    padding-left: 2em;  /* 子列表额外缩进 */
}

/* 第二级列表项 */
.ai-content ul ul li,
.ai-content ul ol li,
.ai-content ol ul li,
.ai-content ol ol li {
    margin: 0.3em 0;
    list-style-type: circle;  /* 二级使用空心圆 */
}

.ai-content ul ul li::marker,
.ai-content ul ol li::marker,
.ai-content ol ul li::marker,
.ai-content ol ol li::marker {
    color: #818cf8;  /* 二级标记颜色浅一些 */
    font-size: 0.9em;
}

/* 第三级列表项 */
.ai-content ul ul ul,
.ai-content ul ul ol,
.ai-content ul ol ul,
.ai-content ul ol ol,
.ai-content ol ul ul,
.ai-content ol ul ol,
.ai-content ol ol ul,
.ai-content ol ol ol {
    padding-left: 1.8em;
}

.ai-content ul ul ul li,
.ai-content ul ul ol li,
.ai-content ul ol ul li,
.ai-content ul ol ol li,
.ai-content ol ul ul li,
.ai-content ol ul ol li,
.ai-content ol ol ul li,
.ai-content ol ol ol li {
    list-style-type: square;  /* 三级使用方块 */
}

.ai-content ul ul ul li::marker,
.ai-content ul ul ol li::marker,
.ai-content ul ol ul li::marker,
.ai-content ul ol ol li::marker,
.ai-content ol ul ul li::marker,
.ai-content ol ul ol li::marker,
.ai-content ol ol ul li::marker,
.ai-content ol ol ol li::marker {
    color: #a5b4fc;  /* 三级标记更浅 */
    font-size: 0.85em;
}

/* 深色模式的嵌套列表 */
.ai-content.dark-mode ul ul li::marker,
.ai-content.dark-mode ul ol li::marker,
.ai-content.dark-mode ol ul li::marker,
.ai-content.dark-mode ol ol li::marker {
    color: #a5b4fc;
}

.ai-content.dark-mode ul ul ul li::marker,
.ai-content.dark-mode ul ul ol li::marker,
.ai-content.dark-mode ul ol ul li::marker,
.ai-content.dark-mode ul ol ol li::marker,
.ai-content.dark-mode ol ul ul li::marker,
.ai-content.dark-mode ol ul ol li::marker,
.ai-content.dark-mode ol ol ul li::marker,
.ai-content.dark-mode ol ol ol li::marker {
    color: #c7d2fe;
}

/* 嵌套列表项之间的间距优化 */
.ai-content li > ul,
.ai-content li > ol {
    margin-top: 0.3em;  /* 子列表和父列表项内容的间距 */
}

/* 确保聊天窗口中的嵌套列表正确显示 */
.chat-message.ai-content ul ul,
.chat-message.ai-content ul ol,
.chat-message.ai-content ol ul,
.chat-message.ai-content ol ol,
.ai-chat-message.ai-content ul ul,
.ai-chat-message.ai-content ul ol,
.ai-chat-message.ai-content ol ul,
.ai-chat-message.ai-content ol ol,
.lumina-message.ai-content ul ul,
.lumina-message.ai-content ul ol,
.lumina-message.ai-content ol ul,
.lumina-message.ai-content ol ol {
    margin-left: 0 !important;
    padding-left: 2em !important;
}

/* 聊天窗口中数字序号下的说明列表：去掉圆点，仅保留缩进 */
.chat-message.ai-content ol + ul,
.ai-chat-message.ai-content ol + ul,
.lumina-message.ai-content ol + ul {
    list-style-type: none !important;
    padding-left: 2.5em !important;
}

.chat-message.ai-content ol + ul li,
.ai-chat-message.ai-content ol + ul li,
.lumina-message.ai-content ol + ul li {
    padding-left: 0 !important;
}

/* 聊天窗口中段落后的说明性列表：额外缩进并保留圆点，体现子层级 */
.chat-message.ai-content p + ul,
.ai-chat-message.ai-content p + ul,
.lumina-message.ai-content p + ul {
    padding-left: 3em !important;
}

.chat-message.ai-content ul ul ul,
.chat-message.ai-content ul ul ol,
.chat-message.ai-content ul ol ul,
.chat-message.ai-content ul ol ol,
.chat-message.ai-content ol ul ul,
.chat-message.ai-content ol ul ol,
.chat-message.ai-content ol ol ul,
.chat-message.ai-content ol ol ol,
.ai-chat-message.ai-content ul ul ul,
.ai-chat-message.ai-content ul ul ol,
.ai-chat-message.ai-content ul ol ul,
.ai-chat-message.ai-content ul ol ol,
.ai-chat-message.ai-content ol ul ul,
.ai-chat-message.ai-content ol ul ol,
.ai-chat-message.ai-content ol ol ul,
.ai-chat-message.ai-content ol ol ol,
.lumina-message.ai-content ul ul ul,
.lumina-message.ai-content ul ul ol,
.lumina-message.ai-content ul ol ul,
.lumina-message.ai-content ul ol ol,
.lumina-message.ai-content ol ul ul,
.lumina-message.ai-content ol ul ol,
.lumina-message.ai-content ol ol ul,
.lumina-message.ai-content ol ol ol {
    padding-left: 1.8em !important;
}

/* ================================
   文本格式化
   ================================ */

/* 粗体 */
.ai-content strong {
    font-weight: 700;
    color: #1a1a1a;
}

.ai-content.dark-mode strong {
    color: #f5f5f5;
}

/* 斜体 */
.ai-content em {
    font-style: italic;
    color: #4a4a4a;
}

.ai-content.dark-mode em {
    color: #d0d0d0;
}

/* ================================
   表格样式
   ================================ */

.ai-content .markdown-table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5em 0;
    font-size: 14px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    border-radius: 6px;
    overflow: hidden;
}

.ai-content .markdown-table thead {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
}

.ai-content .markdown-table th {
    padding: 12px 15px;
    text-align: left;
    font-weight: 600;
    border-right: 1px solid rgba(255, 255, 255, 0.2);
}

.ai-content .markdown-table th:last-child {
    border-right: none;
}

.ai-content .markdown-table td {
    padding: 10px 15px;
    border-bottom: 1px solid #e0e0e0;
    border-right: 1px solid #e0e0e0;
}

.ai-content .markdown-table td:last-child {
    border-right: none;
}

.ai-content .markdown-table tbody tr:nth-child(even) {
    background-color: #f9f9f9;
}

.ai-content .markdown-table tbody tr:hover {
    background-color: #f0f0f0;
    transition: background-color 0.2s;
}

.ai-content.dark-mode .markdown-table {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

.ai-content.dark-mode .markdown-table thead {
    background: linear-gradient(135deg, #4a5568 0%, #2d3748 100%);
}

.ai-content.dark-mode .markdown-table td {
    border-bottom-color: #404040;
    border-right-color: #404040;
}

.ai-content.dark-mode .markdown-table tbody tr:nth-child(even) {
    background-color: #2a2a2a;
}

.ai-content.dark-mode .markdown-table tbody tr:hover {
    background-color: #353535;
}

/* 🔥 聊天窗口表格颜色 - 深色主题 */
.chat-message.ai-content .markdown-table,
.ai-chat-message.ai-content .markdown-table,
.lumina-message.ai-content .markdown-table {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
    background: rgba(15, 23, 42, 0.6) !important;
}

.chat-message.ai-content .markdown-table thead,
.ai-chat-message.ai-content .markdown-table thead,
.lumina-message.ai-content .markdown-table thead {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: white !important;
}

.chat-message.ai-content .markdown-table th,
.ai-chat-message.ai-content .markdown-table th,
.lumina-message.ai-content .markdown-table th {
    color: white !important;
    border-right: 1px solid rgba(255, 255, 255, 0.2) !important;
}

.chat-message.ai-content .markdown-table td,
.ai-chat-message.ai-content .markdown-table td,
.lumina-message.ai-content .markdown-table td {
    color: #e2e8f0 !important;
    border-bottom: 1px solid rgba(99, 102, 241, 0.2) !important;
    border-right: 1px solid rgba(99, 102, 241, 0.2) !important;
    background: rgba(30, 41, 59, 0.3) !important;
}

.chat-message.ai-content .markdown-table tbody tr:nth-child(even) td,
.ai-chat-message.ai-content .markdown-table tbody tr:nth-child(even) td,
.lumina-message.ai-content .markdown-table tbody tr:nth-child(even) td {
    background: rgba(30, 41, 59, 0.5) !important;
}

.chat-message.ai-content .markdown-table tbody tr:hover td,
.ai-chat-message.ai-content .markdown-table tbody tr:hover td,
.lumina-message.ai-content .markdown-table tbody tr:hover td {
    background: rgba(99, 102, 241, 0.15) !important;
}

/* ================================
   代码样式
   ================================ */

/* 行内代码 */
.ai-content code {
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
    font-size: 0.9em;
    background-color: #f5f5f5;
    color: #e01e5a;
    padding: 0.2em 0.4em;
    border-radius: 3px;
    border: 1px solid #e0e0e0;
}

.ai-content.dark-mode code {
    background-color: #2d2d2d;
    color: #ff6b9d;
    border-color: #404040;
}

/* 代码块 */
.ai-content pre {
    background-color: #f8f8f8;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    padding: 1em;
    margin: 1em 0;
    overflow-x: auto;
    line-height: 1.5;
    white-space: pre-wrap;  /* 代码块保留格式 */
    word-break: break-word;
}

.ai-content pre code {
    background-color: transparent;
    color: #24292e;
    padding: 0;
    border: none;
    font-size: 0.9em;
    display: block;
}

.ai-content.dark-mode pre {
    background-color: #1e1e1e;
    border-color: #404040;
}

.ai-content.dark-mode pre code {
    color: #d4d4d4;
}

/* 🔥 聊天窗口代码块颜色 - 深色主题 */
.chat-message.ai-content code,
.ai-chat-message.ai-content code,
.lumina-message.ai-content code {
    background-color: rgba(30, 41, 59, 0.8) !important;
    color: #fbbf24 !important;  /* 金色高亮 */
    border: 1px solid rgba(99, 102, 241, 0.3) !important;
}

.chat-message.ai-content pre,
.ai-chat-message.ai-content pre,
.lumina-message.ai-content pre {
    background-color: #0d1117 !important;
    border: 1px solid rgba(99, 102, 241, 0.3) !important;
}

.chat-message.ai-content pre code,
.ai-chat-message.ai-content pre code,
.lumina-message.ai-content pre code {
    background-color: transparent !important;
    color: #c9d1d9 !important;
    border: none !important;
}

/* ================================
   Highlight.js 代码高亮增强
   ================================ */

/* 确保highlight.js样式与AI内容容器协调 */
.ai-content pre code.hljs {
    display: block;
    padding: 0;  /* pre已有padding */
    background-color: transparent;  /* 使用pre的背景色 */
    border: none;
    line-height: 1.6;
}

/* GitHub Dark主题适配（增强对比度）*/
.ai-content pre code.hljs {
    background: #0d1117;
    color: #c9d1d9;
}

/* 关键词 */
.ai-content .hljs-keyword,
.ai-content .hljs-selector-tag,
.ai-content .hljs-built_in {
    color: #ff7b72;
}

/* 字符串 */
.ai-content .hljs-string,
.ai-content .hljs-doctag {
    color: #a5d6ff;
}

/* 数字 */
.ai-content .hljs-number,
.ai-content .hljs-literal {
    color: #79c0ff;
}

/* 函数和类名 */
.ai-content .hljs-title,
.ai-content .hljs-title.function_,
.ai-content .hljs-title.class_ {
    color: #d2a8ff;
}

/* 注释 */
.ai-content .hljs-comment,
.ai-content .hljs-quote {
    color: #8b949e;
    font-style: italic;
}

/* 变量和属性 */
.ai-content .hljs-variable,
.ai-content .hljs-attr,
.ai-content .hljs-attribute {
    color: #ffa657;
}

/* 元数据和装饰器 */
.ai-content .hljs-meta,
.ai-content .hljs-meta .hljs-keyword {
    color: #ff7b72;
}

/* 标签 */
.ai-content .hljs-tag {
    color: #7ee787;
}

/* 符号和操作符 */
.ai-content .hljs-operator,
.ai-content .hljs-punctuation {
    color: #c9d1d9;
}

/* 语言特定样式 */
.ai-content .hljs-section,
.ai-content .hljs-selector-class,
.ai-content .hljs-selector-id {
    color: #79c0ff;
}

/* 正则表达式 */
.ai-content .hljs-regexp,
.ai-content .hljs-symbol {
    color: #a5d6ff;
}

/* 深色模式增强 */
.ai-content.dark-mode pre code.hljs {
    background: #0d1117;
    color: #c9d1d9;
}

/* 🔥 聊天窗口代码高亮颜色确保 */
.chat-message.ai-content pre code.hljs,
.ai-chat-message.ai-content pre code.hljs,
.lumina-message.ai-content pre code.hljs {
    background: #0d1117 !important;
    color: #c9d1d9 !important;
}

/* 聊天窗口关键词颜色增强 */
.chat-message.ai-content .hljs-keyword,
.chat-message.ai-content .hljs-selector-tag,
.chat-message.ai-content .hljs-built_in,
.ai-chat-message.ai-content .hljs-keyword,
.ai-chat-message.ai-content .hljs-selector-tag,
.ai-chat-message.ai-content .hljs-built_in,
.lumina-message.ai-content .hljs-keyword,
.lumina-message.ai-content .hljs-selector-tag,
.lumina-message.ai-content .hljs-built_in {
    color: #ff7b72 !important;
}

.chat-message.ai-content .hljs-string,
.chat-message.ai-content .hljs-doctag,
.ai-chat-message.ai-content .hljs-string,
.ai-chat-message.ai-content .hljs-doctag,
.lumina-message.ai-content .hljs-string,
.lumina-message.ai-content .hljs-doctag {
    color: #a5d6ff !important;
}

.chat-message.ai-content .hljs-number,
.chat-message.ai-content .hljs-literal,
.ai-chat-message.ai-content .hljs-number,
.ai-chat-message.ai-content .hljs-literal,
.lumina-message.ai-content .hljs-number,
.lumina-message.ai-content .hljs-literal {
    color: #79c0ff !important;
}

.chat-message.ai-content .hljs-title,
.chat-message.ai-content .hljs-title.function_,
.chat-message.ai-content .hljs-title.class_,
.ai-chat-message.ai-content .hljs-title,
.ai-chat-message.ai-content .hljs-title.function_,
.ai-chat-message.ai-content .hljs-title.class_,
.lumina-message.ai-content .hljs-title,
.lumina-message.ai-content .hljs-title.function_,
.lumina-message.ai-content .hljs-title.class_ {
    color: #d2a8ff !important;
}

.chat-message.ai-content .hljs-comment,
.chat-message.ai-content .hljs-quote,
.ai-chat-message.ai-content .hljs-comment,
.ai-chat-message.ai-content .hljs-quote,
.lumina-message.ai-content .hljs-comment,
.lumina-message.ai-content .hljs-quote {
    color: #8b949e !important;
}

.chat-message.ai-content .hljs-variable,
.chat-message.ai-content .hljs-attr,
.chat-message.ai-content .hljs-attribute,
.ai-chat-message.ai-content .hljs-variable,
.ai-chat-message.ai-content .hljs-attr,
.ai-chat-message.ai-content .hljs-attribute,
.lumina-message.ai-content .hljs-variable,
.lumina-message.ai-content .hljs-attr,
.lumina-message.ai-content .hljs-attribute {
    color: #ffa657 !important;
}

/* 代码块语言标签（可选：显示语言名称）*/
.ai-content pre[class*="language-"]::before {
    content: attr(data-language);
    display: block;
    text-align: right;
    font-size: 0.7em;
    color: #8b949e;
    margin-bottom: 0.5em;
    text-transform: uppercase;
}

/* ================================
   流式输出样式
   ================================ */

/* 流式光标动画 */
.ai-content .streaming-cursor {
    display: inline-block;
    font-weight: 700;
    color: #2196F3;
    animation: streaming-blink 1s infinite;
    margin-left: 2px;
}

@keyframes streaming-blink {
    0%, 50% {
        opacity: 1;
    }
    51%, 100% {
        opacity: 0;
    }
}

/* 流式输出容器 */
.ai-content.streaming {
    position: relative;
}

.ai-content.streaming::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 4px;
    height: 100%;
    background: linear-gradient(to top, rgba(33, 150, 243, 0.3), transparent);
    animation: streaming-progress 2s ease-in-out infinite;
}

@keyframes streaming-progress {
    0%, 100% {
        opacity: 0.3;
    }
    50% {
        opacity: 0.8;
    }
}

/* 完成状态 */
.ai-content.complete {
    animation: fade-in 0.3s ease-in;
}

@keyframes fade-in {
    from {
        opacity: 0.8;
    }
    to {
        opacity: 1;
    }
}

/* ================================
   特殊面板样式（从 aiastockonline 移植）
   ================================ */

/* 统一语音状态面板 */
.unified-voice-status-panel {
    background: rgba(0, 0, 0, 0.85);
    border-radius: 10px;
    padding: 12px;
    margin: 8px 0;
    backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.unified-voice-status-panel.dark-mode {
    background: rgba(20, 20, 20, 0.9);
    border-color: rgba(255, 255, 255, 0.15);
}

/* ASR 文本显示（语音识别结果）*/
.asr-text-display {
    margin-bottom: 12px;
    padding: 10px;
    background: rgba(0, 100, 200, 0.1);
    border-radius: 8px;
    border: 1px solid rgba(0, 150, 255, 0.3);
    font-size: 14px;
    line-height: 1.5;
    color: #0066cc;
    min-height: 40px;
}

.asr-text-display.dark-mode {
    background: rgba(0, 100, 200, 0.15);
    border-color: rgba(0, 150, 255, 0.4);
    color: #66b3ff;
}

.asr-text-display.empty {
    opacity: 0.5;
    font-style: italic;
}

/* AI 响应显示区域 */
.ai-response-display {
    padding: 12px;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 8px;
    border: 1px solid rgba(100, 200, 100, 0.3);
    min-height: 60px;
    max-height: 400px;
    overflow-y: auto;
}

.ai-response-display.dark-mode {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(100, 200, 100, 0.4);
}

/* ================================
   滚动条样式
   ================================ */

.ai-content::-webkit-scrollbar,
.ai-response-display::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.ai-content::-webkit-scrollbar-track,
.ai-response-display::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.05);
    border-radius: 3px;
}

.ai-content::-webkit-scrollbar-thumb,
.ai-response-display::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 3px;
}

.ai-content::-webkit-scrollbar-thumb:hover,
.ai-response-display::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.3);
}

.ai-content.dark-mode::-webkit-scrollbar-track,
.ai-response-display.dark-mode::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.05);
}

.ai-content.dark-mode::-webkit-scrollbar-thumb,
.ai-response-display.dark-mode::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2);
}

.ai-content.dark-mode::-webkit-scrollbar-thumb:hover,
.ai-response-display.dark-mode::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.3);
}

/* ================================
   移动端适配
   ================================ */

@media (max-width: 768px) {
    .ai-content {
        font-size: 14px;
        line-height: 1.5;
    }

    .ai-content h1 {
        font-size: 1.5em;
    }

    .ai-content h2 {
        font-size: 1.3em;
    }

    .ai-content h3 {
        font-size: 1.15em;
    }

    .ai-content ul {
        padding-left: 2em;  /* 保持缩进 */
    }

    .ai-content ul li {
        padding-left: 0.3em;
    }

    .ai-content .numbered-item {
        padding-left: 1.5em;  /* 移动端缩进稍小 */
    }

    .ai-content .numbered-item .number {
        min-width: 1.8em;
        margin-right: 0.6em;
        font-size: 1em;
    }

    .ai-content .numbered-item .content {
        padding-left: 0.3em;
    }

    .ai-content pre {
        padding: 0.8em;
        font-size: 0.85em;
    }

    .ai-response-display {
        max-height: 300px;
        padding: 10px;
    }
}

/* 超小屏幕（手机竖屏）*/
@media (max-width: 480px) {
    .ai-content {
        font-size: 13px;
    }

    .ai-content h1 {
        font-size: 1.4em;
    }

    .ai-content h2 {
        font-size: 1.2em;
    }

    .ai-content h3 {
        font-size: 1.1em;
    }

    .unified-voice-status-panel {
        padding: 10px;
    }

    .asr-text-display {
        padding: 8px;
        font-size: 13px;
    }

    .ai-response-display {
        padding: 8px;
        max-height: 250px;
    }
}

/* ================================
   打印样式
   ================================ */

@media print {
    .ai-content .streaming-cursor {
        display: none;
    }

    .ai-content.streaming::after {
        display: none;
    }

    .ai-content {
        color: #000;
    }

    .ai-content code {
        border: 1px solid #ccc;
    }

    .ai-content pre {
        border: 1px solid #ccc;
        page-break-inside: avoid;
    }
}

/* ================================
   可访问性增强
   ================================ */

/* 高对比度模式 */
@media (prefers-contrast: high) {
    .ai-content {
        color: #000;
    }

    .ai-content code {
        border-width: 2px;
    }

    .ai-content pre {
        border-width: 2px;
    }

    .ai-content .numbered-item .number {
        font-weight: 900;
    }
}

/* 减少动画（用户偏好）*/
@media (prefers-reduced-motion: reduce) {
    .streaming-cursor {
        animation: none;
    }

    .ai-content.streaming::after {
        animation: none;
    }

    .ai-content.complete {
        animation: none;
    }
}
