/* ===== 古风主题 - 完整美化方案（紧凑版） ===== */
/* 整合聊天框、代码块和紧凑状态栏美化 */

/* ===== 第一部分：聊天框美化 ===== */
/* 统一聊天框样式 */
.bg-gray-100\/90.relative.inline-block {
  background: linear-gradient(135deg, #f5f1e9 0%, #e8e0d1 100%) !important;
  border: 1px solid #d4c9b8 !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 20px rgba(139, 107, 70, 0.15) !important;
  padding: 16px !important;
  margin: 12px 0 !important;
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

/* 聊天框顶部装饰条隐藏 */
[class*="bg-[#F1CBCB]"], 
[class*="bg-[#c9e1e9]"] {
    display: none !important;
}

/* 聊天框古风背景装饰 */
.bg-gray-100\/90.relative.inline-block::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background-image: 
    radial-gradient(circle at 10% 20%, rgba(210, 180, 140, 0.1) 0%, transparent 20%),
    radial-gradient(circle at 90% 80%, rgba(160, 120, 80, 0.08) 0%, transparent 20%) !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

.bg-gray-100\/90.relative.inline-block::after {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background: 
    linear-gradient(90deg, transparent 95%, rgba(160, 120, 80, 0.1) 100%),
    linear-gradient(0deg, transparent 95%, rgba(160, 120, 80, 0.1) 100%) !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

/* 聊天框内文字样式 */
.markdown-body {
  color: #5c4a3a !important;
  font-family: "Microsoft YaHei", "SimSun", serif !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
  position: relative !important;
  z-index: 1 !important;
  background: transparent !important;
}

/* 聊天框底部按钮美化 */
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary {
  color: #8b6b46 !important;
  font-family: "Microsoft YaHei", serif !important;
  font-size: 13px !important;
  padding: 4px 8px !important;
  border-radius: 4px !important;
  transition: all 0.3s ease !important;
}

.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary:hover {
  background-color: rgba(139, 107, 70, 0.1) !important;
  color: #6b4f32 !important;
}

/* 模型名称和Token消耗文本 */
.MuiTypography-root.MuiTypography-body2.css-6c0gf2,
.text-orange-500 {
  color: #8b6b46 !important;
  font-family: "Microsoft YaHei", serif !important;
  font-size: 12px !important;
  opacity: 0.8 !important;
}

/* 加载动画替换为古风样式 */
.style_dot-flashing__8L91Q.style_text__zGhNq {
  display: none !important;
}

.flex.items-center.justify-center.w-6.h-5 {
  position: relative !important;
  width: 24px !important;
  height: 24px !important;
}

.flex.items-center.justify-center.w-6.h-5::before {
  content: '' !important;
  position: absolute !important;
  width: 20px !important;
  height: 20px !important;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%238b6b46" d="M12 2a10 10 0 1 0 10 10A10 10 0 0 0 12 2zm0 18a8 8 0 1 1 8-8 8 8 0 0 1-8 8z" opacity=".3"/><path fill="%238b6b46" d="M12 2a10 10 0 1 0 10 10A10 10 0 0 0 12 2zm0 18a8 8 0 1 1 8-8 8 8 0 0 1-8 8z"><animateTransform attributeName="transform" type="rotate" from="0 12 12" to="360 12 12" dur="1s" repeatCount="indefinite"/></path></svg>') center/contain no-repeat !important;
  animation: none !important;
}

/* ===== 第二部分：代码块美化 ===== */
.markdown-body pre {
  background: linear-gradient(135deg, #f8f4ec 0%, #f0e8d8 100%) !important;
  border: 1px solid #d4c9b8 !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(139, 107, 70, 0.1) !important;
  margin: 12px 0 !important;
  overflow: hidden !important;
}

/* 代码块头部栏 */
.markdown-body pre > div > div.flex.justify-between.h-8 {
  background: linear-gradient(to right, #e8e0d1, #dcd2c0) !important;
  border-bottom: 1px solid #c9bca5 !important;
  padding: 0 12px !important;
}

/* 语言标签 */
.markdown-body pre > div > div.flex.justify-between > div.text-\[13px\] {
  color: #8b6b46 !important;
  font-family: "Microsoft YaHei", serif !important;
  font-weight: bold !important;
  font-size: 13px !important;
}

/* 复制按钮 */
.markdown-body pre div[data-tooltip-id^="copy-tooltip"] {
  background: transparent !important;
}

.markdown-body pre svg.lucide-copy,
.markdown-body pre div[data-tooltip-id^="copy-tooltip"] > svg {
  color: #8b6b46 !important;
  transition: all 0.3s ease !important;
}

.markdown-body pre .group:hover svg.lucide-copy,
.markdown-body pre div[data-tooltip-id^="copy-tooltip"]:hover > svg {
  color: #6b4f32 !important;
  transform: scale(1.1) !important;
}

/* 代码内容区 */
.markdown-body pre > div > div[node] {
  background: #faf8f3 !important;
  color: #5c4a3a !important;
  padding: 12px !important;
  font-family: "Consolas", "Monaco", monospace !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}

/* 代码语法高亮 */
.markdown-body pre code[class^="language-"] > span {
  color: #8b6b46 !important;
}

.markdown-body pre code[class^="language-"] > span[style*="color:"] {
  filter: sepia(0.3) !important;
}

/* 纯代码块（无语言标识） */
.markdown-body pre > code[node] {
  background: #faf8f3 !important;
  color: #5c4a3a !important;
  padding: 12px !important;
  border-radius: 6px !important;
  display: block !important;
  font-family: "Consolas", "Monaco", monospace !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}

/* Python代码块特殊样式（时间位置信息） */
.markdown-body pre:has(code.language-python) {
  background: linear-gradient(135deg, #f0e8d8 0%, #e8e0d1 100%) !important;
  border: 1px solid #c9bca5 !important;
}

.markdown-body pre:has(code.language-python) > div > div.flex.justify-between.h-8 {
  background: linear-gradient(to right, #dcd2c0, #d4c9b8) !important;
}

/* ===== 第三部分：状态栏美化（紧凑版） ===== */
/* details标签整体样式 */
.markdown-body details {
  background: linear-gradient(135deg, #f5f1e9 0%, #e8e0d1 100%) !important;
  border: 1px solid #d4c9b8 !important;
  border-radius: 8px !important;
  margin: 12px 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  box-shadow: 0 2px 8px rgba(139, 107, 70, 0.1) !important;
}

/* summary标题样式 */
.markdown-body details > summary {
  background: linear-gradient(to right, #e8e0d1, #dcd2c0) !important;
  color: #8b6b46 !important;
  font-family: "Microsoft YaHei", serif !important;
  font-weight: bold !important;
  font-size: 15px !important;
  padding: 10px 16px !important;
  cursor: pointer !important;
  list-style: none !important;
  border-bottom: 1px solid #c9bca5 !important;
  position: relative !important;
}

.markdown-body details > summary::-webkit-details-marker {
  display: none !important;
}

.markdown-body details > summary::after {
  content: '▼' !important;
  position: absolute !important;
  right: 16px !important;
  top: 50% !important;
  transform: translateY(-50%) rotate(0deg) !important;
  transition: transform 0.3s ease !important;
  color: #8b6b46 !important;
  font-size: 12px !important;
}

.markdown-body details[open] > summary::after {
  transform: translateY(-50%) rotate(180deg) !important;
}

.markdown-body details > summary:hover {
  background: linear-gradient(to right, #e0d6c2, #d4c9b8) !important;
}

/* 状态栏内容区域紧凑化 */
.markdown-body details > div {
  padding: 12px 16px !important;
  color: #5c4a3a !important;
  font-family: "Microsoft YaHei", "SimSun", serif !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  display: block !important;
}

/* 强制保留换行符但紧凑化 */
.markdown-body details > div > div,
.markdown-body details > div {
  white-space: pre-line !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
}

/* 状态栏内<div>元素紧凑化 */
.markdown-body details > div > div {
  margin-bottom: 4px !important;
  padding: 6px 10px !important;
  border-left: 2px solid #d4c9b8 !important;
  background: rgba(255, 255, 255, 0.4) !important;
  border-radius: 0 4px 4px 0 !important;
  line-height: 1.6 !important;
}

/* 换行符<br>紧凑样式 */
.markdown-body details > div > br,
.markdown-body details > div > div > br {
  display: block !important;
  content: "" !important;
  margin: 2px 0 !important;
  height: 0 !important;
  line-height: 0 !important;
}

/* 基本信息区块紧凑化 */
.markdown-body details > div > div:first-child {
  background: linear-gradient(135deg, rgba(232, 224, 209, 0.6), rgba(220, 210, 192, 0.4)) !important;
  border-left: 3px solid #8b6b46 !important;
  padding: 8px 12px !important;
  margin-bottom: 6px !important;
}

/* 身体信息区块紧凑化 */
.markdown-body details > div > div:has(-身高：) {
  background: rgba(248, 244, 236, 0.7) !important;
  border-left: 2px solid #c9bca5 !important;
  padding: 6px 10px !important;
  margin-top: 6px !important;
  margin-bottom: 4px !important;
}

/* 信息项紧凑排列 */
.markdown-body details > div > div > span {
  display: inline-block !important;
  margin-right: 12px !important;
  margin-bottom: 2px !important;
}

.markdown-body details > div > div > span[style*="display:"] {
  display: inline !important;
  margin-right: 12px !important;
  margin-bottom: 2px !important;
}

/* 键值对紧凑排列 */
.markdown-body details > div > div > * {
  display: inline-block !important;
  vertical-align: baseline !important;
  margin-bottom: 1px !important;
}

.markdown-body details > div > div > *:contains("：") {
  min-width: 70px !important;
  color: #8b6b46 !important;
  font-weight: bold !important;
  margin-right: 2px !important;
}

.markdown-body details > div > div > *:not(:contains("：")) {
  color: #5c4a3a !important;
  margin-left: 2px !important;
  margin-right: 8px !important;
}

/* 列表项紧凑样式（身体信息部分） */
.markdown-body details > div > div > *:contains("-") {
  display: block !important;
  margin: 2px 0 2px 12px !important;
  padding-left: 6px !important;
  border-left: 1px dotted #d4c9b8 !important;
  line-height: 1.5 !important;
  font-size: 13.5px !important;
}

/* 嵌套details内部紧凑化 */
.markdown-body details details {
  background: rgba(255, 255, 255, 0.5) !important;
  border: 1px solid #e0d6c2 !important;
  margin: 8px 0 !important;
}

.markdown-body details details > summary {
  background: rgba(232, 224, 209, 0.7) !important;
  font-size: 14px !important;
  padding: 8px 12px !important;
}

.markdown-body details details > div {
  padding: 8px 10px !important;
  font-size: 13px !important;
  display: block !important;
}

.markdown-body details details > div > div {
  padding: 4px 8px !important;
  border-left: 2px solid #e0d6c2 !important;
  background: rgba(255, 255, 255, 0.3) !important;
  border-radius: 0 4px 4px 0 !important;
  margin-bottom: 3px !important;
  line-height: 1.5 !important;
}

/* 行动建议紧凑化 */
.markdown-body details > div:has(#行动建议) {
  background: rgba(232, 224, 209, 0.3) !important;
  border-radius: 4px !important;
  margin-top: 6px !important;
  padding: 8px 10px !important;
}

.markdown-body details > div:has(#行动建议) > div {
  background: rgba(255, 255, 255, 0.6) !important;
  border-left: 2px solid #8b6b46 !important;
  padding: 6px 8px !important;
  margin-bottom: 4px !important;
}

/* 选项列表紧凑样式 */
.markdown-body details > div:has(#行动建议) > div > *:contains("A."),
.markdown-body details > div:has(#行动建议) > div > *:contains("B."),
.markdown-body details > div:has(#行动建议) > div > *:contains("C."),
.markdown-body details > div:has(#行动建议) > div > *:contains("D."),
.markdown-body details > div:has(#行动建议) > div > *:contains("E."),
.markdown-body details > div:has(#行动建议) > div > *:contains("F.") {
  display: block !important;
  margin: 3px 0 3px 16px !important;
  padding: 3px 6px !important;
  background: rgba(255, 255, 255, 0.8) !important;
  border-radius: 3px !important;
  border: 1px solid #e0d6c2 !important;
  transition: all 0.2s ease !important;
  line-height: 1.4 !important;
}

.markdown-body details > div:has(#行动建议) > div > *:contains("A."):hover,
.markdown-body details > div:has(#行动建议) > div > *:contains("B."):hover,
.markdown-body details > div:has(#行动建议) > div > *:contains("C."):hover,
.markdown-body details > div:has(#行动建议) > div > *:contains("D."):hover,
.markdown-body details > div:has(#行动建议) > div > *:contains("E."):hover,
.markdown-body details > div:has(#行动建议) > div > *:contains("F."):hover {
  background: rgba(232, 224, 209, 0.8) !important;
  border-color: #c9bca5 !important;
  transform: translateX(4px) !important;
}

/* 记忆区紧凑化 */
.markdown-body details > div:has(短期记忆) {
  background: rgba(248, 244, 236, 0.5) !important;
  padding: 8px 10px !important;
}

.markdown-body details > div:has(短期记忆) > div {
  border-left: 2px solid #a09078 !important;
  padding: 6px 8px !important;
  margin-bottom: 4px !important;
}

.markdown-body details > div:has(短期记忆) > div > *:contains("Slot") {
  display: block !important;
  margin: 2px 0 2px 20px !important;
  padding: 2px 4px !important;
  background: rgba(255, 255, 255, 0.7) !important;
  border-radius: 2px !important;
  border-left: 2px solid #d4c9b8 !important;
  font-size: 12.5px !important;
  line-height: 1.4 !important;
}

/* 标题和分隔线紧凑化 */
.markdown-body details > div > strong {
  color: #8b6b46 !important;
  font-size: 14px !important;
  display: block !important;
  margin: 6px 0 3px 0 !important;
  padding-bottom: 3px !important;
  border-bottom: 1px solid #d4c9b8 !important;
  font-weight: bold !important;
}

.markdown-body details > div > hr {
  border: none !important;
  border-top: 1px solid #d4c9b8 !important;
  margin: 8px 0 !important;
  height: 0 !important;
}

/* 特殊字符和图标优化 */
.markdown-body details > summary::before {
  content: '📜 ' !important;
  margin-right: 6px !important;
}

.markdown-body details > summary:has(👀你的信息)::before {
  content: '👀 ' !important;
}

.markdown-body details > summary:has(其他角色👤)::before {
  content: '👤 ' !important;
}

.markdown-body details > summary:has(行动建议😘)::before {
  content: '😘 ' !important;
}

.markdown-body details > summary:has(记忆区🕐)::before {
  content: '🕐 ' !important;
}

/* 特殊处理：防止空行过多 */
.markdown-body details > div > div:empty,
.markdown-body details > div:empty {
  display: none !important;
}

/* 优化连续换行的显示 */
.markdown-body details > div > br + br {
  margin: 1px 0 !important;
}

/* 信息分组视觉优化 */
.markdown-body details > div > div:not(:last-child) {
  margin-bottom: 4px !important;
}

.markdown-body details > div > div:last-child {
  margin-bottom: 0 !important;
}

/* ===== 第四部分：响应式设计 ===== */
@media (max-width: 480px) {
  /* 聊天框移动端优化 */
  .bg-gray-100\/90.relative.inline-block {
    padding: 12px !important;
    margin: 8px 0 !important;
    border-radius: 8px !important;
  }
  
  .markdown-body {
    font-size: 14px !important;
  }
  
  /* 状态栏移动端进一步紧凑化 */
  .markdown-body details {
    margin: 8px 0 !important;
  }
  
  .markdown-body details > summary {
    padding: 8px 12px !important;
    font-size: 14px !important;
  }
  
  .markdown-body details > div {
    padding: 8px 10px !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
  }
  
  .markdown-body details > div > div {
    padding: 4px 8px !important;
    margin-bottom: 3px !important;
    line-height: 1.5 !important;
  }
  
  .markdown-body details > div > div > span {
    margin-right: 8px !important;
    margin-bottom: 1px !important;
  }
  
  .markdown-body details > div > div > *:contains("-") {
    margin-left: 8px !important;
    font-size: 12.5px !important;
    line-height: 1.4 !important;
    margin-bottom: 1px !important;
  }
  
  .markdown-body details > div:has(#行动建议) > div > *:contains("A."),
  .markdown-body details > div:has(#行动建议) > div > *:contains("B."),
  .markdown-body details > div:has(#行动建议) > div > *:contains("C."),
  .markdown-body details > div:has(#行动建议) > div > *:contains("D."),
  .markdown-body details > div:has(#行动建议) > div > *:contains("E."),
  .markdown-body details > div:has(#行动建议) > div > *:contains("F.") {
    margin-left: 12px !important;
    font-size: 12.5px !important;
    padding: 2px 4px !important;
    margin-bottom: 2px !important;
    line-height: 1.3 !important;
  }
  
  .markdown-body details > div > strong {
    font-size: 13px !important;
    margin: 4px 0 2px 0 !important;
  }
}

/* ===== 第五部分：动效优化 ===== */
/* 减少动效偏好 */
@media (prefers-reduced-motion: reduce) {
  .flex.items-center.justify-center.w-6.h-5::before {
    animation-duration: 2s !important;
  }
  
  .markdown-body pre .group:hover svg.lucide-copy,
  .markdown-body pre div[data-tooltip-id^="copy-tooltip"]:hover > svg {
    transform: none !important;
    transition: none !important;
  }
  
  .markdown-body details > summary::after {
    transition: none !important;
  }
  
  .markdown-body details > div:has(#行动建议) > div > *:contains("A."):hover,
  .markdown-body details > div:has(#行动建议) > div > *:contains("B."):hover,
  .markdown-body details > div:has(#行动建议) > div > *:contains("C."):hover,
  .markdown-body details > div:has(#行动建议) > div > *:contains("D."):hover,
  .markdown-body details > div:has(#行动建议) > div > *:contains("E."):hover,
  .markdown-body details > div:has(#行动建议) > div > *:contains("F."):hover {
    transform: none !important;
    transition: none !important;
  }
}