/**
 * 深色主题CSS变量系统
 * 定义了完整的颜色系统和主题变量
 */

/* 根元素变量定义 */
:root {
    /* 动画和过渡 */
    --transition-fast: 0.15s ease;
    --transition-normal: 0.3s ease;
    --transition-slow: 0.5s ease;

    /* 阴影系统 */
    --shadow-sm: 0 1px 2px 0 var(--shadow-color);
    --shadow-md: 0 4px 6px -1px var(--shadow-color);
    --shadow-lg: 0 10px 15px -3px var(--shadow-color);
    --shadow-xl: 0 20px 25px -5px var(--shadow-color);

    /* 边框圆角 */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;
    --radius-full: 9999px;

    /* 间距系统 */
    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 16px;
    --space-lg: 24px;
    --space-xl: 32px;
    --space-2xl: 48px;

    /* 字体大小 */
    --text-xs: 0.75rem;
    --text-sm: 0.875rem;
    --text-base: 1rem;
    --text-lg: 1.125rem;
    --text-xl: 1.25rem;
    --text-2xl: 1.5rem;
    --text-3xl: 1.875rem;
    --text-4xl: 2.25rem;
}

/* 浅色主题 */
:root,
[data-theme="light"] {
    /* 主色调 */
    --primary-50: #eff6ff;
    --primary-100: #dbeafe;
    --primary-200: #bfdbfe;
    --primary-300: #93c5fd;
    --primary-400: #60a5fa;
    --primary-500: #3b82f6;
    --primary-600: #2563eb;
    --primary-700: #1d4ed8;
    --primary-800: #1e40af;
    --primary-900: #1e3a8a;

    /* 次要色调 */
    --secondary-50: #faf5ff;
    --secondary-100: #f3e8ff;
    --secondary-200: #e9d5ff;
    --secondary-300: #d8b4fe;
    --secondary-400: #c084fc;
    --secondary-500: #a855f7;
    --secondary-600: #9333ea;
    --secondary-700: #7c2d12;
    --secondary-800: #6b21a8;
    --secondary-900: #581c87;

    /* 功能色彩 */
    --success-color: #10b981;
    --success-light: #d1fae5;
    --success-dark: #047857;

    --danger-color: #ef4444;
    --danger-light: #fee2e2;
    --danger-dark: #dc2626;

    --warning-color: #f59e0b;
    --warning-light: #fef3c7;
    --warning-dark: #d97706;

    --info-color: #06b6d4;
    --info-light: #cffafe;
    --info-dark: #0891b2;

    /* 中性色调 */
    --gray-50: #f9fafb;
    --gray-100: #f3f4f6;
    --gray-200: #e5e7eb;
    --gray-300: #d1d5db;
    --gray-400: #9ca3af;
    --gray-500: #6b7280;
    --gray-600: #4b5563;
    --gray-700: #374151;
    --gray-800: #1f2937;
    --gray-900: #111827;

    /* 语义化颜色 */
    --primary-color: var(--primary-600);
    --secondary-color: var(--secondary-600);

    --background-color: #ffffff;
    --surface-color: #f8fafc;
    --surface-hover: #f1f5f9;

    --text-color: var(--gray-900);
    --text-secondary: var(--gray-600);
    --text-muted: var(--gray-500);
    --text-disabled: var(--gray-400);

    --border-color: var(--gray-200);
    --border-hover: var(--gray-300);
    --border-focus: var(--primary-500);

    --shadow-color: rgba(0, 0, 0, 0.1);
    --shadow-color-strong: rgba(0, 0, 0, 0.25);

    /* 渐变背景 */
    --gradient-primary: linear-gradient(135deg, var(--primary-600) 0%, var(--secondary-600) 100%);
    --gradient-surface: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);

    /* 图表颜色 */
    --chart-grid: #f0f0f0;
    --chart-axis: #666666;
    --chart-text: #333333;
    --chart-background: #ffffff;

    /* 特殊效果 */
    --backdrop-blur: blur(10px);
    --glass-background: rgba(255, 255, 255, 0.8);
    --glass-border: rgba(255, 255, 255, 0.2);
}

/* 深色主题 */
[data-theme="dark"] {
    /* 主色调 - 深色模式下稍微调亮 */
    --primary-color: var(--primary-500);
    --secondary-color: var(--secondary-500);

    /* 功能色彩 - 深色模式优化 */
    --success-color: #10b981;
    --success-light: #064e3b;
    --success-dark: #34d399;

    --danger-color: #ef4444;
    --danger-light: #7f1d1d;
    --danger-dark: #f87171;

    --warning-color: #f59e0b;
    --warning-light: #78350f;
    --warning-dark: #fbbf24;

    --info-color: #06b6d4;
    --info-light: #164e63;
    --info-dark: #22d3ee;

    /* 背景和表面 */
    --background-color: #0f0f0f;
    --surface-color: #1a1a1a;
    --surface-hover: #2d2d2d;

    /* 文字颜色 */
    --text-color: #ffffff;
    --text-secondary: #a0a0a0;
    --text-muted: #737373;
    --text-disabled: #525252;

    /* 边框颜色 */
    --border-color: #404040;
    --border-hover: #525252;
    --border-focus: var(--primary-500);

    /* 阴影 */
    --shadow-color: rgba(0, 0, 0, 0.3);
    --shadow-color-strong: rgba(0, 0, 0, 0.6);

    /* 渐变背景 */
    --gradient-primary: linear-gradient(135deg, var(--primary-600) 0%, var(--secondary-600) 100%);
    --gradient-surface: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);

    /* 图表颜色 */
    --chart-grid: #333333;
    --chart-axis: #999999;
    --chart-text: #ffffff;
    --chart-background: #1a1a1a;

    /* 特殊效果 */
    --glass-background: rgba(26, 26, 26, 0.8);
    --glass-border: rgba(255, 255, 255, 0.1);
}

/* 基础样式重置和主题应用 */
* {
    transition: background-color var(--transition-normal),
        color var(--transition-normal),
        border-color var(--transition-normal),
        box-shadow var(--transition-normal);
}

body {
    background-color: var(--background-color);
    color: var(--text-color);
}

/* 通用组件样式 */
.card {
    background-color: var(--surface-color);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md);
}

.card:hover {
    border-color: var(--border-hover);
    box-shadow: var(--shadow-lg);
}

.btn {
    border-radius: var(--radius-md);
    transition: all var(--transition-fast);
}

.btn-primary {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
    color: white;
}

.btn-primary:hover {
    background-color: var(--primary-700);
    border-color: var(--primary-700);
    transform: translateY(-1px);
    box-shadow: var(--shadow-lg);
}

.btn-secondary {
    background-color: var(--secondary-color);
    border-color: var(--secondary-color);
    color: white;
}

.btn-success {
    background-color: var(--success-color);
    border-color: var(--success-color);
}

.btn-danger {
    background-color: var(--danger-color);
    border-color: var(--danger-color);
}

.btn-warning {
    background-color: var(--warning-color);
    border-color: var(--warning-color);
}

.btn-info {
    background-color: var(--info-color);
    border-color: var(--info-color);
}

/* 表单控件 */
.form-control,
.form-select {
    background-color: var(--surface-color);
    border-color: var(--border-color);
    color: var(--text-color);
}

.form-control:focus,
.form-select:focus {
    background-color: var(--surface-color);
    border-color: var(--border-focus);
    color: var(--text-color);
    box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.25);
}

/* 表格 */
.table {
    color: var(--text-color);
}

.table-striped>tbody>tr:nth-of-type(odd)>td,
.table-striped>tbody>tr:nth-of-type(odd)>th {
    background-color: var(--surface-hover);
}

/* 导航和侧边栏 */
.navbar {
    background-color: var(--surface-color) !important;
    border-bottom: 1px solid var(--border-color);
}

.sidebar {
    background: var(--gradient-primary) !important;
}

/* 模态框 */
.modal-content {
    background-color: var(--surface-color);
    border-color: var(--border-color);
}

.modal-header {
    border-bottom-color: var(--border-color);
}

.modal-footer {
    border-top-color: var(--border-color);
}

/* 下拉菜单 */
.dropdown-menu {
    background-color: var(--surface-color);
    border-color: var(--border-color);
    box-shadow: var(--shadow-lg);
}

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

.dropdown-item:hover {
    background-color: var(--surface-hover);
    color: var(--text-color);
}

/* 进度条 */
.progress {
    background-color: var(--surface-hover);
}

/* 徽章 */
.badge {
    color: white;
}

/* 工具提示 */
.tooltip-inner {
    background-color: var(--surface-color);
    color: var(--text-color);
    border: 1px solid var(--border-color);
}

/* 自定义滚动条 */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: var(--surface-color);
}

::-webkit-scrollbar-thumb {
    background: var(--border-color);
    border-radius: var(--radius-full);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--border-hover);
}

/* 响应式设计 */
@media (max-width: 768px) {
    .theme-toggle {
        top: 10px;
        right: 10px;
        width: 40px;
        height: 40px;
        font-size: 16px;
    }
}

/* 打印样式 */
@media print {
    [data-theme="dark"] {
        --background-color: white;
        --text-color: black;
        --surface-color: white;
    }
}

/* ── limit-up-review.html & market-breadth.html 主题适配 ── */

/* 浅色主题覆盖 */
[data-theme="light"] body {
    background: #f1f5f9;
    color: #1e293b;
}

[data-theme="light"] .page-header {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

[data-theme="light"] .main {
    color: #1e293b;
}

/* 卡片类 */
[data-theme="light"] .summary-card,
[data-theme="light"] .index-card,
[data-theme="light"] .amount-card,
[data-theme="light"] .breadth-card,
[data-theme="light"] .chart-card,
[data-theme="light"] .sector-item,
[data-theme="light"] .stat-card,
[data-theme="light"] .card {
    background: #ffffff;
    border-color: #e2e8f0;
    color: #1e293b;
}

[data-theme="light"] .breadth-card .card-header,
[data-theme="light"] .chart-card .card-header,
[data-theme="light"] .card-header {
    color: #334155;
    border-bottom-color: #e2e8f0;
}

/* 日期导航 */
[data-theme="light"] .date-nav,
[data-theme="light"] .date-list {
    background: #f8fafc;
    border-bottom-color: #e2e8f0;
}

[data-theme="light"] .date-btn {
    background: #ffffff;
    border-color: #cbd5e1;
    color: #475569;
}

[data-theme="light"] .date-btn:hover {
    border-color: #3b82f6;
    color: #3b82f6;
}

[data-theme="light"] .date-btn.active {
    background: #1d4ed8;
    border-color: #1d4ed8;
    color: #fff;
}

[data-theme="light"] .nav-arrow {
    background: #ffffff;
    border-color: #cbd5e1;
    color: #475569;
}

[data-theme="light"] .nav-arrow:hover {
    border-color: #3b82f6;
    color: #3b82f6;
}

/* 标签文字 */
[data-theme="light"] .summary-card .label,
[data-theme="light"] .amount-card .label,
[data-theme="light"] .amount-card .unit,
[data-theme="light"] .bar-label,
[data-theme="light"] .update-time {
    color: #64748b;
}

/* 条形图轨道 */
[data-theme="light"] .bar-track {
    background: #e2e8f0;
}

/* 分割线 */
[data-theme="light"] .divider {
    border-top-color: #e2e8f0;
}

/* 错误提示 */
[data-theme="light"] .error-banner {
    background: rgba(239, 68, 68, 0.08);
    border-color: rgba(239, 68, 68, 0.3);
}

/* 刷新按钮 */
[data-theme="light"] .refresh-btn {
    background: #ffffff;
    border-color: #cbd5e1;
    color: #475569;
}

[data-theme="light"] .refresh-btn:hover {
    border-color: #3b82f6;
    color: #3b82f6;
}

/* 涨停复盘表格 */
[data-theme="light"] .stock-table th {
    background: #f8fafc;
    color: #64748b;
    border-bottom-color: #e2e8f0;
}

[data-theme="light"] .stock-table td {
    border-bottom-color: #f1f5f9;
    color: #334155;
}

[data-theme="light"] .stock-table tbody tr:nth-child(odd) td {
    background: rgba(0, 0, 0, 0.02);
}

[data-theme="light"] .stock-table tbody tr:nth-child(even) td {
    background: rgba(0, 0, 0, 0.04);
}

[data-theme="light"] .stock-table tbody tr:hover td {
    background: rgba(59, 130, 246, 0.06) !important;
}

[data-theme="light"] .stock-table td strong {
    color: #1e293b;
}

/* 板块标题 */
[data-theme="light"] .sector-title {
    background: linear-gradient(90deg, #f8fafc, #ffffff);
    border-bottom-color: #e2e8f0;
    color: #1e293b;
}

[data-theme="light"] .sector-name-text {
    color: #1e293b;
}

[data-theme="light"] .sector-desc {
    color: #64748b;
}

/* 概念标签 */
[data-theme="light"] .concept-tag {
    background: #eff6ff;
    border-color: #bfdbfe;
    color: #1d4ed8;
}

/* 图表分组 */
[data-theme="light"] .charts-group {
    background: #f1f5f9;
    border-top-color: #e2e8f0;
    border-bottom-color: #e2e8f0;
}

[data-theme="light"] .charts-group-header {
    color: #334155;
    border-bottom-color: #e2e8f0;
}

/* 统计卡片颜色保持不变（涨红跌绿） */
[data-theme="light"] .stat-card .label {
    color: #64748b;
}

/* 平盘停牌数字在浅色主题下加深 */
[data-theme="light"] .white {
    color: #334155;
}

/* 涨停复盘表格文字在浅色主题下加深 */
[data-theme="light"] .time-tag,
[data-theme="light"] .sector-desc,
[data-theme="light"] .cell-muted {
    color: #475569;
}