/* ==========================================================================
 *  数据质量核查面板（v11.5）—— 政企蓝白，与「区域分析报告」同一套视觉语言
 * ========================================================================== */
.qa-mask {
  position: fixed; inset: 0; z-index: 900;
  background: rgba(9, 26, 56, .55);
  display: none; align-items: center; justify-content: center;
  padding: 28px;
}
.qa-mask.show { display: flex; }

.qa-wrap {
  width: min(1280px, 96vw);
  height: min(820px, 92vh);
  background: #f6f8fc;
  border-radius: 12px;
  box-shadow: 0 24px 70px rgba(6, 24, 56, .38);
  display: flex; flex-direction: column;
  overflow: hidden;
}
.qa-hd {
  height: 54px; flex: none;
  background: #fff;
  border-bottom: 1px solid #e7edf6;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 18px;
}
.qa-tt b { font-size: 16px; color: #0b3d91; letter-spacing: .5px; }
.qa-tt span { font-size: 12px; color: #7a8699; margin-left: 10px; }
.qa-btns { display: flex; gap: 8px; }
.qa-btn {
  height: 30px; padding: 0 14px;
  border: 1px solid #cfd9e8; border-radius: 6px;
  background: #fff; color: #35506f; font-size: 12px; cursor: pointer;
  font-family: inherit;
}
.qa-btn:hover { border-color: #14539a; color: #14539a; }
.qa-btn.primary { background: #14539a; border-color: #14539a; color: #fff; }
.qa-btn.primary:hover { background: #0b3d91; }

/* KPI */
.qa-kpi {
  flex: none;
  display: flex; gap: 10px;
  padding: 12px 18px 6px;
}
.qa-card {
  flex: 1; background: #fff; border-radius: 8px;
  border: 1px solid #e7edf6;
  padding: 10px 12px;
  box-shadow: 0 1px 3px rgba(15, 45, 90, .04);
}
.qa-card.wide { flex: 1 1 100%; }
.qa-card b { display: block; font-size: 22px; color: #0b3d91; line-height: 1.25; font-weight: 600; }
.qa-card i { display: block; font-size: 12px; color: #46586f; font-style: normal; margin-top: 2px; }
.qa-card em { display: block; font-size: 11px; color: #9aa7ba; font-style: normal; margin-top: 3px; }
.qa-prog { height: 6px; background: #eaf0f8; border-radius: 4px; margin-top: 10px; overflow: hidden; }
.qa-prog span { display: block; height: 100%; background: linear-gradient(90deg, #14539a, #2e86c1); transition: width .3s; }

/* 主体：左类型 + 右明细 */
.qa-main {
  flex: 1; min-height: 0;
  display: flex; gap: 12px;
  padding: 6px 18px 12px;
}
.qa-side {
  width: 262px; flex: none;
  overflow-y: auto;
  display: flex; flex-direction: column; gap: 8px;
  padding-right: 2px;
}
.qa-type {
  background: #fff; border: 1px solid #e7edf6; border-radius: 8px;
  padding: 10px 12px; cursor: pointer;
  transition: border-color .15s, box-shadow .15s;
}
.qa-type:hover { border-color: #b9cde8; }
.qa-type.on {
  border-color: #14539a;
  box-shadow: 0 0 0 2px rgba(20, 83, 154, .12);
  background: #f4f8ff;
}
.qa-type-hd { display: flex; align-items: center; gap: 6px; }
.qa-type-hd b { font-size: 13px; color: #17325a; font-weight: 600; flex: 1; }
.qa-type-hd em { font-size: 14px; color: #0b3d91; font-style: normal; font-weight: 600; }
.qa-type-hd .lv {
  font-size: 10px; font-style: normal; padding: 1px 5px; border-radius: 3px; color: #fff;
}
.lv.high { background: #c0392b; }
.lv.mid { background: #d98324; }
.lv.low { background: #7a8699; }
.qa-bar { height: 4px; background: #eef2f8; border-radius: 3px; margin: 7px 0 6px; overflow: hidden; }
.qa-bar span { display: block; height: 100%; background: #2e86c1; border-radius: 3px; }
.qa-type p { font-size: 11px; color: #8794a8; line-height: 1.5; }

.qa-body {
  flex: 1; min-width: 0;
  background: #fff; border: 1px solid #e7edf6; border-radius: 8px;
  display: flex; flex-direction: column; overflow: hidden;
}
.qa-tools {
  flex: none; height: 42px;
  display: flex; align-items: center; gap: 10px;
  padding: 0 12px; border-bottom: 1px solid #eef2f8;
}
.qa-sel {
  height: 26px; border: 1px solid #d5dfec; border-radius: 5px;
  font-size: 12px; color: #35506f; padding: 0 6px; font-family: inherit;
}
.qa-cnt { font-size: 12px; color: #6b7c93; }
.qa-pg { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.qa-pg button {
  height: 26px; padding: 0 10px; font-size: 12px;
  border: 1px solid #d5dfec; border-radius: 5px; background: #fff; color: #35506f;
  cursor: pointer; font-family: inherit;
}
.qa-pg button:disabled { color: #b9c3d2; cursor: default; border-color: #e7edf6; }
.qa-pg b { font-size: 12px; color: #17325a; font-weight: 600; }

.qa-table { flex: 1; overflow: auto; }
.qa-tb { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.qa-tb thead th {
  position: sticky; top: 0; z-index: 1;
  background: #f7f9fd; color: #46586f; font-weight: 600; text-align: left;
  padding: 9px 10px; border-bottom: 1px solid #e7edf6; white-space: nowrap;
}
.qa-tb td { padding: 8px 10px; border-bottom: 1px solid #f2f5fa; color: #22354d; vertical-align: top; }
.qa-tb tbody tr:hover { background: #f8fbff; }
.qa-tb .c { text-align: center; }
.qa-tb .mono { font-family: Consolas, "Courier New", monospace; font-size: 12px; }
.qa-tb b { font-weight: 600; color: #17325a; }
.qa-tb .sub { font-size: 11px; color: #93a0b4; margin-top: 2px; }
.qa-tb .issue { color: #a4421b; }
.qa-loc {
  height: 24px; padding: 0 9px; font-size: 11.5px;
  border: 1px solid #cfd9e8; border-radius: 4px; background: #fff;
  color: #14539a; cursor: pointer; font-family: inherit;
}
.qa-loc:hover { background: #14539a; color: #fff; border-color: #14539a; }
.qa-empty { padding: 48px 0; text-align: center; color: #9aa7ba; font-size: 13px; }

.qa-ft {
  flex: none; padding: 8px 18px;
  font-size: 11px; color: #94a1b5; line-height: 1.6;
  border-top: 1px solid #eef2f8; background: #fff;
}

/* 手机端：单列堆叠，类型横向滚动 */
@media (max-width: 900px) {
  .qa-mask { padding: 0; }
  .qa-wrap { width: 100vw; height: 100vh; border-radius: 0; }
  .qa-kpi { flex-wrap: wrap; gap: 8px; padding: 10px 12px 4px; }
  .qa-card { flex: 1 1 calc(50% - 8px); }
  .qa-card b { font-size: 18px; }
  .qa-main { flex-direction: column; padding: 4px 12px 10px; gap: 8px; }
  .qa-side {
    width: auto; flex: none; flex-direction: row;
    overflow-x: auto; overflow-y: hidden; padding-bottom: 4px;
  }
  .qa-type { flex: none; width: 190px; }
  .qa-tb thead th:nth-child(3), .qa-tb td:nth-child(3),
  .qa-tb thead th:nth-child(4), .qa-tb td:nth-child(4),
  .qa-tb thead th:nth-child(6), .qa-tb td:nth-child(6) { display: none; }
  .qa-tools { height: auto; flex-wrap: wrap; padding: 8px 10px; gap: 6px; }
  .qa-pg { margin-left: 0; }
  .qa-ft { display: none; }
}
