/* --- 光之巨人通讯协议 (ULTRAMAN COMMS PROTOCOL) - SSSP终端界面 v1.0 --- */
/* 设计理念: 模拟科学特搜队(SSSP)的高科技通讯终端，融合奥特曼的标志性元素——红银配色、能量光效与彩色计时器。旨在创造一个既有未来科技感，又充满怀旧英雄情怀的界面。*/
/* v1.0: 初始版本，定义了奥特曼(AI)与科学特搜队(用户)的专属对话框样式，并加入了核心动画效果。*/
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700&display=swap');

/* ======================================================= */
/* Part 0: 核心动画 & 能量效果 (斯派修姆光线层) */
/* ======================================================= */

/* [核心] 能量光晕 (奥特曼存在辉光) */
@keyframes energy-glow-effect {
  0%, 100% { box-shadow: 0 0 12px rgba(0, 220, 255, 0.3), inset 0 0 8px rgba(255,255,255,0.2); }
  50% { box-shadow: 0 0 20px rgba(0, 220, 255, 0.5), inset 0 0 12px rgba(255,255,255,0.3); }
}

/* [核心] 彩色计时器脉冲 (生命信号) */
@keyframes color-timer-pulse {
  0% { transform: translate(50%, -50%) scale(1); filter: drop-shadow(0 0 4px #00aaff); }
  50% { transform: translate(50%, -50%) scale(1.08); filter: drop-shadow(0 0 10px #00ffff); }
  100% { transform: translate(50%, -50%) scale(1); filter: drop-shadow(0 0 4px #00aaff); }
}

/* ======================================================= */
/* Part 1: 通讯记录 (光之巨人 & SSSP队员) */
/* ======================================================= */

/* 通用对话框样式 - 增加间距，确保通讯清晰 */
.bg-gray-100\/90.relative.inline-block {
    overflow: visible !important;
    border-radius: 8px !important;
    margin-bottom: 25px !important; /* 控制聊天框间距 */
    transition: all 0.3s ease-in-out !important;
}

/* 1.1: [奥特曼] AI/系统信息 (来自M78星云的光之巨人) */
.chat-answer-container .bg-gray-100\/90.relative.inline-block {
    background: 
        linear-gradient(160deg, rgba(210, 210, 210, 0.95) 0%, rgba(180, 180, 180, 0.95) 100%),
        url("https://www.transparenttextures.com/patterns/brushed-metal.png"),
        #C0C0C0 !important; /* 奥特曼的银色身体 */
    border: 2px solid #D8252A !important; /* 奥特曼的红色花纹 */
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.5), inset 0 0 15px rgba(255,255,255,0.5) !important;
    animation: energy-glow-effect 8s ease-in-out infinite !important;
}

/* 在AI对话框右上角添加“彩色计时器” */
.chat-answer-container .bg-gray-100\/90.relative.inline-block::after {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    width: 38px !important;
    height: 38px !important;
    pointer-events: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Ccircle cx='50' cy='50' r='45' fill='%2300BFFF'/%3E%3Ccircle cx='50' cy='50' r='35' fill='white'/%3E%3Ccircle cx='50' cy='50' r='30' fill='%2300BFFF'/%3E%3C/svg%3E") !important;
    transform: translate(50%, -50%) !important;
    opacity: 0.95 !important;
    animation: color-timer-pulse 2s ease-in-out infinite !important;
    border-radius: 50% !important;
}

/* 1.2: [SSSP队员] 你的输入 (科学特搜队终端日志) */
.bg-gray-100\/90.relative.inline-block:not(.chat-answer-container .bg-gray-100\/90) {
    background: #2C3A47 !important; /* SSSP终端深色背景 */
    border: none !important;
    border-left: 5px solid #F07823 !important; /* SSSP标志性橙色 */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.6) !important;
    border-radius: 4px !important;
}

/* 在用户对话框左上角添加“科学特搜队流星标志” */
.bg-gray-100\/90.relative.inline-block:not(.chat-answer-container .bg-gray-100\/90)::before {
    content: '' !important;
    position: absolute !important;
    top: 12px !important;
    left: -28px !important;
    width: 20px !important;
    height: 20px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath fill='%23F07823' d='M50 0 L61.8 38.2 L100 38.2 L69.1 61.8 L80.9 100 L50 76.4 L19.1 100 L30.9 61.8 L0 38.2 L38.2 38.2 Z'/%3E%3C/svg%3E") !important;
    opacity: 0.8 !important;
    transform: rotate(0deg) !important;
}

/* ============================================================= */
/* Part 2: [机密档案] 可折叠信息 (SSSP数据库样式) */
/* ============================================================= */
div.markdown-body details { background: rgba(44, 58, 71, 0.8) !important; border: 1px solid rgba(240, 120, 35, 0.3) !important; border-radius: 4px !important; margin: 16px 0 !important; box-shadow: 0 2px 5px rgba(0,0,0,0.5), inset 0 0 10px black !important; transition: all 0.3s ease !important; }
div.markdown-body details[open] { background: rgba(30, 40, 50, 0.9) !important; border-color: #F07823 !important; }
div.markdown-body details > summary { padding: 10px 15px !important; font-weight: bold !important; cursor: pointer !important; color: #aeb8c1 !important; list-style-type: '► ' !important; font-family: 'Orbitron', sans-serif !important; text-transform: uppercase !important; }
div.markdown-body details[open] > summary { color: #F07823 !important; text-shadow: 0 0 5px rgba(240, 120, 35, 0.7) !important; list-style-type: '▼ ' !important; }
div.markdown-body details > *:not(summary) { padding: 15px 20px !important; color: #EAEAEA !important; border-top: 1px solid rgba(240, 120, 35, 0.2) !important; }

/* ============================================================= */
/* Part 3: 全局环境 & 交互终端 (已适配) */
/* ============================================================= */

/* 强制移除平台顶部默认的颜色条 */
[class*="bg-[#F1CBCB]"], [class*="bg-[#c9e1e9]"] {
    display: none !important;
}

/* 文本样式 - 确保在任何背景下都绝对清晰可读 */
.markdown-body { 
    font-family: system-ui, -apple-system, "Segoe UI", "Noto Sans SC", "Microsoft YaHei", sans-serif !important; /* 舒适、现代的系统字体 */
    font-size: 16px !important; 
    line-height: 1.7 !important; 
}

/* AI(奥特曼)的文本颜色 - 深色文字，在银色背景上保证可读性 */
.chat-answer-container .markdown-body { 
    color: #222222 !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.2) !important;
}

/* 用户(SSSP)的文本颜色 - 浅色文字，在深色背景上保证可读性 */
.bg-gray-100\/90.relative.inline-block:not(.chat-answer-container .bg-gray-100\/90) .markdown-body {
    color: #EAEAEA !important;
}

/* 底部操作元素样式 - 与用户输入框风格统一 */
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary,
.MuiTypography-root.MuiTypography-body2.css-6c0gf2,
.text-orange-500 {
    color: #A0A0A0 !important;
    transition: all 0.2s !important;
    font-family: 'Orbitron', sans-serif !important;
    font-size: 11px !important;
    text-transform: uppercase !important;
}
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary:hover {
    color: #F07823 !important; /* 悬停时变为SSSP橙色 */
    background: rgba(240, 120, 35, 0.1) !important;
}