/* ═══ 管理端 · 店铺池 /admin/shops ═══
   只放这一屏独有的规则。共用的在 base.css / components.css / screens.css。
   颜色一律取令牌（vendor/tokens.css）；这一份里出现任何 #hex 都是 bug（tools/selfcheck.py 会查）。

   两条这一屏特有的视觉纪律：
   ① 空的质地只有两种：斜纹＝本该有值这次没取到（.bg.missing，components.css 给）·
      虚线框＝时候未到（.notyet / .bg.unlabeled）。不加第三种。
   ② 二档异常（.as-notice / tr.failing）**有形无色**：3px 灰左条 + 图标，不用红。
      红只留给一档断采横幅，那一条由外壳画。 */

.adminshops { flex: 1; min-height: 0; display: flex; flex-direction: column; }

.as-head { flex-shrink: 0; padding: 14px 18px 0;                  /* GAP pad-18 */
           display: flex; flex-direction: column; gap: var(--space-3); }
.as-head > .as-usageslot:empty,
.as-head > .as-resultslot:empty,
.as-head > .as-intakeslot:empty,
.as-head > .as-toolbarslot:empty { display: none; }

/* ── 二档提示条：就地插在受影响的范围里，3px 灰左条 + 断线图标，有形无色 ── */
.as-notice {
  display: flex; align-items: flex-start; gap: var(--space-2);
  border-left: 3px solid var(--c-neutral-400);                    /* GAP bar-3 */
  background: var(--c-neutral-25); border-radius: 0 var(--radius-md) var(--radius-md) 0;
  padding: 9px var(--space-3);                                    /* GAP notice-pad-9 */
  font-size: var(--size-base); color: var(--c-neutral-600);
  line-height: var(--leading-snug);
}
.as-notice > svg { flex-shrink: 0; margin-top: 1px; color: var(--c-neutral-500); }
.as-notice b { color: var(--c-neutral-900); font-weight: 600; }

.as-p { margin: 0 0 var(--space-1); line-height: var(--leading-snug); }
.as-p.last { margin-bottom: 0; }

/* ── 用量条 ── */
.as-usage { display: flex; flex-direction: column; gap: 2px; }
.as-usage .l1 { font-size: var(--size-base); color: var(--c-neutral-900);
                display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.as-usage .l2 { font-size: var(--size-11); color: var(--c-neutral-500); }
.as-usage .dot, .as-cocell .dot { color: var(--c-neutral-200); }

/* ── 粘链接 ── */
.as-field { max-width: 720px; }                                   /* GAP paste-maxw */
.as-paste { display: flex; align-items: center; gap: var(--space-2); }
.as-paste .input { flex: 1; min-width: 0; }
.as-paste .btn { flex-shrink: 0; }

/* 三态结果条：就地出现在输入框下方，不弹 toast。图标 + 一行字 + 至多一个动作。 */
.as-result {
  display: flex; align-items: flex-start; gap: var(--space-2);
  padding: 9px var(--space-3); border-radius: var(--radius-md);   /* GAP notice-pad-9 */
  border: 1px solid var(--c-neutral-100); background: var(--c-neutral-25);
  font-size: var(--size-base); color: var(--c-neutral-900); max-width: 720px;
  line-height: var(--leading-snug);
}
.as-result > svg { flex-shrink: 0; margin-top: 2px; color: var(--c-neutral-500); }
.as-result .sub { display: block; margin-top: 2px; font-size: var(--size-11);
                  color: var(--c-neutral-600); }
.as-result .btn { margin-left: auto; flex-shrink: 0; }
/* 三种结果的区别靠图标 + 文字，边框只做轻微区分——这里没有一个是「严重」的。 */
.as-result.ok { border-color: var(--border-control); }
.as-result.warn { border-left: 3px solid var(--c-neutral-400); }  /* GAP bar-3 */
.as-result.err { border-color: var(--c-severity-high); }
.as-result.err > svg { color: var(--c-severity-high); }

/* ── 待处理的链接 ── */
.as-intake .body { display: flex; flex-direction: column; gap: var(--space-3);
                   padding: var(--space-3) var(--space-4); }
.as-intakerow { display: flex; align-items: flex-start; gap: var(--space-3);
                padding-bottom: var(--space-3); border-bottom: 1px solid var(--c-neutral-100); }
.as-intake .body > .as-intakerow:last-child { border-bottom: 0; padding-bottom: 0; }
.as-intakemain { flex: 1; min-width: 0; }
.as-url { font-family: var(--font-mono); font-size: var(--size-base); color: var(--c-neutral-900);
          overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.as-intakerow .sub { font-size: var(--size-11); color: var(--c-neutral-500);
                     margin-top: 2px; display: flex; align-items: center; gap: 4px; }
.as-intakeacts { display: flex; align-items: center; gap: var(--space-2); flex-shrink: 0; }
.as-raw { margin-top: var(--space-1); font-size: var(--size-11); color: var(--c-neutral-500); }
.as-raw summary { cursor: pointer; }
.as-raw pre, .as-raw-pre {
  margin: var(--space-1) 0 0; padding: var(--space-2); white-space: pre-wrap; word-break: break-all;
  background: var(--c-neutral-25); border: 1px solid var(--c-neutral-100);
  border-radius: var(--radius-sm); font-size: var(--size-11); color: var(--c-neutral-600);
  user-select: text;
}

/* ── 工具条 ── */
.as-toolbar { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }  /* GAP toolbar-gap-9 */
.as-grp { display: inline-flex; align-items: center; gap: var(--space-1); }
.as-sep { width: 1px; height: 18px; background: var(--c-neutral-100); }         /* GAP sep-h-18 */

/* ── 表 ── */
.as-wrap { flex: 1; min-height: 0; display: flex; flex-direction: column;
           margin: 14px 18px 18px; }                              /* GAP pad-18 */
.as-scroll { flex: 1; min-height: 0; overflow: auto;
             border: 1px solid var(--c-neutral-100); border-radius: var(--radius-10);
             background: var(--c-neutral-0); }
/* ⚠️ 必须写成 table.t.as-t：components.css 的 `table.t` 是 (0,1,1)，只写 .as-t 是 (0,1,0)，
   会被它的 min-width:720px 压过去——表就不横向滚动了，列被挤扁，
   正是「容器窄了绝不挤压列」那条硬规则要防的事。 */
table.t.as-t { min-width: 1080px; }                               /* GAP as-minw */
table.t.as-t th, table.t.as-t td { padding: 8px 10px; vertical-align: top; }   /* GAP row-pad */
table.t.as-t th { font-size: var(--size-xs); vertical-align: middle; }
/* hover 只改底色：不改尺寸、不改字重、不加位移阴影——每分钟有新数据到达，
   鼠标扫过时列表不能抖。 */
table.t.as-t tbody tr { transition: none; }

/* 第一列冻住：横向滚动时店名不走。只冻一列（第二个 sticky 列需要一个已知 px 偏移，
   与「列宽写百分比」冲突）。 */
.as-t thead th:first-child,
.as-t tbody td:first-child { position: sticky; left: 0; background: var(--c-neutral-0);
                             border-right: 1px solid var(--border-hairline); z-index: 1; }
.as-t thead th:first-child { z-index: 3; background: var(--c-neutral-25); }
.as-t tbody tr:hover td:first-child { background: var(--c-neutral-25); }
.as-t tbody tr:focus-visible { outline: var(--a11y-floor-focus-ring) solid var(--a11y-floor-focus-color);
                               outline-offset: -2px; }

/* 二档：这家店连续失败。有形无色 —— 3px 灰左条 + 断线图标，不用红。 */
.as-t tr.failing td:first-child { box-shadow: inset 3px 0 0 var(--c-neutral-400); }  /* GAP bar-3 */
.as-fail { display: flex; align-items: center; gap: 4px; margin-top: 3px;
           font-size: var(--size-11); color: var(--c-neutral-600); }
.as-fail svg { color: var(--c-neutral-500); flex-shrink: 0; }

.as-shopname { font-size: var(--size-md); color: var(--c-neutral-900); }
.as-sid { font-size: var(--size-11); color: var(--c-neutral-500); margin-top: 2px; }

.as-t .sub { font-size: var(--size-11); color: var(--c-neutral-500);
             margin-top: 2px; display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.as-t .as-main { font-size: var(--size-base); color: var(--c-neutral-900);
                 display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
/* 比平时旧 / 实测断流：变色标注。判据是 stale_ratio 比值，不是写死的秒数（见 js）。
   ⚠️ 上色的是那个形状记号，不是那行字：`--c-severity-mid` 在浅色主题里比
   `--c-neutral-900` **浅**，把「实测已停采」这句话染上去等于把它压暗——
   一件要人看见的事被画成了要人忽略的事。红只留给一档，所以这里用「记号带色 + 字加重」。 */
.as-t .as-main.tint { font-weight: 500; }
.as-t .as-main.tint .mk { color: var(--c-severity-mid); }

/* 时候未到：虚线框，没有进度条（只有「还在积累」那一类才有）。
   ⚠️ 绝不把这个形态借给「这个数不可信」那一套——虚线的意思是「以后会有」。 */
.notyet {
  display: inline-flex; align-items: center; border: 1px dashed var(--border-control);
  border-radius: var(--radius-sm); padding: 2px 7px; white-space: nowrap;
  font-size: var(--size-sm); color: var(--c-neutral-600); background: none;
}

/* ── 状态：形状 + 颜色 + 文字三重编码（WCAG 1.4.1）── */
.as-stcell { display: flex; flex-direction: column; gap: 3px; }
.mk { display: inline-block; width: 9px; height: 9px; flex-shrink: 0; }   /* GAP mark-9 */
.mk.dot { border-radius: 50%; background: currentColor; }
.mk.sq { border: 1.5px solid currentColor; border-radius: 1px; background: none; }
.mk.half { border: 1.5px solid currentColor; border-radius: 1px;
           background: linear-gradient(90deg, currentColor 50%, transparent 50%); }
.as-swrow { display: flex; align-items: center; gap: var(--space-2); margin-top: 2px; }
.as-swrow .sub { margin-top: 0; }

/* ── 检查档位 ── */
.as-tiercell { display: flex; flex-direction: column; gap: 3px; }
.seg2-hit { display: inline-flex; align-items: center; min-height: var(--a11y-floor-target-used); }
.seg2 { display: inline-flex; padding: 1px; border-radius: var(--radius-sm);
        border: 1px solid var(--border-control); background: var(--c-neutral-0); }
.seg2 button {
  height: var(--control-h-sm); padding: 0 9px;                     /* GAP seg-pad-9 */
  border: 0; background: none; cursor: pointer; font-family: inherit;
  font-size: var(--size-sm); color: var(--c-neutral-600); border-radius: 3px; white-space: nowrap;
}
.seg2 button:hover { color: var(--c-neutral-900); }
.seg2 button.on { background: var(--c-neutral-900); color: var(--c-neutral-0); font-weight: 500; }
.seg2 button[disabled] { color: var(--c-neutral-500); cursor: default; }

/* ── 归属 ── */
.as-cocell { display: flex; flex-direction: column; gap: 3px; }
.as-coname { display: flex; align-items: center; gap: 5px; font-size: var(--size-base);
             color: var(--c-neutral-900); min-width: 0; }
.as-coname .cut { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.as-coacts { display: flex; align-items: center; gap: var(--space-1); flex-wrap: wrap; }
.as-notecell { font-size: var(--size-base); color: var(--c-neutral-600); }

.as-attempt .sub { justify-content: flex-end; }
.as-t .sub.as-same { margin-top: 0; justify-content: flex-end; }

/* ── 行内三档：原位一行字 + 一个「再试」，不弹层 ── */
.as-rowmsg { display: flex; align-items: center; gap: 4px; margin-top: 5px;
             font-size: var(--size-11); color: var(--c-severity-high); flex-wrap: wrap; }
.as-rowmsg.ok { color: var(--c-neutral-600); }
.as-rowmsg > svg { flex-shrink: 0; }

/* 刚加进来的那一行 / 刚多了一条的那张卡：1.5 秒底色，不闪不跳、不弹 toast。 */
.as-just td { background: var(--c-accent-wash); }
tr.as-just { border-radius: var(--radius-md); }
.as-intake.as-just { outline: 2px solid var(--c-accent-base); outline-offset: 2px; }

/* ── 表底 ──
   ⚠️ 只写「已加载 N 家」，绝不写「共 N 家」：表是 cursor 分页的，
   前端对 items 求和算出来的总数第二页一加载就变，而用户不知道那是分页造成的。
   全池数字一律用服务端算好的 usage。 */
.as-foot { flex-shrink: 0; padding: var(--space-2) 2px 0; font-size: var(--size-11);
           color: var(--c-neutral-500); }

/* ── 弹层内的字段与错误 ── */
.as-dlg .body { display: flex; flex-direction: column; gap: var(--space-3); }
.as-dlg .field { margin: 0; }
.as-dlgerr:empty { display: none; }
.as-errline { display: inline-flex; align-items: center; gap: 4px;
              font-size: var(--size-sm); color: var(--c-severity-high); }
.as-log { font-size: var(--size-base); color: var(--c-neutral-600); }
.as-loglist { margin: 0; padding-left: var(--space-4); display: flex; flex-direction: column;
              gap: var(--space-2); line-height: var(--leading-snug); }
.as-loglist b { color: var(--c-neutral-900); font-weight: 600; }

/* 窄屏：表照旧横向滚动，工具条换行。绝不挤压列。 */
@media (max-width: 900px) {
  .as-head { padding: 10px var(--space-3) 0; }
  .as-wrap { margin: 10px var(--space-3) var(--space-3); }
}
