/* ==========================================================
   内容资产库 · 生成页「引用数据」选择器
   配合 static/js/asset_picker.js 使用
   ========================================================== */

/* 整块：和普通 .field 一致，只是内部元素多一点，别让它撑开太高 */
#asset-field { padding-bottom: 2px; }

.asset-check {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  margin-top: 7px;
  font-size: 12.5px;
  line-height: 1.6;
  color: var(--text-2);
  cursor: pointer;
  font-weight: 400;
}
.asset-check input { margin-top: 2px; flex: none; }

.asset-try { margin-top: 8px; }

.asset-try-box {
  margin-top: 8px;
  padding: 10px 11px;
  background: var(--line-2);
  border: 1px solid var(--line);
  border-radius: 8px;
}

/* ---- 预设口径按钮 ---- */
.asset-presets {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 8px;
}
.asset-pre {
  padding: 4px 10px;
  font-size: 12px;
  line-height: 1.5;
  color: var(--text-2);
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 999px;
  cursor: pointer;
  transition: all .14s;
  white-space: nowrap;
}
.asset-pre:hover {
  border-color: var(--primary);
  color: var(--primary);
  background: #fff;
}

/* ---- 试查结果 ---- */
.asset-res-h {
  font-size: 12.5px;
  color: var(--text-2);
  margin: 4px 0 6px;
  line-height: 1.6;
}
.asset-res-h b { color: var(--text-1); font-size: 13.5px; }

.asset-tbl-wrap {
  max-height: 260px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--card);
}
.asset-tbl {
  width: 100%;
  min-width: 300px;   /* 左栏只有 ~300px，不给下限院校名会被挤成一列竖字 */
  border-collapse: collapse;
  font-size: 12px;
  table-layout: fixed;
}
.asset-tbl th,
.asset-tbl td {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* 列宽：左栏只有 ~300px，六列必然互相挤。
   只留「院校 / 专业 / 分数 / 位次」四列，批次和计划挂到 hover 里。 */
/* 列宽：左栏约 300px。表头现在要显示「26最低分/26位次」，
   按原 36/32/16/16 分配后两列各只剩 ~48px，表头被截成「26…」——
   实测截图就是两个一模一样的「26…」，完全分不清哪列是分、哪列是位次。
   改成 34/26/20/20，并缩小表头字号、去掉单位字，保证「26最低分」读得出。 */
.asset-tbl col.c-col { width: 34%; }
.asset-tbl col.m-col { width: 26%; }
.asset-tbl col.n-col { width: 20%; }
.asset-tbl th { font-size: 11px; letter-spacing: -.2px; }
.asset-tbl th {
  position: sticky;
  top: 0;
  z-index: 1;
  padding: 6px 8px;
  text-align: left;
  font-weight: 500;
  color: var(--text-3);
  background: var(--line-2);
  border-bottom: 1px solid var(--line);
  white-space: nowrap;
}
.asset-tbl td {
  padding: 5px 8px;
  border-bottom: 1px solid var(--line-2);
  color: var(--text-1);
  vertical-align: top;
}
.asset-tbl tbody tr:last-child td { border-bottom: 0; }
.asset-tbl tbody tr:hover td { background: rgba(0, 0, 0, .015); }
.asset-tbl .num { text-align: right; font-variant-numeric: tabular-nums; }

/* ---- 手册试查 ---- */
.asset-sec {
  padding: 8px 0;
  border-top: 1px dashed var(--line);
}
.asset-sec:first-of-type { border-top: 0; }
.asset-sec-h {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-1);
  display: flex;
  align-items: center;
  gap: 6px;
}
.asset-sec-p {
  margin: 4px 0 0;
  font-size: 12px;
  line-height: 1.65;
  color: var(--text-2);
}
.asset-sec-m {
  margin-top: 4px;
  font-size: 11.5px;
  line-height: 1.6;
  color: var(--text-3);
}

/* ==========================================================
   生成结果页 · 本次引用了什么数据
   ========================================================== */
.asset-trace {
  margin: 0 18px 12px;
  padding: 10px 13px;
  background: #f5f9ff;
  border: 1px solid #d6e4f7;
  border-radius: 8px;
  font-size: 12.5px;
  line-height: 1.6;
  color: #2c4a6e;
}
.asset-trace-h {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
  font-weight: 500;
}
.asset-trace-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #3b7ddd;
  flex: none;
  margin-right: 2px;
}
.asset-trace-q { margin-top: 6px; }
.asset-trace-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
  padding: 3px 0;
  border-top: 1px dashed #d6e4f7;
  font-size: 12px;
}
.asset-trace-l {
  flex: none;
  max-width: 40%;
  font-weight: 500;
  color: #1f3a5f;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.asset-trace-f {
  flex: 1;
  min-width: 0;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11px;
  color: #6b83a3;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.asset-trace-t {
  flex: none;
  font-variant-numeric: tabular-nums;
  color: #1f3a5f;
}
.asset-trace-r {
  margin-top: 7px;
  padding-top: 6px;
  border-top: 1px dashed #d6e4f7;
  font-size: 12px;
  color: #6b83a3;
}

/* ---- 没取到数据：橙色警告，必须比正常状态更扎眼 ---- */
.asset-trace.is-warn {
  background: #fff8e6;
  border-color: #f0d48a;
  color: #7a5a00;
}
.asset-trace.is-warn .asset-trace-dot { background: #d99a00; }
.asset-trace.is-warn .asset-trace-r {
  border-top-color: #f0d48a;
  color: #8a6a10;
}
.asset-trace.is-warn b { color: #7a4b00; }

/* 兜底查询角标 */
.asset-trace-fb {
  margin-left: 6px;
  padding: 1px 7px;
  font-size: 11px;
  border-radius: 999px;
  background: #eef3fb;
  color: #4a6b96;
  border: 1px solid #d6e4f7;
}

/* 零命中诊断：把“哪条卡死了”摆出来，而不是一句查不到 */
.asset-zero {
  margin-top: 8px;
  padding: 10px 12px;
  border-radius: 8px;
  background: #fffbf0;
  border: 1px solid #f3e2bd;
  font-size: 12px;
  line-height: 1.7;
}
.asset-zero-t {
  margin: 0 0 6px;
  font-weight: 600;
  color: #7a5a00;
}
.asset-zero-item {
  margin: 4px 0;
  color: #5a4a28;
}
.asset-zero-item b { color: #7a4b00; }
.asset-apply {
  margin-left: 6px;
  padding: 1px 8px;
  font-size: 11px;
  border-radius: 999px;
  border: 1px solid #d9b45a;
  background: #fff5dc;
  color: #7a5a00;
  cursor: pointer;
}
.asset-apply:hover { background: #ffefc2; }

/* 左栏只有 ~300px，四列并排时专业列只剩 80px，
   「农林经济管理(中外合作办学)」被截成「农林经济…」，
   而括号里的办学方式正是用户要看的东西。
   所以改为一行一条：院校 / 专业全称 / 分数位次，上下排。 */
.asset-tbl td.asset-cell {
  padding: 7px 8px;
  line-height: 1.45;
}
.asset-cell-t {
  font-size: 12px;
  color: var(--text, #1f2430);
}
.asset-cell-m {
  font-size: 11.5px;
  color: #4a5568;
  margin-top: 1px;
  word-break: break-all;
}
.asset-cell-f {
  font-size: 11px;
  color: #8a6a10;
  margin-top: 2px;
}
/* 三位一体的降分标记。降分（负数）用绿色，因为对考生是好事；
   升高用红色。跟股市一样，这里红绿含义按「对学生有利/不利」定，
   不是按涨跌 —— 所以降分绿、加分红。 */
.asset-gap {
  display: inline-block;
  margin-left: 5px;
  padding: 0 4px;
  border-radius: 3px;
  font-size: 10.5px;
  line-height: 1.5;
  vertical-align: 1px;
}
.asset-gap.is-down { background: #e8f5ec; color: #1a7f43; }
.asset-gap.is-up { background: #fdecec; color: #b3302a; }
/* 「持平」：既不降也不涨，给个中性灰，别让绿/红暗示方向 */
.asset-gap:not(.is-down):not(.is-up) { background: #f0f0f2; color: #6b6b76; }

.asset-cell-f b {
  font-size: 12.5px;
  color: #b3541e;
}

/* 分段说明与分界行：「专业名就是它」与「大类里含这个方向」两段。
   不加分隔的话，清华试验班 700 分排在同济会计学 671 后面，
   用户会以为排序坏了，或者更糟——把 700 当成会计学录取分。 */
.asset-split {
  margin: 2px 0 7px;
  font-size: 11.5px;
  line-height: 1.5;
  color: #8a6a10;
  background: #fdf8e8;
  border-left: 2px solid #e0b84a;
  border-radius: 0 4px 4px 0;
  padding: 5px 8px;
}
.asset-tbl tr.asset-sep td {
  padding: 7px 8px 4px;
  font-size: 11px;
  color: #7a6a45;
  background: #faf7ef;
  border-top: 1px dashed #ddd3b8;
  line-height: 1.4;
}
.asset-tbl tr.asset-sep td span::before {
  content: "▾ ";
  color: #c9a53c;
}