/* ==========================================
   【历史厚重风格】气泡框美化主题
   ========================================== */

/* 1. 用户输入气泡框：暗古铜皮革质感 */
.group.is-user > div:first-child {
  background: linear-gradient(145deg, #2b231c 0%, #1c1612 100%) !important;
  border: 1px solid #7c6139 !important;
  box-shadow: inset 0 0 12px rgba(0, 0, 0, 0.8), 0 4px 12px rgba(0, 0, 0, 0.5) !important;
  border-radius: 6px !important;
}

/* 2. AI输出气泡框：羊皮典籍暗纹质感 */
.group.is-assistant > div:first-child {
  background: linear-gradient(145deg, #1f1a16 0%, #14100d 100%) !important;
  border: 1px solid #5a462b !important;
  box-shadow: inset 0 0 16px rgba(0, 0, 0, 0.9), 0 4px 16px rgba(0, 0, 0, 0.6) !important;
  border-radius: 6px !important;
  position: relative !important;
}

/* 3. 正文文字与排版：高对比象牙白复古字体（绝对清晰度保障） */
.rili-markdown-renderer, 
.rili-markdown-renderer * {
  color: #e8ded1 !important;
  font-family: "Georgia", "Cambria", "Times New Roman", serif, sans-serif !important;
  line-height: 1.75 !important;
}

/* 代码块暗化与古铜边框处理 */
.rili-markdown-renderer code, 
.rili-markdown-renderer pre {
  background-color: #0d0b0a !important;
  color: #d4c5b0 !important;
  border: 1px solid #4a3b2c !important;
  border-radius: 4px !important;
}

/* 4. 底部附加信息区（Token/模型信息） */
.text-xs.font-mono.text-muted-foreground {
  color: #a38965 !important;
  font-family: "Georgia", serif !important;
}

/* 5. 底部操作按钮区与图标美化 */
.bg-muted.rounded.flex {
  background-color: rgba(28, 22, 18, 0.95) !important;
  border: 1px solid #4a3b2c !important;
  border-radius: 4px !important;
}

.bg-muted.rounded.flex button svg.lucide {
  stroke: #c5a059 !important;
  color: #c5a059 !important;
}

.bg-muted.rounded.flex button:hover svg.lucide {
  stroke: #f0c978 !important;
  filter: drop-shadow(0 0 5px rgba(240, 201, 120, 0.6)) !important;
}

/* 强行保持操作按钮可见性 */
.group .md\:opacity-0 {
  opacity: 0.85 !important;
}

/* 6. 古雅式加载动画（替换原生加载点） */
.flex.gap-2.w-full.h-full.items-center.justify-center > span {
  display: none !important;
}

.flex.gap-2.w-full.h-full.items-center.justify-center::before {
  content: "" !important;
  width: 22px !important;
  height: 22px !important;
  border: 2px solid #5a462b !important;
  border-top-color: #d4a755 !important;
  border-radius: 50% !important;
  animation: ancient-spinner 1.2s infinite linear !important;
}

@keyframes ancient-spinner {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}