/* === 自定义标签显示修复 === */
ai, text {
    display: block !important;
    width: 100% !important;
}

/* === 思维链隐藏 === */
think {
    display: none !important;
}

/* === 统一聊天框：奶油纸感底 + 樱粉描边 (适配Rili气泡) === */
.is-user > div.border-muted,
.is-assistant > div.border-muted {
    background: linear-gradient(168deg, #fffaf3 0%, #fff4ec 55%, #ffeef0 100%) !important;
    border: 1px solid #f3c9d0 !important;
    border-radius: 18px !important;
    box-shadow:
        0 4px 18px rgba(243, 201, 208, 0.25),
        0 1px 3px rgba(180, 140, 150, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.7) !important;
    padding: 18px 20px !important;
    position: relative !important;
    isolation: isolate !important;
    overflow: hidden !important;
    transition: box-shadow 0.4s ease, transform 0.4s ease !important;
}

.is-user > div.border-muted:hover,
.is-assistant > div.border-muted:hover {
    box-shadow:
        0 6px 24px rgba(243, 201, 208, 0.35),
        0 2px 6px rgba(180, 140, 150, 0.12) !important;
}

/* === AI输出框：飘落樱花瓣SVG动效 === */
.is-assistant > div.border-muted::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    opacity: 0.55 !important;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='400' height='300' viewBox='0 0 400 300'><defs><g id='p'><path d='M0,-6 C3,-4 4,-2 4,0 C4,3 2,5 0,6 C-2,5 -4,3 -4,0 C-4,-2 -3,-4 0,-6 Z' fill='%23ffd1d9' opacity='0.9'/></g></defs><g><use href='%23p' x='60' y='30'><animateTransform attributeName='transform' type='translate' from='0,-40' to='0,340' dur='14s' repeatCount='indefinite'/><animateTransform attributeName='transform' type='rotate' from='0' to='360' dur='6s' additive='sum' repeatCount='indefinite'/></use></g><g><use href='%23p' x='160' y='80'><animateTransform attributeName='transform' type='translate' from='0,-80' to='0,360' dur='18s' repeatCount='indefinite'/><animateTransform attributeName='transform' type='rotate' from='0' to='-360' dur='8s' additive='sum' repeatCount='indefinite'/></use></g><g><use href='%23p' x='260' y='10'><animateTransform attributeName='transform' type='translate' from='0,-30' to='0,330' dur='16s' repeatCount='indefinite'/><animateTransform attributeName='transform' type='rotate' from='0' to='360' dur='5s' additive='sum' repeatCount='indefinite'/></use></g><g><use href='%23p' x='340' y='60'><animateTransform attributeName='transform' type='translate' from='0,-60' to='0,360' dur='20s' repeatCount='indefinite'/><animateTransform attributeName='transform' type='rotate' from='0' to='-360' dur='9s' additive='sum' repeatCount='indefinite'/></use></g><g><use href='%23p' x='110' y='150'><animateTransform attributeName='transform' type='translate' from='0,-20' to='0,200' dur='15s' repeatCount='indefinite'/><animateTransform attributeName='transform' type='rotate' from='0' to='360' dur='7s' additive='sum' repeatCount='indefinite'/></use></g><g><use href='%23p' x='220' y='200'><animateTransform attributeName='transform' type='translate' from='0,-50' to='0,150' dur='17s' repeatCount='indefinite'/><animateTransform attributeName='transform' type='rotate' from='0' to='-360' dur='6s' additive='sum' repeatCount='indefinite'/></use></g></svg>") !important;
    background-repeat: repeat !important;
    background-size: 400px 300px !important;
}

/* === AI输出框：右下角和风印章 === */
.is-assistant > div.border-muted::after {
    content: '✿' !important;
    position: absolute !important;
    right: 14px !important;
    bottom: 8px !important;
    font-size: 14px !important;
    color: #e8a4ae !important;
    opacity: 0.4 !important;
    z-index: 0 !important;
    pointer-events: none !important;
}

/* === 用户输入框：去除动效，更纯净 === */
.is-user > div.border-muted {
    background: linear-gradient(160deg, #fdfcf8 0%, #f9f3ee 100%) !important;
    border: 1px dashed #d9c2b8 !important;
}

.is-user > div.border-muted::before {
    display: none !important;
}

/* === 主文本：温润墨色，轻小说排印 (适配Rili Markdown渲染器) === */
.rili-markdown-renderer {
    color: #4a3b3f !important;
    font-family: "Hiragino Mincho ProN", "Yu Mincho", "Songti SC", -apple-system, "PingFang SC", "Microsoft YaHei", serif !important;
    font-size: 15px !important;
    line-height: 1.85 !important;
    letter-spacing: 0.3px !important;
    background: transparent !important;
    position: relative !important;
    z-index: 1 !important;
}

.rili-markdown-renderer strong,
.rili-markdown-renderer b {
    color: #c25670 !important;
    font-weight: bold !important;
}

.rili-markdown-renderer em {
    color: #8b6f9a !important;
    font-style: italic !important;
}

.rili-markdown-renderer code {
    background: rgba(255, 220, 225, 0.5) !important;
    color: #a04860 !important;
    padding: 2px 6px !important;
    border-radius: 4px !important;
    font-size: 13px !important;
}

.rili-markdown-renderer blockquote {
    border-left: 3px solid #f3c9d0 !important;
    background: rgba(255, 244, 236, 0.6) !important;
    color: #6a5358 !important;
    padding: 8px 12px !important;
    border-radius: 0 8px 8px 0 !important;
}

.rili-markdown-renderer details {
    background: rgba(255, 250, 245, 0.7) !important;
    border: 1px solid rgba(243, 201, 208, 0.5) !important;
    border-radius: 10px !important;
    padding: 8px 12px !important;
    margin: 8px 0 !important;
}

.rili-markdown-renderer summary {
    color: #b8546b !important;
    font-weight: bold !important;
    cursor: pointer !important;
}

/* === 底部操作按钮：和果子风 (适配Rili底栏图标) === */
/* 去除Rili按钮组默认灰色底 */
.bg-muted.rounded.flex.p-0\.5 {
    background: transparent !important;
}

.is-user button.rounded-full,
.is-assistant button.rounded-full {
    background: rgba(255, 240, 240, 0.6) !important;
    border-radius: 12px !important;
    transition: all 0.3s ease !important;
}

.is-user button.rounded-full:hover,
.is-assistant button.rounded-full:hover {
    background: rgba(243, 201, 208, 0.5) !important;
    transform: translateY(-1px) !important;
}

/* Rili使用SVG Stroke代替文字颜色 */
.is-user button.rounded-full svg,
.is-assistant button.rounded-full svg {
    stroke: #b07a85 !important;
    color: transparent !important;
}

.is-user button.rounded-full:hover svg,
.is-assistant button.rounded-full:hover svg {
    stroke: #8a4a5a !important;
}

/* === 模型名 & Token (适配Rili底部消耗信息) === */
.is-assistant .text-muted-foreground.font-mono {
    color: #a89090 !important;
    font-size: 12px !important;
    font-style: italic !important;
    background: transparent !important;
}

.is-assistant .text-muted-foreground.font-mono span:not([class*="bg-"]) {
    color: #d49060 !important;
}

/* === 加载动画：三粒和果子跳动 (完美替换Rili的跳动圆点) === */
/* 隐藏Rili原生的圆点 */
.is-assistant .flex.gap-2.w-full.h-full.items-center.justify-center span {
    display: none !important;
}

/* 注入和果子SVG */
.is-assistant .flex.gap-2.w-full.h-full.items-center.justify-center {
    position: relative !important;
    min-height: 24px !important;
    min-width: 48px !important;
}

.is-assistant .flex.gap-2.w-full.h-full.items-center.justify-center::before {
    content: '' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 48px !important;
    height: 18px !important;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='48' height='18' viewBox='0 0 48 18'><circle cx='8' cy='9' r='4' fill='%23f3a8b4'><animate attributeName='cy' values='9;3;9' dur='1s' repeatCount='indefinite' begin='0s'/><animate attributeName='opacity' values='0.6;1;0.6' dur='1s' repeatCount='indefinite' begin='0s'/></circle><circle cx='24' cy='9' r='4' fill='%23e89bb0'><animate attributeName='cy' values='9;3;9' dur='1s' repeatCount='indefinite' begin='0.2s'/><animate attributeName='opacity' values='0.6;1;0.6' dur='1s' repeatCount='indefinite' begin='0.2s'/></circle><circle cx='40' cy='9' r='4' fill='%23d97b9a'><animate attributeName='cy' values='9;3;9' dur='1s' repeatCount='indefinite' begin='0.4s'/><animate attributeName='opacity' values='0.6;1;0.6' dur='1s' repeatCount='indefinite' begin='0.4s'/></circle></svg>") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

/* === 移动端适配 === */
@media (max-width: 480px) {
    .is-user > div.border-muted,
    .is-assistant > div.border-muted {
        padding: 14px 16px !important;
        border-radius: 14px !important;
    }
    .rili-markdown-renderer {
        font-size: 14px !important;
        line-height: 1.75 !important;
    }
    .is-assistant > div.border-muted::before {
        background-size: 300px 240px !important;
        opacity: 0.4 !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .is-assistant > div.border-muted::before {
        opacity: 0.3 !important;
    }
}

/* 
===================================================================
附加组件适配 (由于B平台HTML未提供全局UI结构，此处采用B平台通用Tailwind类名进行映射)
=================================================================== 
*/

/* 顶部栏：和风纸卷感 */
header.sticky.top-0, .sticky.top-0.z-50 {
    background: linear-gradient(180deg, #fffaf3 0%, #fff4ec 100%) !important;
    border-bottom: 1px solid #f3c9d0 !important;
    box-shadow: 0 2px 12px rgba(243, 201, 208, 0.2) !important;
    backdrop-filter: blur(8px) !important;
}

/* 底部输入栏 (Rili通用Textarea) */
textarea, .group textarea {
    background: linear-gradient(160deg, #fdfcf8 0%, #fff4ec 100%) !important;
    border: 1px solid #f3c9d0 !important;
    border-radius: 18px !important;
    box-shadow:
        0 4px 16px rgba(243, 201, 208, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.6) !important;
    transition: box-shadow 0.3s ease !important;
    color: #4a3b3f !important;
    font-family: "Hiragino Mincho ProN", "Yu Mincho", "Songti SC", serif !important;
}

textarea:focus-within, .group textarea:focus-within {
    box-shadow:
        0 6px 22px rgba(243, 201, 208, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
}

textarea::placeholder {
    color: #c9a8b0 !important;
    font-style: italic !important;
    font-size: 14px !important;
}