/**
 * theme.css
 * 全站主题样式 - 暗色模式
 */

/* ===== 暗色主题 ===== */
body.theme-dark {
    background: #1a1a1a !important;
    color: #e0e0e0;
}

body.theme-dark .video-controls {
    background: #2a2a2a !important;
}

body.theme-dark .subtitle-item {
    border-bottom-color: #333;
}

body.theme-dark .subtitle-item:hover {
    background: #2a2a2a;
}

body.theme-dark .subtitle-item.active {
    background: #333;
    border-color: #555;
}

body.theme-dark .subtitle-en,
body.theme-dark .current-en,
body.theme-dark .video-title {
    color: #e0e0e0;
}

body.theme-dark .subtitle-zh,
body.theme-dark .current-zh {
    color: #aaa;
}

body.theme-dark .subtitle-item.active .subtitle-en {
    color: #fff;
}

body.theme-dark .back-btn {
    color: #e0e0e0;
}

body.theme-dark .ctrl-btn {
    color: #e0e0e0 !important;
}

body.theme-dark .ctrl-btn i {
    color: #e0e0e0 !important;
}

body.theme-dark .mode-btn {
    color: #e0e0e0 !important;
}

body.theme-dark .mode-btn:hover {
    color: #fff !important;
}

body.theme-dark .mode-btn.active {
    color: #333 !important;
}

body.theme-dark .mode-buttons {
    background: #333;
}

body.theme-dark .top-bar-right button {
    color: #e0e0e0;
}

body.theme-dark #playPauseBtn,
body.theme-dark #playPauseBtn:hover {
    color: #e0e0e0 !important;
}

/* 字幕工具栏 */
body.theme-dark .subtitle-toolbar {
    border-top-color: #333;
}

body.theme-dark .toolbar-btn {
    color: #aaa;
}

body.theme-dark .toolbar-btn:hover {
    background: #333 !important;
    color: #e0e0e0;
}

/* 听写模式 */
body.theme-dark .dictation-item {
    border-bottom-color: #333 !important;
}

body.theme-dark .dictation-item:hover {
    background: #2a2a2a !important;
}

body.theme-dark .dictation-item.active {
    background: #333 !important;
    border-color: #555 !important;
}

body.theme-dark .dictation-placeholder {
    color: #aaa !important;
}

body.theme-dark .dictation-en,
body.theme-dark .dictation-zh {
    color: #e0e0e0 !important;
}

body.theme-dark .dictation-time {
    color: #888 !important;
}

body.theme-dark .dictation-input-area textarea {
    background: #333;
    color: #e0e0e0;
    border-color: #444;
}

body.theme-dark .clear-dictation-btn,
body.theme-dark .view-original-btn {
    background: #333;
    color: #aaa;
    border-color: #444;
}

body.theme-dark .toggle-original-btn {
    color: #aaa;
}

/* 阅读模式 */
body.theme-dark .reading-item {
    border-bottom-color: #333;
}

body.theme-dark .reading-en {
    color: #e0e0e0 !important;
}

body.theme-dark .reading-zh {
    color: #aaa !important;
}

body.theme-dark .reading-number {
    color: #888;
}

body.theme-dark .reading-toggle {
    color: #aaa;
}

/* 中译英模式 */
body.theme-dark .translation-item {
    border-bottom-color: #333;
}

body.theme-dark .translation-en {
    color: #e0e0e0 !important;
}

body.theme-dark .translation-zh {
    color: #aaa !important;
}

body.theme-dark .translation-number {
    color: #888;
}

body.theme-dark .translation-toggle {
    color: #aaa;
}

/* 挖空模式 */
body.theme-dark .cloze-item {
    border-bottom-color: #333;
}

body.theme-dark .cloze-en {
    color: #e0e0e0;
}

/* 词卡模式 */
body.theme-dark .wordcard-item {
    background: #2a2a2a;
    border-color: #333;
}

body.theme-dark .wordcard-item:hover {
    background: #333;
}

body.theme-dark .wordcard-word {
    color: #e0e0e0;
}

body.theme-dark .wordcard-list {
    color: #e0e0e0;
}

/* 设置面板 */
body.theme-dark .settings-panel {
    background: #2a2a2a;
    color: #e0e0e0;
}

body.theme-dark .settings-label {
    color: #e0e0e0;
}

body.theme-dark .settings-close {
    color: #aaa;
}

body.theme-dark .settings-icon-btn {
    color: #aaa;
}

body.theme-dark .settings-icon-btn:hover {
    background: #333;
    color: #fff;
}

body.theme-dark .settings-icon-btn i {
    color: #aaa;
}

body.theme-dark .settings-icon-btn:hover i {
    color: #fff;
}

body.theme-dark .settings-options {
    background: #333;
}

body.theme-dark .settings-option {
    color: #aaa;
}

body.theme-dark .settings-option.active {
    background: #555;
    color: #fff;
}

body.theme-dark .settings-slider {
    background: #444;
}

body.theme-dark .settings-row,
body.theme-dark .settings-icon-row {
    border-bottom-color: #333;
}

body.theme-dark .settings-tick {
    background: #666;
}

body.theme-dark .settings-value {
    color: #e0e0e0;
}

body.theme-dark .settings-tick-label {
    color: #888;
}

/* 登录/注册/忘记密码页 */
body.theme-dark .login-card {
    background: #2a2a2a !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

body.theme-dark .login-card h1 {
    color: #e0e0e0 !important;
}

body.theme-dark .login-card .sub {
    color: #aaa !important;
}

body.theme-dark .login-card input {
    background: #333 !important;
    border-color: #444 !important;
    color: #e0e0e0 !important;
}

body.theme-dark .login-card button {
    background: #444 !important;
}

body.theme-dark .login-card button:hover {
    background: #555 !important;
}

body.theme-dark .register-note {
    border-top-color: #333 !important;
    color: #aaa !important;
}

body.theme-dark .register-note a {
    color: #aaa !important;
}

body.theme-dark .login-footer {
    color: #888;
}

body.theme-dark .footer-social-link {
    color: #aaa !important;
}

body.theme-dark .footer-social-list {
    border-bottom-color: #333 !important;
}

body.theme-dark .qrcode-modal-content {
    background: #2a2a2a !important;
}

body.theme-dark .qrcode-text {
    color: #e0e0e0 !important;
}

body.theme-dark .qrcode-account {
    background: #333 !important;
}

body.theme-dark .qrcode-account span {
    color: #e0e0e0 !important;
}

/* 反馈页 */
body.theme-dark .feedback-container {
    background: #2a2a2a !important;
}

body.theme-dark .feedback-container h1 {
    color: #e0e0e0 !important;
}

body.theme-dark .feedback-container .sub {
    color: #aaa !important;
}

body.theme-dark .feedback-container label {
    color: #e0e0e0 !important;
}

body.theme-dark .feedback-container select,
body.theme-dark .feedback-container textarea,
body.theme-dark .feedback-container input {
    background: #333 !important;
    border-color: #444 !important;
    color: #e0e0e0 !important;
}

body.theme-dark .feedback-container .btn-submit {
    background: #444 !important;
}

body.theme-dark .feedback-container .back-link {
    color: #aaa !important;
}

/* 引导页 */
body.theme-dark .guide-container h1 {
    color: #e0e0e0 !important;
}

body.theme-dark .guide-container p {
    color: #aaa !important;
}

body.theme-dark .guide-container .back-link {
    color: #aaa !important;
}

/* 仪表盘 */
body.theme-dark .sidebar {
    background: #2a2a2a !important;
}

body.theme-dark .sidebar-nav-item {
    color: #aaa !important;
}

body.theme-dark .sidebar-nav-item.active {
    background: #333 !important;
    color: #e0e0e0 !important;
}

body.theme-dark .category-btn {
    color: #aaa !important;
}

body.theme-dark .category-btn.active {
    background: #333 !important;
    color: #e0e0e0 !important;
}

body.theme-dark .video-card {
    background: #2a2a2a !important;
    border-color: #333 !important;
}

body.theme-dark .stat-card {
    background: #2a2a2a !important;
    border-color: #333 !important;
}

body.theme-dark .profile-card {
    background: #2a2a2a !important;
    border-color: #333 !important;
}

body.theme-dark .profile-label {
    color: #aaa !important;
}

body.theme-dark .profile-value {
    color: #e0e0e0 !important;
}

body.theme-dark .profile-item {
    border-bottom-color: #333 !important;
}

body.theme-dark .logout-btn {
    background: #333 !important;
    border-color: #444 !important;
    color: #e0e0e0 !important;
}

body.theme-dark .logout-btn:hover {
    background: #444 !important;
}

body.theme-dark .modal-content {
    background: #2a2a2a !important;
}

body.theme-dark .modal-content p {
    color: #e0e0e0 !important;
}

body.theme-dark .search-area {
    background: #333 !important;
    border-color: #444 !important;
}

body.theme-dark .search-input {
    color: #e0e0e0 !important;
}

body.theme-dark .empty-state {
    color: #aaa !important;
}

body.theme-dark .stat-list-title {
    color: #e0e0e0 !important;
}

body.theme-dark .stat-value {
    color: #e0e0e0 !important;
}

body.theme-dark .stat-label {
    color: #aaa !important;
}

body.theme-dark .video-period {
    color: #e0e0e0 !important;
}

body.theme-dark .video-title-zh {
    color: #e0e0e0 !important;
}

body.theme-dark .video-meta {
    color: #aaa !important;
    border-top-color: #333 !important;
}

body.theme-dark .top-bar-btn {
    color: #aaa !important;
}

body.theme-dark .top-bar-btn:hover {
    color: #e0e0e0 !important;
}

body.theme-dark .btn-confirm {
    background: #444 !important;
}

body.theme-dark .btn-cancel {
    background: #333 !important;
    border-color: #444 !important;
    color: #aaa !important;
}

body.theme-dark .sidebar-divider {
    border-top-color: #333 !important;
}

body.theme-dark .hamburger-btn {
    color: #e0e0e0 !important;
}

/* 我的收藏/单词本 */
body.theme-dark .words-container {
    background: #1a1a1a;
}

body.theme-dark .words-card {
    background: #2a2a2a !important;
    border-color: #333 !important;
}

body.theme-dark .words-card-header {
    border-bottom-color: #333 !important;
}

body.theme-dark .words-video-info {
    color: #aaa !important;
}

body.theme-dark .words-en {
    color: #e0e0e0 !important;
}

body.theme-dark .words-zh {
    color: #aaa !important;
}

body.theme-dark .words-note-content {
    color: #e0e0e0 !important;
}

body.theme-dark .words-word {
    color: #e0e0e0 !important;
}

body.theme-dark .words-card-actions {
    border-top-color: #333 !important;
}

body.theme-dark .words-btn {
    color: #aaa !important;
}

body.theme-dark .words-btn:hover {
    background: #333 !important;
    color: #e0e0e0 !important;
}

body.theme-dark .words-tab-btn {
    color: #aaa !important;
}

body.theme-dark .words-tab-btn:hover {
    background: #333 !important;
    color: #e0e0e0 !important;
}

body.theme-dark .words-tab-btn.active {
    background: #333 !important;
    color: #e0e0e0 !important;
}

body.theme-dark .words-tabs {
    border-bottom-color: #333 !important;
}

body.theme-dark .words-confirm-box {
    background: #2a2a2a !important;
}

body.theme-dark .words-confirm-box p {
    color: #e0e0e0 !important;
}

body.theme-dark .words-prompt-input {
    background: #333 !important;
    border-color: #444 !important;
    color: #e0e0e0 !important;
}

body.theme-dark .words-btn-confirm {
    background: #444 !important;
}

body.theme-dark .words-btn-cancel {
    background: #333 !important;
    border-color: #444 !important;
    color: #aaa !important;
}

body.theme-dark .words-empty,
body.theme-dark .words-loading {
    color: #aaa !important;
}

/* 单词弹窗 */
body.theme-dark .words-card {
    background: #2a2a2a;
    border-color: #333;
}

body.theme-dark .words-confirm-box {
    background: #2a2a2a;
}

/* 单词释义弹窗 */
body.theme-dark .word-popup-container {
    background: #2a2a2a;
    color: #e0e0e0;
}

body.theme-dark .word-popup-header {
    background: #333;
    border-bottom-color: #444;
}

body.theme-dark .word-popup-title {
    color: #e0e0e0;
}

body.theme-dark .popup-word-title {
    color: #e0e0e0;
}

body.theme-dark .popup-pronounce-value {
    color: #e0e0e0;
}

body.theme-dark .popup-pronounce-label {
    color: #aaa;
}

body.theme-dark .popup-def {
    color: #ccc;
}

body.theme-dark .popup-speak {
    background: #444;
    color: #aaa;
}

body.theme-dark .popup-speak:hover {
    background: #555;
    color: #fff;
}

body.theme-dark .wordcard-detail-meaning-item {
    border-bottom-color: #444;
}

body.theme-dark .wordcard-meaning-text {
    color: #ccc;
}

body.theme-dark .wordcard-detail-example {
    background: #333;
}

body.theme-dark .wordcard-example-en {
    color: #e0e0e0;
}

body.theme-dark .wordcard-example-zh {
    color: #aaa;
}

body.theme-dark .wordcard-detail-word-text {
    color: #e0e0e0;
}

body.theme-dark .wordcard-pronounce-row {
    border-bottom-color: #444;
}

body.theme-dark .wordcard-pronounce-value {
    color: #e0e0e0;
}

body.theme-dark .wordcard-back-btn {
    color: #aaa;
}

/* ===== 系统自动暗色（跟随设备设置） ===== */
@media (prefers-color-scheme: dark) {
    /* 当用户没有手动设置主题时，跟随系统 */
    body:not(.theme-dark):not(.theme-light) {
        background: #1a1a1a !important;
        color: #e0e0e0;
    }
    /* 复用 body.theme-dark 的所有样式 */
    body:not(.theme-dark):not(.theme-light) .video-controls { background: #2a2a2a !important; }
    body:not(.theme-dark):not(.theme-light) .subtitle-item { border-bottom-color: #333; }
    body:not(.theme-dark):not(.theme-light) .subtitle-item:hover { background: #2a2a2a; }
    body:not(.theme-dark):not(.theme-light) .subtitle-item.active { background: #333; border-color: #555; }
    body:not(.theme-dark):not(.theme-light) .subtitle-en,
    body:not(.theme-dark):not(.theme-light) .current-en,
    body:not(.theme-dark):not(.theme-light) .video-title { color: #e0e0e0; }
    body:not(.theme-dark):not(.theme-light) .subtitle-zh,
    body:not(.theme-dark):not(.theme-light) .current-zh { color: #aaa; }
    body:not(.theme-dark):not(.theme-light) .ctrl-btn { color: #e0e0e0 !important; }
    body:not(.theme-dark):not(.theme-light) .mode-btn { color: #e0e0e0 !important; }
    body:not(.theme-dark):not(.theme-light) .mode-buttons { background: #333; }
    body:not(.theme-dark):not(.theme-light) .mode-btn.active { color: #333 !important; }
    body:not(.theme-dark):not(.theme-light) .login-card { background: #2a2a2a !important; }
    body:not(.theme-dark):not(.theme-light) .login-card h1 { color: #e0e0e0 !important; }
    body:not(.theme-dark):not(.theme-light) .login-card .sub { color: #aaa !important; }
    body:not(.theme-dark):not(.theme-light) .login-card input { background: #333 !important; border-color: #444 !important; color: #e0e0e0 !important; }
    body:not(.theme-dark):not(.theme-light) .login-card button { background: #444 !important; }
    body:not(.theme-dark):not(.theme-light) .register-note { border-top-color: #333 !important; }
    body:not(.theme-dark):not(.theme-light) .register-note a { color: #aaa !important; }
    body:not(.theme-dark):not(.theme-light) .sidebar { background: #2a2a2a !important; }
    body:not(.theme-dark):not(.theme-light) .sidebar-nav-item { color: #aaa !important; }
    body:not(.theme-dark):not(.theme-light) .sidebar-nav-item.active { background: #333 !important; color: #e0e0e0 !important; }
    body:not(.theme-dark):not(.theme-light) .video-card { background: #2a2a2a !important; border-color: #333 !important; }
    body:not(.theme-dark):not(.theme-light) .stat-card { background: #2a2a2a !important; border-color: #333 !important; }
    body:not(.theme-dark):not(.theme-light) .profile-card { background: #2a2a2a !important; border-color: #333 !important; }
    body:not(.theme-dark):not(.theme-light) .search-area { background: #333 !important; border-color: #444 !important; }
    body:not(.theme-dark):not(.theme-light) .search-input { color: #e0e0e0 !important; }
    body:not(.theme-dark):not(.theme-light) .words-card { background: #2a2a2a !important; border-color: #333 !important; }
    body:not(.theme-dark):not(.theme-light) .feedback-container { background: #2a2a2a !important; }
    body:not(.theme-dark):not(.theme-light) .feedback-container h1 { color: #e0e0e0 !important; }
    body:not(.theme-dark):not(.theme-light) .feedback-container select,
    body:not(.theme-dark):not(.theme-light) .feedback-container textarea,
    body:not(.theme-dark):not(.theme-light) .feedback-container input { background: #333 !important; border-color: #444 !important; color: #e0e0e0 !important; }
    body:not(.theme-dark):not(.theme-light) .settings-panel { background: #2a2a2a; }
    body:not(.theme-dark):not(.theme-light) .settings-label { color: #e0e0e0; }
    body:not(.theme-dark):not(.theme-light) .settings-options { background: #333; }
    body:not(.theme-dark):not(.theme-light) .settings-option { color: #aaa; }
    body:not(.theme-dark):not(.theme-light) .settings-option.active { background: #555; color: #fff; }
}

/* 模糊按钮激活时暗色 */
body.theme-dark #blurSubtitleBtn.active {
    color: #e0e0e0 !important;
}

/* 手机端暗色补充 */
@media (max-width: 768px) {
    body.theme-dark .subtitle-item {
        border-bottom-color: #333 !important;
    }
    
    body.theme-dark .mobile-mode-btn {
        color: #aaa !important;
    }
    
    body.theme-dark .mobile-mode-btn.active {
        color: #e0e0e0 !important;
        border-bottom-color: #e0e0e0 !important;
    }
    
    body.theme-dark .mobile-controls {
        background: #1a1a1a !important;
    }
    
    body.theme-dark .mobile-progress-container {
        background: #1a1a1a !important;
    }
    
    body.theme-dark .mobile-time {
        color: #aaa !important;
    }
}

/* 系统暗色 - 设置面板补充 */
@media (prefers-color-scheme: dark) {
    body:not(.theme-dark):not(.theme-light) .settings-close { color: #aaa; }
    body:not(.theme-dark):not(.theme-light) .settings-icon-btn { color: #aaa; }
    body:not(.theme-dark):not(.theme-light) .settings-icon-btn:hover { background: #333; color: #fff; }
    body:not(.theme-dark):not(.theme-light) .settings-icon-btn i { color: #aaa; }
    body:not(.theme-dark):not(.theme-light) .settings-icon-btn:hover i { color: #fff; }
    body:not(.theme-dark):not(.theme-light) .settings-slider { background: #444; }
    body:not(.theme-dark):not(.theme-light) .settings-row,
    body:not(.theme-dark):not(.theme-light) .settings-icon-row { border-bottom-color: #333; }
    body:not(.theme-dark):not(.theme-light) .settings-tick { background: #666; }
    body:not(.theme-dark):not(.theme-light) .settings-value { color: #e0e0e0; }
    body:not(.theme-dark):not(.theme-light) .settings-tick-label { color: #888; }
}

/* 暗色下按钮激活状态保持橙色 */
body.theme-dark .ctrl-btn.loop-active,
body.theme-dark .ctrl-btn.pause-active,
body.theme-dark .ctrl-btn.phonetic-active {
    color: #ff9800 !important;
}

/* 暗色下按钮图标激活橙色 */
body.theme-dark .ctrl-btn.loop-active i,
body.theme-dark .ctrl-btn.pause-active i,
body.theme-dark .ctrl-btn.phonetic-active i {
    color: #ff9800 !important;
}

/* 听写模式原句显示 */
body.theme-dark .original-sentence-display .original-en {
    color: #e0e0e0 !important;
}
body.theme-dark .original-sentence-display .original-zh {
    color: #aaa !important;
}