:root {
  --primary-color: #4f46e5;          /* 主色调 */
  --secondary-color: #6366f1;        /* 次要色调 */
  --success-color: #22c55e;          /* 成功色 */
  --danger-color: #ef4444;           /* 危险色 */
  --warning-color: #f59e0b;          /* 警告色 */
  --background-color: #141414;        /* 全局背景色 */
  --card-background: #1a1a1a;         /* 模块底色 */
  --input-background: #242424;        /* 输入框背景色 */
  
  /* 文字颜色统一使用乳白色 */
  --text-color: #f5f5f1;             /* 乳白色 */
  --text-muted: rgba(245, 245, 241, 0.6);  /* 半透明乳白色，用于次要文字 */
  --text-primary: #00ffff;           /* 主要文字 - 青色 */
  --text-secondary: #00cccc;         /* 次要文字 - 深青色 */
  --text-highlight: #00ff00;         /* 高亮文字 - 亮绿色 */
  --text-warning: #ffff00;           /* 警告文字 - 黄色 */
  --text-danger: #ff3333;            /* 错误文字 - 红色 */
  --link-color: #00ffff;             /* 链接颜色 - 青色 */
  --link-hover: #00ff00;             /* 链接悬停 - 亮绿色 */
  --border-color: #2f2f2f;           /* 边框颜色也稍微调亮 */
}

body {
  background-color: var(--background-color);
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  color: var(--text-color);
}

.modern-card {
  background: var(--card-background);
  border-radius: 1rem;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.2);
  border: 1px solid var(--border-color);
}

.modern-card .card-header {
  background: var(--card-background);
  border-bottom: 1px solid var(--border-color);
  color: var(--text-color);
}

.modern-card .card-body {
  padding: 1.5rem;
  color: var(--text-color);
}

.modern-btn {
  padding: 0.75rem 1.5rem;
  border-radius: 0.5rem;
  font-weight: 500;
  transition: all 0.2s;
}

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

.modern-btn-primary:hover {
  background-color: var(--secondary-color);
  transform: translateY(-1px);
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.2);
}

.modern-table {
  background: var(--card-background);
  color: var(--text-color);
}

.modern-table thead th {
  background-color: var(--card-background);
  border-bottom: 1px solid var(--border-color);
}

.modern-input {
  background-color: var(--card-background);
  border: 1px solid var(--border-color);
  color: var(--text-color);
}

.modern-input:focus {
  background-color: var(--card-background);
  border-color: var(--primary-color);
  color: var(--text-color);
}

.modern-select {
  background-color: var(--card-background);
  border: 1px solid var(--border-color);
  color: var(--text-color);
}

.navbar-modern {
  background: var(--card-background);
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);
  border-bottom: 1px solid var(--border-color);
}

.navbar-modern .navbar-brand {
  color: var(--text-color);
}

.navbar-modern .nav-link {
  color: var(--text-muted);
}

.navbar-modern .nav-link:hover {
  color: var(--text-highlight);
}

.alert-modern {
  background: var(--card-background);
  border: 1px solid var(--border-color);
  color: var(--text-color);
}

.badge-modern {
  padding: 0.5em 1em;
  border-radius: 9999px;
  font-weight: 500;
}

h1, h2, h3, h4, h5, h6 {
  color: var(--text-color);
}

.form-label {
  color: var(--text-color);
}

.pagination .page-item .page-link {
  background-color: #242424 !important;
  border-color: var(--border-color) !important;
  color: var(--text-color) !important;
}

.pagination .page-item.active .page-link,
.pagination .page-item .page-link[aria-current="page"] {
  background-color: #1a1a1a !important;
  border-color: var(--border-color) !important;
  color: var(--text-color) !important;
}

.pagination .page-item .page-link:hover {
  background-color: #2a2a2a !important;
  border-color: var(--border-color) !important;
}

.table {
  color: var(--text-color);
}

.table td, .table th {
  border-color: var(--border-color);
}

.dropdown-menu {
  background-color: var(--card-background);
  border: 1px solid var(--border-color);
}

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

.dropdown-item:hover {
  color: var(--text-color);
  background-color: rgba(245, 245, 241, 0.1);
}

.modal-content {
  background-color: var(--card-background);
  border: 1px solid var(--border-color);
}

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

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

.form-control:valid {
  background-color: var(--card-background);
  border-color: var(--border-color);
}

.form-control:invalid {
  background-color: var(--card-background);
  border-color: var(--danger-color);
}

.form-check-input {
  background-color: var(--card-background);
  border-color: var(--border-color);
}

.form-check-input:checked {
  background-color: var(--primary-color);
  border-color: var(--primary-color);
}

/* 确保覆盖Bootstrap默认样式 */
.card.modern-card {
    background-color: #1a1a1a !important;
    border: 1px solid var(--border-color) !important;
}

.card.modern-card .card-header {
    background-color: #1a1a1a !important;
    border-bottom: 1px solid var(--border-color) !important;
    color: var(--text-color) !important;
}

.card.modern-card .card-body {
    background-color: #1a1a1a !important;
    color: var(--text-color) !important;
}

/* 确保表单内的文字颜色正确 */
.card.modern-card .form-label {
    color: var(--text-color) !important;
}

/* 确保所有卡片都使用正确的背景色 */
.card {
    background-color: #1a1a1a !important;
    border: 1px solid var(--border-color) !important;
}

.card .card-header {
    background-color: #1a1a1a !important;
    border-bottom: 1px solid var(--border-color) !important;
    color: var(--text-color) !important;
}

.card .card-body {
    background-color: #1a1a1a !important;
    color: var(--text-color) !important;
}

/* 链接样式 */
a {
  color: var(--link-color);
  transition: color 0.2s;
}

a:hover {
  color: var(--link-hover);
}

/* 表单元素 */
.form-text {
  color: var(--text-muted);
}

/* 按钮文字 */
.btn {
  color: var(--text-color);
}

.btn:hover {
  color: var(--text-color);
  opacity: 0.9;
}

/* 警告框文字 */
.alert-success {
  color: var(--success-color);
}

.alert-danger {
  color: var(--danger-color);
}

.alert-warning {
  color: var(--warning-color);
}

/* 状态标签 */
.badge {
  &.bg-success {
    background-color: var(--success-color) !important;
    color: var(--text-color);
  }
  
  &.bg-danger {
    background-color: var(--danger-color) !important;
    color: var(--text-color);
  }
  
  &.bg-warning {
    background-color: var(--warning-color) !important;
    color: var(--text-color);
  }
}

/* 验证状态 */
.is-valid {
  color: var(--success-color) !important;
}

.is-invalid {
  color: var(--danger-color) !important;
}

/* 特殊强调文本 */
.text-highlight {
  color: var(--text-highlight);
}

.text-muted {
  color: var(--text-muted) !important;
}

/* 所有文字元素统一使用乳白色 */
h1, h2, h3, h4, h5, h6,
p, span, a, div,
.navbar-modern .navbar-brand,
.navbar-modern .nav-link,
.table,
.form-label,
.btn,
.card-header,
.card-body,
.dropdown-item,
.form-control,
.input-group-text,
.nav-link,
.page-link,
.modal-title {
  color: var(--text-color) !important;
}

/* 次要文字使用半透明乳白色 */
.text-muted,
.form-text,
.small,
.text-secondary {
  color: var(--text-muted) !important;
}

/* 输入框文字颜色 */
.form-control {
  color: var(--text-color);
  background-color: var(--input-background);
}

.form-control:focus {
  color: var(--text-color);
}

/* 链接悬停效果 */
a:hover,
.nav-link:hover {
  color: var(--text-color) !important;
  opacity: 0.8;
}

/* 表格文字 */
.table td,
.table th {
  color: var(--text-color);
}

/* 分页器文字 */
.pagination .page-link {
  color: var(--text-color);
  background-color: var(--card-background);
}

/* 表单验证反馈文字 */
.valid-feedback,
.invalid-feedback {
  color: var(--text-color);
}

/* placeholder 文字颜色 */
::placeholder {
  color: var(--text-muted) !important;
}

/* 选中文字的背景色 */
::selection {
  background-color: rgba(245, 245, 241, 0.2);
  color: var(--text-color);
}

/* 输入框样式 */
.form-control,
.form-select,
textarea.form-control,
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"] {
  background-color: var(--input-background) !important;
  border: 1px solid var(--border-color) !important;
  color: var(--text-color) !important;
}

/* 输入框焦点状态 */
.form-control:focus,
.form-select:focus {
  background-color: var(--input-background) !important;
  border-color: var(--primary-color) !important;
  box-shadow: 0 0 0 0.25rem rgba(79, 70, 229, 0.1) !important;
}

/* 下拉框样式 */
select.form-select {
  background-color: var(--input-background) !important;
  border: 1px solid var(--border-color) !important;
  color: var(--text-color) !important;
}

/* 下拉菜单样式 */
.dropdown-menu {
  background-color: var(--input-background) !important;
  border: 1px solid var(--border-color) !important;
}

.dropdown-item {
  background-color: var(--input-background) !important;
  color: var(--text-color) !important;
}

.dropdown-item:hover {
  background-color: var(--card-background) !important;
}

/* 输入组合样式 */
.input-group-text {
  background-color: var(--input-background) !important;
  border: 1px solid var(--border-color) !important;
  color: var(--text-color) !important;
}

/* 禁用状态 */
.form-control:disabled,
.form-control[readonly],
.form-select:disabled {
  background-color: #1e1e1e !important;
  opacity: 0.7;
}

/* 搜索框样式 */
input[type="search"] {
  background-color: var(--input-background) !important;
}

/* 日期选择器样式 */
input[type="date"],
input[type="datetime-local"] {
  background-color: var(--input-background) !important;
  color: var(--text-color) !important;
}

/* 文件上传框样式 */
input[type="file"]::file-selector-button {
  background-color: var(--input-background) !important;
  border: 1px solid var(--border-color) !important;
  color: var(--text-color) !important;
}

/* placeholder 样式 */
::placeholder {
  color: rgba(245, 245, 241, 0.5) !important;
}

/* 自动完成建议下拉框样式 */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--text-color) !important;
  -webkit-box-shadow: 0 0 0px 1000px var(--input-background) inset !important;
  transition: background-color 5000s ease-in-out 0s;
}

/* 选项卡样式 */
.nav-tabs {
  border-bottom: 1px solid var(--border-color);
}

.nav-tabs .nav-link {
  color: var(--text-color);
  background-color: transparent;
  border: none;
  margin-bottom: -1px;
}

.nav-tabs .nav-link:hover {
  border-color: transparent;
  isolation: isolate;
  background-color: #1e1e1e;
  border-bottom: 2px solid #1e1e1e;
}

/* 选中状态 */
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
  color: var(--text-color) !important;
  background-color: #242424 !important;
  border: 1px solid var(--border-color) !important;
  border-bottom: none !important;
}

/* 选项卡内容区域 */
.tab-content {
  background-color: var(--card-background);
  border: 1px solid var(--border-color);
  border-top: none;
  padding: 1rem;
}

/* 确保选项卡文字颜色 */
.nav-tabs .nav-link {
  padding: 0.75rem 1.5rem;
  font-weight: 500;
  transition: all 0.2s ease;
}

/* 禁用状态的选项卡 */
.nav-tabs .nav-link.disabled {
  color: var(--text-muted);
  background-color: transparent;
}

/* 表格文字统一样式 */
.table,
.table th,
.table td,
.table thead th,
.table tbody td {
  color: var(--text-color) !important;
  border-color: var(--border-color);
}

/* 表格中的所有文字元素 */
.table span,
.table .badge,
.table .btn,
.table a,
.table small,
.table .text-muted {
  color: var(--text-color) !important;
  opacity: 1 !important;
}

/* 状态标签保持背景色，但文字统一 */
.badge {
  color: var(--text-color) !important;
}

/* 表格中的按钮文字 */
.table .btn {
  color: var(--text-color) !important;
}

/* 表格中的链接 */
.table a {
  color: var(--text-color) !important;
  text-decoration: none;
}

.table a:hover {
  text-decoration: underline;
}

/* 确保筛选表单中的文字也统一 */
.form-label,
.form-select option,
.form-control,
.input-group-text {
  color: var(--text-color) !important;
}

/* 分页器文字统一 */
.pagination .page-link {
  color: var(--text-color) !important;
}

/* 移除所有半透明效果 */
.text-muted,
.small,
.form-text {
  opacity: 1 !important;
  color: var(--text-color) !important;
}

/* 数据备份管理页面的提示条样式 */
.backup-info,
.backup-message,
.info-bar,
.message-bar,
.alert-info {
    background-color: #1a1a1a !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-color) !important;
}

/* 如果使用的是 Bootstrap 的 alert 组件 */
.alert {
    background-color: #1a1a1a !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-color) !important;
}

/* 确保内部文字颜色正确 */
.alert *,
.backup-info *,
.info-bar * {
    color: var(--text-color) !important;
}