/* ========================================
   🌸 樱花庄的宠物女孩 - 深度美化主题 🌸
   ======================================== */

/* ----------------------------------------
   1. 椎名真白的画板：AI 消息气泡 (画布白 + 颜料边框)
   ---------------------------------------- */
#customized-answer-content {
    background: #FFFBF0 !important; /* 纯净的暖白画布色 */
    border-radius: 24px 24px 24px 6px !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.04), inset 0 0 0 2px #FDE2E4 !important; /* 内嵌淡淡的樱花粉画框 */
    padding: 16px 20px !important;
    transition: all 0.3s ease !important;
}

#customized-answer-content .markdown-body, 
#customized-answer-content .text-gray-900 {
    color: #4A3B32 !important; /* 樱花庄的温馨老木头色，护眼且对比度极佳 */
    font-family: 'Nunito', 'Microsoft YaHei', sans-serif !important;
}

/* ----------------------------------------
   2. 神田空太的日常：用户 消息气泡 (樱花粉渐变)
   ---------------------------------------- */
#customized-question-content {
    background: linear-gradient(135deg, #FDE2E4 0%, #F9B4AB 100%) !important; /* 春日落樱渐变 */
    border-radius: 24px 24px 6px 24px !important;
    box-shadow: 0 6px 16px rgba(249, 180, 171, 0.3) !important;
    padding: 16px 20px !important;
}

#customized-question-content .markdown-body, 
#customized-question-content .text-gray-900 {
    color: #4A3B32 !important;
    font-weight: 500 !important;
}

/* 顶部心情装饰条替换 */
#customized-question-content .bg-\[\#c9e1e9\] {
    background: #FF9A9E !important; /* 活力粉红 */
}
#customized-answer-content .bg-\[\#F1CBCB\] {
    background: #FFD166 !important; /* 真白发色的浅金 */
}

/* ----------------------------------------
   3. 天才的思绪：AI 专属花瓣加载动画 (SVG SMIL)
   ---------------------------------------- */
#customized-answer-content [class*="dot-flashing"] {
    display: none !important;
}
#customized-answer-content .flex.items-center.justify-center.w-6.h-5 {
    position: relative !important;
}
#customized-answer-content .flex.items-center.justify-center.w-6.h-5::before {
    content: '';
    display: block !important;
    width: 24px !important;
    height: 24px !important;
    /* 旋转的樱花花瓣 SVG */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23F9B4AB'%3E%3Cpath d='M12,2c-1.1,0-2,0.9-2,2c0,1.8-1.5,3.3-3.3,3.3c-1.1,0-2,0.9-2,2c0,1.1,0.9,2,2,2c1.8,0,3.3,1.5,3.3,3.3c0,1.1,0.9,2,2,2c1.1,0,2-0.9,2-2c0-1.8,1.5-3.3,3.3-3.3c1.1,0,2-0.9,2-2c0-1.1-0.9-2-2-2c-1.8,0-3.3-1.5-3.3-3.3C14,2.9,13.1,2,12,2z'/%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 12 12' to='360 12 12' dur='2.5s' repeatCount='indefinite'/%3E%3C/svg%3E") !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

/* ----------------------------------------
   4. 青春的留言板：底部输入区与发送按钮
   ---------------------------------------- */
#ai-chat-input {
    background: rgba(255, 255, 255, 0.85) !important;
    border: 2px solid #FDE2E4 !important;
    border-radius: 24px !important;
    color: #4A3B32 !important;
    box-shadow: 0 4px 15px rgba(249, 180, 171, 0.1) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

#ai-chat-input:focus {
    background: #FFFFFF !important;
    border-color: #F9B4AB !important;
    box-shadow: 0 6px 20px rgba(249, 180, 171, 0.25) !important;
    outline: none !important;
}

#ai-chat-input::placeholder {
    color: #CBA5A0 !important;
}

/* 纸飞机变身樱花飞舞：发送按钮 */
#ai-send-button {
    background: linear-gradient(135deg, #F9B4AB 0%, #FF9A9E 100%) !important;
    border-radius: 50% !important;
    box-shadow: 0 4px 12px rgba(249, 180, 171, 0.4) !important;
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
}

#ai-send-button:hover {
    transform: scale(1.15) rotate(10deg) !important;
    box-shadow: 0 6px 16px rgba(249, 180, 171, 0.6) !important;
}

/* ----------------------------------------
   5. 樱花庄的门牌：界面控制区与快捷按钮
   ---------------------------------------- */
#customized-model-selector, 
#header-setting-button, 
#ai-mod-button2 .MuiButton-outlinedPrimary {
    background: #FFFBF0 !important;
    border: 1.5px solid #FDE2E4 !important;
    color: #4A3B32 !important;
    border-radius: 20px !important;
    box-shadow: 0 2px 8px rgba(249, 180, 171, 0.15) !important;
    font-weight: bold !important;
    transition: all 0.2s ease !important;
}

#customized-model-selector:hover, 
#header-setting-button:hover, 
#ai-mod-button2 .MuiButton-outlinedPrimary:hover {
    background: #FDE2E4 !important;
    transform: translateY(-2px) !important;
}

/* 模型消耗 Token 颜色修改为真白的浅金色 */
#customized-answer-content .text-orange-500 {
    color: #E6A845 !important;
    font-weight: 700 !important;
}

/* ----------------------------------------
   6. 消息操作栏图标悬浮特效
   ---------------------------------------- */
#customized-answer-content button:hover svg,
#customized-question-content button:hover svg {
    filter: drop-shadow(0 0 3px #F9B4AB) !important;
    transform: scale(1.1) !important;
    transition: all 0.2s ease !important;
}