* 
==========================================================================
   《鎏金之誓》深度沉浸式UI - V1.2 (方案二 · 最终修复版)
   设计理念：鎏金神权与永恒腐朽的交织
   修改者：兴趣使然的人
========================================================================== 
*/

/* --- 0. 工具类 --- */
/* 用于在正文中隐藏世界书触发词，比用HTML注释更规范 */
.hidden-trigger {
    display: none !important;
}

/* --- 1. 全局滚动条与基础环境渲染 --- */
::-webkit-scrollbar {
    width: 6px;
    background-color: #1a1406; /* 深邃的带金调的背景 */
}
::-webkit-scrollbar-thumb {
    background: linear-gradient(to bottom, #FFD700, #D4AF37);
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(255, 215, 0, 0.5);
}

/* --- 2. 聊天主容器美化：打造“神殿穹顶”感 --- */
#chat-container, .chat-box {
    background: radial-gradient(circle at 50% 20%, rgba(64, 50, 1, 0.4) 0%, rgba(26, 20, 6, 0.95) 70%) !important;
    border: 1px solid rgba(212, 175, 55, 0.2);
    box-shadow: inset 0 0 150px rgba(0, 0, 0, 0.9), 0 0 20px rgba(212, 175, 55, 0.1);
    border-radius: 25px;
    margin: 10px auto;
    backdrop-filter: blur(15px);
}

/* --- 3. 气泡/正文消息框：高保真感官容器 --- */
.message-bubble, .message-content {
    background: rgba(30, 25, 10, 0.7) !important;
    border-left: 4px solid #FFD700 !important;
    border-right: 4px solid #E5B873 !important;
    color: #f0e6d2 !important;
    font-size: 1.05rem !important;
    line-height: 1.8 !important;
    letter-spacing: 0.5px !important;
    padding: 25px !important;
    margin-bottom: 20px !important;
    border-radius: 15px !important;
    box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.5), inset 0 0 10px rgba(255, 215, 0, 0.05);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.message-bubble:hover {
    transform: translateX(5px);
    background: rgba(45, 38, 15, 0.85) !important;
    box-shadow: 0 0 25px rgba(255, 215, 0, 0.2);
}

/* --- 4. 状态栏 (Status Bar) 极致美化方案 --- */
/* 【核心修改区域 START】*/

/* 状态栏容器基础样式 */
.status-bar-container, details {
    background: linear-gradient(135deg, rgba(26, 20, 6, 0.95), rgba(10, 8, 2, 0.98)) !important;
    border: 1px solid rgba(184, 134, 11, 0.3) !important;
    border-radius: 12px !important;
    margin-top: 15px !important;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.7);
    /* 【核心修复】在这里为所有内部文字设定基础的金属金色 */
    color: #D4AF37; 
    padding: 20px; /* 为内部内容提供统一的内边距 */
}

/* 状态栏标题样式 */
summary {
    padding: 12px 20px !important;
    margin: -20px -20px 15px -20px; /* 使用负外边距让标题栏撑满并覆盖padding */
    background: rgba(255, 215, 0, 0.1) !important;
    /* 【颜色覆盖】确保标题是更亮的金色，不受父级影响 */
    color: #FFD700 !important; 
    font-weight: bold !important;
    cursor: pointer;
    list-style: none; /* 隐藏默认的三角箭头 */
    border-bottom: 1px solid rgba(255, 215, 0, 0.2);
    display: flex;
    align-items: center;
    transition: background 0.3s ease;
}
details[open] summary { /* 当状态栏展开时，标题背景更亮 */
    background: rgba(255, 215, 0, 0.2) !important;
}
summary::before {
    content: '⚜ ';
    margin-right: 10px;
    filter: drop-shadow(0 0 5px #FFD700);
}

/* 【新增】对状态栏内部的 <p> 标签进行样式微调 */
details p {
    margin: 0;
    padding: 5px 0;
    line-height: 1.7; /* 增加行高，让多行文本更易读 */
    font-family: 'Consolas', monospace;
}
/* 【新增】让<p>里的加粗文字(如头衔)颜色更突出 */
details p b, details p strong {
    color: #E5B873;
    font-weight: normal;
}

/* 【新增】专门为“记忆区”的Markdown表格设计样式 */
details table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
    font-size: 0.9em;
    font-family: 'Consolas', monospace;
}
details th, details td {
    border: 1px solid rgba(184, 134, 11, 0.2); /* 淡淡的金色边框 */
    padding: 8px 12px;
    text-align: left;
}
details th {
    background-color: rgba(255, 215, 0, 0.05); /* 表头背景色 */
    color: #E5B873; /* 表头文字颜色 */
}

/* 【核心修改区域 END】*/


/* --- 5. 交互按钮与输入框美化 --- */
.input-area, textarea {
    background: rgba(26, 20, 6, 0.9) !important;
    border: 1px solid #B8860B !important;
    border-radius: 15px !important;
    color: #ffffff !important;
    padding: 15px !important;
    box-shadow: inset 0 0 15px rgba(184, 134, 11, 0.2) !important;
}

.send-btn, button {
    background: linear-gradient(90deg, #FFD700, #D4AF37) !important;
    color: #1a1406 !important;
    font-weight: 800 !important;
    border: none !important;
    border-radius: 12px !important;
    text-transform: uppercase;
    letter-spacing: 2px;
    box-shadow: 0 4px 15px rgba(255, 215, 0, 0.4) !important;
    transition: all 0.2s ease !important;
    cursor: pointer;
}
.send-btn:hover, button:hover {
    transform: scale(1.05);
    box-shadow: 0 0 25px rgba(255, 215, 0, 0.7) !important;
}

/* --- 6. 拟态光效与标签 --- */
.race-tag-elf { color: #FFD700; text-shadow: 0 0 10px rgba(255, 215, 0, 0.8); } 
.race-tag-goblin { color: #E5B873; text-shadow: 0 0 10px rgba(229, 184, 115, 0.8); }

/* 特殊：行动建议块的美化 */
.action-suggestion {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 15px;
    padding: 10px;
}
.action-item {
    background: rgba(212, 175, 55, 0.1);
    border: 1px solid rgba(212, 175, 55, 0.3);
    padding: 5px 12px;
    border-radius: 20px;
    font-size: 0.85rem;
    color: #D4AF37;
    cursor: pointer;
    transition: all 0.2s ease;
}
.action-item:hover {
    background: rgba(212, 175, 55, 0.2);
    border-color: #FFD700;
    color: #FFD700;
    transform: translateY(-2px);
}
.action-item[data-type="sex"] {
    background: rgba(229, 184, 115, 0.15);
    border-color: rgba(229, 184, 115, 0.5);
    color: #E5B873;
}
.action-item[data-type="sex"]:hover {
    background: rgba(229, 184, 115, 0.3);
    border-color: #FFD700;
    color: #FFD700;
}

/* --- 7. 全局字体平滑与渲染优化 --- */
body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}