/* ============================================================
   火影忍者 · 聊天框美化 (基于可用的选择器重写)
   配色：纯黑 (#1a1a1a) + 火影橙 (#e65100)
   风格：粗黑边框，硬阴影，无圆角
   ============================================================ */

/* 1. 聊天气泡基础样式 - 粗黑边框 + 硬阴影 (漫画纸色) */
.group.is-user > div:first-child, 
.group.is-assistant > div:first-child {
    background-color: #fcf9f2 !important;          /* 漫画纸色 */
    border: 4px solid #1a1a1a !important;          /* 粗黑边框 */
    border-radius: 0px !important;                 /* 无圆角，硬朗 */
    box-shadow: 6px 6px 0 #2a2a2a !important;      /* 硬阴影，无模糊 */
    padding: 12px 16px !important; 
    box-sizing: border-box !important;
    width: 100% !important;
}

/* 2. 聊天框内主文本内容 - 深色粗体 (排除 summary 及其子元素) */
.rili-markdown-renderer, 
.rili-markdown-renderer *:not([style*="color"]):not([color]):not(code):not(code *):not(summary):not(summary *) {
    color: #1a1a1e !important;
    font-family: 'Noto Sans SC', 'Arial Black', 'Impact', system-ui, sans-serif !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
    text-shadow: none !important;                  /* 去除浅色阴影 */
}

/* 3. Details 折叠框 - 粗黑边框 + 硬阴影 */
.rili-markdown-renderer details {
    background: #fcf9f2 !important;
    border: 4px solid #1a1a1a !important;
    border-radius: 0px !important;
    margin: 10px 0 !important; 
    padding: 0 !important;
    box-shadow: 6px 6px 0 #2a2a2a !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

/* Summary 标题栏 - 纯黑底 + 橙色文字 + 硬描边阴影 */
.rili-markdown-renderer summary,
.rili-markdown-renderer summary * {
    background: #1a1a1a !important;               /* 纯黑底 */
    color: #e65100 !important;                    /* 火影橙 */
    font-weight: 900 !important;
    margin: 0 !important;
    cursor: pointer !important;
    list-style: none !important;
    font-size: 1.05em !important;
    /* 硬文字阴影，模拟描边 + 橙色光晕 */
    text-shadow: 
        -2px -2px 0 #1a1a1a,
        2px -2px 0 #1a1a1a,
        -2px 2px 0 #1a1a1a,
        2px 2px 0 #1a1a1a,
        0 0 8px rgba(230, 81, 0, 0.5) !important;
    letter-spacing: 1px;
}

/* 单独修正 summary 容器布局 */
.rili-markdown-renderer summary {
    display: flex !important;
    align-items: center !important;
    padding: 8px 16px !important;
    border-bottom: 0px solid #1a1a1a !important;
}

/* 修复 summary 内部子元素透明，防止破坏纯黑背景 */
.rili-markdown-renderer summary * {
    background: transparent !important;
    padding: 0 !important;
    display: inline !important;
}

/* 展开时的 Summary - 底部加橙色边框 */
.rili-markdown-renderer details[open] summary {
    background: #1a1a1a !important;
    border-bottom: 4px solid #e65100 !important;
}

/* 移除浏览器默认三角形，替换为火影风符号 */
.rili-markdown-renderer summary::-webkit-details-marker {
    display: none !important;
}
.rili-markdown-renderer summary::before {
    content: '✦' !important;
    margin-right: 12px !important;
    font-size: 1.2em !important;
    color: #e65100 !important;
    text-shadow: 2px 2px 0 #1a1a1a !important;
}
.rili-markdown-renderer details[open] summary::before {
    content: '✧' !important;                     /* 漩涡符号 */
}

/* 展开后的正文内容 - 保持纸色背景 */
.rili-markdown-renderer details > *:not(summary) {
    padding: 6px 10px !important;
    margin: 0 !important;
    background: #fcf9f2 !important;
}

/* 4. 隐藏深度思考过程标签 (保留) */
.rili-markdown-renderer think {
    display: none !important;
}

/* 5. 底部附加元素适配 (复制按钮、模型名称等) */
.text-xs.font-mono.text-muted-foreground,
.bg-muted.rounded.flex button,
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary,
.MuiTypography-root.MuiTypography-body2.css-6c0gf2,
.text-orange-500 {
    color: #e65100 !important;
    font-weight: 900 !important;
    text-shadow: 2px 2px 0 #1a1a1a !important;    /* 硬阴影描边 */
}
.bg-muted.rounded.flex button svg.lucide {
    stroke: #e65100 !important;
}
.group .md\:opacity-0 { 
    opacity: 1 !important; 
}

/* 6. 移动端适配 - 保持硬朗风格 */
@media (max-width: 480px) {
    .group.is-user > div:first-child, 
    .group.is-assistant > div:first-child {
        padding: 8px !important;
        border-width: 3px !important;
        box-shadow: 4px 4px 0 #2a2a2a !important;
        border-radius: 0px !important;
    }
    .rili-markdown-renderer details {
        border-width: 3px !important;
        box-shadow: 4px 4px 0 #2a2a2a !important;
        margin: 6px 0 !important;
        border-radius: 0px !important;
    }
    .rili-markdown-renderer summary {
        padding: 6px 12px !important;
        font-size: 0.95em !important;
        text-shadow: 
            -1px -1px 0 #1a1a1a,
            1px -1px 0 #1a1a1a,
            -1px 1px 0 #1a1a1a,
            1px 1px 0 #1a1a1a,
            0 0 6px rgba(230, 81, 0, 0.4) !important;
    }
    .rili-markdown-renderer details[open] summary {
        border-bottom-width: 3px !important;
    }
    .rili-markdown-renderer details > *:not(summary) {
        padding: 4px 6px !important;
    }
    .rili-markdown-renderer summary::before {
        font-size: 1rem !important;
        margin-right: 8px !important;
    }
}