/* ══════════════════════════════════════════════════════════════════════════
   A2「统组件」层（P2）——按 v2.0 档案 §9「组件规范」收敛
   --------------------------------------------------------------------------
   作用域：一律 `body.admin-view #ap …`（面板容器内）。
     为什么加 #ap：后台右上有「学员前端」页，学员端 UI 会同时挂在 body.admin-view 下，
     只用 body.admin-view 前缀会把学员端也改了 ⇒ 必须再限定到 #ap 面板容器内。
   来源：全部走 admin.css 的 token（禁裸色值、禁 !important、禁多层阴影）。
   回滚：本段整体删除即可（在 admin-comp.css 尾部，带起止标记）。
   ══════════════════════════════════════════════════════════════════════════ */

/* ── C1 按钮：高 32 / 圆角 8 / 四态 ───────────────────────────────────── */
body.admin-view #ap .btn{
  min-height:32px; height:32px; padding:0 var(--space-3);
  border-radius:var(--radius-md); font-size:var(--fs-body); font-weight:var(--fw-medium);
  border:1px solid var(--color-border-strong); background:var(--color-surface);
  color:var(--color-text-1); cursor:pointer; white-space:nowrap;
  display:inline-flex; align-items:center; justify-content:center; gap:var(--space-1);
  transition:background .12s ease, border-color .12s ease, opacity .12s ease, box-shadow .12s ease;
}
body.admin-view #ap .btn:hover{ border-color:var(--color-accent); color:var(--color-accent); background:var(--color-accent-bg); }
body.admin-view #ap .btn.p{ background:var(--color-accent); border-color:var(--color-accent); color:var(--color-on-primary); }
body.admin-view #ap .btn.p:hover{ background:var(--color-primary-light); border-color:var(--color-primary-light); color:var(--color-on-primary); }
body.admin-view #ap .btn.s{ background:var(--color-success-bg); border-color:var(--color-success); color:var(--color-success); }
body.admin-view #ap .btn.o{ background:var(--color-surface); border-color:var(--color-border-strong); color:var(--color-text-1); }
body.admin-view #ap .btn:disabled,
body.admin-view #ap .btn[disabled]{ opacity:.5; cursor:not-allowed; }
body.admin-view #ap .btn:focus-visible{ outline:2px solid var(--color-accent); outline-offset:1px; }
/* 危险按钮：独立危险色，禁主色（§9.1 ⑫） */
body.admin-view #ap .btn.d,
body.admin-view #ap .btn.danger{ background:var(--color-danger); border-color:var(--color-danger); color:#fff; }
/* 行内文字操作（.am）统一为 24px 命中区、无下划线、hover 变强调色 */
body.admin-view #ap .am{
  display:inline-flex; align-items:center; gap:2px; min-height:26px; padding:0 var(--space-2);
  border-radius:var(--radius-sm); font-size:var(--fs-caption); color:var(--color-accent);
  cursor:pointer; white-space:nowrap; transition:background .12s ease, color .12s ease;
}
body.admin-view #ap .am:hover{ background:var(--color-accent-bg); }
body.admin-view #ap .am.r{ color:var(--color-danger); }
body.admin-view #ap .am.r:hover{ background:var(--color-danger-bg); }

/* ── C2 表格：表头 40 / 行 44 / 分隔线代斑马 / 空态引导 ────────────────── */
body.admin-view #ap table{
  width:100%; border-collapse:collapse; background:var(--color-surface);
  border:1px solid var(--color-border); border-radius:var(--radius-md); overflow:hidden;
  font-size:var(--fs-caption);
}
body.admin-view #ap table th{
  height:40px; padding:0 var(--space-3); text-align:left;
  font-size:var(--fs-mini); font-weight:var(--fw-semibold); letter-spacing:.4px;
  color:var(--color-text-2); background:var(--color-bg);
  border-bottom:1px solid var(--color-border); white-space:nowrap;
}
body.admin-view #ap table td{
  height:44px; padding:var(--space-2) var(--space-3); color:var(--color-text-1);
  border-bottom:1px solid var(--color-border); vertical-align:middle;
}
body.admin-view #ap table tr:last-child td{ border-bottom:0; }
body.admin-view #ap table tbody tr:hover td{ background:var(--color-accent-bg); }

/* ── C3 表单：标签 88px / 控件 32px / 错误红字下置 ───────────────────── */
body.admin-view #ap .fg{ padding:var(--space-4); border-radius:var(--radius-lg); box-shadow:var(--shadow-1); }
body.admin-view #ap .fg label{
  display:inline-block; min-height:20px; margin-bottom:var(--space-1);
  font-size:var(--fs-caption); color:var(--color-text-2);
}
body.admin-view #ap input[type=text],
body.admin-view #ap input[type=number],
body.admin-view #ap input[type=password],
body.admin-view #ap select,
body.admin-view #ap .ac-inp,
body.admin-view #ap .ac-inp-b,
body.admin-view #ap .ac-width-100-padding-8px-border-1px-solid{
  min-height:32px; height:32px; padding:0 var(--space-2);
  border:1px solid var(--color-border-strong); border-radius:var(--radius-md);
  font-size:var(--fs-body); color:var(--color-text-1); background:var(--color-surface);
  box-sizing:border-box;
}
body.admin-view #ap textarea{ min-height:72px; padding:var(--space-2); border:1px solid var(--color-border-strong);
  border-radius:var(--radius-md); font-size:var(--fs-body); box-sizing:border-box; }
body.admin-view #ap input:focus,
body.admin-view #ap select:focus,
body.admin-view #ap textarea:focus{ outline:none; border-color:var(--color-accent); box-shadow:0 0 0 3px var(--color-accent-bg); }

/* ── C4 卡片：padding 16 / 圆角 10 / 单层轻阴影（不叠加） ─────────────── */
body.admin-view #ap .mi,
body.admin-view #ap .mb,
body.admin-view #ap .ms,
body.admin-view #ap .ac-empty,
body.admin-view #ap .ac-background-border-radius-14p-04cbe,
body.admin-view #ap .ac-background-border-radius-14p-f91c7,
body.admin-view #ap .ac-background-border-radius-14px-width-10,
body.admin-view #ap .ac-background-border-radius-12px-text-ali{
  box-shadow:none; border-radius:var(--radius-lg);
}

/* ── C5 弹窗 / 抽屉：400 / 560 / 800px，遮罩 + 锁滚动；手机端底部抽屉 ── */
body.admin-view .adCf{ position:fixed; inset:0; z-index:9999; }
body.admin-view .adCf-mask{ position:absolute; inset:0; background:var(--color-overlay); }
body.admin-view .adCf-box{
  position:relative; margin:min(12vh,120px) auto 0; width:100%; max-width:400px;
  background:var(--color-surface); border-radius:var(--radius-lg);
  box-shadow:var(--shadow-3); padding:var(--space-4); box-sizing:border-box;
}
body.admin-view .adCf-head{ display:flex; align-items:center; gap:var(--space-1); font-size:var(--fs-caption); font-weight:var(--fw-semibold); }
body.admin-view .adCf-ico{ font-size:var(--fs-h3); }
body.admin-view .adCf-title{ margin-top:var(--space-2); font-size:var(--fs-h2); color:var(--color-text-1); }
body.admin-view .adCf-text{ margin-top:var(--space-2); font-size:var(--fs-body); color:var(--color-text-2); line-height:var(--lh-body); word-break:break-word; }
body.admin-view .adCf-list{ margin:var(--space-2) 0 0; padding-left:18px; font-size:var(--fs-caption); color:var(--color-danger); line-height:var(--lh-body); }
body.admin-view .adCf-note{ margin-top:var(--space-3); padding:var(--space-2) var(--space-3); border-radius:var(--radius-md);
  background:var(--color-danger-bg); color:var(--color-danger); font-size:var(--fs-caption); }
body.admin-view .adCf[data-level=mid] .adCf-note{ background:var(--color-warning-bg); color:var(--color-warning); }
body.admin-view .adCf-field{ margin-top:var(--space-3); }
body.admin-view .adCf-field label{ display:block; margin-bottom:var(--space-1); font-size:var(--fs-caption); color:var(--color-text-2); }
body.admin-view .adCf-inp{ width:100%; min-height:32px; height:32px; padding:0 var(--space-2); box-sizing:border-box;
  border:1px solid var(--color-border-strong); border-radius:var(--radius-md); font-size:var(--fs-body); }
body.admin-view .adCf-btns{ display:flex; justify-content:flex-end; gap:var(--space-2); margin-top:var(--space-4); }
body.admin-view .adCf-lv{ font-size:var(--fs-caption); font-weight:var(--fw-semibold); letter-spacing:.02em; }
body.admin-view .adCf-cancel{ background:var(--color-surface); border-color:var(--color-border-strong); color:var(--color-text-2); }
body.admin-view .adCf-ok:disabled{ opacity:.5; cursor:not-allowed; }
body.admin-view.adCf-open{ overflow:hidden; }
@media (max-width:640px){
  body.admin-view .adCf{ display:flex; align-items:flex-end; }
  body.admin-view .adCf-box{ margin:0; max-width:none; border-radius:var(--radius-lg) var(--radius-lg) 0 0;
    padding:var(--space-4) var(--space-4) calc(var(--space-4) + env(safe-area-inset-bottom)); max-height:88vh; overflow-y:auto; }
  body.admin-view .adCf-btns{ position:sticky; bottom:0; background:var(--color-surface); padding-top:var(--space-2); }
  body.admin-view .adCf-btns .btn{ flex:1; }
}

/* ── C6 空状态：图标 + 标题 + 说明 + 下一步动作（§9 必须有动作） ──────── */
body.admin-view #ap .adEm{
  display:flex; flex-direction:column; align-items:center; gap:var(--space-2);
  padding:var(--space-8) var(--space-4); background:var(--color-surface);
  border:1px dashed var(--color-border-strong); border-radius:var(--radius-lg); text-align:center;
}
body.admin-view #ap .adEm-ico{ font-size:28px; line-height:1; }
body.admin-view #ap .adEm-t{ font-size:var(--fs-body); font-weight:var(--fw-semibold); color:var(--color-text-1); }
body.admin-view #ap .adEm-d{ font-size:var(--fs-caption); color:var(--color-text-3); max-width:420px; line-height:var(--lh-body); }
body.admin-view #ap .adEm-btn{ margin-top:var(--space-1); }

/* ── C7 纪律收敛：正文不 700 加粗、列表项 padding 下限、禁多层阴影 ────── */
body.admin-view #ap b,
body.admin-view #ap strong{ font-weight:var(--fw-semibold); }
body.admin-view #ap .fg{ box-shadow:var(--shadow-1); }

/* ══ A2-END（回滚划断点：删除本标记到文件末尾的全部内容） ══ */

/* ══════════════════════════════════════════════════════════════════════════
   P3-A1 · 课程内容 →「课程节列表」版式（2026-10-11）
   诉求（BOSS）：每个课节独占一行、整齐美观；列表内不展示内容预览，只留「编辑内容」。
   根因：`body.admin-view .fg` 在 PC 是 1/3 宽 inline-block（三栏栅格）→ 课节卡被挤窄。
   口径：仅作用于 #apCont 内 .adSecCard；学员端与后台其他 .fg 零命中。
   回滚：整段删除（从本注释到 P3-A1-END 标记）。
   ══════════════════════════════════════════════════════════════════════════ */
body.admin-view #apCont .adSecBar{
  display:flex; align-items:baseline; justify-content:space-between;
  gap:var(--space-2); margin:var(--space-3) 0 var(--space-2);
  padding:0 0 var(--space-2); border-bottom:1px solid var(--color-border);
}
body.admin-view #apCont .adSecBarT{
  font-size:var(--fs-h3); font-weight:var(--fw-semibold); color:var(--color-text-1); margin:0;
}
body.admin-view #apCont .adSecBarC{ font-size:var(--fs-caption); color:var(--color-text-3); }
body.admin-view #apCont .fg.adSecCard{
  display:block; width:100%; margin:0 0 var(--space-3); margin-right:0;
  padding:var(--space-4); box-sizing:border-box;
}
body.admin-view #apCont .adSecHead{
  display:flex; align-items:center; justify-content:space-between;
  gap:var(--space-2); margin:0 0 var(--space-3); flex-wrap:nowrap;
}
body.admin-view #apCont .adSecNo{
  font-size:var(--fs-body); font-weight:var(--fw-semibold);
  color:var(--color-text-1); white-space:nowrap;
}
body.admin-view #apCont .adSecTools{
  display:flex; align-items:center; gap:var(--space-1); flex-wrap:nowrap;
}
body.admin-view #apCont .adSecCard > label:not(.adSecHead){ margin:0 0 var(--space-1); }
body.admin-view #apCont .adSecCard input[type=text]{
  display:block; width:100%; max-width:100%; box-sizing:border-box;
}
body.admin-view #apCont .adSecFoot{
  display:flex; justify-content:flex-end; align-items:center;
  margin-top:var(--space-3); padding-top:var(--space-3);
  border-top:1px solid var(--color-border);
}
body.admin-view #apCont .adSecEdit{
  padding:0 var(--space-3); height:32px; line-height:30px;
  font-size:var(--fs-caption); font-weight:var(--fw-medium);
  color:var(--color-accent); background:var(--color-accent-bg);
  border:1px solid var(--color-accent); border-radius:var(--radius-sm);
}
body.admin-view #apCont .adSecEdit:hover{ background:var(--color-surface); }
@media (max-width:760px){
  body.admin-view #apCont .adSecHead{ flex-wrap:wrap; }
  body.admin-view #apCont .adSecTools .am{ min-width:var(--touch-min); min-height:var(--touch-min); }
  body.admin-view #apCont .adSecFoot{ justify-content:stretch; }
  body.admin-view #apCont .adSecEdit{ flex:1; text-align:center; height:var(--touch-min); line-height:var(--touch-min); }
}
/* ══ P3-A1-END ══ */