/* 优化的暗色主题样式 - 改善对比度和可读性 */

/* 基础暗色主题变量 */
:root[data-theme="dark"] {
    /* 背景色系 - 使用更柔和的深色 */
    --dark-bg-primary: #0f172a;      /* 主背景 - 深蓝黑 */
    --dark-bg-secondary: #1e293b;    /* 次要背景 - 深蓝灰 */
    --dark-bg-tertiary: #334155;     /* 第三级背景 - 中蓝灰 */
    --dark-bg-elevated: #475569;     /* 提升背景 - 浅蓝灰 */
    
    /* 文字色系 - 高对比度 */
    --dark-text-primary: #f8fafc;    /* 主要文字 - 近白色 */
    --dark-text-secondary: #e2e8f0;  /* 次要文字 - 浅灰白 */
    --dark-text-tertiary: #cbd5e0;   /* 第三级文字 - 中灰白 */
    --dark-text-muted: #94a3b8;      /* 静默文字 - 深灰白 */
    
    /* 边框色系 */
    --dark-border-primary: #475569;   /* 主要边框 */
    --dark-border-secondary: #64748b; /* 次要边框 */
    --dark-border-focus: #3b82f6;    /* 焦点边框 - 蓝色 */
    
    /* 阴影色系 */
    --dark-shadow: rgba(0, 0, 0, 0.3);
    --dark-shadow-elevated: rgba(0, 0, 0, 0.5);
}

/* 暗色主题基础样式 */
[data-theme="dark"] {
    background-color: var(--dark-bg-primary);
    color: var(--dark-text-primary);
}

/* 导航栏优化 */
[data-theme="dark"] .navbar {
    background: linear-gradient(135deg, var(--dark-bg-secondary) 0%, var(--dark-bg-tertiary) 100%);
    box-shadow: 0 2px 8px var(--dark-shadow);
}

[data-theme="dark"] .navbar-item {
    color: var(--dark-text-primary) !important;
}

[data-theme="dark"] .navbar-item:hover {
    background-color: var(--dark-bg-elevated) !important;
    color: var(--dark-text-primary) !important;
}

[data-theme="dark"] .navbar-item.is-active {
    background-color: var(--dark-bg-elevated) !important;
    border-bottom: 2px solid var(--dark-border-focus);
}

/* 卡片组件优化 */
[data-theme="dark"] .card {
    background-color: var(--dark-bg-secondary) !important;
    border: 1px solid var(--dark-border-primary);
    box-shadow: 0 4px 12px var(--dark-shadow);
}

[data-theme="dark"] .card .title {
    color: var(--dark-text-primary) !important;
}

[data-theme="dark"] .card .subtitle {
    color: var(--dark-text-secondary) !important;
}

[data-theme="dark"] .card .content {
    color: var(--dark-text-secondary) !important;
}

/* 按钮优化 - 更好的对比度 */
[data-theme="dark"] .button.is-primary {
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%) !important;
    color: #ffffff !important;
    border: none;
    box-shadow: 0 2px 4px rgba(59, 130, 246, 0.3);
}

[data-theme="dark"] .button.is-primary:hover {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(59, 130, 246, 0.4);
}

[data-theme="dark"] .button.is-success {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%) !important;
    color: #ffffff !important;
    border: none;
    box-shadow: 0 2px 4px rgba(16, 185, 129, 0.3);
}

[data-theme="dark"] .button.is-danger {
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%) !important;
    color: #ffffff !important;
    border: none;
    box-shadow: 0 2px 4px rgba(239, 68, 68, 0.3);
}

[data-theme="dark"] .button.is-light {
    background-color: var(--dark-bg-elevated) !important;
    color: var(--dark-text-primary) !important;
    border: 1px solid var(--dark-border-primary);
}

[data-theme="dark"] .button.is-light:hover {
    background-color: var(--dark-bg-tertiary) !important;
    border-color: var(--dark-border-secondary);
}

/* 输入框优化 */
[data-theme="dark"] .input,
[data-theme="dark"] .textarea,
[data-theme="dark"] .select select {
    background-color: var(--dark-bg-secondary) !important;
    color: var(--dark-text-primary) !important;
    border: 2px solid var(--dark-border-primary);
    transition: all 0.2s ease;
}

[data-theme="dark"] .input:focus,
[data-theme="dark"] .textarea:focus,
[data-theme="dark"] .select select:focus {
    border-color: var(--dark-border-focus) !important;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1) !important;
    background-color: var(--dark-bg-primary) !important;
}

[data-theme="dark"] .input::placeholder,
[data-theme="dark"] .textarea::placeholder {
    color: var(--dark-text-muted) !important;
}

/* 标签优化 */
[data-theme="dark"] .tag {
    background-color: var(--dark-bg-elevated) !important;
    color: var(--dark-text-primary) !important;
    border: 1px solid var(--dark-border-primary);
}

[data-theme="dark"] .tag.is-primary {
    background-color: #3b82f6 !important;
    color: #ffffff !important;
    border-color: #3b82f6;
}

[data-theme="dark"] .tag.is-success {
    background-color: #10b981 !important;
    color: #ffffff !important;
    border-color: #10b981;
}

[data-theme="dark"] .tag.is-danger {
    background-color: #ef4444 !important;
    color: #ffffff !important;
    border-color: #ef4444;
}

/* 通知优化 */
[data-theme="dark"] .notification {
    background-color: var(--dark-bg-secondary) !important;
    color: var(--dark-text-primary) !important;
    border: 1px solid var(--dark-border-primary);
    box-shadow: 0 2px 8px var(--dark-shadow);
}

[data-theme="dark"] .notification.is-success {
    background-color: #065f46 !important;
    color: #d1fae5 !important;
    border-color: #10b981;
}

[data-theme="dark"] .notification.is-danger {
    background-color: #7f1d1d !important;
    color: #fecaca !important;
    border-color: #ef4444;
}

[data-theme="dark"] .notification.is-warning {
    background-color: #78350f !important;
    color: #fed7aa !important;
    border-color: #f59e0b;
}

[data-theme="dark"] .notification.is-info {
    background-color: #1e3a8a !important;
    color: #bfdbfe !important;
    border-color: #3b82f6;
}

/* 表格优化 */
[data-theme="dark"] .table {
    background-color: var(--dark-bg-secondary) !important;
    color: var(--dark-text-primary) !important;
}

[data-theme="dark"] .table th {
    background-color: var(--dark-bg-tertiary) !important;
    color: var(--dark-text-primary) !important;
    border-color: var(--dark-border-primary) !important;
}

[data-theme="dark"] .table td {
    background-color: var(--dark-bg-secondary) !important;
    color: var(--dark-text-secondary) !important;
    border-color: var(--dark-border-primary) !important;
}

[data-theme="dark"] .table tr:hover {
    background-color: var(--dark-bg-elevated) !important;
}

/* 分页优化 */
[data-theme="dark"] .pagination-link {
    background-color: var(--dark-bg-secondary) !important;
    color: var(--dark-text-primary) !important;
    border-color: var(--dark-border-primary) !important;
}

[data-theme="dark"] .pagination-link:hover {
    background-color: var(--dark-bg-elevated) !important;
    border-color: var(--dark-border-secondary);
}

[data-theme="dark"] .pagination-link.is-current {
    background-color: var(--dark-border-focus) !important;
    color: #ffffff !important;
    border-color: var(--dark-border-focus);
}

/* 模态框优化 */
[data-theme="dark"] .modal-card {
    background-color: var(--dark-bg-secondary) !important;
}

[data-theme="dark"] .modal-card-head {
    background-color: var(--dark-bg-tertiary) !important;
    border-bottom-color: var(--dark-border-primary);
}

[data-theme="dark"] .modal-card-title {
    color: var(--dark-text-primary) !important;
}

[data-theme="dark"] .modal-card-body {
    background-color: var(--dark-bg-secondary) !important;
    color: var(--dark-text-secondary) !important;
}

[data-theme="dark"] .modal-card-foot {
    background-color: var(--dark-bg-tertiary) !important;
    border-top-color: var(--dark-border-primary);
}

/* 下拉菜单优化 */
[data-theme="dark"] .dropdown-content {
    background-color: var(--dark-bg-secondary) !important;
    border: 1px solid var(--dark-border-primary);
    box-shadow: 0 8px 16px var(--dark-shadow-elevated);
}

[data-theme="dark"] .dropdown-item {
    color: var(--dark-text-primary) !important;
}

[data-theme="dark"] .dropdown-item:hover {
    background-color: var(--dark-bg-elevated) !important;
    color: var(--dark-text-primary) !important;
}

/* 面包屑导航优化 */
[data-theme="dark"] .breadcrumb a {
    color: var(--dark-text-secondary) !important;
}

[data-theme="dark"] .breadcrumb a:hover {
    color: var(--dark-text-primary) !important;
}

[data-theme="dark"] .breadcrumb li.is-active a {
    color: var(--dark-text-primary) !important;
}

/* 进度条优化 */
[data-theme="dark"] .progress {
    background-color: var(--dark-bg-elevated) !important;
}

[data-theme="dark"] .progress::-webkit-progress-bar {
    background-color: var(--dark-bg-elevated) !important;
}

[data-theme="dark"] .progress::-webkit-progress-value {
    background: linear-gradient(90deg, #3b82f6, #1d4ed8) !important;
}

/* 工具提示优化 */
[data-theme="dark"] .tooltip {
    background-color: var(--dark-bg-elevated) !important;
    color: var(--dark-text-primary) !important;
    border: 1px solid var(--dark-border-primary);
}

/* 滚动条优化 */
[data-theme="dark"] ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

[data-theme="dark"] ::-webkit-scrollbar-track {
    background: var(--dark-bg-primary);
}

[data-theme="dark"] ::-webkit-scrollbar-thumb {
    background: var(--dark-bg-elevated);
    border-radius: 4px;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
    background: var(--dark-bg-tertiary);
}

/* 选择框优化 */
[data-theme="dark"] .select:not(.is-multiple):not(.is-loading)::after {
    border-color: var(--dark-text-muted) !important;
}

/* 复选框和单选框优化 */
[data-theme="dark"] input[type="checkbox"],
[data-theme="dark"] input[type="radio"] {
    accent-color: var(--dark-border-focus);
}

/* 链接优化 */
[data-theme="dark"] a {
    color: #60a5fa !important;
}

[data-theme="dark"] a:hover {
    color: #93c5fd !important;
    text-decoration: underline;
}

/* 代码块优化 */
[data-theme="dark"] code {
    background-color: var(--dark-bg-elevated) !important;
    color: #fbbf24 !important;
    border: 1px solid var(--dark-border-primary);
    padding: 0.2em 0.4em;
    border-radius: 3px;
}

[data-theme="dark"] pre {
    background-color: var(--dark-bg-elevated) !important;
    color: var(--dark-text-secondary) !important;
    border: 1px solid var(--dark-border-primary);
    border-radius: 6px;
}

/* 引用块优化 */
[data-theme="dark"] blockquote {
    border-left: 4px solid var(--dark-border-focus);
    background-color: var(--dark-bg-elevated);
    color: var(--dark-text-secondary);
    padding: 1rem;
    margin: 1rem 0;
    border-radius: 0 6px 6px 0;
}

/* 水平线优化 */
[data-theme="dark"] hr {
    background-color: var(--dark-border-primary);
    height: 1px;
    border: none;
}

/* 图片优化 */
[data-theme="dark"] img {
    border-radius: 6px;
    box-shadow: 0 2px 8px var(--dark-shadow);
}

/* 特殊元素优化 */
[data-theme="dark"] .hero {
    background: linear-gradient(135deg, var(--dark-bg-secondary) 0%, var(--dark-bg-tertiary) 100%);
}

[data-theme="dark"] .section {
    background-color: var(--dark-bg-primary);
}

[data-theme="dark"] .box {
    background-color: var(--dark-bg-secondary) !important;
    border: 1px solid var(--dark-border-primary);
    box-shadow: 0 2px 8px var(--dark-shadow);
}

/* 响应式优化 */
@media (max-width: 768px) {
    [data-theme="dark"] .card {
        margin: 0.5rem;
    }
    
    [data-theme="dark"] .button {
        padding: 0.75rem 1rem;
    }
}

/* 高对比度模式支持 */
@media (prefers-contrast: high) {
    [data-theme="dark"] {
        --dark-bg-primary: #000000;
        --dark-bg-secondary: #1a1a1a;
        --dark-text-primary: #ffffff;
        --dark-text-secondary: #e6e6e6;
        --dark-border-primary: #ffffff;
    }
}
