/**
 * DAF学院 - 全局主题系统
 * 支持亮色和暗色主题切换
 * 覆盖 design-system.css 中的变量
 */

/* ========================================
   亮色主题（默认）
======================================== */
:root,
[data-theme="light"] {
    /* 覆盖背景色变量 */
    --bg-primary: #ffffff;
    --bg-secondary: #f8fafc;
    --bg-tertiary: #f1f5f9;
    --bg-card: #ffffff;
    --bg-overlay: rgba(0, 0, 0, 0.5);
    
    /* 覆盖文字颜色变量 */
    --text-primary: #1e293b;
    --text-secondary: #64748b;
    --text-tertiary: #94a3b8;
    --text-inverse: #ffffff;
    
    /* 覆盖边框颜色变量 */
    --border-color: #e2e8f0;
    --border-color-light: #f1f5f9;
    --border-color-dark: #cbd5e1;
}

/* ========================================
   暗色主题
======================================== */
[data-theme="dark"] {
    /* 覆盖背景色变量-蓝色调 */
    /* --bg-primary: #1a1a2e;
    --bg-secondary: #16213e;
    --bg-tertiary: #0f1419;
    --bg-card: #1f2937;
    --bg-overlay: rgba(0, 0, 0, 0.7); */
    
    /* 覆盖文字颜色变量-蓝色调 */
    /* --text-primary: #f9fafb;
    --text-secondary: #cbd5e1;
    --text-tertiary: #94a3b8;
    --text-inverse: #1e293b; */
    
    /* 覆盖边框颜色变量-蓝色调 */
    /* --border-color: #374151;
    --border-color-light: #4b5563;
    --border-color-dark: #6b7280; */

    /* 覆盖背景色变量-黑色调 */
    --bg-primary: #1a1a1a;
    --bg-secondary: #1f1f1f;
    --bg-tertiary: #1a1a1a;
    --bg-card: #242424;
    --bg-overlay: rgba(0, 0, 0, 0.7);
    
    /* 覆盖文字颜色变量-黑色调 */
    --text-primary: #f9fafb;
    --text-secondary: #cbd5e1;
    --text-tertiary: #94a3b8;
    --text-inverse: #1e293b;
    
    /* 覆盖边框颜色变量-黑色调 */
    --border-color: #3a3a3a;
    --border-color-light: #3a3a3a;
    --border-color-dark: #4a4a4a;
}

/* ========================================
   应用主题到全局元素
======================================== */
html {
    background-color: var(--bg-secondary);
    color: var(--text-primary);
}

body {
    background-color: var(--bg-secondary);
    color: var(--text-primary);
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* 卡片背景 */
.app-main,
.container,
.card,
.modal,
.share-modal,
.navbar,
.sidebar {
    background-color: var(--bg-card);
    color: var(--text-primary);
}

/* 分享表单容器 - 透明背景，跟随父容器 */
.share-form-container {
    background-color: transparent;
    color: var(--text-primary);
}

/* 标题样式 */
h1, h2, h3, h4, h5, h6,
.title,
.section-title,
.share-form-title {
    color: var(--text-primary);
}

/* 输入框和表单元素 */
input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
select,
textarea,
.form-input,
.form-select,
.form-textarea {
    background-color: var(--bg-card);
    color: var(--text-primary);
    border-color: var(--border-color);
}

input:focus,
select:focus,
textarea:focus,
.form-input:focus,
.form-select:focus,
.form-textarea:focus {
    background-color: var(--bg-card);
    color: var(--text-primary);
    border-color: var(--color-primary);
}

input::placeholder,
textarea::placeholder {
    color: var(--text-tertiary);
}

/* 边框 */
.border,
.border-top,
.border-bottom,
.border-left,
.border-right {
    border-color: var(--border-color);
}

/* 浮动按钮 */
.floating-btn {
    background-color: var(--bg-card);
    border-color: var(--border-color);
    color: var(--text-secondary);
}

.floating-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

/* 导航栏 */
.navbar {
    background-color: var(--bg-card);
    border-bottom-color: var(--border-color);
}

.navbar-dropdown {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

.navbar-dropdown-item {
    color: var(--text-primary);
}

.navbar-dropdown-item:hover {
    background-color: var(--bg-tertiary);
}

/* 模态框 */
.modal,
.share-modal {
    background-color: var(--bg-card);
    color: var(--text-primary);
}

.modal-backdrop,
.share-modal-backdrop {
    background: var(--bg-overlay);
}

/* 按钮 */
.btn,
button {
    color: var(--text-primary);
}

.btn-primary {
    background-color: var(--color-primary);
    color: var(--text-inverse);
}

.btn-secondary {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

/* 平滑过渡 */
html,
body,
.app-main,
.container,
.card,
.modal,
.navbar,
input,
select,
textarea,
.btn,
button,
.floating-btn {
    transition: background-color 0.3s ease, 
                color 0.3s ease, 
                border-color 0.3s ease,
                box-shadow 0.3s ease;
}

/* 禁用某些元素的过渡（性能优化） */
img,
svg,
video,
iframe,
canvas {
    transition: none;
}

/* 页脚样式 - 跟随主题 */
.footer {
    background-color: var(--bg-card);
    color: var(--text-primary);
    border-top-color: var(--border-color-light);
}

.footer-section h4 {
    color: var(--text-primary);
}

.footer-link {
    color: var(--text-secondary);
}

.footer-link:hover {
    color: var(--color-primary);
}

.footer-bottom {
    border-top-color: var(--border-color-light);
    color: var(--text-tertiary);
}

.footer-bottom a {
    color: var(--text-secondary);
}

.footer-bottom a:hover {
    color: var(--color-primary);
}
