/*
  全局主题样式（数据字典风格）
  - 统一全站蓝色调（表格/常用组件）
  - 适用于主页面与 iframe 内子页面
*/

/* ===== 主题变量（数据字典配色）===== */
:root {
  --dd-primary: #0066cc;
  --dd-primary-dark: #0052a3;
  --dd-bg: #e6f0ff;
  --dd-bg-soft: #f5f9ff;
  --dd-border: #c2d9f0;
  --dd-border-soft: #e0e8f0;
  --dd-text: #1f2937;
  --dd-text-muted: #64748b;
}

/* ===== 表格（全局统一）===== */
.table-container {
  border: 1px solid var(--dd-border);
  border-radius: 10px;
  background: #fff;
}

.table-container table,
table,
table.data-table,
table.values-table,
table.rules-table,
table.sub-table {
  width: 100%;
  border-collapse: collapse;
  color: var(--dd-text);
}

.table-container thead th,
table thead th,
table.data-table thead th,
table.values-table thead th,
table.rules-table thead th,
table.sub-table thead th {
  background: var(--dd-bg);
  color: var(--dd-primary);
  font-weight: 600;
  border-bottom: 2px solid var(--dd-border);
}

.table-container th,
.table-container td,
table th,
table td,
table.data-table th,
table.data-table td,
table.values-table th,
table.values-table td,
table.rules-table th,
table.rules-table td,
table.sub-table th,
table.sub-table td {
  padding: 12px 14px;
  border-bottom: 1px solid var(--dd-border-soft);
  vertical-align: middle;
}

.table-container tbody tr:nth-child(even),
table tbody tr:nth-child(even) {
  background-color: var(--dd-bg-soft);
}

.table-container tbody tr:hover,
table tbody tr:hover {
  background-color: var(--dd-bg);
}

.table-container a,
table a {
  color: var(--dd-primary);
}

/* ===== 徽章/状态（通用兼容）===== */
.status-badge {
  border: 1px solid rgba(194, 217, 240, 0.9);
}

/* ===== Element-UI 表格（如 el-table）===== */
.el-table {
  border: 1px solid var(--dd-border);
  border-radius: 10px;
  overflow: hidden;
}

.el-table th.el-table__cell {
  background: var(--dd-bg);
  color: var(--dd-primary);
}

.el-table td.el-table__cell {
  border-bottom-color: var(--dd-border-soft);
}

.el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
  background-color: var(--dd-bg);
}

.modal {
  backdrop-filter: blur(3px);
}

.modal .modal-content,
.modal-content {
  border-radius: 12px;
  border: 1px solid var(--dd-border);
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.28);
  overflow: hidden;
}

/* 兼容：部分页面(如 purchaseContract)使用 .modal-content 内直接放 h2 + .close-modal，且 h2 带 inline style */
body .modal .modal-content {
  border-radius: 12px !important;
  border: 1px solid var(--dd-border) !important;
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.28) !important;
  overflow: hidden !important;
}

body .modal .modal-content > h1,
body .modal .modal-content > h2,
body .modal .modal-content > h3 {
  margin: 0 !important;
  padding: 18px 20px !important;
  background: linear-gradient(
    135deg,
    var(--dd-primary-dark),
    var(--dd-primary)
  ) !important;
  color: #fff !important;
  font-weight: 600 !important;
  position: relative !important;
  font-size: 18px !important;
  line-height: 1.2 !important;
  letter-spacing: 0.2px !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.18) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.18) !important;
}

body .modal .modal-content > h1 + *,
body .modal .modal-content > h2 + *,
body .modal .modal-content > h3 + * {
  display: block;
  padding: 16px 20px 20px;
}

body .modal .modal-content > h1::after,
body .modal .modal-content > h2::after,
body .modal .modal-content > h3::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(
      circle at 12% 20%,
      rgba(255, 255, 255, 0.14) 0,
      rgba(255, 255, 255, 0) 45%
    ),
    radial-gradient(
      circle at 88% 30%,
      rgba(255, 255, 255, 0.12) 0,
      rgba(255, 255, 255, 0) 42%
    );
  pointer-events: none;
}

body .modal .close-modal {
  color: rgba(255, 255, 255, 0.9) !important;
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(255, 255, 255, 0.12) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  line-height: 1 !important;
  font-size: 20px !important;
}

body .modal .close-modal:hover {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.18) !important;
  border-color: rgba(255, 255, 255, 0.28) !important;
}

.modal .modal-close:hover,
.modal-close:hover,
.pc1-modal-close:hover {
  background: rgba(255, 255, 255, 0.18);
  border-color: rgba(255, 255, 255, 0.28);
}

.modal .modal-header,
.modal-header {
  background: linear-gradient(
    135deg,
    var(--dd-primary-dark),
    var(--dd-primary)
  );
  color: #fff;
  border-bottom: 1px solid rgba(255, 255, 255, 0.18);
  position: relative;
  padding: 16px 20px;
  min-height: 52px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.modal .modal-header::after,
.modal-header::after,
.modal-dialog .modal-header::after,
.pc1-modal-header::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(
      circle at 12% 20%,
      rgba(255, 255, 255, 0.14) 0,
      rgba(255, 255, 255, 0) 45%
    ),
    radial-gradient(
      circle at 88% 30%,
      rgba(255, 255, 255, 0.12) 0,
      rgba(255, 255, 255, 0) 42%
    );
  pointer-events: none;
}

.modal .modal-title,
.modal-title {
  color: #fff;
  font-weight: 600;
}

.modal .modal-title,
.modal-title,
.modal-dialog .modal-title,
.pc1-modal-title {
  position: relative;
  z-index: 1;
  margin: 0;
  font-size: 18px;
  line-height: 1.2;
  letter-spacing: 0.2px;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.18);
}

.modal .modal-close,
.modal-close {
  color: rgba(255, 255, 255, 0.9);
}

.modal .modal-close,
.modal-close,
.pc1-modal-close {
  position: relative;
  z-index: 2;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.18);
}

.modal .modal-close:hover,
.modal-close:hover {
  color: #fff;
}

.modal .modal-body,
.modal-body {
  background: #fff;
}

.modal .modal-footer,
.modal-footer {
  background: #fff;
  border-top: 1px solid var(--dd-border-soft);
}

.modal-dialog .modal-content {
  border-radius: 12px;
  border: 1px solid var(--dd-border);
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.28);
  overflow: hidden;
}

.modal-dialog .modal-header {
  background: linear-gradient(
    135deg,
    var(--dd-primary-dark),
    var(--dd-primary)
  );
  color: #fff;
  border-bottom: 1px solid rgba(255, 255, 255, 0.18);
}

.modal-dialog .modal-title {
  color: #fff;
  font-weight: 600;
}

.modal-dialog .btn-close {
  filter: invert(1) grayscale(1);
  opacity: 0.85;
}

.modal-dialog .btn-close:hover {
  opacity: 1;
}

/* 兼容：部分页面使用 Bootstrap + .modal-space 自定义弹窗样式（会覆盖标题字颜色） */
body .modal.modal-space .modal-header {
  background: linear-gradient(
    135deg,
    var(--dd-primary-dark),
    var(--dd-primary)
  ) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.18) !important;
}

body .modal.modal-space .modal-title,
body .modal.modal-space .modal-header h1,
body .modal.modal-space .modal-header h2,
body .modal.modal-space .modal-header h3,
body .modal.modal-space .modal-header h4,
body .modal.modal-space .modal-header h5,
body .modal.modal-space .modal-header h6,
body .modal.modal-space .modal-header span,
body .modal.modal-space .modal-header div,
body .modal.modal-space .modal-header p,
body .modal.modal-space .modal-header a,
body .modal.modal-space .modal-header i {
  color: #fff !important;
}

body .modal.modal-space .btn-close {
  filter: invert(1) grayscale(1) !important;
  opacity: 0.9 !important;
}

.pc1-modal {
  backdrop-filter: blur(3px);
}

.pc1-modal-content {
  border-radius: 12px;
  border: 1px solid var(--dd-border);
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.28);
  overflow: hidden;
}

.pc1-modal-header {
  background: linear-gradient(
    135deg,
    var(--dd-primary-dark),
    var(--dd-primary)
  );
  color: #fff;
  border-bottom: 1px solid rgba(255, 255, 255, 0.18);
}

.pc1-modal-title {
  color: #fff;
  font-weight: 600;
}

.pc1-modal-close {
  color: rgba(255, 255, 255, 0.9);
}

.pc1-modal-close:hover {
  color: #fff;
}

.modal .modal-header,
.modal-header,
.modal-dialog .modal-header,
.pc1-modal-header {
  color: #fff;
}

.modal .modal-header h1,
.modal .modal-header h2,
.modal .modal-header h3,
.modal .modal-header h4,
.modal .modal-header h5,
.modal .modal-header h6,
.modal .modal-header p,
.modal .modal-header span,
.modal .modal-header div,
.modal .modal-header a,
.modal .modal-header i,
.modal-header h1,
.modal-header h2,
.modal-header h3,
.modal-header h4,
.modal-header h5,
.modal-header h6,
.modal-header p,
.modal-header span,
.modal-header div,
.modal-header a,
.modal-header i,
.modal-dialog .modal-header h1,
.modal-dialog .modal-header h2,
.modal-dialog .modal-header h3,
.modal-dialog .modal-header h4,
.modal-dialog .modal-header h5,
.modal-dialog .modal-header h6,
.modal-dialog .modal-header p,
.modal-dialog .modal-header span,
.modal-dialog .modal-header div,
.modal-dialog .modal-header a,
.modal-dialog .modal-header i,
.pc1-modal-header h1,
.pc1-modal-header h2,
.pc1-modal-header h3,
.pc1-modal-header h4,
.pc1-modal-header h5,
.pc1-modal-header h6,
.pc1-modal-header p,
.pc1-modal-header span,
.pc1-modal-header div,
.pc1-modal-header a,
.pc1-modal-header i {
  color: #fff;
}

.modal .modal-header a:hover,
.modal-header a:hover,
.modal-dialog .modal-header a:hover,
.pc1-modal-header a:hover {
  color: #fff;
  text-decoration: underline;
}