/**
 * 账号多选面板的两条增补（C2.129）：公共池置顶 + 按剪辑师筛选。
 *
 * 面板的基础版式（.ap / .ap-bar / .ap-item 等）仍在 polish-2.css 第 29 节，
 * 这里只放这次新增的两块：置顶头卡、筛选下拉。拆开是因为 polish-2.css 已经 390 行。
 */

/* 公共池置顶：整组做成一张带琥珀左边框的卡，和普通分组一眼分得开。
   用琥珀（不是红）——它是「待派给兼职」的提示色，不是告警。 */
.ap-grp.is-pool {
  border: 1px solid var(--line-amber);
  border-left: 3px solid var(--amber);
  border-radius: 9px;
  background: var(--amber-d);
  padding: 5px 8px 7px;
  margin: 2px 0 9px;
}
.ap-grp.is-pool .ap-grp-h b {
  color: var(--amber);
  font-weight: 700;
}
.ap-grp.is-pool .ap-item:hover {
  background: color-mix(in srgb, var(--amber) 15%, transparent);
}
/* 「置顶」小标：说明它为什么排第一，不然用户会以为排序坏了 */
.ap-pin {
  font-style: normal;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.4px;
  line-height: 15px;
  padding: 0 5px;
  border-radius: 999px;
  color: var(--amber);
  border: 1px solid var(--line-amber);
  background: var(--panel);
  flex: 0 0 auto;
}

/* 按剪辑师筛选：尺寸吃 .sel-mini 那套（28px 高 + 自绘下拉箭头），这里只管宽窄。
   注意别写 background 简写——它会把 app.css 里 select 的下拉箭头背景图一起清掉。 */
.ap-bar .ap-owner {
  flex: 0 1 auto;
  min-width: 110px;
  max-width: 170px;
  border-radius: 7px;
}

/* 搜索 + 筛选叠起来一条都不剩时，明确说一句「是筛没了，不是没账号」。
   C2.257：从一行灰字改成「标题 + 为什么会空 + 一个出口」——三种空原因长得一样，
   不分开说用户只能猜；顺带修掉「账号列表本来就是空的时候这里反而不显示」的老毛病。 */
.ap-none {
  margin: 10px 0 4px;
  padding: 14px 12px 12px;
  text-align: center;
  color: var(--txt3);
  font-size: 12.5px;
  line-height: 1.6;
}
.ap-none b {
  display: block;
  margin-bottom: 4px;
  font-size: 13px;
  font-weight: 600;
  color: var(--txt2);
}
.ap-none p {
  margin: 0 0 10px;
}
.ap-none .btn {
  margin: 0 auto;
}

/* ---------- C2.247 账号行带「设备号」 ---------- */

/* 一行里多了设备号：原来 150px 一列塞不下 handle + 设备 + 评级，
   会被挤成两行、或者顶出格子。
   C2.282：去掉「设备」二字前缀之后，设备号本身最长是「白X克猫 14号 (G021)」这种
   （自定义名 1-20 字 + (Gxxx)），需要 130px 上下 —— 列宽 244 仍然会把它截成
   「黑SE 49号 (…」。列宽提到 300，弹窗同步放宽（见文件末尾），保证一行放得下。 */
.ap-grp-body {
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
}

/* 账号名走 14px 粗体（account-identity.css），在有限宽格子里遇到超长 handle
   会把后面的设备号顶出去。这里只补省略号兜底，不动字号和粗细。 */
.ap-item .acc-handle {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 设备号：跟账号走，所以用描边不用实心 —— 实心会和评级徽章抢注意力。
   tabular-nums 让数字对齐，一列扫下去不错行。
   C2.282：不再卡 max-width —— 卡住就会把「(G012)」截掉，而括号里的标签正是
   区分同型号两台机器的唯一凭据。真的要省地方，宁可让账号名先出省略号。
   flex 用 `0 1 auto`（可收缩）而不是 `0 0 auto`：自定义设备名最长 20 字，
   1fr 列再怎么给也可能放不下，那种情况让它自己出省略号，别把整行撑出格子。 */
.ap-dev {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-style: normal;
  font-size: 11px;
  line-height: 15px;
  padding: 0 5px;
  border-radius: 999px;
  border: 1px solid var(--line2);
  background: var(--soft);
  color: var(--txt2);
  font-variant-numeric: tabular-nums;
}

/* 账号弹窗比普通 wide 再宽一档：4 列 × 300px 才不至于把 handle 或设备号截断。
   C2.282：1100 → 1280，配合列宽 244 → 300。只作用于「含账号选择器」的弹窗，
   其它 wide 弹窗（明细、长表单）宽度不变。 */
.modal.wide:has(.ap) {
  max-width: 1280px;
}

/* C2.259：录入任务那个弹窗再宽一档（左栏整栏放账号、右栏放截图 + 任务信息）。
   必须写在上面那条之后 —— 两条特异性相同（都是 .modal.wide + :has(单个 class)），
   靠顺序决出胜负。
   高度钉在视口内：加了固定高之后，内容超出时滚的是 .modal-b，不是整个页面；
   不钉的话小屏（1366×768 笔记本）会把底部「登记任务」按钮推出屏幕。 */
.modal.wide:has(.entry-form) {
  width: min(1320px, 95vw);
  max-width: min(1320px, 95vw);
  max-height: 92vh;
  display: flex;
  flex-direction: column;
}

.modal.wide:has(.entry-form) .modal-b {
  flex: 1;
  min-height: 0;
  overflow: auto;
}

/* ---------- C2.248 指派弹窗：名下 / 公共池 / 其他，三组要有区隔 ---------- */

/* 三组用左边框分等级：绿色 = 他自己的（最自然的选择）、琥珀 = 公共池（沿用原有语义）、
   灰虚线 = 别人的号（能用，但要有「这不是他的」的心理预期）。
   只改左边框和底色，不动卡片形状 —— 三组仍然是一套东西，不是三种组件。 */
.ap-grp.is-mine {
  border-left: 3px solid var(--brand);
  padding-left: 8px;
  margin: 2px 0 9px;
}

.ap-grp.is-others {
  border-left: 2px dashed var(--line2);
  padding-left: 8px;
  margin: 2px 0 9px;
}

/* 组说明：空组的「他名下还没有账号，从下面挑」也走这里 */
.ap-grp-note {
  margin: 1px 0 5px;
  font-size: 11.5px;
  line-height: 1.5;
  color: var(--txt3);
}

/* 「选中整组」推到行尾：三组标题长短不一，跟着标题走就会参差成一排锯齿 */
.ap-grp-h button[data-grp] {
  margin-left: auto;
}

/* 空组只留标题和说明，不再撑出一块空白 */
.ap-grp.is-empty {
  padding-bottom: 2px;
}

.ap-grp.is-empty .ap-grp-h b {
  color: var(--txt3);
}

/* 组与组之间拉开一点，靠边框分不开时还有留白兜底 */
.ap-grp + .ap-grp {
  margin-top: 10px;
}

/* 弹窗里的账号清单按视口高度伸展（C2.284）
 *
 * 原来 .ap-list 写死 240px：21 个账号只露 8 行，剩下的靠滚，而弹窗外面明明还有半屏空着。
 * 这里给一条「跟着视口长」的规则，上限 520px —— 手再长的人也不需要一屏 60 个账号。
 * 只作用于弹窗内的清单：录入表单里那份由 editor.css 的 .step-acc 规则单独管，互不影响。
 *
 * 为什么不用 max-height:none 交给 .modal-b 统一滚：那样工具条（搜索/全选）会跟着滚出视野，
 * 滚到第 15 行时想搜个账号还得先滚回顶。列表内部滚、工具条钉住才是对的。
 */
.modal .ap-list {
  max-height: min(52vh, 520px);
}
