/* ═══ B平台加载动画适配（自动注入）═══ */
.flex.items-center.justify-center.size-6 { opacity: 1 !important; }
.flex.items-center.justify-center.size-6 > .flex.gap-2 { display: none !important; }
.is-assistant.w-fit { width: 100% !important; }
.is-assistant > .border.border-muted:has(.flex.items-center.justify-center.size-6) {
  width: 100% !important; background: transparent !important;
  border: none !important; padding: 0 !important;
}
.is-assistant .space-y-3:has(.flex.items-center.justify-center.size-6) {
  display: flex; justify-content: center; width: 100%;
}

/* ═══ B平台表格修正（自动注入）═══ */
.rili-markdown-renderer table { display:table!important; table-layout:auto!important; width:100%!important; border-collapse:collapse!important; }
.rili-markdown-renderer table caption { display:table-caption!important; caption-side:top!important; text-align:center!important; padding:8px!important; }
.rili-markdown-renderer thead { display:table-header-group!important; }
.rili-markdown-renderer tbody { display:table-row-group!important; }
.rili-markdown-renderer tr { display:table-row!important; }
.rili-markdown-renderer th, .rili-markdown-renderer td { display:table-cell!important; }

/* ═══ B平台按钮组保护（自动注入 — 防止按钮消失）═══
   原理：B平台消息操作按钮结构为：
   .flex.items-center.gap-1.ml-auto (hover显隐包装)
     └── .bg-muted.rounded.flex.p-0.5 (按钮组容器)
           └── button.rounded-full.size-7 (单个按钮)
   以下规则使用高specificity + !important确保按钮
   不被任何转换后/透传的CSS规则意外隐藏
   ═══════════════════════════════════════════════ */
/* 按钮组容器保护 */
.w-full.h-full.flex.group .bg-muted.rounded.flex.p-0\.5,
.is-user .bg-muted.rounded.flex.p-0\.5,
.is-assistant .bg-muted.rounded.flex.p-0\.5 {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  overflow: visible !important;
  position: relative !important;
  width: auto !important;
  height: auto !important;
  max-height: none !important;
  pointer-events: auto !important;
  clip: auto !important;
  clip-path: none !important;
}
/* 单个按钮保护 */
.w-full.h-full.flex.group .bg-muted.rounded.flex.p-0\.5 > button,
.is-user .bg-muted.rounded.flex.p-0\.5 > button,
.is-assistant .bg-muted.rounded.flex.p-0\.5 > button {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  position: relative !important;
  clip: auto !important;
  clip-path: none !important;
}
/* hover显隐包装层保护 — 仅保留B平台原生的opacity过渡 */
.flex.items-center.gap-1.ml-auto.md\:opacity-0.group-hover\:opacity-100 {
  visibility: visible !important;
  display: flex !important;
  pointer-events: auto !important;
  overflow: visible !important;
}
/* 操作行保护 */
.flex.w-full.items-center.justify-between.gap-2.px-2 {
  display: flex !important;
  visibility: visible !important;
  overflow: visible !important;
}

/* ═══ B平台顶部栏适配说明（自动注入）═══
   A: div.sticky > div.flex.justify-between
      ├── 左侧空区
      ├── #ai-model-selector (居中)
      └── 右侧工具(设置按钮等)
   B: <header.flex.justify-between>
      ├── #nav-left (侧边栏开关)
      ├── #nav-middle (可能为空)
      └── #nav-right (通知/主题/语言)
   B平台模型按钮不在header内，选择器:
   button:has(> .flex-1.truncate.text-left)
   ═══════════════════════════════════════ */
header.flex.justify-between { position: relative; overflow: visible; }

/* =========================================
   大唐贞观主题 - 界面全局美化 (兼容多端)
   ========================================= */

/* 1. 顶部栏：卷轴画卷顶端质感 */
header.flex.justify-between {
    background-color: #f4e8d3 !important;
    background-image: radial-gradient(circle at 50% 50%, #f4e8d3 0%, #e3d0b3 100%) !important;
    border-bottom: 2px solid #5c4738 !important; /* 墨线分割 */
    box-shadow: 0 4px 12px rgba(60, 40, 20, 0.15) !important;
}

/* 顶部栏文本：模型名称等采用加粗宋体 */
#nav-middle button:has(> .flex-1.truncate.text-left) .flex-1.truncate.text-left {
    color: #1a1512 !important; /* 浓墨色 */
    font-family: 'Noto Serif SC', 'Songti SC', 'STSong', '宋体', serif !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    letter-spacing: 1px !important;
}

/* 顶部栏图标 (历史记录、设置、下拉箭头等) 统一为枯墨色 */
#nav-middle .shrink-0.flex.items-center svg,
header.flex.justify-between.w-full.top-0 svg.lucide-clock-8,
#nav-right button svg,
header.flex.justify-between.w-full.top-0 button.MuiIconButton-root svg.lucide-music-2,
header.flex.justify-between.w-full.top-0 svg:has(use[href="#icon-icon-set"]) {
    color: #5c4738 !important;
    transition: color 0.3s ease, transform 0.3s ease !important;
}

/* 顶部栏图标悬浮效果：透出朱砂红 */
#nav-right button:hover svg,
#nav-middle .group.flex.items-center:hover svg {
    color: #8b2621 !important;
    transform: scale(1.1) !important;
}

/* 2. 底部栏外层遮罩：渐变过渡到宣纸底色 */
.bg-gradient-to-t {
    background: linear-gradient(to top, #f4e8d3 60%, transparent 100%) !important;
}

/* 3. 底部输入框容器：古籍双线边框 */
#ai-chat-bottom-input {
    background-color: #f4e8d3 !important;
    background-image: linear-gradient(90deg, rgba(139, 69, 19, 0.02) 0%, rgba(139, 69, 19, 0) 50%, rgba(139, 69, 19, 0.02) 100%) !important;
    border: 3px double #5c4738 !important;
    border-radius: 4px !important;
    box-shadow: 0 4px 16px rgba(60, 40, 20, 0.15) !important;
    transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
}

/* 输入框聚焦时：边框泛出朱砂色，犹如朱笔御批 */
#ai-chat-bottom-input:focus-within {
    border-color: #8b2621 !important;
    box-shadow: 0 4px 20px rgba(139, 38, 33, 0.2) !important;
}

/* 4. 输入框内文字：高对比度，绝对清晰 */
#ai-chat-input {
    color: #1a1512 !important; /* 浓墨 */
    font-family: 'Noto Serif SC', 'Songti SC', 'STSong', '宋体', serif !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    line-height: 1.6 !important;
}

/* 输入框占位符 (Placeholder)：采用楷体，呈现古人题词感 */
#ai-chat-input::placeholder {
    color: #8c7b70 !important; /* 淡墨色 */
    font-family: 'Kaiti', 'STKaiti', '楷体', serif !important;
    font-weight: normal !important;
}

/* 文字选中效果：朱砂底金字 */
#ai-chat-input::selection {
    background-color: rgba(139, 38, 33, 0.85) !important;
    color: #f4e8d3 !important;
}

/* 5. 底部按钮组 (Mod按钮/流式按钮等)：古代活字印刷刻板质感 */
#ai-mod-button2 button.MuiButton-root {
    background-color: #f4e8d3 !important;
    border: 1px solid #5c4738 !important;
    color: #1a1512 !important;
    font-family: 'Noto Serif SC', 'Songti SC', '宋体', serif !important;
    font-weight: 700 !important;
    border-radius: 2px !important; /* 方正的刻板感 */
    /* 模拟活字凸起的立体阴影 */
    box-shadow: 2px 2px 0px rgba(92, 71, 56, 0.5) !important; 
    transition: all 0.15s ease !important;
    margin: 0 4px !important;
    padding: 4px 12px !important;
}

/* 按钮内图标颜色同步 */
#ai-mod-button2 button.MuiButton-root svg {
    color: inherit !important;
}

/* 按钮点击/悬浮交互：按下刻板，印出朱红色 */
#ai-mod-button2 button.MuiButton-root:hover,
#ai-mod-button2 button.MuiButton-root:active {
    background-color: #e3d0b3 !important;
    border-color: #8b2621 !important;
    color: #8b2621 !important;
    /* 阴影收缩，产生按压下去的物理感 */
    box-shadow: 0px 0px 0px rgba(139, 38, 33, 0.5) !important; 
    transform: translate(2px, 2px) !important; 
}
/* 1. 隐藏默认顶部破坏古风氛围的现代颜色条 */
[class*="bg-[#F1CBCB]"], 
[class*="bg-[#c9e1e9]"] {
    display: none !important;
}

/* 2. 聊天框主体：大唐宣纸与古籍装帧质感 */
.is-user > .border.border-muted,
.is-assistant > .border.border-muted {
    /* 泛黄宣纸渐变背景 */
    background-color: #f4e8d3 !important;
    background-image: 
        linear-gradient(90deg, rgba(139, 69, 19, 0.03) 0%, rgba(139, 69, 19, 0) 50%, rgba(139, 69, 19, 0.03) 100%),
        radial-gradient(circle at 50% 50%, #f4e8d3 0%, #e3d0b3 100%) !important;
    /* 古籍双线墨色边框 */
    border: 3px double #5c4738 !important;
    border-radius: 2px !important;
    box-shadow: 2px 4px 12px rgba(60, 40, 20, 0.15), inset 0 0 20px rgba(139, 69, 19, 0.04) !important;
    padding: 16px 20px !important;
    position: relative !important;
    isolation: isolate !important;
}

/* 3. 贞观年号朱砂印章水印 (绝对不影响阅读的极低透明度) */
.is-user > .border.border-muted,
.is-assistant > .border.border-muted::after {
    content: "贞观" !important;
    position: absolute !important;
    bottom: 12px !important;
    right: 20px !important;
    font-size: 48px !important;
    font-family: 'Kaiti', 'STKaiti', '楷体', serif !important;
    color: rgba(186, 40, 40, 0.06) !important; /* 极淡的朱砂红 */
    border: 3px solid rgba(186, 40, 40, 0.06) !important;
    padding: 4px 8px !important;
    transform: rotate(-10deg) !important;
    z-index: -1 !important;
    pointer-events: none !important;
    letter-spacing: 4px !important;
}

/* 4. 正文文本：加粗古籍字体，浓墨高对比度，确保绝对清晰 */
.rili-markdown-renderer {
    color: #1a1512 !important; /* 浓墨色，极高对比度 */
    font-family: 'Noto Serif SC', 'Songti SC', 'STSong', 'SimSun', '宋体', serif !important; /* 强制宋体类古风字体 */
    font-weight: 700 !important; /* 强制加粗 */
    line-height: 1.85 !important;
    letter-spacing: 0.8px !important;
    background: transparent !important;
    z-index: 1 !important;
    text-shadow: none !important; /* 严禁文字阴影，保证边缘锐利可读 */
}

/* 引用块美化：类似古书中的朱批注解 */
.rili-markdown-renderer blockquote {
    border-left: 4px solid #8b2621 !important; /* 朱砂红 */
    background: rgba(139, 38, 33, 0.04) !important;
    color: #4a3728 !important;
    padding: 8px 12px !important;
    margin: 10px 0 !important;
}

/* 5. 底部附加元素：融入古风色调 */
/* 底部操作按钮 (复制, 编辑等) - 朱砂色 */
.bg-muted.rounded.flex.p-0\.5 > button.rounded-full.size-7{
    color: #8b2621 !important; 
    font-family: 'Noto Serif SC', 'Songti SC', serif !important;
    font-weight: 700 !important;
    transition: all 0.3s ease !important;
}
.bg-muted.rounded.flex.p-0\.5 > button.rounded-full.size-7{
    background-color: rgba(139, 38, 33, 0.1) !important;
}

/* 模型名称文本 - 枯墨色 */
.flex.items-center.gap-2.text-xs.font-mono.text-muted-foreground {
    color: #6a5749 !important;
    font-family: 'Kaiti', 'STKaiti', serif !important;
}

/* Token消耗文本 - 暗金色 */
/* [Token消耗hover逻辑转换未启用]
.text-orange-500 {
    color: #9e7a46 !important; 
    font-weight: bold !important;
}
*/

/* 6. 沉浸式加载动画：水墨与朱砂交融的SMIL矢量动效 (即使禁用CSS动画依然生效) */
/* 隐藏现代点状加载 */
.style-module__AtdJSq__dot-flashing.style-module__AtdJSq__text {
    display: none !important;
}
/* 注入古风加载动画 */
.flex.items-center.justify-center.size-6 {
    position: relative !important;
}
.flex.items-center.justify-center.size-6::before {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 26px !important;
    height: 26px !important;
    /* 内联SVG：外圈朱砂流转，内圈水墨呼吸 */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Ccircle cx='50' cy='50' r='40' fill='none' stroke='%238b2621' stroke-width='6' stroke-dasharray='180 80' stroke-linecap='round'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 50 50' to='360 50 50' dur='2.5s' repeatCount='indefinite' /%3E%3C/circle%3E%3Ccircle cx='50' cy='50' r='15' fill='%231a1512'%3E%3Canimate attributeName='opacity' values='0.3;0.9;0.3' dur='2s' repeatCount='indefinite' /%3E%3Canimate attributeName='r' values='12;18;12' dur='2s' repeatCount='indefinite' /%3E%3C/circle%3E%3C/svg%3E") !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
}

/* 移动端细微适配 */
@media(max-width: 480px) {
    .is-user > .border.border-muted,
.is-assistant > .border.border-muted {
        padding: 12px 14px !important;
    }
    .is-user > .border.border-muted,
.is-assistant > .border.border-muted::after {
        font-size: 36px !important;
        right: 10px !important;
    }
}
/* =========================================
   大唐贞观主题 - 状态栏(卷宗)全局美化
   ========================================= */

/* 1. 状态栏外层主容器 (折子/卷宗外观) */
.rili-markdown-renderer details {
    background-color: #f4e8d3 !important;
    background-image: linear-gradient(120deg, #f4e8d3 0%, #faefe0 50%, #f4e8d3 100%) !important;
    border: 1px solid #5c4738 !important;
    border-radius: 4px !important;
    margin-bottom: 12px !important;
    box-shadow: 2px 2px 6px rgba(92, 71, 56, 0.12) !important;
    overflow: hidden !important;
    transition: all 0.3s ease !important;
    /* 统一文字基础属性 */
    font-family: 'Noto Serif SC', 'Songti SC', 'STSong', '宋体', serif !important;
    color: #2b231d !important; 
    line-height: 1.7 !important;
    font-size: 14.5px !important;
}

/* 展开状态下，底部留出呼吸空间 */
.rili-markdown-renderer details[open] {
    padding-bottom: 12px !important;
}

/* 2. 标题栏 (卷宗签条) */
.rili-markdown-renderer details > summary {
    display: flex !important;
    align-items: center !important;
    padding: 10px 16px !important;
    font-family: 'Noto Serif SC', 'Songti SC', 'STSong', '宋体', serif !important;
    font-size: 16px !important;
    font-weight: 900 !important;
    color: #1a1512 !important; /* 浓墨 */
    cursor: pointer !important;
    user-select: none !important;
    background-color: rgba(92, 71, 56, 0.04) !important;
    list-style: none !important; /* 隐藏默认三角形 */
    transition: background-color 0.2s ease, color 0.2s ease !important;
}

/* 隐藏部分浏览器默认的 marker */
.rili-markdown-renderer details > summary::-webkit-details-marker {
    display: none !important;
}

/* 标题栏悬浮效果：透出朱红色 */
.rili-markdown-renderer details > summary:hover {
    background-color: rgba(139, 38, 33, 0.06) !important;
    color: #8b2621 !important;
}

/* 自定义右侧展开/折叠指示器 */
.rili-markdown-renderer details > summary::after {
    content: '▼' !important;
    margin-left: auto !important;
    font-size: 12px !important;
    color: #5c4738 !important;
    transition: transform 0.3s ease, color 0.3s ease !important;
}

/* 展开时的标题栏状态 */
.rili-markdown-renderer details[open] > summary {
    border-bottom: 1px dashed rgba(92, 71, 56, 0.4) !important;
    margin-bottom: 12px !important;
}
.rili-markdown-renderer details[open] > summary::after {
    transform: rotate(180deg) !important;
    color: #8b2621 !important; /* 展开后箭头变红 */
}

/* 3. 内部排版优化 (约束边距，防止贴边) */
.rili-markdown-renderer details > p,
.rili-markdown-renderer details > div,
.rili-markdown-renderer details > ul,
.rili-markdown-renderer details > ol,
.rili-markdown-renderer details > blockquote {
    padding: 0 16px !important;
    margin-top: 6px !important;
    margin-bottom: 8px !important;
}

/* 4. 朱批高亮 (所有加粗的属性名，如 "姓名:" "体魄:") */
.rili-markdown-renderer details strong,
.rili-markdown-renderer details b {
    color: #8b2621 !important; /* 朱砂红 */
    font-weight: 900 !important;
    margin-right: 4px !important;
    letter-spacing: 0.5px !important;
}

/* 5. 列表美化 (无序列表变为中式点阵) */
.rili-markdown-renderer details ul {
    list-style-type: none !important;
    padding-left: 32px !important;
}
.rili-markdown-renderer details ul li {
    position: relative !important;
    margin-bottom: 6px !important;
}
.rili-markdown-renderer details ul li::before {
    content: '▪' !important;
    position: absolute !important;
    left: -16px !important;
    color: #8b2621 !important;
    font-size: 12px !important;
    top: 2px !important;
}

/* 6. 分割线 (墨痕) */
.rili-markdown-renderer details hr {
    border: none !important;
    border-top: 1px solid rgba(92, 71, 56, 0.6) !important;
    border-bottom: 1px solid rgba(92, 71, 56, 0.2) !important;
    height: 3px !important;
    margin: 16px 16px !important;
    background: transparent !important;
}

/* 7. 表格美化 (古代账册风格) */
.rili-markdown-renderer details table {
    width: calc(100% - 32px) !important;
    margin: 8px 16px 16px 16px !important;
    border-collapse: collapse !important;
    border: 2px solid #5c4738 !important; /* 外框粗墨线 */
}
.rili-markdown-renderer details th,
.rili-markdown-renderer details td {
    border: 1px solid rgba(92, 71, 56, 0.4) !important; /* 内框细墨线 */
    padding: 8px 10px !important;
    text-align: left !important;
    font-size: 13.5px !important;
}
.rili-markdown-renderer details th {
    background-color: rgba(92, 71, 56, 0.1) !important;
    color: #1a1512 !important;
    font-weight: 900 !important;
}
.rili-markdown-renderer details td {
    background-color: rgba(255, 255, 255, 0.3) !important; /* 提升表格内容可读性 */
}

/* 8. 嵌套的二级状态栏 (如史书篡改度内的折叠项) */
.rili-markdown-renderer details details,
.rili-markdown-renderer details .sub-details {
    background-image: none !important;
    background-color: rgba(255, 255, 255, 0.4) !important; /* 背景变浅以示层级 */
    border: 1px dashed rgba(92, 71, 56, 0.5) !important;
    box-shadow: none !important;
    margin: 8px 16px 12px 16px !important;
    border-radius: 2px !important;
}
.rili-markdown-renderer details details > summary {
    font-size: 14.5px !important;
    padding: 8px 12px !important;
}