/* 隐藏浅蓝色条 */
div[class*="bg-[#c9e1e9]"][class*="top-0"][class*="h-0.5"] {
  display: none !important;
}

/* 隐藏浅粉色条 */
div[class*="bg-[#F1CBCB]"][class*="top-0"][class*="h-0.5"] {
  display: none !important;
}
/*
 * ================================================
 *   暗恋氛围·花边卡片风格（所有模块·完整版）
 *   明显渐变·1.5px花边·25px辉光·文字清晰
 *   外框颜色已加强，肉眼可见
 * ================================================
 */

/* 
 * ---------------------------------
 *   模块一：对话气泡美化 (AI侧)
 *   渐变：左上浅 → 右下深，肉眼可见
 *   外框：1.5px 明亮玫瑰金
 * ---------------------------------
 */
.group .bg-gray-100\/90 {
    /* 明显渐变：左上角浅紫灰 → 右下角深紫 */
    background: linear-gradient(135deg, #5a4e62 0%, #2d2533 100%) !important;
    
    /* 花边边框：1.5px 明亮的干枯玫瑰色 */
    border: 1.5px solid #d4838f !important;
    border-radius: 12px !important;
    
    /* 阴影：双层衬线 + 25px 玫瑰金辉光 */
    box-shadow: 
        0 0 0 3px #1a1a22,
        0 4px 16px rgba(0, 0, 0, 0.55),
        0 0 25px rgba(212, 131, 143, 0.28) !important;
    
    /* 文字颜色：明亮暖白 */
    color: #ffffff !important;
    
    padding: 14px 18px !important;
    font-weight: 400;
    letter-spacing: 0.3px;
}

/* 气泡内大多数文本强制亮白（排除 details 和 p 标签） */
.group .bg-gray-100\/90 *:not(pre):not(code):not(details):not(details *):not(p) {
    color: #ffffff !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

/* 链接使用明亮的玫瑰金 */
.group .bg-gray-100\/90 a {
    color: #f0c0d0 !important;
    border-bottom: 1px dotted rgba(240, 192, 208, 0.6);
}


/* 
 * ---------------------------------
 *   模块二：平台按钮美化
 *   外框：1.5px 明亮玫瑰金，肉眼可见
 * ---------------------------------
 */
.flex.items-center.gap-2.pb-2 > button {
    background: #2a2a32 !important;
    color: #e0d8dc !important;
    
    /* 外框加强：明亮的玫瑰金色 */
    border: 1.5px solid #d4838f !important;
    border-radius: 6px !important;
    box-shadow: 
        0 0 0 2px #1c1c22,
        0 3px 10px rgba(0, 0, 0, 0.5) !important;
    
    font-weight: 600 !important;
    letter-spacing: 0.8px;
    text-transform: none !important;
    transition: all 0.25s ease !important;
    padding: 8px 20px !important;
}

.flex.items-center.gap-2.pb-2 > button:hover {
    background: #3d2d30 !important;
    color: #ffffff !important;
    border-color: #f0c0d0 !important;  /* 悬停时更亮 */
    box-shadow: 
        0 0 0 2px #1a1a1f,
        0 0 24px rgba(212, 131, 143, 0.4),
        0 6px 14px rgba(0, 0, 0, 0.6) !important;
    transform: translateY(-2px);
}


/* 
 * ---------------------------------
 *   模块三：多余元素隐藏（保持原样）
 * ---------------------------------
 */
.MuiButtonBase-root.MuiButton-root.MuiButton-default.css-w13mdt,
.absolute.z-40 .px-4.py-2.hover\:bg-indigo-100:nth-child(5),
.css-nkqe49 {
    /* display: none !important; */
}


/* 
 * ---------------------------------
 *   模块四：输入栏美化
 *   外框：1.5px 明亮玫瑰金，肉眼可见
 * ---------------------------------
 */
#ai-chat-input {
    background-color: #1a1a1f !important;
    
    /* 外框加强：明亮的玫瑰金色 */
    border: 1.5px solid #d4838f !important;
    border-radius: 8px !important;
    
    /* 文字：纯白 */
    color: #ffffff !important;
    
    box-shadow: 
        inset 0 2px 6px rgba(0, 0, 0, 0.5),
        0 0 0 3px #1c1c22,
        0 3px 10px rgba(0, 0, 0, 0.4) !important;
    
    padding: 12px 16px !important;
}

/* 聚焦时外框更亮 */
#ai-chat-input:focus {
    border-color: #f0c0d0 !important;
    box-shadow: 
        inset 0 2px 6px rgba(0, 0, 0, 0.5),
        0 0 0 3px #1c1c22,
        0 0 20px rgba(212, 131, 143, 0.35) !important;
    outline: none !important;
}

#ai-chat-input::placeholder {
    color: #b0a4a6 !important;
    opacity: 1 !important;
}

#ai-chat-bottom-input { 
    background: #1c1c22 !important; 
    backdrop-filter: none !important;
    border-top: 1px solid #2a2a32;
}






/*
 * ===========================================
 *   <details> 折叠面板 & Markdown 表格美化
 *   无三角图标 / 适配暗色亮色背景 / 响应式
 * ===========================================
 */

/* ===== 1. 折叠面板容器 ===== */
details {
  display: block;
  margin: 1em 0;
  border: 1.5px solid rgba(180, 140, 160, 0.5);
  border-radius: 12px;
  background: rgba(42, 42, 50, 0.7);
  backdrop-filter: blur(4px);
  box-shadow: 0 4px 20px rgba(0,0,0,0.25);
  transition: all 0.3s ease;
  overflow: hidden;
}

details[open] {
  border-color: rgba(212, 131, 143, 0.8);
  box-shadow: 0 4px 25px rgba(212,131,143,0.25);
}

/* ===== 2. 摘要标题 ===== */
details summary {
  display: flex;
  align-items: center;
  padding: 0.9em 1.2em;
  font-size: 1em;
  font-weight: 600;
  color: #f0e8ec;
  cursor: pointer;
  list-style: none;                /* 移除默认三角形图标 */
  user-select: none;
  letter-spacing: 0.3px;
  transition: background 0.2s;
}

/* 彻底隐藏所有默认三角形 */
details summary::-webkit-details-marker {
  display: none;
}
details summary::marker {
  display: none;
  content: "";
}

details summary:hover {
  background: rgba(212, 131, 143, 0.12);
}

/* ===== 3. 面板内容区域 ===== */
details > *:not(summary) {
  margin: 0;
  padding: 0.2em 1.5em 1.2em;
  color: #e2d8de;
  font-size: 0.95em;
  line-height: 1.7;
}

/* ===== 4. Markdown 表格美化 ===== */
details table {
  width: 100%;
  max-width: 100%;
  margin: 1em 0;
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 0.92em;
  color: #333;                     /* 深色文字，黑白背景均清晰可读 */
  background: rgba(255, 250, 252, 0.92);
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  display: block;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

details table thead,
details table tbody,
details table tr {
  display: table;
  width: 100%;
  table-layout: fixed;
}

details table th,
details table td {
  padding: 0.7em 1em;
  text-align: left;
  border-bottom: 1px solid rgba(180, 150, 160, 0.25);
  word-break: break-word;
  white-space: normal;
}

details table th {
  background: rgba(212, 131, 143, 0.18);
  color: #4a3548;
  font-weight: 600;
  font-size: 0.9em;
  letter-spacing: 0.4px;
  border-bottom: 2px solid rgba(212, 131, 143, 0.4);
}

details table tr:nth-child(even) td {
  background: rgba(240, 230, 236, 0.5);
}
details table tr:hover td {
  background: rgba(212, 131, 143, 0.08);
}

/* 移动端适配 */
@media (max-width: 600px) {
  details table {
    font-size: 0.82em;
  }
  details table th,
  details table td {
    padding: 0.5em 0.7em;
  }
  details > *:not(summary) {
    padding: 0.2em 1em 1em;
    font-size: 0.9em;
  }
}












/* ========== 平台星星评分替换为🧸 ========== */
/* 定位评分星星容器，恢复字体大小 */
.MuiRating-root,
.MuiRating-root .MuiRating-icon,
.MuiRating-root .MuiRating-iconFilled,
.MuiRating-root .MuiRating-iconEmpty,
.MuiRating-root .MuiRating-iconHover {
    font-size: 24px !important;
    width: auto !important;
    height: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: none !important;
}

/* 隐藏原有的SVG星星图标 */
.MuiRating-root .MuiRating-icon svg {
    display: none !important;
}

/* 使用伪元素显示🧸 */
.MuiRating-root .MuiRating-icon::before {
    content: "🧸" !important;
    display: block !important;
    line-height: 1 !important;
}

/* 未选中的星星：灰化且半透明，模拟空星效果 */
.MuiRating-root .MuiRating-iconEmpty::before {
    filter: grayscale(0.7) opacity(0.35) !important;
}

/* 选中的星星：鲜艳完整 */
.MuiRating-root .MuiRating-iconFilled::before {
    filter: none !important;
    opacity: 1 !important;
}

/* 悬停时的星星：轻微灰化，稍微透明 */
.MuiRating-root .MuiRating-iconHover::before {
    filter: grayscale(0.3) opacity(0.7) !important;
}



/*
 * ===========================================
 *   替换加载动画为文字提示
 *   “别着急，再逗逗他......🧸”
 * ===========================================
 */

/* 选中包含加载点的父容器 */
.flex.items-center.justify-center.w-6.h-5 {
  width: auto !important;          /* 取消固定宽度，让文字自适应 */
  height: auto !important;         /* 取消固定高度 */
  position: relative;
}

/* 隐藏原来的三点加载动画 */
.flex.items-center.justify-center.w-6.h-5 > .style_dot-flashing__8L91Q.style_text__zGhNq {
  display: none !important;
}

/* 用伪元素显示文字，横向一行 */
.flex.items-center.justify-center.w-6.h-5::after {
  content: "别着急，再逗逗他......🧸";
  display: block;
  white-space: nowrap;             /* 强制横向排列，不换行 */
  font-size: 14px;
  font-weight: 500;
  color: #d4838f;                 /* 主题玫瑰金色，可按需调整 */
  letter-spacing: 0.5px;
  text-shadow: 0 1px 4px rgba(0,0,0,0.2);
  animation: none !important;      /* 清除可能继承的动画 */
}

/* 如果需要在移动端缩小字体 */
@media (max-width: 480px) {
  .flex.items-center.justify-center.w-6.h-5::after {
    font-size: 12px;
  }
}
