/* === 强制覆盖：全局文本反色与背景联动 === */
/* 针对整个聊天区的背景氛围，若平台未提供暗色背景，这里将在 body 级生效 */
.chat-background, 
.main-content {
  background: linear-gradient(135deg, #1a0a1e 0%, #2d1b2e 50%, #1a0a1e 100%) !important;
}

/* === 气泡框美化：用户与 AI 通用基底 === */
/* 柔化原生的硬边框，统一赋予毛玻璃与内发光质感 */
.group.is-user > div:first-child,
.group.is-assistant > div:first-child {
  backdrop-filter: blur(12px) !important;
  border: 1px solid rgba(255, 105, 180, 0.25) !important;
  box-shadow: 0 4px 20px rgba(255, 20, 100, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.15) !important;
  border-radius: 1.5rem !important;
  transition: all 0.3s ease !important;
}

/* === 用户气泡专属：亮绿特权光效 === */
.group.is-user > div:first-child {
  background: rgba(20, 30, 20, 0.7) !important;
  border-left: 3px solid #66ff66 !important;
  box-shadow: 0 0 25px rgba(102, 255, 102, 0.3), 0 4px 15px rgba(0, 0, 0, 0.5) !important;
}

/* === AI 气泡专属：粉紫服从光效 === */
.group.is-assistant > div:first-child {
  background: rgba(40, 15, 35, 0.75) !important;
  border-left: 3px solid #ff99cc !important;
  box-shadow: 0 0 25px rgba(255, 153, 204, 0.25), 0 4px 15px rgba(0, 0, 0, 0.6) !important;
}

/* === 最高可读性法则：强制将正文文字变白，提升对比度 === */
.rili-markdown-renderer,
.rili-markdown-renderer * {
  color: #f5f0f5 !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8) !important;
  line-height: 1.7 !important;
  font-weight: 400 !important;
}

/* 赋予代码块和引用块特殊的暗色装饰 */
.rili-markdown-renderer code {
  background: rgba(102, 255, 102, 0.15) !important;
  color: #c3e88d !important;
  padding: 0.2rem 0.5rem !important;
  border-radius: 0.3rem !important;
}
.rili-markdown-renderer blockquote {
  border-left-color: #ff99cc !important;
  background: rgba(255, 153, 204, 0.1) !important;
}

/* === 底部信息栏（Token 消耗等） === */
.text-xs.font-mono.text-muted-foreground {
  color: rgba(255, 220, 240, 0.8) !important;
  font-style: italic !important;
}

/* === 底部操作按钮区美化 === */
.bg-muted.rounded.flex {
  background: rgba(30, 10, 35, 0.7) !important;
  backdrop-filter: blur(8px) !important;
  border: 1px solid rgba(255, 105, 180, 0.3) !important;
  border-radius: 2rem !important;
  padding: 0.25rem !important;
}
.bg-muted.rounded.flex button {
  opacity: 0.9 !important;
  transition: all 0.2s ease !important;
  color: #f0c0e0 !important;
}
.bg-muted.rounded.flex button:hover {
  background: rgba(255, 153, 204, 0.3) !important;
  color: #ffffff !important;
  opacity: 1 !important;
}
.bg-muted.rounded.flex button svg.lucide {
  stroke: rgba(255, 200, 220, 0.9) !important;
}

/* 若用户需要按钮一直可见（对抗平台默认的 md:opacity-0） */
.group .md\:opacity-0 {
  opacity: 1 !important;
}

/* === 折叠状态栏（Details）深度美化 === */
.rili-markdown-renderer details {
  background: rgba(20, 5, 25, 0.7) !important;
  backdrop-filter: blur(16px) !important;
  border: 1px solid #ff99cc !important;
  border-radius: 1rem !important;
  margin: 1rem 0 !important;
  box-shadow: 0 0 25px rgba(255, 20, 80, 0.3) !important;
  transition: all 0.4s ease !important;
}

.rili-markdown-renderer details[open] {
  background: rgba(30, 10, 35, 0.85) !important;
  box-shadow: 0 0 35px rgba(255, 20, 100, 0.5), inset 0 0 20px rgba(255, 105, 180, 0.1) !important;
}

.rili-markdown-renderer summary {
  color: #ffb6d9 !important;
  font-weight: bold !important;
  font-size: 1.05rem !important;
  padding: 0.75rem 1.25rem !important;
  background: linear-gradient(90deg, rgba(255, 20, 100, 0.2), transparent) !important;
  border-radius: 1rem !important;
  cursor: pointer !important;
  letter-spacing: 0.5px !important;
  text-shadow: 0 0 8px rgba(255, 105, 180, 0.7) !important;
}

.rili-markdown-renderer details hr {
  border-color: rgba(255, 153, 204, 0.4) !important;
  margin: 0.8rem 0 !important;
}

/* === 加载动画重设计：粉红光点跳动 === */
.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::after {
  content: "✧ ✦ ✧";
  font-size: 1.6rem;
  letter-spacing: 0.3rem;
  color: #ff99cc;
  animation: pulse-glow 1.4s infinite ease-in-out;
  text-shadow: 0 0 20px #ff69b4, 0 0 40px #ff1493;
}

@keyframes pulse-glow {
  0%, 100% { opacity: 0.4; transform: scale(0.9); }
  50% { opacity: 1; transform: scale(1.2); text-shadow: 0 0 35px #ff69b4, 0 0 60px #ff1493; }
}
/* ========= 棉花糖梦境 · 可读性优先 ========= */

/* --- 顶部栏 --- */
.sticky.w-full.top-0.flex.items-center {
  background: rgba(255, 240, 245, 0.82) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border-bottom: 1.5px solid #ffb6c1 !important;
  box-shadow: 0 4px 12px rgba(255, 182, 193, 0.15) !important;
}

/* 模型选择器 */
#ai-model-selector .group.flex.items-center {
  background: rgba(255, 255, 255, 0.7) !important;
  border-radius: 24px !important;
  border: 1px solid #ffb6c1 !important;
  transition: all 0.25s ease !important;
}
#ai-model-selector .group.flex.items-center:hover {
  background: rgba(255, 230, 240, 0.9) !important;
  box-shadow: 0 0 8px rgba(255, 105, 180, 0.3) !important;
}
#ai-model-selector .truncate.text-\[13px\] {
  color: #6d4b5e !important;
  font-weight: 500 !important;
}
#ai-model-selector .shrink-0.flex.items-center svg {
  color: #ff99cc !important;
  transition: transform 0.3s !important;
}
#ai-model-selector .group:hover .shrink-0.flex.items-center svg {
  transform: rotate(180deg) !important;
}

/* 移动端历史记录图标 */
.sticky.w-full.top-0 svg.lucide-clock-8 {
  color: #ff99cc !important;
  filter: drop-shadow(0 0 2px #ffb6c1) !important;
}
/* 历史记录未读角标 */
.sticky.w-full.top-0 span.MuiBadge-dot.md\:hidden {
  background-color: #ff6b81 !important; /* 草莓糖色 */
}

/* 音乐按钮 */
.sticky.w-full.top-0 button.MuiIconButton-root:has(svg.lucide-music-2) {
  background: rgba(255,182,193,0.1) !important;
  border-radius: 50% !important;
  transition: background 0.3s !important;
}
.sticky.w-full.top-0 button.MuiIconButton-root:has(svg.lucide-music-2):hover {
  background: rgba(255,105,180,0.2) !important;
}
.sticky.w-full.top-0 button.MuiIconButton-root svg.lucide-music-2 {
  color: #ff99cc !important;
}

/* 设置按钮 */
#header-setting-button {
  background: rgba(255, 182, 193, 0.15) !important;
  border-radius: 12px !important;
  transition: all 0.2s !important;
}
#header-setting-button:hover {
  background: rgba(255, 105, 180, 0.25) !important;
  box-shadow: 0 0 6px #ff99cc !important;
}
#header-setting-button svg {
  color: #ff99cc !important;
}

/* 移动端设置图标 */
.sticky.w-full.top-0 svg:has(use[href="#icon-icon-set"]) {
  color: #ff99cc !important;
}

/* --- 开场白 --- */
div.flex.items-center.h-9.bg-white.rounded-md.cursor-pointer.group[class*="border-gray"],
div.h-9.rounded-md.cursor-pointer.group:has(svg[data-icon="SlidersH"]) {
  background: #fff9fb !important;
  border: 1px solid #ffd0dc !important;
  box-shadow: 0 2px 8px rgba(255, 192, 203, 0.2) !important;
  border-radius: 20px !important;
  transition: all 0.3s !important;
}
div.flex.items-center.h-9.bg-white.rounded-md.cursor-pointer.group[class*="border-gray"]:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(255, 105, 180, 0.25) !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: #ff99cc !important;
  transition: transform 0.3s !important;
}
div.flex.items-center.h-9.cursor-pointer.group:hover svg[data-icon="SlidersH"] {
  transform: rotate(-10deg) scale(1.1) !important;
}

/* --- 按钮栏（若启用） --- */
#ai-mod-button2 button.MuiButton-root {
  background: linear-gradient(135deg, #ffb6c1, #ff91a4) !important;
  color: white !important;
  border-radius: 24px !important;
  font-weight: 600 !important;
  box-shadow: 0 3px 8px rgba(255, 105, 180, 0.3) !important;
  transition: all 0.3s !important;
  border: none !important;
}
#ai-mod-button2 button.MuiButton-root:hover {
  background: linear-gradient(135deg, #ff91a4, #ff6b81) !important;
  box-shadow: 0 6px 14px rgba(255, 20, 147, 0.4) !important;
  transform: translateY(-1px) !important;
}
#ai-mod-button2 button.MuiButton-root svg {
  color: white !important;
}

/* --- 底部栏 --- */
.bg-gradient-to-t {
  background: linear-gradient(to top, rgba(255, 240, 245, 0.95), rgba(255, 255, 255, 0.85)) !important;
}

/* 输入框容器 */
#ai-chat-bottom-input {
  border: 1px solid #ffc0cb !important;
  border-radius: 28px !important;
  background: rgba(255, 250, 252, 0.9) !important;
  box-shadow: 0 2px 10px rgba(255, 182, 193, 0.2) !important;
  transition: border 0.3s, box-shadow 0.3s !important;
}
#ai-chat-bottom-input:focus-within {
  border-color: #66ccff !important;
  box-shadow: 0 0 0 3px rgba(102, 204, 255, 0.3) !important;
}

/* 主输入框 */
#ai-chat-input {
  color: #4a3b4e !important;
  caret-color: #ff99cc !important;
}
#ai-chat-input::placeholder {
  color: #f5a0b8 !important; /* 浅樱色 */
  opacity: 0.8 !important;
}
#ai-chat-input::selection {
  background: #b8f0d4 !important; /* 薄荷色 */
  color: #2e4a3b !important;
}

/* --- 分页栏（仅视觉样式） --- */
.MuiPaginationItem-root {
  color: #6d4b5e !important;
  border-radius: 50% !important;
  transition: all 0.3s !important;
}
.MuiPaginationItem-root:hover {
  background: rgba(255, 182, 193, 0.2) !important;
}
.MuiPaginationItem-root.Mui-selected {
  background: linear-gradient(135deg, #ff99cc, #ff6b81) !important;
  color: white !important;
  font-weight: bold !important;
  box-shadow: 0 2px 6px rgba(255, 20, 147, 0.4) !important;
}
.MuiPaginationItem-icon {
  color: #ff99cc !important;
}
.MuiStack-root.css-1uwir8f .MuiBox-root {
  color: #6d4b5e !important;
}
.MuiInputBase-input {
  border: 1px solid #ffc0cb !important;
  border-radius: 16px !important;
  padding: 4px 8px !important;
  color: #4a3b4e !important;
}

/* --- 评论区 --- */
/* 背景主容器（勿改布局） */
div[class*="w-full"][class*="bg-white"][class*="bottom-0"] {
  background: linear-gradient(170deg, #fff4f8 0%, #fff 40%) !important;
}

/* 标题 */
div.text-lg.font-bold {
  color: #d46c8c !important;
  border-bottom: 2px dashed #ffc0cb !important;
  padding-bottom: 4px !important;
}

/* 评分 */
p.MuiTypography-body1.text-grey-600 {
  color: #9e6b7c !important;
}
span.MuiRating-iconEmpty svg {
  color: #e0c0d0 !important;
}
span.MuiRating-iconFilled svg {
  color: #ff99cc !important;
}
span.text-orange-500 {
  color: #ff6b81 !important;
}

/* 评论输入 */
div.flex.flex-col.border-gray-200 {
  border-color: #ffccd9 !important;
  border-radius: 20px !important;
  background: #fff9fb !important;
}
textarea.rc-textarea {
  color: #4a3b4e !important;
  caret-color: #ff99cc !important;
}
div.bg-gray-100.text-gray-500 {
  background: #fff0f5 !important;
  color: #b08090 !important;
}

/* 发送按钮 */
div.cursor-pointer.group.flex.items-center.justify-center {
  background: linear-gradient(135deg, #ff99cc, #ff4d6d) !important;
  border-radius: 50% !important;
  box-shadow: 0 3px 8px rgba(255, 20, 147, 0.4) !important;
  transition: transform 0.3s, box-shadow 0.3s !important;
}
div.cursor-pointer.group.flex.items-center.justify-center:hover {
  transform: scale(1.08) !important;
  box-shadow: 0 6px 14px rgba(255, 20, 147, 0.6) !important;
}
div[data-state="closed"] svg[data-icon="Send03"] {
  color: white !important;
}

/* 分割线 */
div.style_divider__mW0YX {
  background: linear-gradient(to right, #fff, #ffb6c1, #fff) !important;
  height: 1.5px !important;
}

/* 排序按钮组 */
.MuiStack-root.css-1dmzxoz button.MuiButton-containedPrimary,
.MuiStack-root.css-1dmzxoz button.MuiButton-outlinedPrimary {
  border-radius: 24px !important;
  font-weight: 500 !important;
  transition: all 0.3s !important;
}
.MuiStack-root.css-1dmzxoz button.MuiButton-containedPrimary {
  background: linear-gradient(135deg, #ff99cc, #ff5277) !important;
  color: white !important;
  box-shadow: 0 2px 6px rgba(255, 20, 147, 0.3) !important;
}
.MuiStack-root.css-1dmzxoz button.MuiButton-outlinedPrimary {
  border-color: #ffb6c1 !important;
  color: #d45d7c !important;
}
.MuiStack-root.css-1dmzxoz button.MuiButton-outlinedPrimary:hover {
  background: rgba(255, 182, 193, 0.15) !important;
}

/* 评论列表项 */
div.group.ml-0 {
  border-bottom: 1px solid #ffe4ec !important;
  padding: 12px 0 !important;
}

/* 用户名 */
div.text-sm.text-grey-600 span.font-bold {
  color: #c45b7c !important;
}

/* “（你）” 标签 */
span.text-\[10px\] {
  background: #66ff66 !important;    /* 用户的亮绿色 */
  color: #003300 !important;
  border-radius: 10px !important;
  padding: 2px 6px !important;
  font-weight: bold !important;
}

/* 评论内容 */
div.break-all {
  color: #4a3b4e !important;
}

/* 时间戳 */
div.text-xs.text-grey-600 {
  color: #a08090 !important;
}

/* 点赞按钮 */
button.text-gray-400 {
  color: #ff99cc !important;
  transition: color 0.3s !important;
}
button.text-gray-400:hover {
  color: #ff4d6d !important;
}
button.text-gray-400 svg {
  color: inherit !important;
}

/* 回复链接 */
span.cursor-pointer {
  color: #66ccff !important; /* 男性角色天蓝，或作为通用回复色 */
  font-weight: 500 !important;
}
span.cursor-pointer:hover {
  color: #3399cc !important;
  text-decoration: underline !important;
}

/* 回复区域边框 */
div.ml-8.border-l {
  border-color: #ffccd9 !important;
}