/* ============================================================
 * 主题颜色规范覆盖层 v1.0
 * 生成日期: 2026-06-24
 * 说明: 按照设计规范对白天/黑夜主题进行批量颜色修正
 * 加载顺序: 必须在所有其他CSS之后加载
 * ============================================================ */

/* ============================================================
 * CSS 变量定义
 * ============================================================ */
:root {
  /* 黑夜主题（默认）变量 */
  --tl-bg-base: #0B1020;
  --tl-bg-gradient-start: #0D1428;
  --tl-bg-gradient-end: #0A0F1F;
  --tl-bg-card: #121A33;
  --tl-bg-card-float: #162042;
  --tl-bg-card-highlight: #1C2A52;
  --tl-accent-primary: #6C7CFF;
  --tl-accent-strong: #4C6FFF;
  --tl-accent-purple: #8A5CFF;
  --tl-accent-gradient: linear-gradient(135deg, #6C7CFF, #8A5CFF);
  --tl-text-primary: #EAF0FF;
  --tl-text-secondary: #A9B4CC;
  --tl-text-weak: #6E7A94;
  --tl-border-standard: rgba(255, 255, 255, 0.06);
  --tl-border-solid: #1A2440;
  --tl-glow: rgba(108, 124, 255, 0.25);
  --tl-divider: rgba(255, 255, 255, 0.06);
}

html.light-theme {
  /* 白天主题变量 */
  --tl-bg-base: #F4F7FB;
  --tl-bg-gradient-start: #EEF3FA;
  --tl-bg-gradient-end: #F7FAFF;
  --tl-bg-card: #FFFFFF;
  --tl-bg-card-float: #FFFFFF;
  --tl-bg-card-highlight: #E8F0FF;
  --tl-accent-primary: #4F7CFF;
  --tl-accent-strong: #4F7CFF;
  --tl-accent-purple: #6A5CFF;
  --tl-accent-gradient: linear-gradient(135deg, #4F7CFF, #6A5CFF);
  --tl-text-primary: #1C2333;
  --tl-text-secondary: #3A465B;
  --tl-text-weak: #8A94A6;
  --tl-border-standard: #E6ECF5;
  --tl-border-solid: #E6ECF5;
  --tl-glow: rgba(79, 124, 255, 0.15);
  --tl-divider: #E6ECF5;
  --tl-accent-secondary-bg: #E8F0FF;
  --tl-accent-secondary-bg-end: #DDE7FF;
}

/* ============================================================
 * 1. 全局背景与基础容器
 * ============================================================ */

/* 黑夜主题 - 主背景 */
html:not(.light-theme) body,
html:not(.light-theme) #app {
  background: var(--tl-bg-base) !important;
  color: var(--tl-text-primary) !important;
}

html:not(.light-theme) .mobile-container,
html:not(.light-theme) .mobile-container[data-v-01899233] {
  background: var(--tl-bg-gradient-start) !important;
  color: var(--tl-text-primary) !important;
}

/* 白天主题 - 主背景 */
html.light-theme body,
html.light-theme #app {
  background: var(--tl-bg-base) !important;
  color: var(--tl-text-primary) !important;
}

html.light-theme .mobile-container,
html.light-theme .mobile-container[data-v-01899233] {
  background: var(--tl-bg-base) !important;
  color: var(--tl-text-primary) !important;
}

/* ============================================================
 * 2. 移动端头部 Header
 * ============================================================ */

html:not(.light-theme) .mobile-header,
html:not(.light-theme) .mobile-header[data-v-01899233] {
  background: rgba(18, 26, 51, 0.85) !important;
  border-bottom: 1px solid var(--tl-border-standard) !important;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}

html.light-theme .mobile-header,
html.light-theme .mobile-header[data-v-01899233] {
  background: rgba(255, 255, 255, 0.9) !important;
  border-bottom: 1px solid var(--tl-border-standard) !important;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}

/* ============================================================
 * 3. 移动端侧边栏 Sidebar
 * ============================================================ */

html:not(.light-theme) .mobile-sidebar,
html:not(.light-theme) .mobile-sidebar[data-v-01899233] {
  background: var(--tl-bg-card) !important;
  border-right: 1px solid var(--tl-border-standard) !important;
}

html.light-theme .mobile-sidebar,
html.light-theme .mobile-sidebar[data-v-01899233] {
  background: var(--tl-bg-card) !important;
  border-right: 1px solid var(--tl-border-standard) !important;
}

/* 侧边栏会话条目 */
html:not(.light-theme) .sidebar-item,
html:not(.light-theme) .sidebar-item[data-v-01899233] {
  border-bottom: 1px solid var(--tl-border-standard) !important;
}

html.light-theme .sidebar-item,
html.light-theme .sidebar-item[data-v-01899233] {
  border-bottom: 1px solid var(--tl-border-standard) !important;
}

/* 选中状态 - 蓝紫发光 */
html:not(.light-theme) .sidebar-item.active,
html:not(.light-theme) .sidebar-item.active[data-v-01899233] {
  background: rgba(108, 124, 255, 0.12) !important;
  border-left: 3px solid var(--tl-accent-primary) !important;
  box-shadow: 0 0 16px var(--tl-glow) !important;
}

html.light-theme .sidebar-item.active,
html.light-theme .sidebar-item.active[data-v-01899233] {
  background: var(--tl-accent-secondary-bg) !important;
  border-left: 3px solid var(--tl-accent-primary) !important;
}

/* 搜索框 */
html:not(.light-theme) .sidebar-search-input,
html:not(.light-theme) .sidebar-search-input[data-v-01899233] {
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid var(--tl-border-standard) !important;
  color: var(--tl-text-primary) !important;
}

html:not(.light-theme) .sidebar-search-input::placeholder {
  color: var(--tl-text-weak) !important;
}

html:not(.light-theme) .sidebar-search-input:focus {
  border-color: var(--tl-accent-primary) !important;
}

html.light-theme .sidebar-search-input,
html.light-theme .sidebar-search-input[data-v-01899233] {
  background: #F4F7FB !important;
  border: 1px solid var(--tl-border-standard) !important;
  color: var(--tl-text-primary) !important;
}

html.light-theme .sidebar-search-input::placeholder {
  color: var(--tl-text-weak) !important;
}

html.light-theme .sidebar-search-input:focus {
  border-color: var(--tl-accent-primary) !important;
}

/* ============================================================
 * 4. 底部 Tab 栏
 * ============================================================ */

html:not(.light-theme) .mobile-tabbar,
html:not(.light-theme) .mobile-tabbar[data-v-01899233] {
  background: var(--tl-bg-card) !important;
  border-top: 1px solid var(--tl-border-standard) !important;
}

html.light-theme .mobile-tabbar,
html.light-theme .mobile-tabbar[data-v-01899233] {
  background: var(--tl-bg-card) !important;
  border-top: 1px solid var(--tl-border-standard) !important;
}

/* Tab 项默认色 */
html:not(.light-theme) .tab-item,
html:not(.light-theme) .tab-item[data-v-01899233] {
  color: var(--tl-text-secondary) !important;
}

html.light-theme .tab-item,
html.light-theme .tab-item[data-v-01899233] {
  color: var(--tl-text-secondary) !important;
}

/* Tab 项激活 - 蓝紫渐变 */
.mobile-tabbar .tab-item.active,
.mobile-tabbar .tab-item.active[data-v-01899233] {
  color: #FFFFFF !important;
  background: linear-gradient(135deg, #6C7CFF 0%, #8A5CFF 100%) !important;
  box-shadow: 0 8px 20px rgba(108, 124, 255, 0.35) !important;
}

html.light-theme .mobile-tabbar .tab-item.active,
html.light-theme .mobile-tabbar .tab-item.active[data-v-01899233] {
  color: #FFFFFF !important;
  background: linear-gradient(135deg, #4F7CFF 0%, #6A5CFF 100%) !important;
  box-shadow: 0 8px 20px rgba(79, 124, 255, 0.3) !important;
}

/* ============================================================
 * 5. 聊天消息
 * ============================================================ */

/* 用户消息 - 蓝紫渐变 */
html:not(.light-theme) .msg-row.user .msg-bubble,
html:not(.light-theme) .msg-row.user .msg-bubble[data-v-01899233] {
  background: linear-gradient(135deg, #6C7CFF, #8A5CFF) !important;
  color: #FFFFFF !important;
  box-shadow: 0 4px 12px rgba(108, 124, 255, 0.3) !important;
}

html.light-theme .msg-row.user .msg-bubble,
html.light-theme .msg-row.user .msg-bubble[data-v-01899233] {
  background: linear-gradient(135deg, #4F7CFF, #6A5CFF) !important;
  color: #FFFFFF !important;
  box-shadow: 0 4px 12px rgba(79, 124, 255, 0.25) !important;
}

/* AI 消息 */
html:not(.light-theme) .msg-row.assistant .msg-bubble,
html:not(.light-theme) .msg-row.assistant .msg-bubble[data-v-01899233] {
  background: var(--tl-bg-card) !important;
  color: var(--tl-text-primary) !important;
  border: 1px solid var(--tl-border-standard) !important;
}

html.light-theme .msg-row.assistant .msg-bubble,
html.light-theme .msg-row.assistant .msg-bubble[data-v-01899233] {
  background: #FFFFFF !important;
  color: var(--tl-text-primary) !important;
  border: 1px solid var(--tl-border-standard) !important;
}

/* 列表标记色 */
html:not(.light-theme) .msg-bubble li::marker {
  color: var(--tl-accent-primary) !important;
}

html.light-theme .msg-bubble li::marker {
  color: var(--tl-accent-primary) !important;
}

/* ============================================================
 * 6. 发送按钮与输入区
 * ============================================================ */

/* 聊天发送按钮 - 蓝紫渐变 */
html:not(.light-theme) .mobile-send-btn.chat,
html:not(.light-theme) .mobile-send-btn.chat[data-v-01899233] {
  background: var(--tl-accent-primary) !important;
  color: #FFFFFF !important;
}

html.light-theme .mobile-send-btn.chat,
html.light-theme .mobile-send-btn.chat[data-v-01899233] {
  background: var(--tl-accent-primary) !important;
  color: #FFFFFF !important;
}

/* 通用发送按钮渐变 */
.send-btn,
.send-btn[data-v-01899233] {
  background: linear-gradient(135deg, #6C7CFF, #8A5CFF) !important;
  color: #FFFFFF !important;
  box-shadow: 0 2px 8px rgba(108, 124, 255, 0.4) !important;
}

html.light-theme .send-btn,
html.light-theme .send-btn[data-v-01899233] {
  background: linear-gradient(135deg, #4F7CFF, #6A5CFF) !important;
  box-shadow: 0 2px 8px rgba(79, 124, 255, 0.35) !important;
}

/* 输入框 */
html:not(.light-theme) .mobile-input .el-textarea__inner,
html:not(.light-theme) .mobile-input .el-textarea__inner[data-v-01899233] {
  background: var(--tl-bg-card) !important;
  border: 1.5px solid var(--tl-border-standard) !important;
  color: var(--tl-text-primary) !important;
}

html:not(.light-theme) .mobile-input .el-textarea__inner:focus {
  border-color: var(--tl-accent-primary) !important;
}

html.light-theme .mobile-input .el-textarea__inner,
html.light-theme .mobile-input .el-textarea__inner[data-v-01899233] {
  background: #FFFFFF !important;
  border: 1.5px solid var(--tl-border-standard) !important;
  color: var(--tl-text-primary) !important;
}

html.light-theme .mobile-input .el-textarea__inner:focus {
  border-color: var(--tl-accent-primary) !important;
}

/* ============================================================
 * 7. 弹窗与菜单
 * ============================================================ */

/* 上下文菜单 */
html:not(.light-theme) .context-menu,
html:not(.light-theme) .context-menu[data-v-01899233] {
  background: var(--tl-bg-card-float) !important;
  border: 1px solid var(--tl-border-standard) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
}

html.light-theme .context-menu,
html.light-theme .context-menu[data-v-01899233] {
  background: var(--tl-bg-card-float) !important;
  border: 1px solid var(--tl-border-standard) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1) !important;
}

html:not(.light-theme) .context-menu-item,
html:not(.light-theme) .context-menu-item[data-v-01899233] {
  color: var(--tl-text-primary) !important;
}

html.light-theme .context-menu-item,
html.light-theme .context-menu-item[data-v-01899233] {
  color: var(--tl-text-primary) !important;
}

/* 弹出面板 */
html:not(.light-theme) .popup-panel,
html:not(.light-theme) .popup-panel[data-v-01899233] {
  background: var(--tl-bg-card-float) !important;
  color: var(--tl-text-primary) !important;
  border: 1px solid var(--tl-border-standard) !important;
}

html.light-theme .popup-panel,
html.light-theme .popup-panel[data-v-01899233] {
  background: var(--tl-bg-card-float) !important;
  color: var(--tl-text-primary) !important;
  border: 1px solid var(--tl-border-standard) !important;
}

/* 主操作按钮 - 蓝紫渐变 */
.popup-action-btn.primary,
.popup-action-btn.primary[data-v-01899233] {
  background: linear-gradient(135deg, #6C7CFF, #8A5CFF) !important;
  color: #FFFFFF !important;
}

html.light-theme .popup-action-btn.primary,
html.light-theme .popup-action-btn.primary[data-v-01899233] {
  background: linear-gradient(135deg, #4F7CFF, #6A5CFF) !important;
}

/* 选项芯片激活态 */
.option-chip.active,
.option-chip.active[data-v-01899233] {
  background: linear-gradient(135deg, #6C7CFF, #8A5CFF) !important;
  color: #FFFFFF !important;
}

html.light-theme .option-chip.active,
html.light-theme .option-chip.active[data-v-01899233] {
  background: linear-gradient(135deg, #4F7CFF, #6A5CFF) !important;
}

/* ============================================================
 * 8. 模型信息弹窗（修复绿色→蓝紫色）
 * ============================================================ */

html:not(.light-theme) .mobile-model-info-popper {
  background: linear-gradient(135deg, #121A33 0%, #162042 100%) !important;
  border: 1px solid rgba(108, 124, 255, 0.3) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6) !important;
}

html.light-theme .mobile-model-info-popper {
  background: linear-gradient(135deg, #FFFFFF 0%, #F4F7FB 100%) !important;
  border: 1px solid rgba(79, 124, 255, 0.2) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1) !important;
}

/* 箭头颜色 - 分离 dark/light */
html:not(.light-theme) .mobile-model-info-popper .el-popper__arrow:before {
  border-color: #0000 #0000 rgba(108, 124, 255, 0.3) !important;
}

html.light-theme .mobile-model-info-popper .el-popper__arrow:before {
  border-color: #0000 #0000 rgba(79, 124, 255, 0.2) !important;
}

html:not(.light-theme) .mobile-model-info-header {
  color: var(--tl-accent-primary) !important;
}

html.light-theme .mobile-model-info-header {
  color: var(--tl-accent-primary) !important;
}

html:not(.light-theme) .mobile-model-info-popover {
  color: var(--tl-text-primary) !important;
}

html.light-theme .mobile-model-info-popover {
  color: var(--tl-text-primary) !important;
}

/* ============================================================
 * 9. 积分与记录（修复绿色→蓝紫色）
 * ============================================================ */

html:not(.light-theme) .mobile-points-title {
  color: var(--tl-accent-primary) !important;
}

html.light-theme .mobile-points-title {
  color: var(--tl-accent-primary) !important;
}

html:not(.light-theme) .mobile-points-tab.active,
html:not(.light-theme) .mobile-points-tab.active[data-v-01899233] {
  color: var(--tl-accent-primary) !important;
  border-bottom-color: var(--tl-accent-primary) !important;
}

html.light-theme .mobile-points-tab.active,
html.light-theme .mobile-points-tab.active[data-v-01899233] {
  color: var(--tl-accent-primary) !important;
  border-bottom-color: var(--tl-accent-primary) !important;
}

html:not(.light-theme) .record-model,
html:not(.light-theme) .record-model[data-v-01899233] {
  color: var(--tl-accent-primary) !important;
}

html.light-theme .record-model,
html.light-theme .record-model[data-v-01899233] {
  color: var(--tl-accent-primary) !important;
}

/* 正数金额保持绿色（UX惯例：收入为绿） */
html:not(.light-theme) .record-amount.positive {
  color: #34d399 !important;
}

html.light-theme .record-amount.positive {
  color: #059669 !important;
}

/* 成功状态保持绿色 */
html:not(.light-theme) .record-status.status-success {
  color: #34d399 !important;
  background: rgba(52, 211, 153, 0.15) !important;
}

html.light-theme .record-status.status-success {
  color: #059669 !important;
  background: rgba(5, 150, 105, 0.1) !important;
}

/* ============================================================
 * 10. 通知类型标签（修复绿色→蓝紫色）
 * ============================================================ */

html:not(.light-theme) .mobile-notify-item-type {
  color: var(--tl-accent-primary) !important;
  background: rgba(108, 124, 255, 0.15) !important;
}

html:not(.light-theme) .mobile-notify-item-type.public {
  color: var(--tl-accent-primary) !important;
  background: rgba(108, 124, 255, 0.15) !important;
}

html.light-theme .mobile-notify-item-type {
  color: var(--tl-accent-primary) !important;
  background: rgba(79, 124, 255, 0.1) !important;
}

html.light-theme .mobile-notify-item-type.public {
  color: var(--tl-accent-primary) !important;
  background: rgba(79, 124, 255, 0.1) !important;
}

/* 通知回复按钮 - 蓝紫渐变 */
.mobile-notify-reply-send-btn {
  background: linear-gradient(135deg, #6C7CFF, #8A5CFF) !important;
  color: #FFFFFF !important;
}

html.light-theme .mobile-notify-reply-send-btn {
  background: linear-gradient(135deg, #4F7CFF, #6A5CFF) !important;
}

/* ============================================================
 * 11. 微信支付（保留微信品牌绿色）
 * ============================================================ */

/* 微信支付按钮保留绿色 - 微信品牌规范 */
.wxpay-mobile-btn {
  background: linear-gradient(135deg, #07c160, #10b981) !important;
  color: #FFFFFF !important;
}

/* 微信支付金额保留绿色 - 微信品牌规范 */
.wxpay-package-price {
  color: #07c160 !important;
}

.mobile-wxpay-amount {
  color: #07c160 !important;
}

/* 选中套餐 - 蓝紫边框 */
html:not(.light-theme) .wxpay-package-item.selected {
  background: rgba(108, 124, 255, 0.12) !important;
  border-color: var(--tl-accent-primary) !important;
}

html.light-theme .wxpay-package-item.selected {
  background: rgba(79, 124, 255, 0.08) !important;
  border-color: var(--tl-accent-primary) !important;
}

/* ============================================================
 * 12. 抠图确认按钮（修复绿色→蓝紫色）
 * ============================================================ */

html:not(.light-theme) .mpe-preview-tool-btn.confirm {
  background: rgba(108, 124, 255, 0.2) !important;
  border-color: rgba(108, 124, 255, 0.45) !important;
  color: var(--tl-accent-primary) !important;
}

html.light-theme .mpe-preview-tool-btn.confirm {
  background: rgba(79, 124, 255, 0.12) !important;
  border-color: rgba(79, 124, 255, 0.4) !important;
  color: var(--tl-accent-primary) !important;
}

/* ============================================================
 * 13. 生成按钮（修复绿色→蓝紫色）
 * ============================================================ */

html:not(.light-theme) .action-icon.generate-btn {
  background: linear-gradient(135deg, #6C7CFF, #8A5CFF) !important;
  color: #FFFFFF !important;
}

html.light-theme .action-icon.generate-btn {
  background: linear-gradient(135deg, #4F7CFF, #6A5CFF) !important;
  color: #FFFFFF !important;
}

/* 激活状态图标 - 蓝紫色 */
html:not(.light-theme) .action-icon.active {
  background: rgba(108, 124, 255, 0.12) !important;
  color: var(--tl-accent-primary) !important;
  border-color: var(--tl-accent-primary) !important;
}

html.light-theme .action-icon.active {
  background: rgba(79, 124, 255, 0.1) !important;
  color: var(--tl-accent-primary) !important;
  border-color: var(--tl-accent-primary) !important;
}

/* ============================================================
 * 14. 深度思考切换
 * ============================================================ */

html:not(.light-theme) .deep-thinking-toggle.active {
  background: rgba(108, 124, 255, 0.12) !important;
  border-color: var(--tl-accent-primary) !important;
  color: var(--tl-accent-primary) !important;
}

html.light-theme .deep-thinking-toggle.active {
  background: rgba(79, 124, 255, 0.08) !important;
  border-color: var(--tl-accent-primary) !important;
  color: var(--tl-accent-primary) !important;
}

/* ============================================================
 * 15. 图标按钮激活态
 * ============================================================ */

html:not(.light-theme) .mobile-icon-btn.active {
  background: rgba(108, 124, 255, 0.12) !important;
  border-color: var(--tl-accent-primary) !important;
  color: var(--tl-accent-primary) !important;
}

html.light-theme .mobile-icon-btn.active {
  background: rgba(79, 124, 255, 0.08) !important;
  border-color: var(--tl-accent-primary) !important;
  color: var(--tl-accent-primary) !important;
}

/* ============================================================
 * 16. 加载更多按钮
 * ============================================================ */

html:not(.light-theme) .m-load-more-btn {
  background: rgba(108, 124, 255, 0.12) !important;
  border: 1px solid rgba(108, 124, 255, 0.2) !important;
  color: var(--tl-accent-primary) !important;
}

html.light-theme .m-load-more-btn {
  background: rgba(79, 124, 255, 0.08) !important;
  border: 1px solid rgba(79, 124, 255, 0.15) !important;
  color: var(--tl-accent-primary) !important;
}

/* ============================================================
 * 17. 头像与资料
 * ============================================================ */

.profile-avatar {
  background: linear-gradient(135deg, #6C7CFF, #8A5CFF) !important;
}

html.light-theme .profile-avatar {
  background: linear-gradient(135deg, #4F7CFF, #6A5CFF) !important;
}

/* ============================================================
 * 18. 字体设置
 * ============================================================ */

.font-setting-range {
  accent-color: var(--tl-accent-primary) !important;
}

.font-settings-btn.primary {
  background: linear-gradient(135deg, #6C7CFF, #8A5CFF) !important;
  color: #FFFFFF !important;
}

html.light-theme .font-settings-btn.primary {
  background: linear-gradient(135deg, #4F7CFF, #6A5CFF) !important;
}

/* ============================================================
 * 19. 密码确认按钮
 * ============================================================ */

.mobile-password-btn.confirm {
  background: linear-gradient(135deg, #6C7CFF, #8A5CFF) !important;
  color: #FFFFFF !important;
}

html.light-theme .mobile-password-btn.confirm {
  background: linear-gradient(135deg, #4F7CFF, #6A5CFF) !important;
}

/* ============================================================
 * 20. 提示词相关
 * ============================================================ */

html:not(.light-theme) .prompt-label {
  color: var(--tl-accent-primary) !important;
}

html.light-theme .prompt-label {
  color: var(--tl-accent-primary) !important;
}

html:not(.light-theme) .prompt-textarea:focus {
  border-color: var(--tl-accent-primary) !important;
}

html.light-theme .prompt-textarea:focus {
  border-color: var(--tl-accent-primary) !important;
}

html:not(.light-theme) .prompt-dot {
  background: var(--tl-accent-primary) !important;
}

html.light-theme .prompt-dot {
  background: var(--tl-accent-primary) !important;
}

/* ============================================================
 * 21. 加载动画
 * ============================================================ */

html:not(.light-theme) .loading-spinner {
  border-top-color: var(--tl-accent-primary) !important;
}

html.light-theme .loading-spinner {
  border-color: var(--tl-accent-primary) rgba(0, 0, 0, 0.15) rgba(0, 0, 0, 0.15) !important;
}

/* ============================================================
 * 22. 抠图区域
 * ============================================================ */

html:not(.light-theme) .mpe-preview-rect-region {
  background: rgba(108, 124, 255, 0.18) !important;
  border: 2px solid rgba(108, 124, 255, 0.85) !important;
}

html.light-theme .mpe-preview-rect-region {
  background: rgba(79, 124, 255, 0.12) !important;
  border: 2px solid rgba(79, 124, 255, 0.8) !important;
}

/* ============================================================
 * 23. 导入区域
 * ============================================================ */

html:not(.light-theme) .import-area:active {
  background: rgba(108, 124, 255, 0.05) !important;
  border-color: rgba(108, 124, 255, 0.5) !important;
}

html:not(.light-theme) .import-area.has-images {
  border-color: rgba(108, 124, 255, 0.3) !important;
}

html.light-theme .import-area:active {
  background: rgba(79, 124, 255, 0.05) !important;
  border-color: rgba(79, 124, 255, 0.5) !important;
}

html.light-theme .import-area.has-images {
  border-color: rgba(79, 124, 255, 0.3) !important;
}

/* ============================================================
 * 24. 抠图选项芯片
 * ============================================================ */

html:not(.light-theme) .option-chip.active {
  background: rgba(108, 124, 255, 0.2) !important;
  border-color: rgba(108, 124, 255, 0.5) !important;
}

html.light-theme .option-chip.active {
  color: var(--tl-accent-primary) !important;
  background: rgba(79, 124, 255, 0.1) !important;
  border-color: rgba(79, 124, 255, 0.4) !important;
}

/* ============================================================
 * 25. 重命名对话框
 * ============================================================ */

.rename-dialog.chat {
  --rename-accent: var(--tl-accent-primary) !important;
  --rename-accent-dark: var(--tl-accent-strong) !important;
}

/* ============================================================
 * 26. 选择器悬停
 * ============================================================ */

html:not(.light-theme) .prompt-purpose-select .el-select__wrapper:hover,
html:not(.light-theme) .prompt-category-select .el-select__wrapper:hover {
  box-shadow: inset 0 0 0 1px rgba(108, 124, 255, 0.4) !important;
}

html.light-theme .prompt-purpose-select .el-select__wrapper:hover,
html.light-theme .prompt-category-select .el-select__wrapper:hover {
  box-shadow: inset 0 0 0 1px rgba(79, 124, 255, 0.4) !important;
}

/* ============================================================
 * 27. 推理过程显示
 * ============================================================ */

html:not(.light-theme) .mobile-reasoning {
  color: var(--tl-accent-purple) !important;
  background: rgba(138, 92, 255, 0.1) !important;
  border: 1px solid rgba(138, 92, 255, 0.2) !important;
}

html.light-theme .mobile-reasoning {
  color: var(--tl-accent-purple) !important;
  background: rgba(106, 92, 255, 0.06) !important;
  border: 1px solid rgba(106, 92, 255, 0.15) !important;
}

/* ============================================================
 * 28. 参考图标签（Home CSS - 修复绿色→蓝紫色）
 * ============================================================ */

.chat-footer .ref-label {
  background: rgba(108, 124, 255, 0.12) !important;
  color: var(--tl-accent-primary) !important;
}

html.light-theme .chat-footer .ref-label {
  background: rgba(79, 124, 255, 0.1) !important;
  color: var(--tl-accent-primary) !important;
}

.chat-footer .ref-list::-webkit-scrollbar-thumb {
  background: rgba(108, 124, 255, 0.4) !important;
}

.chat-footer .ref-add {
  border: 1px dashed rgba(108, 124, 255, 0.5) !important;
  color: var(--tl-accent-primary) !important;
}

html.light-theme .chat-footer .ref-add {
  border-color: rgba(79, 124, 255, 0.5) !important;
  color: var(--tl-accent-primary) !important;
}

/* ============================================================
 * 29. 会话片段与空状态
 * ============================================================ */

html:not(.light-theme) .tl-session-snippet {
  color: var(--tl-text-secondary) !important;
}

html.light-theme .tl-session-snippet {
  color: var(--tl-text-secondary) !important;
}

html:not(.light-theme) .tl-empty-logo {
  border: 1px solid var(--tl-border-standard) !important;
  background: linear-gradient(135deg, rgba(108, 124, 255, 0.12), rgba(138, 92, 255, 0.06)) !important;
}

html.light-theme .tl-empty-logo {
  border-color: var(--tl-border-standard) !important;
  background: linear-gradient(135deg, rgba(79, 124, 255, 0.1), rgba(106, 92, 255, 0.06)) !important;
}

html:not(.light-theme) .tl-empty-text {
  color: var(--tl-text-primary) !important;
  background: linear-gradient(92deg, #EAF0FF 0%, #C7D2FF 44%, #6C7CFF 76%, #8A5CFF 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

html.light-theme .tl-empty-text {
  background: linear-gradient(92deg, #1C2333 0%, #4F7CFF 58%, #6A5CFF 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

/* ============================================================
 * 30. ICP 备案底部栏
 * ============================================================ */

html:not(.light-theme) .mobile-icp-footer {
  color: rgba(234, 240, 255, 0.4) !important;
  background: var(--tl-bg-card) !important;
  border-top: 1px solid var(--tl-border-standard) !important;
}

html.light-theme .mobile-icp-footer,
html.light-theme .wechat-webview .mobile-icp-footer,
.wechat-webview.light-theme .mobile-icp-footer {
  color: var(--tl-text-weak) !important;
  background: var(--tl-bg-card) !important;
  border-top-color: var(--tl-border-standard) !important;
}

html:not(.light-theme) .mobile-icp-footer .mobile-icp-sep {
  color: rgba(234, 240, 255, 0.25) !important;
}

html.light-theme .mobile-icp-footer .mobile-icp-sep {
  color: rgba(28, 35, 51, 0.15) !important;
}

/* ============================================================
 * 31. 网站底部
 * ============================================================ */

html:not(.light-theme) .site-footer,
html:not(.light-theme) .site-footer[data-v-255e913d] {
  background: linear-gradient(#0A0F1F 0% 60%, #070A14 100%) !important;
}

html:not(.light-theme) .wave,
html:not(.light-theme) .wave[data-v-255e913d] {
  fill: #0A0F1F !important;
}

html:not(.light-theme) .footer-col,
html:not(.light-theme) .footer-col[data-v-255e913d] {
  color: var(--tl-text-weak) !important;
}

html:not(.light-theme) .footer-col.has-link:hover {
  color: var(--tl-text-secondary) !important;
}

html.light-theme .site-footer,
html.light-theme .site-footer[data-v-255e913d] {
  background: linear-gradient(#EEF3FA 0% 60%, #F4F7FB 100%) !important;
}

html.light-theme .wave,
html.light-theme .wave[data-v-255e913d] {
  fill: #EEF3FA !important;
}

html.light-theme .footer-col,
html.light-theme .footer-col[data-v-255e913d] {
  color: var(--tl-text-weak) !important;
}

html.light-theme .footer-col.has-link:hover {
  color: var(--tl-text-secondary) !important;
}

/* ============================================================
 * 32. 滑动删除工具栏（修复乱码后样式）
 * ============================================================ */

.tl-session-toolbar {
  background: var(--tl-bg-card-float) !important;
  border-bottom: 1px solid var(--tl-border-standard) !important;
}

.tl-session-title {
  color: var(--tl-text-primary) !important;
}

.tl-session-back,
.tl-session-new {
  color: var(--tl-accent-primary) !important;
}

.tl-session-delete-btn {
  color: #ef4444 !important;
  background: rgba(239, 68, 68, 0.1) !important;
  border: 1px solid rgba(239, 68, 68, 0.3) !important;
}

/* ============================================================
 * 33. 确认对话框
 * ============================================================ */

.tl-confirm-overlay {
  background: rgba(7, 10, 20, 0.7) !important;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

html.light-theme .tl-confirm-overlay {
  background: rgba(28, 35, 51, 0.4) !important;
}

.tl-confirm-dialog {
  background: var(--tl-bg-card-float) !important;
  border: 1px solid var(--tl-border-standard) !important;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.3) !important;
}

.tl-confirm-title {
  color: var(--tl-text-primary) !important;
}

.tl-confirm-msg {
  color: var(--tl-text-secondary) !important;
}

.tl-confirm-btn-cancel {
  background: var(--tl-bg-card-highlight) !important;
  color: var(--tl-text-secondary) !important;
}

.tl-confirm-btn-ok {
  background: linear-gradient(135deg, #6C7CFF, #8A5CFF) !important;
  color: #FFFFFF !important;
}

html.light-theme .tl-confirm-btn-ok {
  background: linear-gradient(135deg, #4F7CFF, #6A5CFF) !important;
}

/* ============================================================
 * 34. Toast 提示
 * ============================================================ */

.tl-toast {
  background: var(--tl-bg-card-float) !important;
  color: var(--tl-text-primary) !important;
  border: 1px solid var(--tl-border-standard) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3) !important;
}

.tl-toast.success {
  border-left: 3px solid #34d399 !important;
}

.tl-toast.error {
  border-left: 3px solid #ef4444 !important;
}

/* ============================================================
 * 35. PC端聊天容器
 * ============================================================ */

html:not(.light-theme) .chat-wrapper,
html:not(.light-theme) .chat-wrapper[data-v-9ec85279] {
  background: var(--tl-bg-gradient-start) !important;
}

html:not(.light-theme) .chat-wrapper:after {
  background: radial-gradient(circle, rgba(108, 124, 255, 0.08), transparent 70%) !important;
}

html.light-theme .chat-wrapper,
html.light-theme .chat-wrapper[data-v-9ec85279] {
  background: var(--tl-bg-base) !important;
}

html.light-theme .chat-wrapper:after {
  background: radial-gradient(circle, rgba(79, 124, 255, 0.06), transparent 70%) !important;
}

/* ============================================================
 * 36. 下载弹窗
 * ============================================================ */

html:not(.light-theme) .download-overlay,
html:not(.light-theme) .download-overlay[data-v-9ec85279] {
  background: rgba(7, 10, 20, 0.73) !important;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

html:not(.light-theme) .download-popup,
html:not(.light-theme) .download-popup[data-v-9ec85279] {
  background: var(--tl-bg-card-float) !important;
  border: 1px solid var(--tl-border-standard) !important;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.4) !important;
}

html:not(.light-theme) .dlp-title,
html:not(.light-theme) .dlp-title[data-v-9ec85279] {
  color: var(--tl-text-primary) !important;
}

html.light-theme .download-overlay,
html.light-theme .download-overlay[data-v-9ec85279] {
  background: rgba(28, 35, 51, 0.4) !important;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

html.light-theme .download-popup,
html.light-theme .download-popup[data-v-9ec85279] {
  background: #FFFFFF !important;
  border: 1px solid var(--tl-border-standard) !important;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.15) !important;
}

html.light-theme .dlp-title,
html.light-theme .dlp-title[data-v-9ec85279] {
  color: var(--tl-text-primary) !important;
}

/* ============================================================
 * 37. AI 免责声明
 * ============================================================ */

html:not(.light-theme) .ai-disclaimer,
html:not(.light-theme) .ai-disclaimer[data-v-9ec85279] {
  color: var(--tl-text-weak) !important;
}

html.light-theme .ai-disclaimer,
html.light-theme .ai-disclaimer[data-v-9ec85279] {
  color: var(--tl-text-weak) !important;
}

/* ============================================================
 * 38. 主题切换过渡
 * ============================================================ */

html, body, #app,
.mobile-container, .mobile-header, .mobile-sidebar, .mobile-tabbar,
.sidebar-item, .tab-item, .msg-bubble, .context-menu, .popup-panel,
.chat-wrapper, .site-footer, .mobile-icp-footer,
.mobile-input .el-textarea__inner, .sidebar-search-input {
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease !important;
}

/* ============================================================
 * 39. 链接颜色
 * ============================================================ */

html:not(.light-theme) a {
  color: var(--tl-accent-primary) !important;
}

html.light-theme a {
  color: var(--tl-accent-primary) !important;
}

/* ============================================================
 * 40. 滚动条
 * ============================================================ */

html:not(.light-theme) ::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

html:not(.light-theme) ::-webkit-scrollbar-track {
  background: var(--tl-bg-base) !important;
}

html:not(.light-theme) ::-webkit-scrollbar-thumb {
  background: var(--tl-border-solid) !important;
  border-radius: 3px;
}

html:not(.light-theme) ::-webkit-scrollbar-thumb:hover {
  background: var(--tl-accent-primary) !important;
}

html.light-theme ::-webkit-scrollbar-track {
  background: var(--tl-bg-base) !important;
}

html.light-theme ::-webkit-scrollbar-thumb {
  background: var(--tl-border-standard) !important;
  border-radius: 3px;
}

html.light-theme ::-webkit-scrollbar-thumb:hover {
  background: var(--tl-accent-primary) !important;
}

/* ============================================================
 * 41. PC端底部导航栏
 * ============================================================ */

/* 移动端窄屏下显示的PC响应式底部导航：避免被ICP备案信息遮挡 */
body.mobile-footer-visible .pc-bottom-tabbar,
body.mobile-footer-visible .pc-bottom-tabbar[data-v-94917686] {
  margin-bottom: calc(var(--mobile-footer-height, 22px) + env(safe-area-inset-bottom)) !important;
}

html:not(.light-theme) .pc-bottom-tabbar .tab-item.active,
html:not(.light-theme) .pc-bottom-tabbar .tab-item.active[data-v-94917686] {
  color: var(--tl-accent-primary) !important;
  background: rgba(108, 124, 255, 0.1) !important;
  box-shadow: inset 0 0 0 1px rgba(108, 124, 255, 0.28) !important;
}

html.light-theme .pc-bottom-tabbar .tab-item.active,
html.light-theme .pc-bottom-tabbar .tab-item.active[data-v-94917686] {
  color: var(--tl-accent-primary) !important;
  background: rgba(79, 124, 255, 0.08) !important;
  box-shadow: inset 0 0 0 1px rgba(79, 124, 255, 0.22) !important;
}

/* ============================================================
 * 42. PC端会话列表选中项（绿色→蓝紫）
 * ============================================================ */

html:not(.light-theme) .session-item.active,
html:not(.light-theme) .session-item.active[data-v-9ec85279],
html:not(.light-theme) .session-item.active[data-v-883a4e41],
html:not(.light-theme) .session-item.active[data-v-52bb6565] {
  background: rgba(108, 124, 255, 0.12) !important;
}

html:not(.light-theme) .session-item.active:before,
html:not(.light-theme) .session-item.active[data-v-9ec85279]:before,
html:not(.light-theme) .session-item.active[data-v-883a4e41]:before,
html:not(.light-theme) .session-item.active[data-v-52bb6565]:before {
  background: linear-gradient(135deg, var(--tl-accent-primary) 0%, var(--tl-accent-strong) 100%) !important;
}

html.light-theme .session-item.active,
html.light-theme .session-item.active[data-v-9ec85279],
html.light-theme .session-item.active[data-v-883a4e41],
html.light-theme .session-item.active[data-v-52bb6565] {
  background: rgba(79, 124, 255, 0.1) !important;
}

html.light-theme .session-item.active:before,
html.light-theme .session-item.active[data-v-9ec85279]:before,
html.light-theme .session-item.active[data-v-883a4e41]:before,
html.light-theme .session-item.active[data-v-52bb6565]:before {
  background: linear-gradient(135deg, var(--tl-accent-primary) 0%, var(--tl-accent-primary) 100%) !important;
}

/* ============================================================
 * 43. PC端会话列表滚动条
 * ============================================================ */

html:not(.light-theme) .session-list::-webkit-scrollbar-thumb,
html:not(.light-theme) [data-v-9ec85279] .session-list::-webkit-scrollbar-thumb,
html:not(.light-theme) [data-v-883a4e41] .session-list::-webkit-scrollbar-thumb,
html:not(.light-theme) .session-list[data-v-52bb6565]::-webkit-scrollbar-thumb {
  background: var(--tl-border-solid) !important;
}

html:not(.light-theme) .session-list::-webkit-scrollbar-thumb:hover,
html:not(.light-theme) [data-v-9ec85279] .session-list::-webkit-scrollbar-thumb:hover,
html:not(.light-theme) [data-v-883a4e41] .session-list::-webkit-scrollbar-thumb:hover,
html:not(.light-theme) .session-list[data-v-52bb6565]::-webkit-scrollbar-thumb:hover {
  background: var(--tl-accent-primary) !important;
}

html.light-theme .session-list::-webkit-scrollbar-thumb,
html.light-theme [data-v-9ec85279] .session-list::-webkit-scrollbar-thumb,
html.light-theme [data-v-883a4e41] .session-list::-webkit-scrollbar-thumb,
html.light-theme .session-list[data-v-52bb6565]::-webkit-scrollbar-thumb {
  background: var(--tl-border-standard) !important;
}

html.light-theme .session-list::-webkit-scrollbar-thumb:hover,
html.light-theme [data-v-9ec85279] .session-list::-webkit-scrollbar-thumb:hover,
html.light-theme [data-v-883a4e41] .session-list::-webkit-scrollbar-thumb:hover,
html.light-theme .session-list[data-v-52bb6565]::-webkit-scrollbar-thumb:hover {
  background: var(--tl-accent-primary) !important;
}

/* ============================================================
 * 44. PC端模型信息弹窗（绿色→蓝紫）
 * ============================================================ */

html:not(.light-theme) .model-info-popper {
  background: linear-gradient(135deg, #121A33 0%, #162042 100%) !important;
  border-color: rgba(108, 124, 255, 0.3) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6) !important;
}

html.light-theme .model-info-popper {
  background: linear-gradient(135deg, #FFFFFF 0%, #F4F7FB 100%) !important;
  border-color: rgba(79, 124, 255, 0.2) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1) !important;
}

html:not(.light-theme) .model-info-popper .el-popper__arrow:before {
  border-color: rgba(108, 124, 255, 0.3) !important;
}

html.light-theme .model-info-popper .el-popper__arrow:before {
  border-color: rgba(79, 124, 255, 0.2) !important;
}

html:not(.light-theme) .model-info-popper .mobile-model-info-header {
  color: var(--tl-accent-primary) !important;
}

html.light-theme .model-info-popper .mobile-model-info-header {
  color: var(--tl-accent-primary) !important;
}

/* ============================================================
 * 45. PC端参考图标签（绿色→蓝紫）
 * ============================================================ */

html:not(.light-theme) .chat-footer .panel-label.ref-label,
html:not(.light-theme) .chat-footer .panel-label.ref-label[data-v-9ec85279] {
  background: rgba(108, 124, 255, 0.12) !important;
  color: var(--tl-accent-primary) !important;
}

html.light-theme .chat-footer .panel-label.ref-label,
html.light-theme .chat-footer .panel-label.ref-label[data-v-9ec85279] {
  background: rgba(79, 124, 255, 0.1) !important;
  color: var(--tl-accent-primary) !important;
}

/* ============================================================
 * 46. 套图生成按钮（绿色→蓝紫）
 * ============================================================ */

html:not(.light-theme) .sgen-generate-config .sgen-generate-btn,
html:not(.light-theme) .sgen-generate-config .sgen-generate-btn[data-v-52bb6565] {
  background: linear-gradient(135deg, #6C7CFF, #8A5CFF) !important;
}

html.light-theme .sgen-generate-config .sgen-generate-btn,
html.light-theme .sgen-generate-config .sgen-generate-btn[data-v-52bb6565] {
  background: linear-gradient(135deg, #4F7CFF, #6A5CFF) !important;
}

/* ============================================================
 * 47. PC端聊天背景装饰（绿色→蓝紫）
 * ============================================================ */

html:not(.light-theme) .chat-wrapper:before,
html:not(.light-theme) .chat-wrapper[data-v-9ec85279]:before,
html:not(.light-theme) .chat-wrapper[data-v-883a4e41]:before {
  background: radial-gradient(circle, rgba(108, 124, 255, 0.08), transparent 70%) !important;
}

html.light-theme .chat-wrapper:before,
html.light-theme .chat-wrapper[data-v-9ec85279]:before,
html.light-theme .chat-wrapper[data-v-883a4e41]:before {
  background: radial-gradient(circle, rgba(79, 124, 255, 0.06), transparent 70%) !important;
}

/* ============================================================
 * 48. PC端顶部导航选中项（绿色→蓝紫）
 * ============================================================ */

html:not(.light-theme) .nav-item.active,
html:not(.light-theme) .nav-item.active[data-v-94917686] {
  color: var(--tl-accent-primary) !important;
}

html.light-theme .nav-item.active,
html.light-theme .nav-item.active[data-v-94917686] {
  color: var(--tl-accent-primary) !important;
  background: rgba(79, 124, 255, 0.08) !important;
  border-color: rgba(79, 124, 255, 0.18) !important;
}

html.light-theme .nav-item.active[data-v-94917686]:after {
  background: var(--tl-accent-primary) !important;
}

/* ============================================================
 * 49. PC端会话删除按钮（绿色→红，与移动端统一）
 * ============================================================ */

html:not(.light-theme) .session-del,
html:not(.light-theme) .session-del[data-v-9ec85279],
html:not(.light-theme) .session-del[data-v-883a4e41],
html:not(.light-theme) .session-del[data-v-52bb6565] {
  color: #fff !important;
  background-color: rgba(239, 68, 68, 0.85) !important;
}

html:not(.light-theme) .session-del:hover,
html:not(.light-theme) .session-del[data-v-9ec85279]:hover,
html:not(.light-theme) .session-del[data-v-883a4e41]:hover,
html:not(.light-theme) .session-del[data-v-52bb6565]:hover {
  background-color: rgba(239, 68, 68, 1) !important;
}

html.light-theme .session-del,
html.light-theme .session-del[data-v-9ec85279],
html.light-theme .session-del[data-v-883a4e41],
html.light-theme .session-del[data-v-52bb6565] {
  color: #fff !important;
  background-color: rgba(239, 68, 68, 0.85) !important;
}

html.light-theme .session-del:hover,
html.light-theme .session-del[data-v-9ec85279]:hover,
html.light-theme .session-del[data-v-883a4e41]:hover,
html.light-theme .session-del[data-v-52bb6565]:hover {
  background-color: rgba(239, 68, 68, 1) !important;
}

/* ============================================================
 * 50. Element Plus 下拉选中项（绿色→蓝紫）
 * ============================================================ */

html:not(.light-theme) .el-select-dropdown__item.is-selected,
html:not(.light-theme) .el-select-dropdown__item.selected {
  color: var(--tl-accent-primary) !important;
  background: rgba(108, 124, 255, 0.1) !important;
}

html.light-theme .el-select-dropdown__item.is-selected,
html.light-theme .el-select-dropdown__item.selected {
  color: var(--tl-accent-primary) !important;
  background: rgba(79, 124, 255, 0.08) !important;
}

.sketch-pad-popper .el-select-dropdown__item.selected {
  color: var(--tl-accent-primary) !important;
}