/* =============================================
   暖居 · 四人合租主题
   base-hue:30  base-sat:40%  is-dark:0  accent-hue:28  accent-sat:65%

   bg-deep:#faf5f0   bg-default:#fffcf8   bg-paper:#fffaf5
   text-main:#3d2e1f    text-sub:#8b7355
   accent:#c8945a       glow:rgba(200,148,90,0.35)

   亮点① 暖棕米色调，模拟合租公寓暖光灯氛围
   亮点② 折叠面板胶囊按钮+展开旋转+柔光呼吸
   亮点③ 聊天气泡暖边框+悬浮微升+内光晕
   ============================================= */

/* ===== 危险区域（隐藏特定背景色） ===== */

/* ===== 全局基础 ===== */
.max-w-\[720px\] {
    --bg-deep: #faf5f0;
    --bg-default: #fffcf8;
    --bg-paper: #fffaf5;
    --text-main: #3d2e1f;
    --text-sub: #8b7355;
    --accent: #c8945a;
    --accent-soft: #d4a574;
    --accent-glow: rgba(200, 148, 90, 0.35);
    --border: #e8d5c4;
    --border-light: #f0e4d6;
    --shadow-warm: rgba(139, 115, 85, 0.08);
    --shadow-deep: rgba(139, 115, 85, 0.15);
    --radius-pill: 9999px;
    --radius-card: 12px;
    --radius-inner: 8px;
    --transition-fast: 0.2s ease;
    --transition-normal: 0.3s ease;
}

/* ===== 顶部导航 ===== */
.sticky.w-full.top-0.flex.items-center {
    background: rgba(255, 252, 248, 0.88);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--border-light);
    box-shadow: 0 1px 8px var(--shadow-warm);
}

/* ===== 侧边栏 ===== */
.shadow-lg.border-r.border-gray-200 {
    background: var(--bg-default);
    border-right-color: var(--border-light) !important;
}

.conversation-text {
    color: var(--text-main);
}

.conversation-text:hover {
    color: var(--accent);
}

/* ===== 聊天气泡 ===== */
.chat-container .group .relative.inline-block,
.bg-gray-100\/90.relative.inline-block {
    background-color: var(--bg-paper);
    border: 1px solid var(--border);
    border-radius: var(--radius-card);
    box-shadow: 0 2px 12px var(--shadow-warm);
    transition: transform var(--transition-fast), box-shadow var(--transition-fast);
}

.chat-container .group .relative.inline-block:hover,
.bg-gray-100\/90.relative.inline-block:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 16px var(--shadow-deep);
}

.chat-container .group .relative.inline-block > .MuiBox-root.css-0 {
    display: none;
}

/* Markdown正文 */
.markdown-body {
    color: var(--text-main);
    line-height: 1.8;
}

.markdown-body h1, .markdown-body h2, .markdown-body h3 {
    color: var(--text-main);
    border-bottom-color: var(--border-light);
}

.markdown-body a {
    color: var(--accent);
}

.markdown-body a:hover {
    color: var(--accent-soft);
    text-decoration: underline;
}

.markdown-body strong {
    color: var(--text-main);
}

.markdown-body em {
    color: var(--text-sub);
    font-style: italic;
}

.markdown-body blockquote {
    border-left-color: var(--accent);
    background: rgba(200, 148, 90, 0.06);
    color: var(--text-sub);
}

.markdown-body table th {
    background: rgba(200, 148, 90, 0.08);
    color: var(--text-main);
    border-color: var(--border);
}

.markdown-body table td {
    border-color: var(--border-light);
}

.markdown-body table tr:nth-child(even) {
    background: rgba(200, 148, 90, 0.03);
}

.markdown-body ul li::marker {
    color: var(--accent);
}

/* ===== 折叠面板（状态栏核心） ===== */
.markdown-body details {
    border: none;
    margin: 14px 0;
    background-color: transparent;
    overflow: visible;
}

.markdown-body summary {
    display: inline-flex;
    align-items: center;
    padding: 8px 18px;
    cursor: pointer;
    background-color: var(--bg-paper);
    color: var(--text-main);
    font-weight: 500;
    font-size: 0.92rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-pill);
    box-shadow: 0 2px 6px var(--shadow-warm);
    list-style: none;
    transition: all var(--transition-fast);
    user-select: none;
}

.markdown-body summary::-webkit-details-marker {
    display: none;
}

.markdown-body summary:hover {
    background-color: var(--accent);
    color: #fff;
    border-color: var(--accent);
    box-shadow: 0 2px 12px var(--accent-glow);
    transform: translateY(-1px);
}

.markdown-body summary:active {
    transform: scale(0.97);
}

.markdown-body summary::before {
    content: '▶';
    display: inline-block;
    margin-right: 10px;
    font-size: 0.65em;
    color: var(--accent);
    transition: transform var(--transition-normal);
    transform-origin: center;
}

.markdown-body summary:hover::before {
    color: #fff;
}

.markdown-body details[open] > summary::before {
    transform: rotate(90deg);
}

.markdown-body details[open] > summary {
    background-color: var(--accent);
    color: #fff;
    border-color: var(--accent);
    box-shadow: 0 2px 12px var(--accent-glow);
}

/* 折叠面板内部内容区 */
.markdown-body details > pre,
.markdown-body details > table,
.markdown-body details > .markdown-body {
    margin-top: 10px;
    border: 1px solid var(--border-light);
    border-radius: var(--radius-inner);
    background-color: var(--bg-paper);
    padding: 12px 16px;
    overflow-x: auto;
}

/* ===== 代码块 ===== */
.markdown-body pre {
    background: #3d2e1f;
    border: 1px solid #5a4535;
    border-radius: var(--radius-inner);
    padding: 16px;
    overflow-x: auto;
}

.markdown-body pre code {
    color: #f0e4d6;
    font-size: 0.88rem;
    line-height: 1.6;
}

.markdown-body :not(pre) > code {
    background: rgba(200, 148, 90, 0.12);
    color: var(--accent);
    padding: 2px 7px;
    border-radius: 4px;
    font-size: 0.88em;
}

/* ===== 加载动画 ===== */
@keyframes ai-answer-spinner-rotation {
    to { transform: rotate(360deg); }
}

@keyframes warmPulse {
    0%, 100% { box-shadow: 0 0 0 0 var(--accent-glow); }
    50% { box-shadow: 0 0 0 6px transparent; }
}

#ai-chat-answer .chat-answer-container div:has(> .style_dot-flashing__8L91Q) {
    justify-content: flex-start;
    width: auto;
    height: auto;
}

#ai-chat-answer .chat-answer-container .style_dot-flashing__8L91Q::before,
#ai-chat-answer .chat-answer-container .style_dot-flashing__8L91Q::after {
    content: none;
    display: none;
}

#ai-chat-answer .chat-answer-container .style_dot-flashing__8L91Q {
    background: transparent;
    width: 16px;
    height: 16px;
    box-sizing: border-box;
    flex-shrink: 0;
    border: 2px solid rgba(200, 148, 90, 0.2);
    border-left-color: var(--accent);
    border-radius: 50%;
    animation: ai-answer-spinner-rotation 0.8s linear infinite;
}

/* ===== 底部输入区 ===== */
#ai-chat-bottom-input {
    background: rgba(255, 252, 248, 0.92);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-top: 1px solid var(--border-light);
}

#ai-chat-input,
textarea.rc-textarea {
    background: var(--bg-paper) !important;
    color: var(--text-main) !important;
    border-color: var(--border) !important;
    border-radius: var(--radius-inner) !important;
    caret-color: var(--accent);
}

#ai-chat-input:focus,
textarea.rc-textarea:focus {
    border-color: var(--accent) !important;
    box-shadow: 0 0 0 3px var(--accent-glow) !important;
}

#ai-chat-input::placeholder,
textarea.rc-textarea::placeholder {
    color: var(--accent-soft);
}

#ai-send-button {
    background: var(--accent) !important;
    border-radius: var(--radius-inner) !important;
    transition: all var(--transition-fast);
}

#ai-send-button:hover {
    background: var(--accent-soft) !important;
    box-shadow: 0 2px 10px var(--accent-glow);
}

#ai-send-button:active {
    transform: scale(0.95);
}

.bg-gradient-to-t {
    background: transparent !important;
}

/* ===== 评论区 ===== */
div[class*="w-full"][class*="bg-white"][class*="bottom-0"] {
    background: var(--bg-default) !important;
}

div.text-lg.font-bold {
    color: var(--text-main);
}

div.group.ml-0 {
    background: var(--bg-paper);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-inner);
}

div.ml-8.border-l {
    border-left-color: var(--accent) !important;
}

div.style_divider__mW0YX::before {
    content: '· · ·';
    display: block;
    text-align: center;
    color: var(--accent-soft);
    letter-spacing: 8px;
    padding: 8px 0;
}

/* ===== MUI 组件 ===== */
.MuiButton-root {
    color: var(--text-main) !important;
    border-color: var(--border) !important;
}

.MuiButton-contained {
    background: var(--accent) !important;
    color: #fff !important;
}

.MuiButton-contained:hover {
    background: var(--accent-soft) !important;
}

.MuiIconButton-root {
    color: var(--text-sub) !important;
}

.MuiIconButton-root:hover {
    color: var(--accent) !important;
}

.MuiOutlinedInput-root .MuiOutlinedInput-notchedOutline {
    border-color: var(--border) !important;
}

.MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline {
    border-color: var(--accent) !important;
}

.MuiDivider-root {
    border-color: var(--border-light) !important;
}

.MuiTypography-root {
    color: var(--text-main) !important;
}

/* ===== 滚动条 ===== */
::-webkit-scrollbar {
    width: 6px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: var(--border);
    border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--accent-soft);
}

/* ===== 选中色 ===== */
::selection {
    background: rgba(200, 148, 90, 0.25);
    color: var(--text-main);
}

/* ===== 降速（prefers-reduced-motion） ===== */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}