/* Light Theme Enhancements - Better Contrast */

/* 模态框遮罩 - 亮色模式由 body.light-theme 的 --modal-overlay-bg 继承 */

body.light-theme #character-hall-modal {
    background: rgba(248, 250, 252, 0.95) !important;
}

/* 创建/编辑角色、用户设置、模型大厅 - 亮色模式遮罩 */
body.light-theme #create-char-modal,
body.light-theme #edit-char-modal,
body.light-theme #user-settings-modal,
body.light-theme #model-hub-modal {
    background: rgba(248, 250, 252, 0.95) !important;
}

/* 绘图配置弹窗遮罩 - 亮色模式 */
body.light-theme .draw-config-modal-overlay {
    background: rgba(248, 250, 252, 0.85);
}

/* 图片/头像预览覆盖层 - 亮色模式浅色遮罩 */
body.light-theme .image-preview-overlay,
body.light-theme .char-avatar-preview-overlay {
    background-color: rgba(248, 250, 252, 0.95) !important;
}

body.light-theme .image-preview-download-btn,
body.light-theme .char-avatar-btn {
    background: rgba(30, 41, 59, 0.9) !important;
    border-color: rgba(30, 41, 59, 0.3) !important;
    color: #f1f5f9 !important;
}

body.light-theme .image-preview-download-btn:hover,
body.light-theme .char-avatar-btn:hover {
    background: rgba(30, 41, 59, 0.95) !important;
}

body.light-theme .char-avatar-preview-image {
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);
}

/* 角色设定预览框 - 亮色模式 */
body.light-theme .prompt-preview-box {
    background: rgba(0, 0, 0, 0.06);
}

/* 错误报告框 - 亮色模式 */
body.light-theme .error-debug-box {
    background: rgba(0, 0, 0, 0.06);
}

body.light-theme .error-debug-box .error-debug-text,
body.light-theme .error-debug-box .error-debug-value {
    color: #1e293b;
}

body.light-theme .error-debug-box .error-debug-pre {
    color: #475569;
}

body.light-theme .error-debug-raw-footer {
    border-top-color: rgba(0, 0, 0, 0.15);
}

/* 开场白空状态卡片 - 亮色模式 */
body.light-theme .empty-state-first-msg-card {
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

body.light-theme .empty-state-first-msg-label {
    color: #64748b;
}

body.light-theme .empty-state-first-msg-text {
    color: #1e293b;
}

body.light-theme .empty-state-first-msg-hint {
    color: #94a3b8;
}

/* 懒加载占位符标签 - 亮色模式 */
body.light-theme .lazy-image-placeholder-label {
    background: rgba(255, 255, 255, 0.95);
    color: var(--text-primary);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

/* 模态框关闭按钮 - 增强可见性 */

body.light-theme .modal-close-btn {
    color: #64748b;
    background: rgba(100, 116, 139, 0.1);
}

body.light-theme .modal-close-btn:hover {
    background: #ef4444;
    color: #ffffff;
}

/* 设置面板关闭按钮 */
body.light-theme .settings-close-btn {
    background: #ffffff;
    border-color: #cbd5e1;
    color: #64748b;
}

body.light-theme .settings-close-btn:hover {
    color: #1e293b;
    background: #f8fafc;
    border-color: #4f46e5;
}

/* 白天模式按钮优化 */
body.light-theme .btn-create,
body.light-theme .btn-cancel,
body.light-theme .btn-save {
    color: #1e293b;
    border-color: rgba(30, 41, 59, 0.2);
}

body.light-theme .btn-create {
    background: #4f46e5;
    color: #ffffff;
    border-color: #4f46e5;
}

body.light-theme .btn-create:hover {
    background: #4338ca;
    border-color: #4338ca;
}

body.light-theme .btn-cancel {
    background: #ffffff;
    border-color: #cbd5e1;
}

body.light-theme .btn-cancel:hover {
    background: #f1f5f9;
    border-color: #94a3b8;
}

/* 顶部控制按钮 */
body.light-theme .header-controls button {
    color: #64748b;
    background: rgba(100, 116, 139, 0.05);
}

body.light-theme .header-controls button:hover {
    color: #1e293b;
    background: rgba(100, 116, 139, 0.15);
}

/* 消息操作按钮 - 白天模式 */
body.light-theme .msg-action-btn {
    background: #ffffff;
    border-color: #cbd5e1;
    color: #475569;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}

body.light-theme .msg-action-btn:hover {
    background: #4f46e5;
    border-color: #4f46e5;
    color: #ffffff;
    box-shadow: 0 4px 6px -1px rgba(79, 70, 229, 0.2);
}

/* 复制按钮 - 绿色 */
body.light-theme .msg-action-btn.copy {
    color: #16a34a;
    border-color: rgba(22, 163, 74, 0.3);
}

body.light-theme .msg-action-btn.copy:hover {
    background: #16a34a;
    border-color: #16a34a;
    color: #ffffff;
    box-shadow: 0 4px 6px -1px rgba(22, 163, 74, 0.2);
}

/* 重试按钮 - 蓝色 */
body.light-theme .msg-action-btn.regenerate {
    color: #2563eb;
    border-color: rgba(37, 99, 235, 0.3);
}

body.light-theme .msg-action-btn.regenerate:hover {
    background: #2563eb;
    border-color: #2563eb;
    color: #ffffff;
    box-shadow: 0 4px 6px -1px rgba(37, 99, 235, 0.2);
}

/* 编辑按钮 - 橙色 */
body.light-theme .msg-action-btn.edit {
    color: #ea580c;
    border-color: rgba(234, 88, 12, 0.3);
}

body.light-theme .msg-action-btn.edit:hover {
    background: #ea580c;
    border-color: #ea580c;
    color: #ffffff;
    box-shadow: 0 4px 6px -1px rgba(234, 88, 12, 0.2);
}

/* 删除按钮 - 红色 */
body.light-theme .msg-action-btn.delete {
    color: #dc2626;
    border-color: rgba(220, 38, 38, 0.3);
}

body.light-theme .msg-action-btn.delete:hover {
    background: #dc2626;
    border-color: #dc2626;
    color: #ffffff;
    box-shadow: 0 4px 6px -1px rgba(220, 38, 38, 0.2);
}

body.light-theme .edit-textarea,
body.light-theme .message-group.user .edit-textarea {
    background: #ffffff !important;
    border-color: #4f46e5 !important;
    color: #1e293b !important;
}

body.light-theme .btn-save-edit {
    background: #0891b2;
}

body.light-theme .btn-save-edit:hover {
    background: #0e7490;
}

body.light-theme .btn-cancel-edit,
body.light-theme .message-group.user .btn-cancel-edit {
    background: #ef4444 !important;
    color: #ffffff !important;
    border: none !important;
}

body.light-theme .btn-cancel-edit:hover,
body.light-theme .message-group.user .btn-cancel-edit:hover {
    background: #dc2626 !important;
    color: #ffffff !important;
}

/* 用户消息内的保存按钮 */
body.light-theme .message-group.user .btn-save-edit {
    background: #0891b2 !important;
    color: #ffffff !important;
}

/* 设置面板关闭按钮 */
body.light-theme #close-settings-btn {
    color: #64748b;
    background: rgba(100, 116, 139, 0.1);
}

body.light-theme #close-settings-btn:hover {
    background: rgba(100, 116, 139, 0.2);
    color: #1e293b;
}

/* 模式选择按钮 */
body.light-theme .mode-btn {
    background: #ffffff;
    border-color: #cbd5e1;
    color: #64748b;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}

body.light-theme .mode-btn:hover {
    background: #f8fafc;
    border-color: #94a3b8;
    color: #1e293b;
}

body.light-theme .mode-btn.active {
    background: #4f46e5;
    border-color: #4f46e5;
    color: #ffffff;
    box-shadow: 0 4px 6px -1px rgba(79, 70, 229, 0.3);
}

/* 风格按钮 */
body.light-theme .style-btn {
    background: #ffffff;
    border-color: #cbd5e1;
    color: #64748b;
}

body.light-theme .style-btn:hover {
    background: rgba(8, 145, 178, 0.05);
    border-color: rgba(8, 145, 178, 0.3);
    color: #0891b2;
}

body.light-theme .style-btn.active {
    background: rgba(8, 145, 178, 0.1);
    border-color: #0891b2;
    color: #0891b2;
}

/* 新建角色按钮 */
body.light-theme .btn-new-char {
    background: #ffffff;
    color: #1e293b;
    border-color: #cbd5e1;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}

body.light-theme .btn-new-char:hover {
    background: #4f46e5;
    color: #ffffff;
    border-color: #4f46e5;
    box-shadow: 0 4px 6px -1px rgba(79, 70, 229, 0.2);
}

/* 思维链卡片 - 白天模式 */
body.light-theme .think-container {
    display: block !important;
    width: 100% !important;
    flex-shrink: 0;
    flex-basis: 100%;
    background: #f1f5f9;
    border-color: #cbd5e1;
    /* 🛡️ [关键修复] 禁用容器高度过渡，防止折叠延迟导致空白占位 */
    transition: none !important;
}

body.light-theme .think-container.collapsed {
    background: #f8fafc;
}

body.light-theme .think-header {
    color: #475569;
}

body.light-theme .think-toggle ion-icon {
    color: #64748b;
}

body.light-theme .think-content {
    color: #334155;
    background: #ffffff;
    border-top: 1px solid #e2e8f0;
    /* 🛡️ [流式修复] 禁用高度相关过渡，确保折叠时立即生效 */
    transition: none !important;
}

/* 🎨 [滚动条优化] 亮色模式思考卡片滚动条 - 蓝绿色，与已完成思考文字一致 */
body.light-theme .think-content::-webkit-scrollbar {
    width: 6px;
}

body.light-theme .think-content::-webkit-scrollbar-track {
    background: transparent;
}

body.light-theme .think-content::-webkit-scrollbar-thumb {
    background: rgba(8, 145, 178, 0.4);
    /* #0891b2 的 40% 透明度 */
    border-radius: 3px;
}

body.light-theme .think-content::-webkit-scrollbar-thumb:hover {
    background: rgba(8, 145, 178, 0.6);
    /* #0891b2 的 60% 透明度 */
}

/* 🔧 [折叠修复] 确保亮色主题下思考卡片折叠状态在流式输出时立即收缩 */

/* 🛡️ [核心修复] 折叠容器自身样式 - 禁止容器被撑大 */
body.light-theme .think-container.collapsed {
    /* 🔧 [边距统一v2] 移除负margin，与暗色模式保持一致 */
    margin: 8px 0 12px 0 !important;
    /* 🛡️ [关键] 容器高度自适应内容，不允许被撑大 */
    height: auto !important;
    max-height: none;
    /* 🛡️ [关键] 禁止 flex 扩展 */
    flex-grow: 0 !important;
    flex-basis: auto !important;
    /* 禁用过渡 */
    transition: none !important;
}

/* 🛡️ [绝对修复] 折叠内容区 - 使用多重手段确保高度归零 */
body.light-theme .think-container.collapsed .think-content {
    /* 高度归零 */
    max-height: 0 !important;
    height: 0 !important;
    min-height: 0 !important;

    /* 内边距归零 */
    padding-top: 0 !important;
    padding-bottom: 0 !important;

    /* 边框隐藏 */
    border-top: none !important;
    border-width: 0 !important;

    /* 防止内容溢出 */
    overflow: hidden !important;

    /* 视觉隐藏备用 */
    visibility: hidden !important;
    opacity: 0 !important;

    /* 移除行高占位 */
    line-height: 0 !important;
    font-size: 0 !important;

    /* 🛡️ 禁用所有过渡，确保立即生效 */
    transition: none !important;
}

/* 对话区域背景 - 白天模式 */
body.light-theme .chat-messages {
    background: rgba(255, 255, 255, 0.9);
}

/* 建议问题按钮 - 使用和已完成思考一样的颜色 */
body.light-theme .suggest-question-btn {
    background: rgba(8, 145, 178, 0.1);
    border-color: rgba(8, 145, 178, 0.3);
    color: #0891b2;
}

body.light-theme .suggest-question-btn:hover {
    background: rgba(8, 145, 178, 0.15);
    border-color: #0891b2;
    color: #0891b2;
}

body.light-theme .suggest-question-btn::before {
    filter: brightness(0) saturate(100%) invert(52%) sepia(98%) saturate(1392%) hue-rotate(157deg) brightness(92%) contrast(94%);
}

/* AI 占位头像图标 - 亮色模式深色图标（浅灰背景需深色图标才可见） */
body.light-theme .msg-avatar-ai-fallback ion-icon {
    color: var(--text-primary);
}

/* 消息元信息（角色名字和时间戳）- 白天模式 */
body.light-theme .msg-meta {
    color: #475569;
    /* 深灰色，在浅色背景下清晰可见 */
}

body.light-theme .message-group.bot .msg-meta {
    color: #334155;
    /* AI消息的角色名更深一点 */
}

body.light-theme .message-group.user .msg-meta {
    color: #64748b;
    /* 用户消息的名字稍浅 */
}

/* 时间戳 - 白天模式 */
body.light-theme .msg-timestamp {
    color: #94a3b8;
    /* 更淡的灰色用于时间戳 */
}

/* 角色列表 hover - 浅色模式 */
body.light-theme .character-item:hover {
    background-color: rgba(0, 0, 0, 0.04);
}

body.light-theme .character-item.active {
    background-color: rgba(79, 70, 229, 0.1);
    border-color: rgba(79, 70, 229, 0.3);
}

/* 新建角色按钮 hover - 浅色模式 */
body.light-theme .btn-new-char:hover {
    color: #ffffff;
}

/* 内联代码 - 浅色模式 */
body.light-theme .msg-bubble code {
    background: rgba(0, 0, 0, 0.06);
    color: #1e293b;
}

/* 分隔线 - 浅色模式 */
body.light-theme .glass-border,
body.light-theme .modal-header,
body.light-theme .modal-footer,
body.light-theme .settings-header {
    border-color: rgba(0, 0, 0, 0.08);
}

/* Galgame 选项按钮 - 浅色模式基础样式 */
body.light-theme .gal-option-btn {
    background: rgba(79, 70, 229, 0.08);
    border-color: rgba(79, 70, 229, 0.25);
    color: #1e293b;
}

body.light-theme .gal-option-btn:hover {
    background: rgba(79, 70, 229, 0.15);
    border-color: rgba(79, 70, 229, 0.4);
}

/* 对话选项 - 浅色模式粉色主题 */
body.light-theme .gal-option-btn.dialogue {
    border-left: 3px solid #ec4899;
    background: linear-gradient(90deg, rgba(236, 72, 153, 0.08) 0%, rgba(255, 255, 255, 0.9) 100%);
    border-color: rgba(236, 72, 153, 0.3);
}

body.light-theme .gal-option-btn.dialogue:hover {
    border-color: #ec4899;
    background: linear-gradient(90deg, rgba(236, 72, 153, 0.15) 0%, rgba(255, 255, 255, 0.95) 100%);
    box-shadow: 0 4px 12px rgba(236, 72, 153, 0.2);
}

/* 动作选项 - 浅色模式青绿色主题 */
body.light-theme .gal-option-btn.action {
    border-left: 3px solid #0d9488;
    background: linear-gradient(90deg, rgba(13, 148, 136, 0.08) 0%, rgba(255, 255, 255, 0.9) 100%);
    border-color: rgba(13, 148, 136, 0.3);
}

body.light-theme .gal-option-btn.action:hover {
    border-color: #0d9488;
    background: linear-gradient(90deg, rgba(13, 148, 136, 0.15) 0%, rgba(255, 255, 255, 0.95) 100%);
    box-shadow: 0 4px 12px rgba(13, 148, 136, 0.2);
}

/* Galgame 开始界面（时间/地点选择）- 亮色模式 */
body.light-theme .gal-start-options {
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.1);
}

body.light-theme .gal-start-label {
    color: #334155;
}

body.light-theme .gal-start-label-icon {
    color: #0891b2;
}

body.light-theme .gal-start-custom-input {
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(0, 0, 0, 0.12);
    color: #1e293b;
}
body.light-theme .gal-start-custom-input::placeholder {
    color: #64748b;
}
body.light-theme .gal-start-custom-input:focus {
    border-color: #0891b2;
    background: #fff;
}
body.light-theme .gal-start-char-count {
    color: #64748b;
}

body.light-theme #gal-start-container .custom-select-wrapper .custom-select-trigger {
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(0, 0, 0, 0.12);
    color: #1e293b;
}

body.light-theme #gal-start-container .custom-select-wrapper .custom-select-trigger:hover {
    border-color: rgba(8, 145, 178, 0.4);
    background: rgba(8, 145, 178, 0.06);
}

body.light-theme #gal-start-container .custom-select-wrapper .custom-select-trigger.active {
    border-color: #0891b2;
    box-shadow: 0 0 0 3px rgba(8, 145, 178, 0.2);
}

body.light-theme #gal-start-container .custom-select-wrapper .custom-select-arrow {
    color: #64748b;
}

body.light-theme #gal-start-container .custom-select-dropdown {
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
    scrollbar-color: rgba(0, 0, 0, 0.25) rgba(0, 0, 0, 0.06);
}
body.light-theme #gal-start-container .custom-select-dropdown::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.06);
    margin: 6px 0;
}
body.light-theme #gal-start-container .custom-select-dropdown::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.25);
}
body.light-theme #gal-start-container .custom-select-dropdown::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.4);
}

body.light-theme #gal-start-container .custom-select-option {
    color: #1e293b;
}

body.light-theme #gal-start-container .custom-select-option:hover {
    background: rgba(8, 145, 178, 0.08);
}

body.light-theme #gal-start-container .custom-select-option.selected {
    background: rgba(8, 145, 178, 0.12);
    color: #0e7490;
}

body.light-theme #gal-start-container .custom-select-option .option-check {
    color: #0891b2;
}

/* 历史记录面板 - 浅色模式 */
body.light-theme .history-item {
    background: rgba(0, 0, 0, 0.02);
    border-color: rgba(0, 0, 0, 0.06);
}

body.light-theme .history-item:hover {
    background: rgba(79, 70, 229, 0.05);
    border-color: rgba(79, 70, 229, 0.2);
}

/* 思考中状态 - 浅色模式 */
body.light-theme .think-container.thinking {
    border-color: rgba(234, 179, 8, 0.4);
    background: rgba(254, 243, 199, 0.5);
}

body.light-theme .think-container.thinking .think-header {
    background: rgba(234, 179, 8, 0.1);
}

body.light-theme .think-status.thinking {
    color: #b45309;
    font-weight: 600;
}

/* 思考字数统计 - 浅色模式（继承父元素颜色，无需单独设置） */