/* ========== 全局字体与基础变量 ========== */
.bg-gradient-to-t,
#ai-chat-bottom-input,
#ai-mod-button2,
div[class*="w-full"][class*="bg-white"][class*="bottom-0"]{
  font-family:"KaiTi","STKaiti","楷体",serif !important;
}

/* ========== 一、按钮栏修仙化（Mod、流式等下角按钮） ========== */
#ai-mod-button2{
  background:linear-gradient(135deg,rgba(15,30,50,0.6) 0%,rgba(25,15,40,0.5) 100%) !important;
  border-radius:8px !important;
  padding:4px !important;
  backdrop-filter:blur(4px);
  border:1px solid rgba(120,180,220,0.15) !important;
}
#ai-mod-button2 button.MuiButton-root{
  background:linear-gradient(135deg,#1a2a4a 0%,#2a1a3a 100%) !important;
  color:#d4af37 !important;
  border:1px solid rgba(127,219,255,0.4) !important;
  border-radius:6px !important;
  font-family:"KaiTi","STKaiti",serif !important;
  font-size:13px !important;
  letter-spacing:2px !important;
  position:relative !important;
  overflow:hidden !important;
  transition:all 0.4s ease !important;
  box-shadow:0 0 8px rgba(127,219,255,0.2),inset 0 0 10px rgba(212,175,55,0.05) !important;
}
#ai-mod-button2 button.MuiButton-root::before{
  content:"❋";
  position:absolute;
  left:6px;
  top:50%;
  transform:translateY(-50%);
  color:rgba(127,219,255,0.5);
  font-size:10px;
  animation:talismanFloat 3s ease-in-out infinite;
}
#ai-mod-button2 button.MuiButton-root:hover{
  background:linear-gradient(135deg,#2a3a5a 0%,#3a2a4a 100%) !important;
  color:#f4d35e !important;
  border-color:#7fdbff !important;
  box-shadow:0 0 18px rgba(127,219,255,0.5),inset 0 0 14px rgba(244,211,94,0.15) !important;
  transform:translateY(-1px);
}
#ai-mod-button2 button.MuiButton-root svg{
  filter:drop-shadow(0 0 4px rgba(127,219,255,0.6)) !important;
  color:#88d8ff !important;
}

/* ========== 二、聊天输入框灵气环绕特效 ========== */
.bg-gradient-to-t{
  background:linear-gradient(to top,rgba(10,18,35,0.95) 0%,rgba(15,25,45,0.6) 70%,transparent 100%) !important;
}
#ai-chat-bottom-input{
  background:linear-gradient(135deg,rgba(20,30,55,0.85) 0%,rgba(30,20,50,0.85) 100%) !important;
  border:1px solid rgba(127,219,255,0.35) !important;
  border-radius:14px !important;
  position:relative !important;
  box-shadow:0 0 22px rgba(127,219,255,0.15),inset 0 0 18px rgba(212,175,55,0.06) !important;
  overflow:visible !important;
}
#ai-chat-bottom-input::before{
  content:"";
  position:absolute;
  top:-2px;left:-2px;right:-2px;bottom:-2px;
  border-radius:16px;
  background:linear-gradient(135deg,#7fdbff,#d4af37,#88d8b0,#7fdbff);
  background-size:300% 300%;
  z-index:-1;
  opacity:0.5;
  animation:spiritFlow 6s linear infinite;
  filter:blur(6px);
}
#ai-chat-bottom-input::after{
  content:"⚹";
  position:absolute;
  right:14px;
  top:50%;
  transform:translateY(-50%);
  color:rgba(244,211,94,0.4);
  font-size:14px;
  pointer-events:none;
  animation:rune 4s ease-in-out infinite;
}
#ai-chat-input{
  color:#e8d9a8 !important;
  font-family:"KaiTi","STKaiti",serif !important;
  font-size:15px !important;
  letter-spacing:1px !important;
  caret-color:#7fdbff !important;
}
#ai-chat-input::placeholder{
  color:rgba(168,158,137,0.55) !important;
  font-style:italic;
  letter-spacing:2px;
}
#ai-chat-input::selection{
  background:rgba(127,219,255,0.35) !important;
  color:#f4d35e !important;
}

/* ========== 三、状态栏修仙化美化 ========== */
details{
  background:linear-gradient(135deg,rgba(20,30,55,0.7) 0%,rgba(30,20,50,0.6) 100%) !important;
  border:1px solid rgba(127,219,255,0.25) !important;
  border-radius:8px !important;
  margin:10px 0 !important;
  padding:12px 16px !important;
  position:relative;
  box-shadow:0 4px 14px rgba(0,0,0,0.3),inset 0 0 12px rgba(212,175,55,0.04);
  transition:all 0.4s ease;
}
details::before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;
  height:1px;
  background:linear-gradient(90deg,transparent,#7fdbff,#d4af37,#7fdbff,transparent);
  opacity:0.7;
}
details:hover{
  border-color:rgba(127,219,255,0.5) !important;
  box-shadow:0 6px 20px rgba(127,219,255,0.2),inset 0 0 18px rgba(212,175,55,0.08);
}
details summary{
  color:#d4af37 !important;
  font-family:"KaiTi","STKaiti",serif !important;
  font-size:16px !important;
  font-weight:bold;
  letter-spacing:3px;
  cursor:pointer;
  padding:6px 8px;
  position:relative;
  list-style:none;
  text-shadow:0 0 10px rgba(212,175,55,0.4);
}
details summary::-webkit-details-marker{display:none}
details summary::before{
  content:"❖";
  margin-right:8px;
  color:#7fdbff;
  font-size:14px;
  text-shadow:0 0 6px rgba(127,219,255,0.8);
  animation:runeRotate 8s linear infinite;
  display:inline-block;
}
details[open] summary{
  border-bottom:1px dashed rgba(127,219,255,0.3);
  margin-bottom:10px;
  padding-bottom:10px;
}
details[open] summary::after{
  content:"展卷";
  position:absolute;
  right:8px;
  top:50%;
  transform:translateY(-50%);
  font-size:11px;
  color:rgba(127,219,255,0.6);
  letter-spacing:2px;
}

/* 状态栏内嵌套表格美化 */
details table{
  width:100%;
  border-collapse:collapse;
  margin:8px 0;
  background:rgba(10,18,35,0.4);
  border-radius:6px;
  overflow:hidden;
}
details table th{
  background:linear-gradient(135deg,rgba(127,219,255,0.15),rgba(212,175,55,0.1)) !important;
  color:#f4d35e !important;
  font-family:"KaiTi","STKaiti",serif !important;
  letter-spacing:2px;
  padding:8px 12px;
  border-bottom:1px solid rgba(127,219,255,0.3);
}
details table td{
  color:#cfc5a3 !important;
  padding:6px 12px;
  border-bottom:1px dashed rgba(127,219,255,0.1);
  font-size:13px;
}
details table tr:hover td{
  background:rgba(127,219,255,0.05);
  color:#e8d9a8 !important;
}

/* 状态栏内的强调文字 */
details strong,details b{
  color:#88d8ff !important;
  text-shadow:0 0 6px rgba(127,219,255,0.3);
}

/* ========== 四、修仙思考动画（AI"打坐参悟"特效） ========== */
/* 该动画会出现在状态栏summary前的符文上 */
details summary:hover::before{
  animation:runeRotate 1.5s linear infinite,spiritGlow 1s ease-in-out infinite !important;
  color:#f4d35e;
  text-shadow:0 0 14px rgba(244,211,94,0.9);
}

/* ========== 五、统一动画关键帧 ========== */
@keyframes spiritFlow{
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}
@keyframes talismanFloat{
  0%,100%{transform:translateY(-50%) rotate(0deg);opacity:0.5}
  50%{transform:translateY(-60%) rotate(180deg);opacity:1}
}
@keyframes rune{
  0%,100%{opacity:0.3;transform:translateY(-50%) scale(1)}
  50%{opacity:0.9;transform:translateY(-50%) scale(1.2)}
}
@keyframes runeRotate{
  from{transform:rotate(0deg)}
  to{transform:rotate(360deg)}
}
@keyframes spiritGlow{
  0%,100%{filter:drop-shadow(0 0 4px #7fdbff)}
  50%{filter:drop-shadow(0 0 14px #f4d35e)}
}

/* ========== 六、整体配色微调，避免白色字体 ========== */
.bg-gradient-to-t *{color:#cfc5a3}
#ai-chat-bottom-input *{color:#e8d9a8}