/* =============================================
   🍬 甜甜校园风 · RiliChat 完全重制版
   日间明亮清爽 / 黑夜柔和护眼 / 自动切换
   ============================================= */

/* ========== 滚动条 ========== */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(255,150,160,0.3); border-radius: 10px; }
* { scrollbar-color: rgba(255,150,160,0.3) transparent; }

/* ============================================
   💬 对话角色标签（日间鲜亮 / 黑夜柔和）
   ============================================ */
c { color: #c8851a !important; font-weight: 700; }        /* 主角：暖橘金，像阳光 */
g { color: #e05570 !important; font-weight: 600; }        /* 女生：明亮草莓红 */
m { color: #4488cc !important; font-weight: 600; }        /* 男生：清爽牛仔蓝 */
[data-theme="dark"] c { color: #f5d06b !important; }
[data-theme="dark"] g { color: #ff9eb5 !important; }
[data-theme="dark"] m { color: #8dc8f0 !important; }

/* ========== 💗 用户消息气泡（日间-奶油底） ========== */
.group.is-user div.border.border-muted {
    background: #fff8f6 !important;
    border: 1.5px solid #fccdd3 !important;
    border-radius: 6px 20px 6px 20px !important;
    color: #4a3035 !important;
    box-shadow: 0 2px 8px rgba(255,180,180,0.12) !important;
}

/* ========== 💙 AI消息气泡（日间-天蓝底） ========== */
.group.is-assistant div.border.border-muted {
    background: #f8fafd !important;
    border: 1.5px solid #cdddf5 !important;
    border-radius: 20px 6px 20px 6px !important;
    color: #303648 !important;
    box-shadow: 0 2px 8px rgba(180,200,240,0.12) !important;
}

/* ========== 🌙 黑夜 - 用户气泡 ========== */
[data-theme="dark"] .group.is-user div.border.border-muted {
    background: #26202a !important;
    border-color: #543a48 !important;
    color: #ddc8ce !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.25) !important;
}

/* ========== 🌙 黑夜 - AI气泡 ========== */
[data-theme="dark"] .group.is-assistant div.border.border-muted {
    background: #1e2430 !important;
    border-color: #364860 !important;
    color: #ccd4e0 !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.25) !important;
}

/* ========== ✏️ 输入框（日间-笔记本格线感） ========== */
#prompt-input [data-slot="input-group"] {
    border: 1.5px solid #e8ccd0 !important;
    border-radius: 16px !important;
    background: rgba(255,252,250,0.7) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    box-shadow: 0 1px 6px rgba(0,0,0,0.04) !important;
}
#prompt-input [data-slot="input-group"]:focus-within {
    border-color: #f08c9e !important;
    box-shadow: 0 0 0 3px rgba(240,140,158,0.1) !important;
}
#prompt-input textarea {
    border-radius: 16px !important;
    caret-color: #f08c9e !important;
    font-size: 0.94rem !important;
}
#prompt-input textarea::placeholder { color: #c0a8ae !important; font-style: italic; }

/* ========== 🌙 输入框黑夜 ========== */
[data-theme="dark"] #prompt-input [data-slot="input-group"] {
    border-color: #4a3840 !important;
    background: rgba(22,18,24,0.7) !important;
}
[data-theme="dark"] #prompt-input [data-slot="input-group"]:focus-within {
    border-color: #e07088 !important;
    box-shadow: 0 0 0 3px rgba(224,112,136,0.15) !important;
}
[data-theme="dark"] #prompt-input textarea::placeholder { color: #7a6a70 !important; }

/* ========== 📨 发送按钮 ========== */
button[type="submit"] {
    background: #f08c9e !important;
    color: #fff !important;
    border-radius: 50% !important;
    box-shadow: 0 2px 10px rgba(240,140,158,0.3) !important;
    transition: all 0.2s ease !important;
}
button[type="submit"]:hover {
    background: #f5a0b0 !important;
    transform: scale(1.06) !important;
    box-shadow: 0 4px 16px rgba(240,140,158,0.4) !important;
}
button[type="submit"]:active { transform: scale(0.95) !important; }
[data-theme="dark"] button[type="submit"] { background: #d06078 !important; }

/* ========== 🔘 工具栏按钮 ========== */
#prompt-input-header button,
#prompt-input-footer button:not([type="submit"]) {
    border-radius: 8px !important;
    transition: all 0.15s ease !important;
}
#prompt-input-header button:hover,
#prompt-input-footer button:not([type="submit"]):hover {
    background: rgba(240,140,158,0.1) !important;
}

/* ========== 💮 文中强调 ========== */
.rili-markdown-renderer em, [class*="markdown"] em { color: #e05570 !important; }
.rili-markdown-renderer strong, [class*="markdown"] strong { color: #d04460 !important; }

/* ========== 🖱 选中文字 ========== */
::selection { background: rgba(240,140,158,0.2) !important; }

/* ========== 🔗 链接 ========== */
.rili-markdown-renderer a { color: #e05570 !important; }
.rili-markdown-renderer a:hover { color: #c04058 !important; }

/* ========== 🔲 代码块 ========== */
.rili-markdown-renderer code, [class*="markdown"] code {
    background: rgba(240,140,158,0.06) !important;
    border: 1px solid rgba(240,140,158,0.18) !important;
    border-radius: 4px !important;
    padding: 1px 6px !important;
    font-size: 0.9em !important;
    color: #d04460 !important;
}
[data-theme="dark"] .rili-markdown-renderer code { color: #ff9eb5 !important; }

/* ========== 📋 引用块 ========== */
.rili-markdown-renderer blockquote, [class*="markdown"] blockquote {
    border-left: 3px solid #fccdd3 !important;
    background: rgba(240,140,158,0.03) !important;
    padding: 8px 16px !important;
    border-radius: 0 6px 6px 0 !important;
}

/* ========== ✨ 消息入场（轻弹入） ========== */
.group.is-user > div > div, .group.is-assistant > div > div {
    animation: msgIn 0.35s cubic-bezier(0.34,1.3,0.64,1) !important;
}
@keyframes msgIn {
    from { opacity: 0; transform: translateY(10px) scale(0.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

/* ========== 🌈 水平线 ========== */
.rili-markdown-renderer hr, [class*="markdown"] hr {
    border: none !important; height: 1px !important;
    background: linear-gradient(to right, transparent, #e8ccd0, transparent) !important;
    margin: 16px 0 !important;
}

/* ========== 📊 表格 ========== */
.rili-markdown-renderer th, [class*="markdown"] th {
    background: rgba(240,140,158,0.08) !important;
    padding: 8px 12px !important;
    border-bottom: 2px solid rgba(240,140,158,0.2) !important;
}
.rili-markdown-renderer td, [class*="markdown"] td {
    padding: 6px 12px !important;
    border-bottom: 1px solid rgba(240,140,158,0.08) !important;
}

/* ========== 🎀 顶栏 ========== */
nav.sticky.top-0 {
    border-bottom: 1px solid rgba(240,140,158,0.12) !important;
}
[data-theme="dark"] nav.sticky.top-0 {
    border-bottom-color: rgba(224,112,136,0.15) !important;
}

/* ========== 📱 移动端 ========== */
@media (max-width: 768px) {
    .group.is-user div.border.border-muted { border-radius: 4px 16px 4px 16px !important; }
    .group.is-assistant div.border.border-muted { border-radius: 16px 4px 16px 4px !important; }
    #prompt-input [data-slot="input-group"] { border-radius: 14px !important; }
}