/**
 * PDF Web 深色模式样式
 * 覆盖设计系统变量实现深色主题
 */

/* ========================================
 * 深色模式全局变量覆盖
 * ======================================== */
body, select, textarea {
  /* 使用设计系统定义的深色变量 */
  background-color: var(--bg-secondary) !important;
  color: var(--text-primary) !important;
}

/* ========================================
 * 页面布局
 * ======================================== */
#page-container {
  background-color: var(--bg-secondary) !important;
}

#content-wrap {
  background-color: var(--bg-secondary) !important;
}

/* ========================================
 * 卡片组件
 * ======================================== */
.card,
.dark-card {
  background-color: var(--card-bg) !important;
  border-color: var(--card-border) !important;
  color: var(--text-primary) !important;
}

.feature-card {
  background-color: var(--card-bg) !important;
  border-color: var(--card-border) !important;
}

.feature-card:hover {
  border-color: var(--primary-color) !important;
}

.card-title {
  color: var(--text-primary) !important;
}

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

/* ========================================
 * Jumbotron / Banner
 * ======================================== */
#jumbotron,
.jumbotron {
  background: linear-gradient(135deg, var(--bg-tertiary) 0%, var(--bg-secondary) 100%) !important;
  border-bottom-color: var(--border-light) !important;
  color: var(--text-primary) !important;
}

#jumbotron h1,
.jumbotron h1 {
  color: var(--text-primary) !important;
}

#jumbotron .lead,
.jumbotron .lead {
  color: var(--text-secondary) !important;
}

/* ========================================
 * 列表组件
 * ======================================== */
.list-group {
  background-color: var(--bg-primary) !important;
  border-color: var(--border-light) !important;
}

.list-group-item {
  background-color: var(--bg-primary) !important;
  border-color: var(--border-light) !important;
  color: var(--text-primary) !important;
}

.list-group-item:hover {
  background-color: var(--bg-hover) !important;
}

/* ========================================
 * Tab 导航
 * ======================================== */
.projectServiceNav {
  background-color: var(--bg-primary) !important;
  border-color: var(--border-light) !important;
}

.projectServiceNav > div {
  background-color: var(--tab-bg) !important;
  color: var(--text-secondary) !important;
}

.projectServiceNav > div:hover {
  background-color: var(--bg-hover) !important;
  color: var(--primary-color) !important;
}

.projectServiceNav > div.select {
  background-color: var(--tab-active-bg) !important;
  color: var(--tab-active-color) !important;
}

/* ========================================
 * 表单控件
 * ======================================== */
.form-control,
input,
select,
textarea {
  background-color: var(--bg-tertiary) !important;
  border-color: var(--border-default) !important;
  color: var(--text-primary) !important;
}

.form-control:focus,
input:focus,
select:focus,
textarea:focus {
  border-color: var(--primary-color) !important;
  box-shadow: 0 0 0 3px var(--primary-light) !important;
}

.form-control::placeholder,
input::placeholder {
  color: var(--text-placeholder) !important;
}

/* ========================================
 * 按钮
 * ======================================== */
.btn {
  border: none;
}

.btn-primary {
  background-color: var(--primary-color) !important;
  color: #fff !important;
}

.btn-primary:hover {
  background-color: var(--primary-hover) !important;
}

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

.btn-secondary:hover {
  background-color: var(--bg-active) !important;
}

.btn-info {
  background-color: var(--info-color) !important;
  color: #fff !important;
}

.btn-info:hover {
  background-color: var(--info-hover) !important;
}

.btn-danger {
  background-color: var(--danger-color) !important;
  color: #fff !important;
}

.btn-danger:hover {
  background-color: var(--danger-hover) !important;
}

.btn-success {
  background-color: var(--success-color) !important;
  color: #fff !important;
}

.btn-outline-secondary {
  color: var(--text-primary) !important;
  border-color: var(--border-default) !important;
  background-color: transparent !important;
}

.btn-outline-secondary:hover {
  background-color: var(--bg-tertiary) !important;
  color: var(--primary-color) !important;
  border-color: var(--primary-color) !important;
}

/* ========================================
 * 表格
 * ======================================== */
table {
  background-color: var(--bg-primary) !important;
}

table thead {
  background-color: var(--bg-tertiary) !important;
  border-color: var(--border-light) !important;
}

table th,
table td {
  border-color: var(--border-light) !important;
  color: var(--text-primary) !important;
}

table tbody tr:hover {
  background-color: var(--bg-hover) !important;
}

/* ========================================
 * 分割线
 * ======================================== */
hr {
  background-color: var(--border-light) !important;
  border-color: var(--border-light) !important;
}

/* ========================================
 * 图标
 * ======================================== */
.favorite-icon img {
  filter: brightness(0) invert(1) !important;
}

.blackwhite-icon {
  filter: brightness(0) invert(1);
}

.home-card-icon {
  opacity: 0.9;
}

/* ========================================
 * 功能页面容器
 * ======================================== */
#dropContainer .col-md-6 {
  background-color: var(--bg-primary) !important;
  border-color: var(--border-light) !important;
}

#dropContainer h2 {
  color: var(--text-primary) !important;
  border-bottom-color: var(--primary-color) !important;
}

/* ========================================
 * 文件选择区域
 * ======================================== */
.custom-file-chooser .form-control {
  background-color: var(--bg-primary) !important;
  border-color: var(--border-default) !important;
}

.custom-file-chooser .form-control:hover {
  border-color: var(--primary-color) !important;
  background-color: var(--primary-light) !important;
}

/* ========================================
 * 进度条
 * ======================================== */
.progress {
  background-color: var(--bg-tertiary) !important;
}

/* ========================================
 * 其他元素
 * ======================================== */
#support-section {
  background-color: var(--bg-tertiary) !important;
}

#pages-container-wrapper {
  --background-color: var(--bg-tertiary) !important;
  --scroll-bar-color: var(--bg-active) !important;
  --scroll-bar-thumb: var(--text-tertiary) !important;
  --scroll-bar-thumb-hover: var(--text-secondary) !important;
}

#global-buttons-container input {
  background-color: var(--bg-tertiary) !important;
  caret-color: var(--text-primary) !important;
  color: var(--text-primary) !important;
}

#global-buttons-container input::placeholder {
  color: var(--text-placeholder) !important;
}

#global-buttons-container input:disabled::placeholder {
  color: var(--text-disabled) !important;
}

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

.bg-light {
  background-color: var(--bg-primary) !important;
}

/* ========================================
 * 警告和提示框
 * ======================================== */
.alert-success {
  background-color: var(--success-light) !important;
  color: var(--success-color) !important;
}

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

/* ========================================
 * 链接
 * ======================================== */
a {
  color: var(--primary-color);
}

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

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

::-webkit-scrollbar-track {
  background: var(--bg-tertiary);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb {
  background: var(--text-disabled);
  border-radius: 4px;
}

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

/* ========================================
 * 响应式适配
 * ======================================== */
@media (prefers-color-scheme: dark) {
  /* 自动检测系统深色模式时的额外样式 */
}