/* ==========================================================================
   enrich-view.css —— 富集结果可读性（2026-10-10）
   --------------------------------------------------------------------------
   背景：原先结果塞在 <pre> 里，字号小、灰度高、条目挤，且看不到「富的是哪一方面」。
   现在：顶部「看的方面」分布 + 每条目标注方面/来源徽标 + 指标标签 + 命中基因 chip。
   颜色刻意提高对比度（正文 #1f2937，标签 #374151，弱化文字 #4b5563 起）。
   ========================================================================== */

.ez-head {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px;
  padding: 10px 12px; margin: 0 0 12px;
  border: 1px solid #cbd5e1; border-left: 4px solid #1f9d55;
  border-radius: 10px; background: #f0fdf4;
}
.ez-head .ez-method { font-size: 13px; color: #1f2937; }
.ez-head .ez-count {
  font-size: 13px; color: #374151; background: #fff;
  border: 1px solid #d1d5db; border-radius: 999px; padding: 2px 10px;
}
.ez-head .ez-count b { color: #15803d; }

/* —— 看的方面 —— */
.ez-scope {
  border: 1px solid #e2e8f0; border-radius: 10px;
  padding: 10px 12px; margin: 0 0 14px; background: #fbfdff;
}
.ez-scope h5 { margin: 0 0 8px; font-size: 13.5px; color: #374151; font-weight: 600; }
.ez-scope-row {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px;
  margin: 6px 0;
}
.ez-scope-k { font-size: 12.5px; color: #4b5563; min-width: 80px; }
.ez-scope-chip {
  font-size: 12.5px; color: #111827; background: #fff;
  border: 1px solid #cbd5e1; border-radius: 8px; padding: 3px 9px;
}
.ez-scope-chip b { margin-left: 6px; color: #b45309; }
.ez-scope-note { font-size: 12px; color: #4b5563; }

/* —— 条目列表 —— */
.ez-list { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 8px; }
.ez-item {
  border: 1px solid #e2e8f0; border-left: 3px solid #94a3b8;
  border-radius: 10px; padding: 9px 12px; background: #fff;
}
.ez-item:hover { border-color: #cbd5e1; background: #fcfdff; }
.ez-line1 {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  margin-bottom: 6px;
}
.ez-idx {
  flex: 0 0 auto; min-width: 20px; height: 20px; line-height: 20px;
  text-align: center; border-radius: 6px; background: #eef2f7;
  color: #475569; font-size: 12px; font-weight: 600;
}
.ez-name { font-size: 14px; font-weight: 600; color: #111827; line-height: 1.45; }
.ez-gid {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11.5px; color: #475569; background: #f1f5f9;
  border-radius: 5px; padding: 1px 6px;
}
.ez-link { font-size: 12px; color: #1d4ed8; text-decoration: none; }
.ez-link:hover { text-decoration: underline; }
.ez-warn { font-size: 11.5px; color: #b45309; }

/* 方面 / 来源徽标：色相区分 + 高对比文字 */
.ez-badge {
  display: inline-block; font-size: 11.5px; font-weight: 600;
  border-radius: 6px; padding: 2px 8px; border: 1px solid transparent;
  white-space: nowrap;
}
.ez-bp    { background: #e0f2fe; color: #075985; border-color: #bae6fd; }
.ez-cc    { background: #ede9fe; color: #5b21b6; border-color: #ddd6fe; }
.ez-mf    { background: #fef3c7; color: #92400e; border-color: #fde68a; }
.ez-na    { background: #f1f5f9; color: #475569; border-color: #e2e8f0; }
.ez-src-kegg     { background: #dcfce7; color: #166534; border-color: #bbf7d0; }
.ez-src-wiki     { background: #e0e7ff; color: #3730a3; border-color: #c7d2fe; }
.ez-src-reactome { background: #ffe4e6; color: #9f1239; border-color: #fecdd3; }

/* 指标标签：数值用等宽字体，标签小一号 */
.ez-line2 { display: flex; flex-wrap: wrap; gap: 6px 8px; }
.ez-metric {
  display: inline-flex; align-items: baseline; gap: 5px;
  border: 1px solid #e2e8f0; background: #f8fafc;
  border-radius: 7px; padding: 2px 8px;
}
.ez-metric i { font-style: normal; font-size: 11px; color: #4b5563; }
.ez-metric b {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 12.5px; font-weight: 600; color: #111827;
}

.ez-line3 {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
  margin-top: 7px; padding-top: 7px; border-top: 1px dashed #e5e7eb;
}
.ez-k { font-size: 11.5px; color: #4b5563; margin-right: 2px; }
.ez-gene {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11.5px; color: #0f172a; background: #f1f5f9;
  border: 1px solid #e2e8f0; border-radius: 5px; padding: 1px 6px;
}

/* —— 原始文本折叠区 —— */
.ez-raw { margin: 14px 0 10px; }
.ez-raw > summary {
  cursor: pointer; font-size: 12.5px; color: #1d4ed8;
}
.ez-raw > summary:hover { text-decoration: underline; }
.ez-raw .enrich-summary {
  margin-top: 8px; font-size: 12.5px; line-height: 1.6; color: #1f2937;
  background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px;
  padding: 10px 12px; white-space: pre-wrap; overflow-x: auto;
}

@media (max-width: 720px) {
  .ez-line1, .ez-line2 { gap: 6px; }
  .ez-name { font-size: 13.5px; }
}