/* ============ 拓展课选课系统 · 移动端优先自适应样式 ============ */
:root {
  --red: #c8403a;
  --red-dark: #a5332e;
  --red-light: #fdf1f0;
  --green: #1f8a4c;
  --green-light: #eaf7ef;
  --gray: #8a8f99;
  --gray-light: #f2f3f5;
  --border: #e6e8eb;
  --text: #23262b;
  --text-sub: #6b7280;
  --card: #ffffff;
  --bg: #f5f6f8;
  --radius: 14px;
  --shadow: 0 1px 3px rgba(20, 24, 34, .06), 0 4px 14px rgba(20, 24, 34, .05);
}
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { margin: 0; padding: 0; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
  background: var(--bg); color: var(--text); font-size: 15px; line-height: 1.55;
}
#app { min-height: 100vh; display: flex; flex-direction: column; }

/* ---- 顶栏 ---- */
.topbar {
  background: linear-gradient(135deg, var(--red) 0%, var(--red-dark) 100%);
  color: #fff; padding: 14px 16px; padding-top: calc(14px + env(safe-area-inset-top));
  display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
  position: sticky; top: 0; z-index: 50; box-shadow: var(--shadow);
}
.brand { display: flex; align-items: center; gap: 8px; font-size: 17px; font-weight: 700; letter-spacing: .5px; }
.brand-dot { width: 9px; height: 9px; border-radius: 50%; background: #ffd7a1; box-shadow: 0 0 0 3px rgba(255,215,161,.25); }
.window-chip {
  background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.35);
  padding: 3px 12px; border-radius: 999px; font-size: 12.5px; font-variant-numeric: tabular-nums;
}
.window-chip.closed { background: rgba(0,0,0,.18); border-color: rgba(255,255,255,.2); }

/* ---- 主体 ---- */
main { flex: 1; width: 100%; max-width: 760px; margin: 0 auto; padding: 14px 14px 40px; }
@media (min-width: 760px) { main { padding: 20px 0 60px; } }

.card { background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); padding: 16px; margin-bottom: 14px; }
.card h3 { margin: 0 0 10px; font-size: 15.5px; display: flex; align-items: center; gap: 8px; }
.muted { color: var(--text-sub); font-size: 13px; }

.notice {
  background: #fffbe8; border: 1px solid #f5e6a8; color: #7a5c12;
  border-radius: var(--radius); padding: 10px 14px; margin-bottom: 14px; font-size: 13.5px; white-space: pre-wrap;
}

/* ---- 表单 ---- */
label.field { display: block; margin-bottom: 12px; }
label.field > span { display: block; font-size: 13px; color: var(--text-sub); margin-bottom: 5px; }
select, input[type=text], input[type=password], input[type=datetime-local], textarea {
  width: 100%; padding: 11px 12px; border: 1px solid var(--border); border-radius: 10px;
  font-size: 15px; background: #fff; color: var(--text); font-family: inherit; outline: none;
}
select:focus, input:focus, textarea:focus { border-color: var(--red); box-shadow: 0 0 0 3px rgba(200,64,58,.12); }
textarea { resize: vertical; min-height: 120px; }
/* 表单行：flex 子项必须允许收缩（min-width:0），否则日期控件等「固有宽度大」的控件
   会把整行撑出容器 → 窄屏横向溢出。flex-wrap 让窄屏能自动换行。 */
.form-row { display: flex; gap: 10px; flex-wrap: wrap; }
.form-row > * { flex: 1; min-width: 0; }
/* 窄屏：多控件不再挤在一行 —— 下拉两两一行、输入框独占一行、按钮保持自然宽度 */
@media (max-width: 640px) {
  .form-row > * { flex: 1 1 100%; }
  .form-row > .inline-select { flex: 1 1 calc(50% - 5px); }
  .form-row > .btn { flex: 0 0 auto; }
  label.field { margin-bottom: 10px; }
}

/* ---- 按钮 ---- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  border: none; border-radius: 10px; padding: 11px 18px; font-size: 15px; font-weight: 600;
  cursor: pointer; font-family: inherit; transition: filter .15s, transform .05s; user-select: none;
}
.btn:active { transform: scale(.98); }
.btn-primary { background: var(--red); color: #fff; }
.btn-primary:hover { filter: brightness(1.06); }
.btn-outline { background: #fff; color: var(--red); border: 1.5px solid var(--red); }
.btn-ghost { background: var(--gray-light); color: var(--text); }
.btn-danger { background: #fff; color: #c0392b; border: 1.5px solid #e5b4ae; }
.btn-sm { padding: 5px 12px; font-size: 13px; border-radius: 8px; font-weight: 500; }
.btn-block { width: 100%; }
.btn[disabled] { opacity: .5; cursor: not-allowed; }

/* ---- 家长：状态卡 ---- */
.my-card { border-top: 4px solid var(--red); }
.my-head { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 4px; }
.my-name { font-size: 17px; font-weight: 700; }
.badge {
  display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 600;
}
.badge-red { background: var(--red-light); color: var(--red); }
.badge-green { background: var(--green-light); color: var(--green); }
.badge-gray { background: var(--gray-light); color: var(--gray); }
.badge-blue { background: #e6f0fd; color: #1a6fd4; }
.my-course { margin-top: 10px; padding: 12px 14px; background: var(--red-light); border-radius: 10px; }
.my-course .cname { font-size: 18px; font-weight: 700; color: var(--red-dark); }
.my-course .cmeta { color: var(--text-sub); font-size: 13px; margin-top: 2px; }
.my-actions { display: flex; gap: 10px; margin-top: 12px; }
.my-actions .btn { flex: 1; }
.my-empty { margin-top: 10px; padding: 14px; text-align: center; color: var(--text-sub); background: var(--gray-light); border-radius: 10px; }
/* 一人多课：家长选择保留哪一门 */
.choice-row { display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 10px 12px; margin-top: 8px; background: #fff; border: 1px solid #f0dede; border-radius: 10px; }
.choice-row .choice-info { min-width: 0; }
.choice-row .choice-info b { font-size: 15px; }
.choice-row .btn { flex: none; white-space: nowrap; }

/* ---- 家长：课程网格 ---- */
.courses-title { display: flex; align-items: center; justify-content: space-between; margin: 18px 2px 10px; }
.courses-title h2 { margin: 0; font-size: 16px; }
.live-dot { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--green); }
.live-dot::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--green); animation: pulse 1.6s infinite; }
@keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: .3; } }
.course-grid { display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 620px) { .course-grid { grid-template-columns: 1fr 1fr; } }
.course-card {
  background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow);
  padding: 14px 15px; display: flex; flex-direction: column; gap: 8px;
  border: 1.5px solid transparent; position: relative;
}
.course-card.current { border-color: var(--red); }
.course-card.full { opacity: .68; }
.course-name { font-size: 16.5px; font-weight: 700; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.course-meta { color: var(--text-sub); font-size: 13px; }
.quota-row { display: flex; align-items: center; justify-content: space-between; font-size: 12.5px; color: var(--text-sub); }
.quota-bar { height: 7px; border-radius: 4px; background: var(--gray-light); overflow: hidden; }
.quota-bar > i { display: block; height: 100%; border-radius: 4px; background: var(--red); transition: width .4s; }
.quota-bar > i.warn { background: #e08a1e; }
.remain { font-weight: 700; font-variant-numeric: tabular-nums; }
.remain.hot { color: var(--red); }
.remain.ok { color: var(--green); }
.course-card .btn { margin-top: 2px; }

/* ---- 列表 / 表格 ---- */
.table-wrap { overflow-x: auto; }
table.tbl { width: 100%; border-collapse: collapse; font-size: 13.5px; min-width: 480px; }
table.tbl th, table.tbl td { padding: 8px 10px; border-bottom: 1px solid var(--border); text-align: left; white-space: nowrap; }
table.tbl th { color: var(--text-sub); font-weight: 600; font-size: 12.5px; background: #fafbfc; position: sticky; top: 0; }
table.tbl tr:last-child td { border-bottom: none; }
.tag { display: inline-block; padding: 1px 8px; border-radius: 6px; font-size: 12px; }
.tag-red { background: var(--red-light); color: var(--red); }
.tag-green { background: var(--green-light); color: var(--green); }
.tag-gray { background: var(--gray-light); color: var(--gray); }
.tag-amber { background: #fdf3e0; color: #a3690a; }
.row-hl td { background: #fffdf5; }

/* ---- 选项 chips（重名选择） ---- */
.chip-row { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0; }
.chip {
  padding: 7px 14px; border-radius: 999px; border: 1.5px solid var(--border); background: #fff;
  font-size: 13.5px; cursor: pointer; font-family: inherit;
}
.chip.sel { border-color: var(--red); color: var(--red); background: var(--red-light); font-weight: 600; }

/* ---- 弹窗 / toast ---- */
#modalRoot .overlay {
  position: fixed; inset: 0; background: rgba(15, 18, 25, .45); z-index: 100;
  display: flex; align-items: center; justify-content: center; padding: 18px; animation: fadeIn .15s;
}
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
.dialog {
  background: #fff; border-radius: 16px; width: 100%; max-width: 420px; max-height: 86vh;
  overflow: auto; padding: 18px; animation: pop .18s;
}
@keyframes pop { from { transform: scale(.94); opacity: 0; } to { transform: scale(1); opacity: 1; } }
.dialog h4 { margin: 0 0 10px; font-size: 16px; }
.dialog .dlg-actions { display: flex; gap: 10px; margin-top: 16px; }
.dialog .dlg-actions .btn { flex: 1; }
#toastRoot { position: fixed; top: 70px; left: 0; right: 0; z-index: 200; display: flex; flex-direction: column; align-items: center; gap: 8px; pointer-events: none; }
.toast {
  background: rgba(30, 33, 40, .92); color: #fff; padding: 10px 20px; border-radius: 999px;
  font-size: 14px; max-width: 86vw; animation: pop .18s; box-shadow: var(--shadow);
}
.toast.err { background: rgba(160, 40, 35, .95); }
.toast.ok { background: rgba(23, 110, 64, .95); }
.toast.warn { background: rgba(168, 106, 18, .95); }

/* ---- 页脚 ---- */
.foot { text-align: center; padding: 18px 0 calc(18px + env(safe-area-inset-bottom)); color: #b0b4bc; font-size: 12.5px; }
.foot a { color: #9aa0a9; margin: 0 8px; text-decoration: underline; text-underline-offset: 3px; }

/* ---- 管理端 ---- */
.admin-tabs { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 4px; margin-bottom: 14px; }
.tab {
  flex-shrink: 0; padding: 8px 16px; border-radius: 999px; border: 1.5px solid var(--border);
  background: #fff; font-size: 14px; cursor: pointer; font-family: inherit; color: var(--text-sub);
}
.tab.on { background: var(--red); border-color: var(--red); color: #fff; font-weight: 600; }
.stat-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 14px; }
@media (max-width: 520px) { .stat-row { grid-template-columns: repeat(2, 1fr); } }
.stat { background: var(--card); border-radius: 12px; box-shadow: var(--shadow); padding: 12px; text-align: center; }
.stat b { display: block; font-size: 22px; color: var(--red); font-variant-numeric: tabular-nums; }
.stat span { font-size: 12px; color: var(--text-sub); }
/* 第十六轮：可点击下钻的统计卡（未选课 / 一人多课 / 待审免修） */
.stat.clickable { cursor: pointer; transition: transform .12s ease, box-shadow .12s ease, border .12s ease; border: 1px solid transparent; }
.stat.clickable:hover { transform: translateY(-2px); border-color: var(--red); box-shadow: 0 4px 14px rgba(0,0,0,.10); }
.stat.clickable:active { transform: translateY(0); }
.code-text { font-family: ui-monospace, Menlo, Consolas, monospace; letter-spacing: 2px; font-weight: 700; color: var(--red-dark); }
.toolbar { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.inline-select { width: auto; display: inline-block; }
.warnbox { background: #fdf3e0; border: 1px solid #eed9a9; color: #7a5c12; border-radius: 10px; padding: 10px 12px; font-size: 13px; margin-bottom: 12px; }
.import-sheet { border: 1px solid var(--border); border-radius: 10px; padding: 12px; margin-bottom: 10px; background: #fafbfc; }
.import-sheet .sheet-name { font-weight: 700; margin-bottom: 6px; }
.map-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; }
.count-line { font-size: 13px; color: var(--text-sub); margin: 6px 0 10px; }
.hint { font-size: 12.5px; color: var(--text-sub); background: var(--gray-light); border-radius: 8px; padding: 8px 10px; margin: 8px 0; }
.section-gap { height: 6px; }
.backlink { display: inline-flex; align-items: center; gap: 4px; color: var(--text-sub); font-size: 13.5px; cursor: pointer; margin-bottom: 10px; border: none; background: none; font-family: inherit; padding: 0; }
.big-num { font-size: 26px; font-weight: 800; color: var(--red); font-variant-numeric: tabular-nums; }
.seg { display: inline-flex; border: 1px solid var(--border); border-radius: 10px; overflow: hidden; margin: 6px 0 12px; }
.seg-btn { border: none; background: #fff; color: var(--text-sub); font-family: inherit; font-size: 13.5px; padding: 8px 14px; cursor: pointer; }
.seg-btn + .seg-btn { border-left: 1px solid var(--border); }
.seg-btn.on { background: var(--red); color: #fff; font-weight: 700; }
.grade-checks { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 6px 0 12px; }
.gchk { display: inline-flex; align-items: center; gap: 5px; font-size: 14px; cursor: pointer; }
.form-col { display: flex; flex-direction: column; }
.form-col label { font-size: 13px; color: var(--text-sub); margin-bottom: 5px; }

/* ============ 本轮新增 ============ */
.row-between { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }

/* ---- 一人多课：保留/放弃 双按钮 ---- */
.choice-btns { display: flex; gap: 8px; flex: none; }
.choice-btns .btn { flex: none; }
@media (max-width: 520px) {
  .choice-row { flex-direction: column; align-items: stretch; }
  .choice-btns .btn { flex: 1; }
}

/* ---- 家长确认项 ---- */
.confirm-box {
  margin-top: 10px; padding: 12px 13px; background: #fffbe8;
  border: 1px solid #f0dda6; border-radius: 10px;
}
.confirm-line { display: flex; align-items: flex-start; gap: 9px; font-size: 13.5px; line-height: 1.6; cursor: pointer; }
.confirm-line input[type=checkbox] { width: 18px; height: 18px; margin: 1px 0 0; flex: none; accent-color: var(--red); }
.confirm-line span { flex: 1; }

/* ---- 课程简介 / 图片 ---- */
.course-intro { font-size: 13.5px; color: var(--text-sub); line-height: 1.6; white-space: pre-wrap; }
.course-imgs { display: flex; gap: 8px; flex-wrap: wrap; }
.course-imgs img {
  width: 84px; height: 84px; object-fit: cover; border-radius: 9px;
  border: 1px solid var(--border); cursor: zoom-in; background: var(--gray-light);
}
.img-viewer { max-width: 100%; border-radius: 12px; display: block; }

/* ---- 校队课程卡（仅展示不可选） ---- */
.course-card.team-card { border-color: #e8d9bc; background: linear-gradient(180deg, #fffdf7 0%, #fff 42%); }
.course-card.team-card .team-hint { font-size: 12.5px; color: #a3690a; background: #fdf3e0; border-radius: 8px; padding: 6px 10px; }
.course-card .btn[disabled] { opacity: .72; }

/* ---- 课程 pill（班级表并列展示多课） ---- */
.course-pill {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 3px 11px; margin: 2px 6px 2px 0; border-radius: 999px;
  font-size: 13px; background: var(--red-light); color: var(--red-dark); white-space: nowrap;
}
.course-pill.team { background: #fdf3e0; color: #a3690a; }
.course-pill.source-parent { background: #e6f0fd; color: #1a6fd4; }
.course-pill.source-head { background: #f0e9fb; color: #6a3fc0; }

/* ---- 后台班级表：仿学校原 Excel 版式（左右双栏 + 窄格课程列） ---- */
.cs-title { font-size: 14.5px; font-weight: 700; margin: 4px 0 10px; }
.class-sheet { min-width: 0; }
.class-sheet col.cs-col-no { width: 44px; }
.class-sheet col.cs-col-name { width: 92px; }
.class-sheet col.cs-col-c { width: 40px; }
.class-sheet col.cs-col-gap { width: 26px; }
.class-sheet th, .class-sheet td { vertical-align: top; }
.class-sheet th.cs-no, .class-sheet td.cs-no { width: 44px; min-width: 44px; text-align: center; color: var(--text-sub); font-variant-numeric: tabular-nums; }
.class-sheet th:nth-child(2), .class-sheet td.cs-name { width: 92px; min-width: 92px; white-space: nowrap; }
.class-sheet .cs-gap { width: 26px; min-width: 26px; border-bottom: none !important; background: linear-gradient(90deg, transparent 45%, var(--border) 45%, var(--border) 55%, transparent 55%); }
.class-sheet td.cs-c { width: 40px; min-width: 40px; padding: 7px 5px; white-space: normal; }
.cs-course { display: block; width: 2em; margin: 0 auto; text-align: center; font-size: 13px; line-height: 1.45; word-break: break-all; color: var(--text); }
.cs-course.team { color: #a3690a; font-weight: 600; }
.cs-stats { margin-top: 16px; padding-top: 12px; border-top: 1px dashed var(--border); }
.cs-stats h4 { margin: 0 0 8px; font-size: 14px; }
.cs-stat-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.cs-chip {
  display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px;
  border: 1px solid var(--border); border-radius: 999px; background: #fff;
  font-size: 13px; color: var(--text);
}
.cs-chip b { color: var(--red); font-variant-numeric: tabular-nums; }
.cs-chip b::after { content: "人"; font-size: 11px; font-weight: 400; color: var(--text-sub); margin-left: 1px; }
.cs-chip.team { background: #fdf3e0; border-color: #ecd9b7; }
.cs-chip.team i { font-style: normal; font-size: 11px; color: #a3690a; border: 1px solid #d9b98a; border-radius: 5px; padding: 0 4px; }
.cs-stats .hint { margin-top: 8px; font-size: 12.5px; color: var(--text-sub); }

/* ---- 第十五轮：班级表「异常选课状态」凸显（未选课 / 多课冲突） ---- */
/* 行级高亮：未选课=红底红左边框，多课冲突=橙底橙左边框，普通未选（历史样式）保持浅黄 */
.class-sheet tr.row-unsel > td { background: #fdeceb !important; }
.class-sheet tr.row-unsel > td:first-child { box-shadow: inset 3px 0 0 var(--red); }
.class-sheet tr.row-multi > td { background: #fff6e6 !important; }
.class-sheet tr.row-multi > td:first-child { box-shadow: inset 3px 0 0 #d98b19; }
/* 异常汇总条 */
.cs-abn {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin: 0 0 10px; padding: 8px 12px; border-radius: 10px;
  background: #fdf3f2; border: 1px solid #f2d5d2; font-size: 13px;
}
.cs-abn.ok { background: #f1f8f2; border-color: #cfe6d4; }
.cs-abn-t { font-weight: 700; color: #a4342e; white-space: nowrap; }
.cs-abn.ok .cs-abn-t { color: #2f7d43; }
.cs-abn-chip {
  display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px;
  border-radius: 999px; border: 1px solid transparent; cursor: pointer;
  font-size: 12.5px; font-family: inherit; color: #fff; white-space: nowrap;
}
.cs-abn-chip.unsel { background: var(--red); }
.cs-abn-chip.multi { background: #d98b19; }
.cs-abn-chip b { font-variant-numeric: tabular-nums; }
.cs-abn-chip:hover { filter: brightness(1.08); }
.cs-abn-chip.active { box-shadow: 0 0 0 2px #fff, 0 0 0 4px currentColor; }
.cs-abn-names { display: flex; flex-wrap: wrap; gap: 6px; color: var(--text-sub); }
.cs-abn-nm {
  display: inline-flex; align-items: center; gap: 3px; padding: 1px 7px;
  border-radius: 6px; background: #fff; border: 1px solid #e8ded9; font-size: 12.5px;
}
.cs-abn-nm i { font-style: normal; font-size: 11px; color: #a4342e; }
.cs-abn-nm.multi i { color: #a3690a; }
.cs-abn-nm.multi { border-color: #ecd9b7; background: #fffdf7; }
/* 「只看异常」筛选态下，被隐藏的行 */
.class-sheet tr.cs-hide { display: none; }

/* ---- 班级表移动端自适应：fixed 布局 + colgroup 显式列宽，双栏完整塞进窄屏 ---- */
@media (max-width: 640px) {
  .cs-title { font-size: 13px; margin: 2px 0 8px; }
  .class-sheet { width: 100%; table-layout: fixed; border-spacing: 0; font-size: 12px; }
  table.class-sheet th, table.class-sheet td { padding: 5px 3px; }
  .class-sheet col.cs-col-no { width: 20px; }
  .class-sheet col.cs-col-name { width: 54px; }
  .class-sheet col.cs-col-c { width: 32px; }
  .class-sheet col.cs-col-gap { width: 6px; }
  .class-sheet td { white-space: normal; }
  .class-sheet td.cs-c { padding: 5px 2px; }
  .cs-course { font-size: 12px; overflow: hidden; }
  .cs-name .badge { font-size: 10px; padding: 0 3px; }
  .cs-abn { gap: 6px; padding: 6px 9px; font-size: 12px; }
  .cs-abn-nm { font-size: 11.5px; padding: 1px 5px; }
  .cs-abn-chip { font-size: 11.5px; padding: 2px 8px; }
  .class-sheet tr.row-unsel > td:first-child, .class-sheet tr.row-multi > td:first-child { box-shadow: inset 2px 0 0 currentColor; }
  .cs-stats h4 { font-size: 13px; }
  .cs-chip { font-size: 12px; padding: 4px 9px; }
}

/* ---- 班主任端班级表（第十三轮：主界面改用 class-sheet 版式） ---- */
.head-tbl { width: 100%; border-collapse: collapse; font-size: 14px; }
.head-tbl th, .head-tbl td { padding: 9px 10px; border-bottom: 1px solid var(--border); text-align: left; vertical-align: top; }
.head-tbl th { color: var(--text-sub); font-weight: 600; font-size: 12.5px; background: #fafbfc; }
.head-tbl .col-no { width: 52px; color: var(--text-sub); font-variant-numeric: tabular-nums; }
.head-tbl .col-name { width: 86px; font-weight: 600; white-space: nowrap; }
.head-tbl tr:last-child td { border-bottom: none; }
.head-row:hover td { background: #fafbfc; }
.head-row.multi td { background: #fffdf5; }
.name-link { color: var(--text); text-decoration: none; border-bottom: 1px dashed #c3c7cd; cursor: pointer; background: none; border-top: 0; border-left: 0; border-right: 0; font: inherit; font-weight: 600; padding: 0; }
.name-link:hover { color: var(--red); border-bottom-color: var(--red); }
/* 班主任端班级表：姓名格可点（代选课入口） */
.head-sheet td.cs-name[data-sid] { cursor: pointer; }
.head-sheet td.cs-name[data-sid]:hover { background: #fdf3f2; }
.head-sheet td.cs-name[data-sid]:hover b { color: var(--red); }

/* ---- 总表：内联名额输入 ---- */
.cap-input {
  width: 74px !important; padding: 4px 8px !important; font-size: 13px !important;
  text-align: center; border-radius: 8px !important;
}

/* ---- 课程资料（教师/管理员维护） ---- */
.media-row { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 8px; }
.media-thumb { position: relative; width: 84px; height: 84px; border-radius: 9px; overflow: hidden; border: 1px solid var(--border); }
.media-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.media-del {
  position: absolute; top: 3px; right: 3px; width: 20px; height: 20px; border-radius: 50%;
  border: none; background: rgba(30,33,40,.72); color: #fff; font-size: 13px; line-height: 1;
  cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0;
}
.profile-line { display: flex; gap: 8px; font-size: 13.5px; padding: 5px 0; border-bottom: 1px dashed var(--border); }
.profile-line:last-child { border-bottom: none; }
.profile-line .k { color: var(--text-sub); flex: none; width: 68px; }
.profile-line .v { flex: 1; min-width: 0; white-space: pre-wrap; word-break: break-word; }

/* ---- 免修申请 ---- */
.waiver-card { margin-top: 10px; padding: 12px 14px; border-radius: 10px; background: var(--gray-light); font-size: 13.5px; }
.waiver-card.pending { background: #fdf3e0; color: #7a5c12; }
.waiver-card.rejected { background: #fdeceb; color: #9c3129; }
.waiver-card.ok { background: var(--green-light); color: var(--green); }
.waiver-actions { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.waiver-actions .btn { flex: none; }
@media (max-width: 520px) { .waiver-actions .btn { flex: 1; } }
.waiver-item { padding: 12px 0; border-bottom: 1px solid var(--border); }
.waiver-item:last-child { border-bottom: none; }
.waiver-item .w-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.waiver-item .w-name { font-weight: 700; }
.waiver-reason { color: var(--text-sub); font-size: 13px; margin-top: 4px; white-space: pre-wrap; }
.file-drop {
  border: 1.5px dashed #cfd3d9; border-radius: 10px; padding: 18px; text-align: center;
  color: var(--text-sub); font-size: 13.5px; cursor: pointer; background: #fafbfc;
}
.file-drop:active { border-color: var(--red); }
.file-drop .fd-icon { font-size: 24px; display: block; margin-bottom: 4px; }

/* ---- 第九轮：名额参考 / 批量名额 / 学生调课 ---- */
.grade-ref {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  padding: 10px 12px; border-radius: 10px; background: var(--gray-light); margin-bottom: 12px; font-size: 13px;
}
.grade-ref .gr-title { font-weight: 700; color: var(--text-sub); flex: none; }
.grade-ref .gr-chip {
  padding: 5px 10px; border-radius: 999px; background: #fff; border: 1px solid var(--border);
  white-space: nowrap;
}
.grade-ref .gr-chip .gr-rem { color: var(--red); }
.adj-stu { padding: 10px 0; border-bottom: 1px solid var(--border); }
.adj-stu:last-child { border-bottom: none; }
.adj-stu .adj-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.adj-stu .adj-ops { margin-left: auto; flex: none; }
.adj-stu .adj-enr { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 13.5px; }
.chip-item {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 8px; border-radius: 8px; background: var(--gray-light); border: 1px solid var(--border);
}
.chip-item .btn { padding: 2px 8px; font-size: 12px; }
@media (max-width: 640px) {
  .grade-ref { font-size: 12px; padding: 8px 10px; }
  .grade-ref .gr-chip { padding: 4px 8px; }
  .adj-stu .adj-ops { margin-left: 0; flex-basis: 100%; }
}

/* ---- 第十轮：总表固定列宽换行 / 弹窗加宽 / 打印导出 ---- */
.tag-blue { background: #e8f0fb; color: #2c5fb3; }
/* 总表课程列表：固定列宽 + 自动换行，不再横向滚动 */
table.fixed-tbl { table-layout: fixed; min-width: 0; }
table.fixed-tbl th, table.fixed-tbl td { white-space: normal; word-break: break-word; overflow-wrap: anywhere; }
table.fixed-tbl th { vertical-align: middle; }
table.fixed-tbl .cap-input { width: 100%; max-width: 60px; }
table.fixed-tbl .btn { margin: 2px 2px 2px 0; }
/* 窄屏（<900px）恢复自动布局 + 横滚兜底：11 列在手机上无法全部塞下 */
@media (max-width: 900px) {
  table.fixed-tbl { table-layout: auto; min-width: 680px; }
}
/* 课程名单等宽弹窗 */
.dialog.dialog-wide { max-width: 640px; }
/* 打印导出页 */
.print-row {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  border: 1px solid var(--border); border-radius: 10px; padding: 12px 14px; margin-bottom: 10px; background: #fafbfc;
}
.print-ops { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
/* 批量勾选快捷分组（按年级，校队等同年级） */
.quick-pick { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 0 0 8px; }
.qp-chip {
  border: 1px solid var(--border); background: #fff; border-radius: 999px;
  padding: 3px 12px; font-size: 13px; cursor: pointer; line-height: 1.6; color: inherit;
  transition: border-color .15s, color .15s, background .15s;
}
.qp-chip b { font-weight: 600; margin-left: 2px; }
.qp-chip:hover { border-color: #c8403a; color: #c8403a; background: #fdf3f2; }

/* ---- 第十七轮：角色操作日志 ---- */
.tag-purple { background: #f1ecfb; color: #6b3fb8; }
.log-bar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; justify-content: space-between; margin-bottom: 6px; }
.log-bar .seg { margin: 0; }
.log-bar .seg-btn { padding: 6px 12px; font-size: 13px; }
.log-search { display: flex; gap: 6px; align-items: center; }
.log-search .inp { width: 220px; padding: 7px 10px; border: 1px solid var(--border); border-radius: 8px; font-family: inherit; font-size: 13.5px; }
@media (max-width: 640px) {
  .log-bar { flex-direction: column; align-items: stretch; }
  .log-search .inp { flex: 1; width: auto; }
  .log-bar .seg { flex-wrap: wrap; }
}

/* ============ 第十九轮 ============ */

/* ---- 橙色警示按钮（候补入口） ---- */
.btn-warn { background: #e08b1e; color: #fff; }
.btn-warn:hover { background: #c87a15; }

/* ---- 家长登录：登录方式切换 ---- */
.login-tabs { display: flex; gap: 6px; margin: 4px 0 14px; background: var(--gray-light); padding: 4px; border-radius: 10px; }
.login-tab {
  flex: 1; border: 0; background: transparent; padding: 8px 10px; border-radius: 8px;
  font-size: 14px; font-family: inherit; color: var(--text-sub); cursor: pointer; transition: background .15s, color .15s;
}
.login-tab.sel { background: #fff; color: var(--red); font-weight: 600; box-shadow: 0 1px 3px rgba(0, 0, 0, .08); }

/* ---- 家长登录：本机已登录的孩子（多孩快速切换） ---- */
.kids-card { border-left: 4px solid var(--red); }
.kids-title { font-weight: 600; margin-bottom: 10px; }
.kid-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.kid-chip {
  position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 2px;
  border: 1px solid var(--border); background: #fff; border-radius: 12px; padding: 10px 30px 10px 14px;
  cursor: pointer; font-family: inherit; text-align: left; min-width: 130px;
  transition: border-color .15s, box-shadow .15s, transform .1s;
}
.kid-chip:hover { border-color: var(--red); box-shadow: 0 3px 10px rgba(200, 64, 58, .12); }
.kid-chip:active { transform: scale(.98); }
.kid-chip b { font-size: 16px; color: var(--text); }
.kid-chip span { font-size: 12px; color: var(--text-sub); }
.kid-del {
  position: absolute; top: 6px; right: 8px; font-style: normal; font-size: 16px; line-height: 1;
  color: #b9bec7; padding: 2px 4px; border-radius: 6px;
}
.kid-del:hover { color: var(--red); background: var(--red-light); }

/* ---- 课程图片被策略屏蔽时的提示 ---- */
.imgs-hidden {
  font-size: 12px; color: var(--text-sub); background: var(--gray-light);
  border-radius: 8px; padding: 8px 10px; margin: 8px 0 2px;
}

/* ---- 候补状态卡 ---- */
.wl-card { border-left: 4px solid #e08b1e; }
.wl-title { font-weight: 600; margin-bottom: 10px; color: #a86a12; }
.wl-row {
  display: flex; gap: 12px; align-items: flex-start; justify-content: space-between;
  border: 1px solid #f0e2c8; background: #fffdf7; border-radius: 12px; padding: 12px 14px; margin-bottom: 10px;
}
.wl-main { flex: 1; min-width: 0; }
.wl-main b { font-size: 16px; }
.wl-sub { font-size: 13px; color: var(--text-sub); margin-top: 4px; }
.wl-sub .ok { color: var(--green); font-weight: 600; }
.wl-sub .wl-warn { color: #b26a00; font-weight: 600; }
.wl-btns { display: flex; flex-direction: column; gap: 6px; flex-shrink: 0; }
.wl-btns .btn { white-space: nowrap; }
/* 候补「未选保底」提醒条（列表顶部，醒目） */
.wl-alert {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  background: #fdf3e0; border: 1px solid #eed9a9; color: #7a5c12;
  border-radius: 10px; padding: 10px 12px; margin-bottom: 10px; font-size: 13px; line-height: 1.6;
}
.wl-alert .btn { flex-shrink: 0; }
@media (max-width: 640px) {
  .wl-row { flex-direction: column; }
  .wl-btns { flex-direction: row; width: 100%; }
  .wl-btns .btn { flex: 1; }
  .kid-chip { flex: 1 1 calc(50% - 10px); min-width: 0; }
}

/* ---- 后台：按班限额配置表 ---- */
.cq-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.cq-table th, .cq-table td { border: 1px solid var(--border); padding: 6px 8px; text-align: center; }
.cq-table th { background: var(--gray-light); font-weight: 600; white-space: nowrap; }
.cq-table td.cq-cls { text-align: left; white-space: nowrap; }
.cq-table .cq-inp {
  width: 68px; padding: 5px 6px; border: 1px solid var(--border); border-radius: 6px;
  font-family: inherit; font-size: 13.5px; text-align: center;
}
.cq-table .cq-inp:focus { outline: 2px solid rgba(200, 64, 58, .3); border-color: var(--red); }
.cq-wrap { max-height: 46vh; overflow: auto; border-radius: 10px; }
.cq-sum { font-size: 13px; color: var(--text-sub); margin: 8px 0; }
.cq-sum b { color: var(--red); }
.grade-band { background: #fbfbfc; font-weight: 600; }
.cq-bump { color: #e08b1e; font-size: 12px; }

/* ---- 后台：候补队列 ---- */
/* 第二十一轮：默认只显示人数概览，点击概览卡展开完整名单 */
.wq-summary { display: flex; align-items: stretch; gap: 10px; flex-wrap: wrap; cursor: pointer;
  border: 1px solid var(--border); border-radius: 12px; padding: 12px; margin-bottom: 12px;
  background: #fffdf7; transition: border-color .12s ease, box-shadow .12s ease; }
.wq-summary:hover { border-color: #e08b1e; box-shadow: 0 4px 14px rgba(224,139,30,.14); }
.wq-summary .stat { flex: 0 0 auto; min-width: 104px; padding: 6px 14px; box-shadow: none;
  background: transparent; border-right: 1px solid var(--border); border-radius: 0; text-align: center; }
.wq-summary .stat:last-of-type { border-right: none; }
.wq-summary .stat b { display: block; font-size: 24px; color: #e08b1e; font-variant-numeric: tabular-nums; }
.wq-summary .stat span { font-size: 12px; color: var(--text-sub); }
.wq-toggle { margin-left: auto; display: flex; align-items: center; gap: 6px; align-self: center;
  font-size: 13px; color: #a3690a; font-weight: 600; white-space: nowrap; }
.wq-caret { font-size: 12px; }
.wq-warn { color: #b26a00; font-weight: 600; }
.wq-group { border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; margin-bottom: 12px; background: #fff; }
.wq-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.wq-head b { font-size: 15px; }
/* 候补名单：版式与「历史候补记录」一致 —— 完整展示、内容自动换行，不出现左右滑动 */
.wq-report { border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
.wq-table { width: 100%; table-layout: fixed; border-collapse: collapse; font-size: 13px; }
.wq-table th, .wq-table td { border-bottom: 1px solid var(--border); padding: 5px 8px; text-align: left;
  vertical-align: top; word-break: break-word; }
.wq-table th { color: var(--text-sub); font-weight: 500; background: var(--gray-light); }
.wq-table tr:last-child td { border-bottom: none; }
.wq-table .c-pos { width: 46px; }
.wq-table .c-name { width: 13%; }
.wq-table .c-cls { width: 17%; }
.wq-table .c-course { width: 17%; }
.wq-table .c-back { width: 19%; }
.wq-table .c-adj { width: 76px; }
.wq-table .c-time { width: 92px; }
.wq-yes { color: var(--green); font-weight: 600; }
.wq-pos { display: inline-block; min-width: 22px; height: 22px; line-height: 22px; text-align: center;
  background: #e08b1e; color: #fff; border-radius: 999px; font-size: 12px; font-weight: 700; }
/* 手机端：整体收缩，保持完整展示不横向滑动 */
@media (max-width: 640px) {
  .wq-table { font-size: 12px; }
  .wq-table th, .wq-table td { padding: 4px 5px; }
  .wq-table .c-pos { width: 34px; }
  .wq-table .c-cls { width: 20%; }
  .wq-table .c-course { width: 19%; }
  .wq-table .c-back { width: 21%; }
  .wq-table .c-adj { width: 58px; }
  .wq-table .c-time { width: 74px; }
  .wq-pos { min-width: 19px; height: 19px; line-height: 19px; font-size: 11px; }
}

/* ---- 后台：身份证导入 ---- */
.idc-stat { display: flex; gap: 16px; flex-wrap: wrap; margin: 8px 0 14px; }
.idc-stat .stat { min-width: 120px; }
.idc-report { max-height: 320px; overflow: auto; border: 1px solid var(--border); border-radius: 10px; }
.idc-report table { width: 100%; border-collapse: collapse; font-size: 13px; }
.idc-report th, .idc-report td { border-bottom: 1px solid var(--border); padding: 5px 8px; text-align: left; }
.idc-report th { position: sticky; top: 0; background: var(--gray-light); }
.idc-report tr.r-ok td { color: var(--green); }
.idc-report tr.r-error td { color: var(--red); }
.idc-report tr.r-skip td { color: var(--text-sub); }

/* ---- 第二十轮：学生信息列表（逐个编辑） ---- */
.mini-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.mini-table th, .mini-table td { border-bottom: 1px solid var(--border); padding: 7px 9px; text-align: left; }
.mini-table th { color: var(--text-sub); font-weight: 500; white-space: nowrap; background: var(--gray-light); }
.mini-table tr:hover td { background: #fafbfc; }
@media (max-width: 640px) {
  .mini-table th:nth-child(1), .mini-table td:nth-child(1),
  .mini-table th:nth-child(3), .mini-table td:nth-child(3) { display: none; }
}

/* ============ 第二十三轮：小程序对接（SSO） ============ */

/* 凭据行：只读输入框 + 复制按钮，窄屏下自动折行（沿用 .form-row 的 min-width:0 约定） */
.copy-row { display: flex; gap: 8px; align-items: stretch; flex-wrap: wrap; }
.copy-row > input { flex: 1; min-width: 0; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12.5px; }
.copy-row > .btn { flex: 0 0 auto; }

/* 代码块：示例代码与测试链接。窄屏可横向滚动（代码本身不适合折行） */
.code-block {
  background: #f7f8fa; border: 1px solid var(--border); border-radius: 10px;
  padding: 12px 14px; margin: 0; font-size: 12.5px; line-height: 1.65;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  white-space: pre; overflow-x: auto; color: #2c3038;
  -webkit-overflow-scrolling: touch;
}
.code-block code, .card code {
  background: #f1f2f5; border-radius: 4px; padding: 1px 5px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12.5px;
}

@media (max-width: 640px) {
  .code-block { font-size: 11.5px; padding: 10px; }
  /* 凭据输入框在手机上独占一行，复制按钮保持自然宽度 */
  .copy-row > input { flex: 1 1 100%; }
  .copy-row > .btn { flex: 0 0 auto; }
}