/* =============================================
   午夜 (暗色精选)
   base-hue:230  base-sat:25%  is-dark:1  accent-hue:240  accent-sat:75%

   bg-deep:hsl(230, 25%, 7%)   bg-default:hsl(230, 25%, 11%)   bg-paper:hsl(230, 25%, 15%)   bg-raised:hsl(230, 25%, 20%)
   bg-hover:hsl(230, 25%, 26%)  text-main:hsl(230, 8%, 93%)    text-sub:hsl(230, 6%, 68%)   text-muted:hsl(230, 5%, 44%)
   border:hsl(230, 25%, 28%)    accent:hsl(240, 75%, 68%)       accent-dim:hsl(240, 26.25%, 18%) accent-text:hsl(240, 60%, 80%)
   glow: 0 0 14px hsl(240,75%,55%,0.4)   glow-soft: 0 0 6px hsl(240,75%,55%,0.2)

   亮点① blockquote → 左侧电光蓝边框，背景半透明，文字略浅，营造代码引用或重要提示感。
   亮点② 加载动画  → 隐藏默认，使用SVG SMIL实现两个交错旋转的圆点，模拟星体运转。
   亮点③ 分隔线    → 采用深色渐变背景，中间用发光边框模拟星河，增加神秘感。
   ============================================= */

/* ===== 危险区域 ===== */
/* 1. 隐藏装饰条 */
[class*="bg-[#F1CBCB]"], [class*="bg-[#c9e1e9]"] { display: none !important; }

/* 2. 代码块 */
.markdown-body pre { background: hsl(240, 25%, 15%) !important; border: 1px solid rgba(129,140,248,0.70) !important; border-left: 3px solid hsl(240, 75%, 68%) !important; border-radius: 6px; padding: 1em 1.2em; overflow-x: auto; }
.markdown-body pre code { background: transparent !important; color: hsl(230, 8%, 93%) !important; }
.markdown-body :not(pre)>code { background: rgba(99,102,241,0.22) !important; color: hsl(240, 60%, 80%) !important; padding: 0.15em 0.45em; border-radius: 4px; }

/* 3. details折叠块 —— 标题行和容器背景分开设置 */
details { background: rgba(0,0,0,0.02) !important; border: 1px solid rgba(99,102,241,0.22) !important; border-radius: 6px !important; margin: 8px 0; overflow: hidden; transition: border-color 0.15s; }
details[open] { border-color: rgba(136,136,136,0.45) !important; }
details summary { background: rgba(0,0,0,0.06) !important; color: #a5b4fc !important; padding: 8px 12px 8px 32px; display: block; position: relative; border-bottom: 1px solid rgba(136,136,136,0.15) !important; cursor: pointer; font-weight: 600; list-style: none; user-select: none; }
details summary::before { content: '\25B6' !important; position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: #818cf8 !important; font-size: 11px; transition: transform 0.2s ease; }
details[open] summary::before { transform: translateY(-50%) rotate(90deg); }
details summary::-webkit-details-marker { display: none; }

/* 4. 滚动条 */
::-webkit-scrollbar { width: 3px !important; height: 3px !important; }
::-webkit-scrollbar-track { background: hsl(230, 25%, 7%) !important; }
::-webkit-scrollbar-thumb { background: #4f46e5 !important; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: hsl(240, 75%, 68%) !important; }

/* 5. 选区 & 占位符 */
::placeholder { color: rgba(99,102,241,0.3) !important; opacity: 1; }
::selection { background: hsl(240, 26.25%, 18%) !important; color: hsl(240, 60%, 80%) !important; }

/* ⚠️ 输入框强制可见（白底白字必死）*/
#ai-chat-input { background: rgba(0,0,14,0.97) !important; color: #e0e7ff !important; caret-color: #818cf8 !important; }
textarea.rc-textarea { background: rgba(0,0,14,0.97) !important; color: #e0e7ff !important; border: 1px solid rgba(99,102,241,0.3) !important; }

/* ===== 全局 ===== */
body, #root, .h-screen {
  background: hsl(230, 25%, 11%) !important;
  color: hsl(230, 8%, 93%) !important;
  cursor: auto !important;
}

/* ===== 顶部导航 ===== */
.sticky.w-full.top-0.flex.items-center {
  background: rgba(0,0,14,0.96) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border-bottom: 1px solid rgba(79,70,229,0.28) !important;
}
#ai-model-selector .group.flex.items-center {
  background: rgba(99,102,241,0.12) !important;
  border: 1px solid rgba(99,102,241,0.38) !important;
  border-radius: 6px !important;
  transition: background 0.2s, border-color 0.2s !important;
}
#ai-model-selector .group.flex.items-center:hover {
  background: rgba(99,102,241,0.2) !important;
  border-color: rgba(99,102,241,0.6) !important;
}
#ai-model-selector .truncate.text-[13px] {
  color: #e0e7ff !important;
}
#ai-model-selector .shrink-0.flex.items-center svg {
  color: #818cf8 !important;
}
#header-setting-button {
  color: hsl(230, 8%, 93%) !important;
}
#header-setting-button:hover {
  color: hsl(240, 75%, 68%) !important;
}

/* ===== 开场白区域 ===== */
div.flex.items-center.h-9.bg-white.rounded-md.cursor-pointer.group[class*="border-gray"] {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(99,102,241,0.18) !important;
  color: #a5b4fc !important;
  border-radius: 6px !important;
  transition: background 0.15s, border-color 0.15s !important;
}
div.flex.items-center.h-9.bg-white.rounded-md.cursor-pointer.group[class*="border-gray"]:hover {
  background: rgba(255,255,255,0.08) !important;
  border-color: rgba(99,102,241,0.3) !important;
}
div.flex.items-center.h-9.cursor-pointer.group svg[data-icon="SlidersH"],
div.flex.items-center.h-9.cursor-pointer.group svg[data-icon="ChevronDown"] {
  color: #a5b4fc !important;
}

/* ===== 侧边栏 ===== */
.shadow-lg.border-r.border-gray-200 {
  background: hsl(230, 25%, 15%) !important;
  border-right: 1px solid hsl(230, 25%, 28%) !important;
}
.MuiList-root {
  background: transparent !important;
}
.conversation-text {
  color: hsl(230, 8%, 93%) !important;
}

/* ===== 功能按钮 ===== */
#ai-mod-button2 {
  background: rgba(79,70,229,0.1) !important;
  border: 1px solid rgba(99,102,241,0.25) !important;
  border-radius: 6px !important;
}
#ai-mod-button2 button.MuiButton-root {
  color: #a5b4fc !important;
}
#ai-mod-button2 button.MuiButton-root svg {
  color: #a5b4fc !important;
}

/* ===== 聊天气泡 ===== */
.bg-gray-100\/90.relative.inline-block {
  background: #00001a !important;
  border: 1px solid rgba(99,102,241,0.35) !important;
  border-radius: 8px !important;
  padding: 10px 14px !important;
  box-shadow: 0 0 0px rgba(79,70,229,0.45) !important; /* 发光强度0 */
  color: #e0e7ff !important;
  font-size: 14px !important;
  line-height: 1.8 !important;
  font-weight: 400 !important;
  letter-spacing: 0.02em !important;
  transition: box-shadow 0.2s ease-in-out !important;
}
.bg-gray-100\/90.relative.inline-block:not(.chat-answer-container .bg-gray-100\/90) {
  background: #060622 !important;
  border: 1px solid rgba(99,102,241,0.35) !important;
  border-radius: 8px !important;
  padding: 10px 14px !important;
  box-shadow: 0 0 0px rgba(79,70,229,0.45) !important; /* 发光强度0 */
}
.markdown-body {
  color: #e0e7ff !important;
  font-size: 14px !important;
  line-height: 1.8 !important;
  font-weight: 400 !important;
  letter-spacing: 0.02em !important;
}
.markdown-body h1, .markdown-body h2, .markdown-body h3 {
  color: #a5b4fc !important;
  font-weight: 600 !important;
}
.markdown-body ul, .markdown-body ol, .markdown-body li {
  color: #e0e7ff !important;
}
.markdown-body blockquote { /* 亮点①：世界观氛围 */
  border-left: 4px solid rgba(99,102,241,0.65) !important;
  background: rgba(0,0,0,0.03) !important;
  color: #c7d2fe !important;
  padding: 8px 12px !important;
  margin: 8px 0 !important;
  font-style: italic !important;
  border-radius: 4px !important;
}
.markdown-body table, .markdown-body th, .markdown-body td {
  border: 1px solid hsl(230, 25%, 28%) !important;
  color: #e0e7ff !important;
}
.markdown-body th {
  background: rgba(0,0,0,0.06) !important;
  color: #a5b4fc !important;
}
.markdown-body strong {
  color: #a5b4fc !important;
  font-weight: 600 !important;
}
.markdown-body em {
  color: hsl(230, 6%, 68%) !important;
  font-style: italic !important;
}
.markdown-body a {
  color: hsl(240, 75%, 68%) !important;
  text-decoration: underline !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: 20px !important;
  overflow: hidden !important;
}
/* 亮点②：自定义加载动画 (SVG SMIL内嵌) */
.flex.items-center.justify-center.w-6.h-5::before {
  content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="8" height="8" viewBox="0 0 8 8"><circle cx="4" cy="4" r="3" fill="%23a5b4fc"><animateTransform attributeName="transform" type="rotate" from="0 4 4" to="360 4 4" dur="1.2s" repeatCount="indefinite" /></circle></svg>') !important;
  position: absolute !important;
  left: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 8px !important;
  height: 8px !important;
  display: block !important;
}
.flex.items-center.justify-center.w-6.h-5::after {
  content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="8" height="8" viewBox="0 0 8 8"><circle cx="4" cy="4" r="3" fill="%23818cf8"><animateTransform attributeName="transform" type="rotate" from="360 4 4" to="0 4 4" dur="1.1s" repeatCount="indefinite" /></circle></svg>') !important;
  position: absolute !important;
  right: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 8px !important;
  height: 8px !important;
  display: block !important;
}

/* ===== 底部输入区 ===== */
.bg-gradient-to-t {
  background: linear-gradient(to top, hsl(230, 25%, 11%) 40%, rgba(0,0,0,0)) !important;
}
#ai-chat-bottom-input {
  background: transparent !important;
}
#ai-chat-input {
  background: rgba(0,0,14,0.97) !important;
  color: #e0e7ff !important;
  caret-color: #818cf8 !important;
  border: 1px solid rgba(99,102,241,0.3) !important;
  border-radius: 14px !important;
  transition: border-color 0.2s !important;
}
#ai-chat-input:focus {
  border-color: rgba(99,102,241,0.6) !important;
}
#ai-chat-input::placeholder {
  color: rgba(99,102,241,0.3) !important;
}
#ai-chat-input::selection {
  background: hsl(240, 26.25%, 18%) !important;
  color: hsl(240, 60%, 80%) !important;
}
#ai-send-button {
  background: linear-gradient(135deg, #4338ca, #3730a3) !important;
  border-radius: 50% !important;
  color: white !important; /* 确保按钮图标可见 */
  transition: transform 0.15s ease-out !important;
}
#ai-send-button:hover {
  transform: scale(1.05) !important;
}

/* ===== 评论区 ===== */
div[class*="w-full"][class*="bg-white"][class*="bottom-0"] {
  background: hsl(230, 25%, 15%) !important;
  border-top: 1px solid hsl(230, 25%, 28%) !important;
  color: hsl(230, 8%, 93%) !important;
}
div.text-lg.font-bold {
  color: #a5b4fc !important;
}
p.MuiTypography-body1.text-grey-600 {
  color: hsl(230, 6%, 68%) !important;
}
span.MuiRating-root {
  color: hsl(240, 75%, 68%) !important;
}
span.MuiRating-iconEmpty svg {
  color: hsl(230, 5%, 44%) !important;
}
span.MuiRating-iconFilled svg {
  color: hsl(240, 75%, 68%) !important;
}
span.text-orange-500 {
  color: hsl(240, 75%, 68%) !important;
}
div.flex.flex-col.border-gray-200 {
  border-top: 1px solid hsl(230, 25%, 28%) !important;
}
textarea.rc-textarea {
  background: rgba(0,0,14,0.97) !important;
  color: #e0e7ff !important;
  border: 1px solid rgba(99,102,241,0.3) !important;
  border-radius: 8px !important;
  transition: border-color 0.2s !important;
}
textarea.rc-textarea:focus {
  border-color: rgba(99,102,241,0.6) !important;
}
div.bg-gray-100.text-gray-500 {
  background: hsl(230, 25%, 7%) !important;
  color: hsl(230, 5%, 44%) !important;
}
div.cursor-pointer.group.flex.items-center.justify-center {
  background: hsl(240, 75%, 68%) !important;
  color: white !important;
  border-radius: 4px !important;
  transition: background 0.15s ease-out !important;
}
div.cursor-pointer.group.flex.items-center.justify-center:hover {
  background: hsl(240, 75%, 75%) !important;
}
div[data-state="closed"] svg[data-icon="Send03"] {
  color: white !important;
}
.style_divider__mW0YX { /* 亮点③：分隔线装饰 */
  background: linear-gradient(to right, rgba(0,0,0,0), rgba(79,70,229,0.25) 20%, rgba(79,70,229,0.25) 80%, rgba(0,0,0,0)) !important;
  height: 2px !important;
  border: none !important;
  margin: 16px 0 !important;
  box-shadow: 0 0 8px rgba(79,70,229,0.3) !important;
}
.MuiStack-root.css-1dmzxoz {
  /* 评论区底部按钮容器，维持默认布局 */
}
button.MuiButton-containedPrimary {
  background: hsl(240, 75%, 68%) !important;
  color: white !important;
  border-radius: 4px !important;
  transition: background 0.15s ease-out !important;
}
button.MuiButton-containedPrimary:hover {
  background: hsl(240, 75%, 75%) !important;
}
button.MuiButton-outlinedPrimary {
  border: 1px solid hsl(240, 75%, 68%) !important;
  color: hsl(240, 75%, 68%) !important;
  border-radius: 4px !important;
  transition: background 0.15s ease-out, color 0.15s !important;
}
button.MuiButton-outlinedPrimary:hover {
  background: hsl(240, 26.25%, 18%) !important;
  color: hsl(240, 75%, 68%) !important;
}
div.p-3.overflow-y-auto {
  background: hsl(230, 25%, 11%) !important; /* 评论列表背景 */
  border-radius: 8px !important;
  border: 1px solid hsl(230, 25%, 28%) !important;
}
div.group.ml-0 {
  /* Individual comment container, no specific style override needed beyond text */
}
div.group img.rounded-full {
  border: 1px solid hsl(230, 25%, 28%) !important;
}
div.text-sm.text-grey-600 span.font-bold {
  color: #a5b4fc !important;
}
span.text-[10px] {
  color: hsl(230, 5%, 44%) !important;
}
div.break-all {
  color: hsl(230, 8%, 93%) !important;
}
div.text-xs.text-grey-600 {
  color: hsl(230, 5%, 44%) !important;
}
button.text-gray-400 {
  color: hsl(230, 5%, 44%) !important;
  transition: color 0.15s !important;
}
button.text-gray-400:hover {
  color: hsl(240, 75%, 68%) !important;
}
button.text-gray-400 svg {
  color: hsl(230, 5%, 44%) !important;
}
span.cursor-pointer {
  color: hsl(240, 75%, 68%) !important;
}
div.ml-8.border-l {
  border-left: 1px solid hsl(230, 25%, 28%) !important;
}

/* ===== 分页 ===== */
.MuiPaginationItem-root {
  color: hsl(230, 6%, 68%) !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  transition: background 0.15s, border-color 0.15s, color 0.15s !important;
}
.MuiPaginationItem-root:hover {
  background: hsl(230, 25%, 20%) !important;
  border-color: hsl(230, 25%, 28%) !important;
  color: hsl(230, 8%, 93%) !important;
}
.MuiPaginationItem-root.Mui-selected {
  background: hsl(240, 75%, 68%) !important;
  color: white !important;
  border-color: hsl(240, 75%, 68%) !important;
}
.MuiPaginationItem-root.Mui-disabled {
  color: hsl(230, 5%, 44%) !important;
  opacity: 0.6 !important;
  pointer-events: none !important;
}
.MuiPaginationItem-icon {
  color: hsl(230, 6%, 68%) !important;
}
.MuiPaginationItem-root:hover .MuiPaginationItem-icon {
  color: hsl(230, 8%, 93%) !important;
}
.MuiPaginationItem-root.Mui-selected .MuiPaginationItem-icon {
  color: white !important;
}
.MuiStack-root.css-1uwir8f {
  /* Pagination container, no specific style override needed */
}
.MuiInputBase-input {
  background: rgba(0,0,14,0.97) !important;
  color: #e0e7ff !important;
  border: 1px solid rgba(99,102,241,0.3) !important;
  border-radius: 4px !important;
  transition: border-color 0.2s !important;
}
.MuiInputBase-input:focus {
  border-color: rgba(99,102,241,0.6) !important;
}


/* ===== MUI 全局 ===== */
.MuiButton-root, .MuiButton-contained, .MuiButton-outlined {
  font-weight: 500 !important;
  text-transform: none !important;
  border-radius: 4px !important;
  transition: background 0.15s ease-out, color 0.15s, border-color 0.15s !important;
}
.MuiButton-contained {
  background: hsl(240, 75%, 68%) !important;
  color: white !important;
}
.MuiButton-contained:hover {
  background: hsl(240, 75%, 75%) !important;
}
.MuiButton-outlined {
  border: 1px solid hsl(240, 75%, 68%) !important;
  color: hsl(240, 75%, 68%) !important;
}
.MuiButton-outlined:hover {
  background: hsl(240, 26.25%, 18%) !important;
}
.MuiIconButton-root {
  color: hsl(230, 8%, 93%) !important;
  transition: color 0.15s !important;
}
.MuiIconButton-root:hover {
  color: hsl(240, 75%, 68%) !important;
  background: rgba(255,255,255,0.04) !important;
}
.MuiDialog-paper, .MuiDrawer-paper, .MuiBackdrop-root {
  background: hsl(230, 25%, 15%) !important;
  color: hsl(230, 8%, 93%) !important;
}
.MuiDivider-root {
  background-color: hsl(230, 25%, 28%) !important;
}
.MuiTypography-root {
  color: hsl(230, 8%, 93%) !important;
}
.MuiRating-icon {
  color: hsl(230, 5%, 44%) !important;
}
.MuiOutlinedInput-root {
  background: rgba(0,0,14,0.97) !important;
  color: #e0e7ff !important;
  border-radius: 8px !important;
}
.MuiOutlinedInput-notchedOutline {
  border-color: rgba(99,102,241,0.3) !important;
  transition: border-color 0.2s !important;
}
.MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline {
  border-color: rgba(99,102,241,0.6) !important;
}
.MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline {
  border-color: rgba(99,102,241,0.6) !important;
  border-width: 1px !important; /* Ensure border width is consistent */
}
.MuiTouchRipple-root {
  /* Keep default ripple effect */
}
.MuiTypography-root.MuiTypography-body2.css-6c0gf2 {
  color: hsl(230, 6%, 68%) !important; /* Specific text for some small descriptions */
}
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary {
  color: hsl(240, 75%, 68%) !important;
  transition: color 0.15s !important;
}
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary:hover {
  color: hsl(240, 75%, 75%) !important;
}
.text-orange-500 { /* General override for specific orange text to accent */
  color: hsl(240, 75%, 68%) !important;
}

/* ===== 响应式 ===== */
@media (max-width: 480px) {
  /* 可以在这里添加针对小屏幕的调整 */
  .markdown-body pre {
    padding: 0.8em 1em !important;
  }
  details summary {
    padding: 8px 10px 8px 28px !important;
  }
  details summary::before {
    left: 10px !important;
  }
}

/* ===== 降速兜底 ===== */
@media (prefers-reduced-motion: reduce) {
  .flex.items-center.justify-center.w-6.h-5::before,
  .flex.items-center.justify-center.w-6.h-5::after { animation-duration: 4s !important; }
  /* 禁用其他不必要的动画和过渡 */
  * {
    transition-duration: 0s !important;
    transition-delay: 0s !important;
    animation-duration: 0s !important;
    animation-delay: 0s !important;
  }
}