/* --- 情调红粉爱心主题 --- */

/* 1. 隐藏默认的加载动画 */
.style-module__AtdJSq__dot-flashing.style-module__AtdJSq__text {
    display: none !important;
}

/* 2. 自定义跳动爱心加载动画 */
.flex.items-center.justify-center.w-6.h-5 {
    position: relative !important;
    width: 50px !important;
    height: 30px !important;
}

.flex.items-center.justify-center.w-6.h-5::before {
    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 30" width="50" height="30"><path id="h" fill="%23FF8FAB" d="M10 3C7.2 3 5 5.2 5 8c0 3.1 2.6 5.6 6.1 8.5L12 17.2l.9-.7c3.5-2.9 6.1-5.4 6.1-8.5 0-2.8-2.2-5-5-5-1.9 0-3.5 1.1-4.4 2.6C8.5 4.1 6.9 3 5.4 3z" transform="translate(-4, 0)"/><use href="%23h" x="15"><animateTransform attributeName="transform" type="translate" values="-4 0; -4 -3; -4 0" begin="0s" dur="0.8s" repeatCount="indefinite"/></use><use href="%23h" x="30"><animateTransform attributeName="transform" type="translate" values="-4 0; -4 -5; -4 0" begin="0.2s" dur="0.8s" repeatCount="indefinite"/></use><use href="%23h" x="45"><animateTransform attributeName="transform" type="translate" values="-4 0; -4 -3; -4 0" begin="0.4s" dur="0.8s" repeatCount="indefinite"/></use></svg>');
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
}

/* 3. 统一聊天框美化 (输入与输出) */
.bg-gray-100\/90.relative.inline-block {
    /* -- 主背景: 红粉线性渐变 -- */
    background-image: 
        /* 叠加一层半透明的爱心图案 */
        url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMCIgaGVpZ2h0PSIzMCIgdmlld0JveD0iMCAwIDEwMCAxMDAiPjxwYXRoIGQ9Ik0zMS4xODQgODQuNzMyYy0uMzk1LS4yMDgtLjguNDMtLjU0IDEuMDMuNDM0IDEuMDAzIDEuNDIgMS44NjIgMi4zNjcgMi4xMjlDNTQuMjc2IDkyLjQ5MiA2OC4zMzIgNzMuOTA3IDY4LjMzMiA1MS42MkM2OC4zMzIgMzAuODk4IDUxLjQzNCAxNCAzMS4xODQgMTQgMTAuOTMzIDE0IC01Ljk2MyAzMC44OTggLTUuOTYzIDUxLjYyYzAgMjIuMjg3IDE0LjA1NiA0MC44NzIgMzUuMjEzIDM0LjQ4MyAuMzk2LS4xMi42MS0uNTUuNDc0LS45NDctMS4xMjItMy4yMS0zLjU2Mi04LjYxMy00LjU0LTExLjQyNHoiIGZpbGw9InJnYmEoMjU1LCAxNzAsIDE4MCwgMC4xNSkiLz48L3N2Zz4='),
        /* 底层主渐变色 */
        linear-gradient(135deg, #a00030 0%, #d82148 50%, #b32a53 100%) !important;
    background-repeat: repeat, no-repeat !important;
    background-size: 35px 35px, cover !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    border-radius: 16px !important;
    box-shadow: 0 6px 25px rgba(160, 0, 48, 0.45), 0 0 5px rgba(255, 105, 180, 0.3) inset !important;
    color: #FFFFFF !important; /* 确保所有未被覆盖的子元素默认为亮色 */
}

/* 4. 主要文本内容样式 (强制可读性) */
.markdown-body {
    color: #FFFFFF !important;
    background: transparent !important; /* 确保文本背景透明以显示渐变 */
    text-shadow: 0 1px 2px rgba(0,0,0,0.3) !important; /* 轻微阴影增加辨识度 */
}

/* --- 加强特定文本元素 --- */
.markdown-body p, .markdown-body li {
    color: #F5F5F5 !important; /* 主要段落使用非常柔和的白色 */
}

.markdown-body strong, .markdown-body b {
    color: #FFD1E3 !important; /* 粗体文本使用亮粉色突出 */
    font-weight: bold !important;
}

/* 5. 底部附加元素样式 (按钮, 模型名称, Token消耗) */
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary,
.MuiTypography-root.MuiTypography-body2.css-6c0gf2,
.text-orange-500 {
    color: #FFC0CB !important; /* 浅粉色 */
    opacity: 0.8 !important;
    transition: opacity 0.3s ease !important;
}

.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary:hover {
    opacity: 1 !important;
    background-color: rgba(255, 255, 255, 0.1) !important;
}

/* 6. [可选] 隐藏顶部的颜色装饰条 */
[class*="bg-[#F1CBCB]"], 
[class*="bg-[#c9e1e9]"] {
    display: none !important;
}