/* Astem Theme System - CSS Variables (亮色默认 + 深空赛博) */

/* ========== 亮色主题（默认）— ASTEM 莫兰迪色系 ========== */
:root,
[data-theme="light"] {
    --bg-primary: #FDFCF5;
    --bg-sidebar: #F2F1EA;
    --bg-sidebar-grad: linear-gradient(180deg,#F2F1EA 0%,#E8E7E0 100%);
    --bg-card: #FFFEFA;
    --bg-input: #F5F4ED;
    --bg-hover: rgba(0,0,0,0.05);
    --bg-message-user: linear-gradient(135deg,#6366f1,#8b5cf6);
    --bg-message-assistant: #FFFEFA;
    --text: #4D4D4D;
    --text-muted: #B3B3B3;
    --text-dark: #4D4D4D;
    --border: #D4D4CE;
    --primary: #6366f1;
    --primary-light: #818cf8;
    --shadow: rgba(77,77,77,0.1);
}

/* ========== 深空赛博主题 ========== */
[data-theme="cyber"] {
    --bg-primary: #0a0a0f;
    --bg-sidebar: #0e0e16;
    --bg-sidebar-grad: linear-gradient(180deg,#0e0e16 0%,#0c0c12 100%);
    --bg-card: #12121a;
    --bg-input: #1a1a24;
    --bg-hover: rgba(99,102,241,0.18);
    --bg-message-user: linear-gradient(135deg,#6366f1,#22e5e5);
    --bg-message-assistant: #12121a;
    --text: #f0f0f8;
    --text-muted: #d4d4f0;
    --text-dark: #0a0a0f;
    --border: #27272a;
    --primary: #6366f1;
    --primary-light: #818cf8;
    --shadow: rgba(0,0,0,0.5);
}

/* ========== Light Theme Component Overrides ========== */

/* Sidebar */
[data-theme="light"] .sidebar {
    background: var(--bg-sidebar-grad) !important;
    border-right-color: rgba(0,0,0,0.08) !important;
}
[data-theme="light"] .sidebar-toggle {
    background: rgba(0,0,0,0.06) !important;
    color: #555 !important;
}
[data-theme="light"] .sidebar-toggle:hover {
    background: rgba(0,0,0,0.12) !important;
    color: #222 !important;
}
[data-theme="light"] .nav-item {
    color: rgba(0,0,0,0.6) !important;
}
[data-theme="light"] .nav-item:hover,
[data-theme="light"] .nav-item.active {
    background: rgba(99,102,241,0.1) !important;
    color: #6366f1 !important;
}
[data-theme="light"] .nav-icon { color: rgba(0,0,0,0.5) !important; }
[data-theme="light"] .nav-item:hover .nav-icon,
[data-theme="light"] .nav-item.active .nav-icon { color: #6366f1 !important; }
[data-theme="light"] .conv-list-label {
    color: rgba(0,0,0,0.35) !important;
}
[data-theme="light"] .conv-item {
    color: rgba(0,0,0,0.7) !important;
}
[data-theme="light"] .conv-item:hover {
    background: rgba(0,0,0,0.05) !important;
}
[data-theme="light"] .conv-item.active {
    background: rgba(99,102,241,0.08) !important;
    color: #6366f1 !important;
}
[data-theme="light"] .conv-item .conv-time {
    color: rgba(0,0,0,0.35) !important;
}
[data-theme="light"] .sidebar-user-name {
    color: rgba(0,0,0,0.7) !important;
}

/* Message bubbles */
[data-theme="light"] .message.assistant .message-bubble {
    background: var(--bg-message-assistant) !important;
    border-color: rgba(0,0,0,0.08) !important;
    color: #4D4D4D !important;
}
[data-theme="light"] .message.user .message-bubble {
    color: #4D4D4D !important;
}

/* Action buttons in messages */
[data-theme="light"] .msg-action-btn {
    color: rgba(0,0,0,0.4) !important;
}
[data-theme="light"] .msg-action-btn:hover {
    color: #6366f1 !important;
    background: rgba(99,102,241,0.08) !important;
}

/* Right panel */
[data-theme="light"] .right-panel {
    background: var(--bg-card) !important;
    border-left-color: rgba(0,0,0,0.08) !important;
}
[data-theme="light"] .right-panel-header {
    border-bottom-color: rgba(0,0,0,0.08) !important;
}
[data-theme="light"] .right-panel-header h3 {
    color: var(--text) !important;
}
[data-theme="light"] .right-panel-tab {
    color: var(--text-muted) !important;
}
[data-theme="light"] .right-panel-tab:hover {
    color: var(--text) !important;
}
[data-theme="light"] .right-panel-tab.active {
    color: var(--primary) !important;
}

/* Settings items */
[data-theme="light"] .rp-setting-item {
    border-bottom-color: rgba(0,0,0,0.06) !important;
}
[data-theme="light"] .rp-setting-label {
    color: var(--text) !important;
}
[data-theme="light"] .rp-setting-btn {
    background: var(--bg-input) !important;
    color: var(--text-muted) !important;
}
[data-theme="light"] .rp-setting-btn:hover {
    background: rgba(99,102,241,0.1) !important;
    color: var(--primary) !important;
}
[data-theme="light"] .rp-section-title {
    color: var(--text-muted) !important;
}

/* Info cards */
[data-theme="light"] .rp-info-card {
    background: var(--bg-input) !important;
}
[data-theme="light"] .rp-label {
    color: var(--text-muted) !important;
}
[data-theme="light"] .rp-value {
    color: var(--text) !important;
}

/* Context menu / right-click menu */
[data-theme="light"] .ctx-menu {
    background: #fff !important;
    border-color: rgba(0,0,0,0.12) !important;
    box-shadow: 0 4px 16px rgba(0,0,0,0.1) !important;
}
[data-theme="light"] .ctx-menu-item {
    color: var(--text) !important;
}
[data-theme="light"] .ctx-menu-item:hover {
    background: rgba(99,102,241,0.08) !important;
}

/* Modal */
[data-theme="light"] .modal-box {
    background: #fff !important;
}
[data-theme="light"] .modal-header {
    border-bottom-color: rgba(0,0,0,0.08) !important;
}
[data-theme="light"] .modal-header h2 {
    color: var(--text) !important;
}

/* Input area */
[data-theme="light"] .input-area {
    background: var(--bg-card) !important;
    border-top-color: rgba(0,0,0,0.08) !important;
}
[data-theme="light"] #messageInput {
    background: var(--bg-input) !important;
    color: var(--text) !important;
    border-color: rgba(0,0,0,0.1) !important;
}
[data-theme="light"] #messageInput::placeholder {
    color: var(--text-muted) !important;
}

/* Agent items */
[data-theme="light"] .agent-item {
    border-color: rgba(0,0,0,0.08) !important;
}
[data-theme="light"] .agent-item:hover {
    border-color: var(--primary-light) !important;
}
[data-theme="light"] .agent-item.active {
    border-color: var(--primary) !important;
    background: rgba(99,102,241,0.08) !important;
}
[data-theme="light"] .agent-item-name {
    color: var(--text) !important;
}
[data-theme="light"] .agent-item-status {
    color: var(--text-muted) !important;
}
[data-theme="light"] .agent-item-btn {
    color: var(--text-muted) !important;
}
[data-theme="light"] .agent-item-btn:hover {
    background: var(--bg-card) !important;
    color: var(--text) !important;
}

/* Voice select */
[data-theme="light"] .voice-option {
    background: var(--bg-input) !important;
    border-color: rgba(0,0,0,0.08) !important;
    color: var(--text) !important;
}
[data-theme="light"] .voice-option:hover {
    border-color: var(--primary) !important;
}
[data-theme="light"] .voice-option.active {
    border-color: var(--primary) !important;
    background: rgba(99,102,241,0.08) !important;
}
[data-theme="light"] .voice-option .voice-name {
    color: var(--text) !important;
}
[data-theme="light"] .voice-option .voice-desc {
    color: var(--text-muted) !important;
}

/* TTS playing glow */
[data-theme="light"] .message.tts-playing .message-bubble {
    border-color: var(--primary) !important;
    box-shadow: 0 0 8px rgba(99,102,241,0.2) !important;
}

/* Theme select in settings */
[data-theme="light"] #themeSelect {
    background: var(--bg-input) !important;
    color: var(--text) !important;
    border-color: rgba(0,0,0,0.1) !important;
}
[data-theme="light"] #themeSelect option {
    background: #fff !important;
    color: #4D4D4D !important;
}

/* Scrollbar */
[data-theme="light"] ::-webkit-scrollbar-thumb {
    background: rgba(0,0,0,0.15) !important;
}

/* Form elements */
[data-theme="light"] input[type="text"],
[data-theme="light"] textarea,
[data-theme="light"] select {
    background: var(--bg-input) !important;
    color: var(--text) !important;
    border-color: rgba(0,0,0,0.1) !important;
}
[data-theme="light"] .form-hint,
[data-theme="light"] .form-example {
    color: var(--text-muted) !important;
}

/* Btn new agent */
[data-theme="light"] .btn-new-agent {
    border-color: rgba(0,0,0,0.12) !important;
    color: var(--text-muted) !important;
}
[data-theme="light"] .btn-new-agent:hover {
    border-color: var(--primary) !important;
    color: var(--primary) !important;
}

/* Image preview bar */
[data-theme="light"] .image-preview-bar {
    background: var(--bg-card) !important;
    border-top-color: rgba(0,0,0,0.08) !important;
}

/* Upload buttons */
[data-theme="light"] .btn-upload-img,
[data-theme="light"] .btn-gen-img {
    background: var(--bg-card) !important;
    border-color: rgba(0,0,0,0.1) !important;
    color: var(--text-muted) !important;
}

/* BG preview */
[data-theme="light"] .bg-preview-wrap {
    background-color: var(--bg-input) !important;
    border-color: rgba(0,0,0,0.1) !important;
}

/* Blockquote / cite */
[data-theme="light"] blockquote,
[data-theme="light"] .cite-block {
    border-left-color: var(--primary) !important;
    background: var(--bg-input) !important;
    color: var(--text) !important;
}

/* Code */
[data-theme="light"] code,
[data-theme="light"] pre {
    background: rgba(0,0,0,0.04) !important;
    color: #e74c3c !important;
}
[data-theme="light"] pre code {
    color: var(--text) !important;
}

/* TTS btn speaking */
[data-theme="light"] .msg-action-btn.tts-btn.speaking {
    color: rgba(99,102,241,0.9) !important;
}


/* ========== Light Theme - Chat Area Background ========== */
[data-theme="light"] .chat-messages:not(.has-bg) {
    background: var(--bg-primary) !important;
}
[data-theme="light"] .chat-container {
    background: var(--bg-primary) !important;
}
[data-theme="light"] .main-content {
    background: var(--bg-primary) !important;
}
[data-theme="light"] .app-layout {
    background: var(--bg-primary) !important;
}
[data-theme="light"] body {
    background: var(--bg-primary) !important;
}
[data-theme="light"] html {
    background: var(--bg-primary) !important;
}

/* ========== Light Theme - Chat Header/Toolbar ========== */
[data-theme="light"] .chat-header {
    background: var(--bg-card) !important;
    border-bottom-color: rgba(0,0,0,0.08) !important;
}
[data-theme="light"] .chat-toolbar {
    background: var(--bg-card) !important;
    border-bottom-color: rgba(0,0,0,0.08) !important;
}

/* ========== Light Theme - Input Area ========== */
[data-theme="light"] .chat-input-area {
    background: var(--bg-card) !important;
    border-top-color: rgba(0,0,0,0.08) !important;
}

/* ========== Light Theme - Welcome Message ========== */
[data-theme="light"] .welcome-msg h2 {
    color: var(--text) !important;
}
[data-theme="light"] .welcome-msg p {
    color: var(--text-muted) !important;
}

/* ========== Light Theme - Sidebar nav (expanded) ========== */
[data-theme="light"] .sidebar-nav-item {
    color: rgba(0,0,0,0.6) !important;
}
[data-theme="light"] .sidebar-nav-item:hover {
    background: rgba(0,0,0,0.06) !important;
    color: rgba(0,0,0,0.8) !important;
}
[data-theme="light"] .sidebar-nav-item.active {
    background: rgba(108,92,231,0.15) !important;
    color: #6c5ce7 !important;
}
[data-theme="light"] .sidebar-divider {
    background: rgba(0,0,0,0.08) !important;
}
[data-theme="light"] .sidebar-conv-item {
    color: rgba(0,0,0,0.7) !important;
}
[data-theme="light"] .sidebar-conv-item:hover {
    background: rgba(0,0,0,0.05) !important;
}
[data-theme="light"] .sidebar-conv-item.active {
    background: rgba(108,92,231,0.12) !important;
    color: #6c5ce7 !important;
}
[data-theme="light"] .sidebar-conv-item .conv-time {
    color: rgba(0,0,0,0.35) !important;
}
[data-theme="light"] .sidebar-conv-delete {
    background: rgba(255,80,80,0.08) !important;
    color: #ff6b6b !important;
}

/* ========== Light Theme - Message bubbles (hardcoded override) ========== */
[data-theme="light"] .message.assistant .message-bubble {
    background: #ffffff !important;
    border-color: rgba(0,0,0,0.08) !important;
    color: #4D4D4D !important;
}
/* 用户消息气泡：ASTEM五色随机循环（JS动态添加 .accent-a/s/t/e/m） */
[data-theme="light"] .message.user .message-bubble {
    color: #4D4D4D !important;
    border: 1px solid rgba(0,0,0,0.06) !important;
}
[data-theme="light"] .message.user .message-bubble.accent-a { background: #FDEEF0 !important; }
[data-theme="light"] .message.user .message-bubble.accent-s { background: #EDF1F8 !important; }
[data-theme="light"] .message.user .message-bubble.accent-t { background: #FDF3EF !important; }
[data-theme="light"] .message.user .message-bubble.accent-e { background: #F0F8E8 !important; }
[data-theme="light"] .message.user .message-bubble.accent-m { background: #F3EEF8 !important; }

/* ========== Light Theme - Action buttons ========== */
[data-theme="light"] .msg-action-btn {
    background: rgba(0,0,0,0.06) !important;
    color: rgba(0,0,0,0.5) !important;
}
[data-theme="light"] .msg-action-btn:hover {
    background: rgba(99,102,241,0.15) !important;
    color: #6366f1 !important;
}
/* AI bubble action buttons (TTS/朗读 etc.) - 亮色适配 2026-08-10 */
[data-theme="light"] .ai-bubble-actions .action-btn {
    background: rgba(0,0,0,0.05) !important;
    color: #B3B3B3 !important;
}
[data-theme="light"] .ai-bubble-actions .action-btn:hover {
    background: rgba(99,102,241,0.12) !important;
    color: #6366f1 !important;
}
[data-theme="light"] .ai-bubble-actions .action-btn.speaking {
    color: #6366f1 !important;
    background: rgba(99,102,241,0.12) !important;
}
[data-theme="light"] .ai-bubble-actions .action-btn .btn-tooltip {
    background: rgba(77,77,77,0.9) !important;
    color: #fff !important;
}

/* === Voice Options Light Theme Fix === */
[data-theme="light"] .voice-select-name,
[data-theme="light"] .tts-voice-name,
[data-theme="light"] .voice-select-name,
[data-theme="light"] .tts-voice-name {
    color: #4D4D4D !important;
    font-weight: 600;
}

[data-theme="light"] .voice-select-desc,
[data-theme="light"] .tts-voice-desc,
[data-theme="light"] .voice-select-desc,
[data-theme="light"] .tts-voice-desc {
    color: #666 !important;
}

[data-theme="light"] .voice-select-item,
[data-theme="light"] .voice-select-item {
    background: #f8f8fc !important;
    border-color: #e0e0e0 !important;
    color: #4D4D4D !important;
}

[data-theme="light"] .voice-select-item:hover,
[data-theme="light"] .voice-select-item:hover {
    background: #eef0ff !important;
    border-color: #6c5ce7 !important;
}

[data-theme="light"] .voice-select-item.selected,
[data-theme="light"] .voice-select-item.selected {
    background: #eef0ff !important;
    border-color: #6c5ce7 !important;
}

[data-theme="light"] .voice-select-tag,
[data-theme="light"] .voice-select-tag {
    color: #6c5ce7 !important;
    background: rgba(108,92,231,0.1) !important;
}

[data-theme="light"] .voice-select-tag.female,
[data-theme="light"] .voice-select-tag.female {
    background: rgba(236,72,153,0.1) !important;
    color: #ec4899 !important;
}

[data-theme="light"] .voice-preview-btn,
[data-theme="light"] .voice-preview-btn {
    background: #eef0ff !important;
    color: #6c5ce7 !important;
}

[data-theme="light"] .voice-preview-btn:hover,
[data-theme="light"] .voice-preview-btn.playing,
[data-theme="light"] .voice-preview-btn:hover,
[data-theme="light"] .voice-preview-btn.playing {
    background: #6c5ce7 !important;
    color: #fff !important;
}


/* === TTS Panel Full Light Theme Fix === */
[data-theme="light"] .tts-voice-panel-header h3,
[data-theme="light"] .tts-voice-panel-header,
[data-theme="light"] .rp-setting-label,
[data-theme="light"] .rp-setting-icon,
[data-theme="light"] .rp-setting-left,
[data-theme="light"] .tts-voice-panel-header h3,
[data-theme="light"] .tts-voice-panel-header,
[data-theme="light"] .rp-setting-label,
[data-theme="light"] .rp-setting-icon,
[data-theme="light"] .rp-setting-left {
    color: #4D4D4D !important;
}

[data-theme="light"] .tts-voice-panel,
[data-theme="light"] .tts-voice-panel-overlay,
[data-theme="light"] .tts-voice-panel,
[data-theme="light"] .tts-voice-panel-overlay {
    background: #fff !important;
}

[data-theme="light"] .tts-voice-panel-header,
[data-theme="light"] .tts-voice-panel-header {
    background: #f8f8fc !important;
    border-bottom-color: #e0e0e0 !important;
}

[data-theme="light"] .tts-voice-panel-close,
[data-theme="light"] .tts-voice-panel-close {
    background: rgba(0,0,0,0.05) !important;
    color: #666 !important;
}

[data-theme="light"] .tts-voice-panel-close:hover,
[data-theme="light"] .tts-voice-panel-close:hover {
    background: rgba(0,0,0,0.1) !important;
    color: #333 !important;
}

/* 音色选择器标题区域 */
[data-theme="light"] .voice-select-header,
[data-theme="light"] .voice-select-title,
[data-theme="light"] .voice-select-header,
[data-theme="light"] .voice-select-title {
    color: #4D4D4D !important;
}

[data-theme="light"] .voice-select-list,
[data-theme="light"] .voice-select-list {
    background: #fff !important;
}

/* 当前音色右侧按钮 */
[data-theme="light"] .rp-setting-right button,
[data-theme="light"] .rp-setting-right select,
[data-theme="light"] .rp-setting-right button,
[data-theme="light"] .rp-setting-right select {
    color: #4D4D4D !important;
    background: #f0f0f0 !important;
}

/* 朗读音色section标题 */
[data-theme="light"] .rp-section-title,
[data-theme="light"] .rp-setting-section-title,
[data-theme="light"] .rp-section-title,
[data-theme="light"] .rp-setting-section-title {
    color: #4D4D4D !important;
}


/* PPT section light theme */
html[data-theme="light"] #pptGenerateBtn {
    background: linear-gradient(135deg, #6366f1, #8b5cf6) !important;
    color: #fff !important;
}
html[data-theme="light"] #pptTopicInput {
    color: #4D4D4D !important;
    background: #fff !important;
    border-color: #ddd !important;
}