/* ========================================
   深色主题适配样式
   ======================================== */

/* ========================================
   1. CSS 变量定义
   ======================================== */

[data-bs-theme="dark"],
[data-bs-theme="dark-small"] {
    --sgf-card-bg: #343a40;
    --sgf-card-hover-bg: #495057;
    --sgf-border: rgba(255, 255, 255, 0.1);
    --sgf-text-primary: #f8f9fa;
    --sgf-text-secondary: #adb5bd;
    --sgf-text-muted: #6c757d;
    --sgf-link-color: #0dcaf0;
    --sgf-success-color: #20c997;
    --sgf-warning-color: #ffc107;
    --sgf-danger-color: #dc3545;
}

/* ========================================
   2. 卡片组件样式
   ======================================== */

/* 基础卡片样式 */
[data-bs-theme="dark"] .card,
[data-bs-theme="dark-small"] .card {
    background-color: var(--sgf-card-bg);
    border-color: var(--sgf-border);
}

[data-bs-theme="dark"] .card:hover,
[data-bs-theme="dark-small"] .card:hover {
    background-color: var(--sgf-card-hover-bg);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

/* 卡片头部 */
[data-bs-theme="dark"] .card-header,
[data-bs-theme="dark-small"] .card-header {
    background-color: var(--sgf-card-bg);
    border-color: var(--sgf-border);
    color: var(--sgf-text-primary);
}

[data-bs-theme="dark"] .card-header.bg-light,
[data-bs-theme="dark-small"] .card-header.bg-light {
    background-color: var(--sgf-card-bg) !important;
    color: var(--sgf-text-primary) !important;
}

[data-bs-theme="dark"] .card-header.text-black,
[data-bs-theme="dark-small"] .card-header.text-black {
    color: var(--sgf-text-primary) !important;
}

[data-bs-theme="dark"] .card-header.bg-light.text-black,
[data-bs-theme="dark-small"] .card-header.bg-light.text-black {
    background-color: var(--sgf-card-hover-bg) !important;
    color: var(--sgf-text-primary) !important;
}

[data-bs-theme="dark"] .card.shadow-sm .card-header.bg-light.text-black,
[data-bs-theme="dark-small"] .card.shadow-sm .card-header.bg-light.text-black {
    background-color: var(--sgf-card-hover-bg) !important;
    color: var(--sgf-text-primary) !important;
}

/* 卡片主体 */
[data-bs-theme="dark"] .card-body,
[data-bs-theme="dark-small"] .card-body {
    background-color: var(--sgf-card-bg);
    color: var(--sgf-text-primary);
}

/* 阴影卡片 */
[data-bs-theme="dark"] .card.shadow-sm,
[data-bs-theme="dark-small"] .card.shadow-sm {
    background-color: var(--sgf-card-bg);
    border-color: var(--sgf-border);
}

[data-bs-theme="dark"] .card.shadow-sm:hover,
[data-bs-theme="dark-small"] .card.shadow-sm:hover {
    background-color: var(--sgf-card-hover-bg);
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.3) !important;
}

/* ========================================
   3. 表格样式
   ======================================== */

/* 基础表格 */
[data-bs-theme="dark"] .table-light,
[data-bs-theme="dark-small"] .table-light {
    --bs-table-color: var(--sgf-text-primary);
    --bs-table-bg: var(--sgf-card-bg);
    --bs-table-border-color: var(--sgf-border);
    --bs-table-striped-bg: var(--sgf-card-hover-bg);
    --bs-table-striped-color: var(--sgf-text-primary);
    --bs-table-hover-bg: var(--sgf-card-hover-bg);
    --bs-table-hover-color: var(--sgf-text-primary);
}

[data-bs-theme="dark"] .table-light th,
[data-bs-theme="dark-small"] .table-light th {
    background-color: var(--sgf-card-hover-bg);
    border-color: var(--sgf-border);
    color: var(--sgf-text-primary);
}

[data-bs-theme="dark"] .table-light th i,
[data-bs-theme="dark-small"] .table-light th i {
    color: var(--sgf-link-color);
}

/* 表格悬停效果 */
[data-bs-theme="dark"] .table-hover tbody tr:hover,
[data-bs-theme="dark-small"] .table-hover tbody tr:hover {
    background-color: rgba(13, 202, 240, 0.1);
    color: var(--sgf-text-primary);
}

/* 表格链接 */
[data-bs-theme="dark"] .table a.link-primary,
[data-bs-theme="dark-small"] .table a.link-primary {
    color: var(--sgf-link-color) !important;
}

[data-bs-theme="dark"] .table a.link-primary:hover,
[data-bs-theme="dark-small"] .table a.link-primary:hover {
    color: var(--sgf-link-color) !important;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.1);
}

/* 移动版表格 */
[data-bs-theme="dark"] .table-secondary,
[data-bs-theme="dark-small"] .table-secondary {
    --bs-table-bg: var(--sgf-card-hover-bg);
    --bs-table-color: var(--sgf-text-primary);
    background-color: var(--sgf-card-hover-bg);
    color: var(--sgf-text-primary);
}

[data-bs-theme="dark"] .table-secondary th,
[data-bs-theme="dark-small"] .table-secondary th {
    background-color: var(--sgf-card-hover-bg);
    color: var(--sgf-text-primary);
    border-color: var(--sgf-border);
}

[data-bs-theme="dark"] .table tbody tr,
[data-bs-theme="dark-small"] .table tbody tr {
    background-color: var(--sgf-card-bg);
    color: var(--sgf-text-primary);
}

[data-bs-theme="dark"] .table tbody tr:hover,
[data-bs-theme="dark-small"] .table tbody tr:hover {
    background-color: var(--sgf-card-hover-bg);
    color: var(--sgf-text-primary);
}

/* ========================================
   4. 按钮样式
   ======================================== */

/* 轮廓按钮 */
[data-bs-theme="dark"] .btn-outline-secondary,
[data-bs-theme="dark-small"] .btn-outline-secondary {
    color: var(--sgf-text-primary);
    border-color: var(--sgf-border);
}

[data-bs-theme="dark"] .btn-outline-secondary:hover,
[data-bs-theme="dark-small"] .btn-outline-secondary:hover {
    background-color: var(--sgf-card-hover-bg);
    border-color: var(--sgf-border);
    color: var(--sgf-text-primary);
}

/* 实心按钮 */
[data-bs-theme="dark"] .btn-warning,
[data-bs-theme="dark-small"] .btn-warning {
    background-color: var(--sgf-warning-color);
    border-color: var(--sgf-warning-color);
    color: #000;
}

[data-bs-theme="dark"] .btn-primary,
[data-bs-theme="dark-small"] .btn-primary {
    background-color: var(--sgf-link-color);
    border-color: var(--sgf-link-color);
}

/* 移动版按钮 */
[data-bs-theme="dark"] .btn-light,
[data-bs-theme="dark-small"] .btn-light {
    background-color: var(--sgf-card-bg);
    border-color: var(--sgf-border);
    color: var(--sgf-text-primary);
}

[data-bs-theme="dark"] .btn-light:hover,
[data-bs-theme="dark-small"] .btn-light:hover {
    background-color: var(--sgf-card-hover-bg);
    border-color: var(--sgf-border);
    color: var(--sgf-text-primary);
}

[data-bs-theme="dark"] .btn-secondary,
[data-bs-theme="dark-small"] .btn-secondary {
    background-color: var(--sgf-card-hover-bg);
    border-color: var(--sgf-border);
    color: var(--sgf-text-primary);
}

[data-bs-theme="dark"] .btn-secondary:hover,
[data-bs-theme="dark-small"] .btn-secondary:hover {
    background-color: var(--sgf-card-bg);
    border-color: var(--sgf-border);
    color: var(--sgf-text-primary);
}

/* ========================================
   5. 徽章样式
   ======================================== */

[data-bs-theme="dark"] .badge,
[data-bs-theme="dark-small"] .badge {
    color: var(--sgf-text-primary);
}

[data-bs-theme="dark"] .badge.bg-light,
[data-bs-theme="dark-small"] .badge.bg-light {
    background-color: var(--sgf-card-hover-bg) !important;
    color: var(--sgf-text-primary) !important;
    border-color: var(--sgf-border) !important;
}

/* ========================================
   6. 分页样式
   ======================================== */

[data-bs-theme="dark"] .pagination .page-link,
[data-bs-theme="dark-small"] .pagination .page-link {
    background-color: var(--sgf-card-bg);
    border-color: var(--sgf-border);
    color: var(--sgf-text-primary);
}

[data-bs-theme="dark"] .pagination .page-link:hover,
[data-bs-theme="dark-small"] .pagination .page-link:hover {
    background-color: var(--sgf-card-hover-bg);
    border-color: var(--sgf-border);
    color: var(--sgf-text-primary);
}

[data-bs-theme="dark"] .page-item.active .page-link,
[data-bs-theme="dark-small"] .page-item.active .page-link {
    background-color: var(--sgf-link-color);
    border-color: var(--sgf-link-color);
    color: #000;
}

[data-bs-theme="dark"] .page-item.disabled .page-link,
[data-bs-theme="dark-small"] .page-item.disabled .page-link {
    background-color: var(--sgf-card-bg);
    border-color: var(--sgf-border);
    color: var(--sgf-text-muted);
}

/* ========================================
   7. 表单样式
   ======================================== */

/* 输入框 */
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark-small"] .form-control {
    background-color: var(--sgf-card-bg);
    border-color: var(--sgf-border);
    color: var(--sgf-text-primary);
}

[data-bs-theme="dark"] .form-control:focus,
[data-bs-theme="dark-small"] .form-control:focus {
    background-color: var(--sgf-card-bg);
    border-color: var(--sgf-link-color);
    color: var(--sgf-text-primary);
    box-shadow: 0 0 0 0.2rem rgba(13, 202, 240, 0.25);
}

/* 选择框 */
[data-bs-theme="dark"] .form-select,
[data-bs-theme="dark-small"] .form-select {
    background-color: var(--sgf-card-bg);
    border-color: var(--sgf-border);
    color: var(--sgf-text-primary);
}

[data-bs-theme="dark"] .form-select:focus,
[data-bs-theme="dark-small"] .form-select:focus {
    background-color: var(--sgf-card-bg);
    border-color: var(--sgf-link-color);
    color: var(--sgf-text-primary);
    box-shadow: 0 0 0 0.2rem rgba(13, 202, 240, 0.25);
}

/* 标签 */
[data-bs-theme="dark"] .form-label,
[data-bs-theme="dark-small"] .form-label {
    color: var(--sgf-text-primary);
}

/* ========================================
   8. 文本颜色样式
   ======================================== */

[data-bs-theme="dark"] .text-success,
[data-bs-theme="dark-small"] .text-success {
    color: var(--sgf-success-color) !important;
}

[data-bs-theme="dark"] .text-muted,
[data-bs-theme="dark-small"] .text-muted {
    color: var(--sgf-text-secondary) !important;
}

[data-bs-theme="dark"] .text-dark,
[data-bs-theme="dark-small"] .text-dark {
    color: var(--sgf-text-primary) !important;
}

[data-bs-theme="dark"] .text-warning,
[data-bs-theme="dark-small"] .text-warning {
    color: var(--sgf-warning-color) !important;
}

[data-bs-theme="dark"] .text-danger,
[data-bs-theme="dark-small"] .text-danger {
    color: var(--sgf-danger-color) !important;
}

[data-bs-theme="dark"] .text-body-emphasis,
[data-bs-theme="dark-small"] .text-body-emphasis {
    color: var(--sgf-text-primary) !important;
}

[data-bs-theme="dark"] .small.text-muted strong,
[data-bs-theme="dark-small"] .small.text-muted strong {
    color: #adb5bd;
}

/* ========================================
   9. 棋手信息卡片样式
   ======================================== */

[data-bs-theme="dark"] .player-info-card,
[data-bs-theme="dark-small"] .player-info-card {
    background-color: var(--sgf-card-bg);
    border-color: var(--sgf-border);
    color: var(--sgf-text-primary);
}

[data-bs-theme="dark"] .player-info-card:hover,
[data-bs-theme="dark-small"] .player-info-card:hover {
    background-color: var(--sgf-card-hover-bg);
    border-color: var(--sgf-link-color);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

[data-bs-theme="dark"] .player-info-card .text-muted,
[data-bs-theme="dark-small"] .player-info-card .text-muted {
    color: var(--sgf-text-secondary) !important;
}

[data-bs-theme="dark"] .player-info-card .link-primary,
[data-bs-theme="dark-small"] .player-info-card .link-primary {
    color: var(--sgf-link-color) !important;
}

[data-bs-theme="dark"] .player-info-card .link-primary:hover,
[data-bs-theme="dark-small"] .player-info-card .link-primary:hover {
    color: var(--sgf-link-color) !important;
}

/* ========================================
   10. 背景和边框样式
   ======================================== */

[data-bs-theme="dark"] .bg-light,
[data-bs-theme="dark-small"] .bg-light {
    background-color: var(--sgf-card-hover-bg) !important;
    color: var(--sgf-text-primary) !important;
}

[data-bs-theme="dark"] .border-black,
[data-bs-theme="dark-small"] .border-black {
    border-color: var(--sgf-border) !important;
}

[data-bs-theme="dark"] .border,
[data-bs-theme="dark-small"] .border {
    border-color: var(--sgf-border) !important;
}

/* ========================================
   11. 特殊组件样式
   ======================================== */

/* 列表组 */
[data-bs-theme="dark"] .list-group-item-action:hover,
[data-bs-theme="dark-small"] .list-group-item-action:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

/* AI分析指标框 */
[data-bs-theme="dark"] .text-center.p-2.border.rounded,
[data-bs-theme="dark-small"] .text-center.p-2.border.rounded {
    background-color: var(--sgf-card-hover-bg) !important;
    border-color: var(--sgf-border) !important;
    color: var(--sgf-text-primary) !important;
}

[data-bs-theme="dark"] .text-center.p-2.border.rounded:hover,
[data-bs-theme="dark-small"] .text-center.p-2.border.rounded:hover {
    background-color: var(--sgf-card-bg) !important;
    border-color: var(--sgf-link-color) !important;
}

[data-bs-theme="dark"] .text-center.p-2.border.rounded .small,
[data-bs-theme="dark-small"] .text-center.p-2.border.rounded .small {
    color: var(--sgf-text-secondary) !important;
}

[data-bs-theme="dark"] .text-center.p-2.border.rounded .fw-bold,
[data-bs-theme="dark-small"] .text-center.p-2.border.rounded .fw-bold {
    color: var(--sgf-text-primary) !important;
}

[data-bs-theme="dark"] .text-center.p-2.border.rounded .text-muted,
[data-bs-theme="dark-small"] .text-center.p-2.border.rounded .text-muted {
    color: var(--sgf-text-secondary) !important;
}

/* ========================================
   12. 表单插件样式
   ======================================== */

/* tt_sgfs 棋谱比较分析文本框 */
[data-bs-theme="dark"] #tt_sgfs,
[data-bs-theme="dark-small"] #tt_sgfs {
    background-color: var(--sgf-card-bg) !important;
    border-color: var(--sgf-border) !important;
    color: var(--sgf-text-primary) !important;
}

[data-bs-theme="dark"] #tt_sgfs:focus,
[data-bs-theme="dark-small"] #tt_sgfs:focus {
    background-color: var(--sgf-card-bg) !important;
    border-color: var(--sgf-link-color) !important;
    color: var(--sgf-text-primary) !important;
    box-shadow: 0 0 0 0.2rem rgba(13, 202, 240, 0.25) !important;
}

[data-bs-theme="dark"] #tt_sgfs::placeholder,
[data-bs-theme="dark-small"] #tt_sgfs::placeholder {
    color: var(--sgf-text-secondary) !important;
    opacity: 0.8;
}

/* tagEditor 插件 */
[data-bs-theme="dark"] .tag-editor,
[data-bs-theme="dark-small"] .tag-editor {
    background-color: var(--sgf-card-bg) !important;
    border-color: var(--sgf-border) !important;
    color: var(--sgf-text-primary) !important;
}

[data-bs-theme="dark"] .tag-editor:focus,
[data-bs-theme="dark-small"] .tag-editor:focus {
    background-color: var(--sgf-card-bg) !important;
    border-color: var(--sgf-link-color) !important;
    color: var(--sgf-text-primary) !important;
    box-shadow: 0 0 0 0.2rem rgba(13, 202, 240, 0.25) !important;
}

[data-bs-theme="dark"] .tag-editor .tag,
[data-bs-theme="dark-small"] .tag-editor .tag {
    background-color: var(--sgf-card-hover-bg) !important;
    color: var(--sgf-text-primary) !important;
    border-color: var(--sgf-border) !important;
}

[data-bs-theme="dark"] .tag-editor .tag:hover,
[data-bs-theme="dark-small"] .tag-editor .tag:hover {
    background-color: var(--sgf-card-bg) !important;
    border-color: var(--sgf-link-color) !important;
}

[data-bs-theme="dark"] .tag-editor .tag .tag-remove,
[data-bs-theme="dark-small"] .tag-editor .tag .tag-remove {
    color: var(--sgf-text-primary) !important;
}

[data-bs-theme="dark"] .tag-editor .tag .tag-remove:hover,
[data-bs-theme="dark-small"] .tag-editor .tag .tag-remove:hover {
    color: var(--sgf-danger-color) !important;
}

[data-bs-theme="dark"] .tag-editor .tag-editor-autocomplete,
[data-bs-theme="dark-small"] .tag-editor .tag-editor-autocomplete {
    background-color: var(--sgf-card-bg) !important;
    border-color: var(--sgf-border) !important;
    color: var(--sgf-text-primary) !important;
}

[data-bs-theme="dark"] .tag-editor .tag-editor-autocomplete .tag-editor-autocomplete-item,
[data-bs-theme="dark-small"] .tag-editor .tag-editor-autocomplete .tag-editor-autocomplete-item {
    background-color: var(--sgf-card-bg) !important;
    color: var(--sgf-text-primary) !important;
}

[data-bs-theme="dark"] .tag-editor .tag-editor-autocomplete .tag-editor-autocomplete-item:hover,
[data-bs-theme="dark-small"] .tag-editor .tag-editor-autocomplete .tag-editor-autocomplete-item:hover {
    background-color: var(--sgf-card-hover-bg) !important;
    color: var(--sgf-text-primary) !important;
}

[data-bs-theme="dark"] .tag-editor .tag-editor-autocomplete .tag-editor-autocomplete-item.selected,
[data-bs-theme="dark-small"] .tag-editor .tag-editor-autocomplete .tag-editor-autocomplete-item.selected {
    background-color: var(--sgf-link-color) !important;
    color: var(--sgf-card-bg) !important;
}

/* ========================================
   13. 图标和特殊元素样式
   ======================================== */

/* 国旗图标 */
[data-bs-theme="dark"] .flag-icon,
[data-bs-theme="dark-small"] .flag-icon {
    border-color: #6c757d;
    box-shadow: 0 1px 3px rgba(255, 255, 255, 0.1);
}

[data-bs-theme="dark"] .flag-icon:hover,
[data-bs-theme="dark-small"] .flag-icon:hover {
    box-shadow: 0 2px 6px rgba(255, 255, 255, 0.2);
}

/* Tipbar 样式 */
[data-bs-theme="dark"] .alert {
    border: 1px solid rgba(255, 255, 255, 0.125);
}

[data-bs-theme="dark"] .alert-success {
    --bs-alert-bg: rgba(25, 135, 84, 0.1);
    --bs-alert-border-color: rgba(25, 135, 84, 0.3);
    --bs-alert-color: #75b798;
}

[data-bs-theme="dark"] .alert-danger {
    --bs-alert-bg: rgba(220, 53, 69, 0.1);
    --bs-alert-border-color: rgba(220, 53, 69, 0.3);
    --bs-alert-color: #f1aeb5;
}

[data-bs-theme="dark"] .alert-info {
    --bs-alert-bg: rgba(13, 202, 240, 0.1);
    --bs-alert-border-color: rgba(13, 202, 240, 0.3);
    --bs-alert-color: #6edff6;
}