/* ============================================================
   词上分 · 监管师中心 —— 全局基础样式（Ant Design Blazor）
   仅保留框架级基础样式与少量产品级布局/组件补充样式，
   业务页面结构一律使用 Ant Design 组件表达。
   ============================================================ */

:root {
    --wm-bg: #f5f7fa;
    --wm-border: #f0f0f0;
    --wm-text: rgba(0, 0, 0, .88);
    --wm-text-secondary: rgba(0, 0, 0, .65);
    --wm-text-tertiary: rgba(0, 0, 0, .45);
    --wm-primary: #1677ff;
    --wm-sider-width: 232px;
    --wm-header-height: 64px;
}

html, body {
    margin: 0;
    padding: 0;
    height: 100%;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB',
                 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 14px;
    color: var(--wm-text);
    background: var(--wm-bg);
    -webkit-font-smoothing: antialiased;
}

h1:focus,
h2:focus {
    outline: none;
}

code {
    color: #c02d76;
}

/* ---------- Blazor 启动/异常提示（框架自带，保留） ---------- */

#blazor-error-ui {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.blazor-error-boundary {
    background: #b32121;
    padding: 1rem 1rem 1rem 1.25rem;
    color: white;
    border-radius: 6px;
}

    .blazor-error-boundary::after {
        content: "页面渲染出现异常，请刷新后重试。";
    }

.loading-progress {
    position: absolute;
    display: block;
    width: 8rem;
    height: 8rem;
    inset: 20vh 0 auto 0;
    margin: 0 auto 0 auto;
}

    .loading-progress circle {
        fill: none;
        stroke: #e6e8eb;
        stroke-width: 0.6rem;
        transform-origin: 50% 50%;
        transform: rotate(-90deg);
    }

        .loading-progress circle:last-child {
            stroke: var(--wm-primary);
            stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
            transition: stroke-dasharray 0.05s ease-in-out;
        }

.loading-progress-text {
    position: absolute;
    text-align: center;
    font-weight: 600;
    color: var(--wm-text-secondary);
    inset: calc(20vh + 3.25rem) 0 auto 0.2rem;
}

    .loading-progress-text:after {
        content: var(--blazor-load-percentage-text, "加载中");
    }

/* ---------- 主框架：Sider + Header + Content ---------- */

.wm-layout {
    min-height: 100vh;
}

.wm-sider.ant-layout-sider {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    height: 100vh;
    overflow-y: auto;
    background: #fff;
    border-right: 1px solid var(--wm-border);
    z-index: 20;
}

.wm-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    height: var(--wm-header-height);
    padding: 0 20px;
    border-bottom: 1px solid var(--wm-border);
    overflow: hidden;
    white-space: nowrap;
}

.wm-brand-icon {
    font-size: 22px;
    color: var(--wm-primary);
}

.wm-brand-text {
    display: flex;
    flex-direction: column;
    line-height: 1.15;
}

.wm-brand-title {
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 1px;
}

.wm-brand-sub {
    font-size: 12px;
    color: var(--wm-text-tertiary);
    letter-spacing: 2px;
}

.wm-menu.ant-menu {
    border-inline-end: none !important;
    padding: 8px 0;
}

.wm-body {
    margin-left: var(--wm-sider-width);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.wm-header.ant-layout-header {
    position: sticky;
    top: 0;
    z-index: 10;
    height: var(--wm-header-height);
    line-height: var(--wm-header-height);
    padding: 0 24px;
    background: #fff;
    border-bottom: 1px solid var(--wm-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.wm-header-title {
    font-size: 16px;
    font-weight: 600;
}

.wm-header-right {
    display: flex;
    align-items: center;
    gap: 12px;
}

.wm-header-divider {
    width: 1px;
    height: 16px;
    background: #e5e6eb;
}

.wm-user {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--wm-text-secondary);
}

.wm-user-name {
    font-weight: 500;
    color: var(--wm-text);
}

.wm-content.ant-layout-content {
    flex: 1;
    padding: 24px;
    background: var(--wm-bg);
}

.wm-content-plain {
    min-height: 100vh;
    background: var(--wm-bg);
}

/* ---------- 页面通用：标题区 / 工具条 / 卡片 ---------- */

/* 页头（.wm-page-head）、工具条（.wm-toolbar）、分页区（.wm-table-foot）、
   卡头（.wm-card-head）等「界面规范公共段」已统一到下方 WM-COMMON 区间，
   本段只保留 Admin 端私有的卡片视觉与表格细节。 */

.wm-card.ant-card {
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .03);
}

/* 表格内细节：邀请码 / 编码等用等宽字体，操作列按钮紧凑 */
.wm-mono {
    font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
    font-size: 13px;
    letter-spacing: .4px;
}

.wm-op-cell .ant-btn {
    padding-left: 0;
    padding-right: 8px;
}

.wm-op-cell .ant-btn + .ant-btn {
    padding-left: 8px;
    border-left: 0;
}

/* 概览统计卡 */
.wm-stat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

@media (max-width: 1200px) {
    .wm-stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .wm-stat-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

.wm-stat {
    display: flex;
    align-items: center;
    gap: 16px;
}

.wm-stat-icon {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
}

.wm-stat-blue {
    color: #1677ff;
    background: #e6f4ff;
}

.wm-stat-cyan {
    color: #13c2c2;
    background: #e6fffb;
}

.wm-stat-purple {
    color: #722ed1;
    background: #f9f0ff;
}

.wm-stat-orange {
    color: #fa8c16;
    background: #fff7e6;
}

.wm-stat .ant-statistic-title {
    font-size: 13px;
    color: var(--wm-text-tertiary);
    margin-bottom: 2px;
}

.wm-stat .ant-statistic-content {
    font-size: 26px;
    font-weight: 600;
    line-height: 1.2;
}

/* ---------- 登录页 ---------- */

.wm-login-wrap {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: linear-gradient(135deg, #e8f1ff 0%, #f5f7fa 45%, #eef3ff 100%);
}

.wm-login-card {
    width: 100%;
    max-width: 420px;
    padding: 40px 36px 32px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(16, 43, 84, .10);
}

.wm-login-head {
    text-align: center;
    margin-bottom: 28px;
}

.wm-login-logo {
    width: 56px;
    height: 56px;
    margin: 0 auto 14px;
    border-radius: 14px;
    background: linear-gradient(135deg, #1677ff, #4096ff);
    color: #fff;
    font-size: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 16px rgba(22, 119, 255, .28);
}

.wm-login-head h1 {
    margin: 0;
    font-size: 20px;
    font-weight: 600;
}

.wm-login-head p {
    margin: 8px 0 0;
    font-size: 13px;
    color: var(--wm-text-tertiary);
}

.wm-login-hint {
    margin-top: 20px;
    text-align: center;
    font-size: 12px;
    color: var(--wm-text-tertiary);
}

/* ---------- 对话框内表单 ---------- */

.wm-form-tip {
    margin-bottom: 16px;
}

.wm-check-tip {
    margin-top: 12px;
    padding: 10px 12px;
    border-radius: 6px;
    background: #fff7e6;
    border: 1px solid #ffe7ba;
    font-size: 13px;
    color: #ad6800;
}

.wm-empty-title {
    margin: 8px 0 6px;
    font-size: 15px;
    font-weight: 600;
    color: var(--wm-text);
}

/* ---------- 轻量标签（对齐 Ant Design Tag 视觉规范） ---------- */

.wm-tag {
    display: inline-block;
    height: 22px;
    padding: 0 7px;
    font-size: 12px;
    line-height: 20px;
    border-radius: 4px;
    border: 1px solid transparent;
    white-space: nowrap;
}

.wm-tag-green {
    color: #389e0d;
    background: #f6ffed;
    border-color: #b7eb8f;
}

.wm-tag-blue {
    color: #0958d9;
    background: #e6f4ff;
    border-color: #91caff;
}

.wm-tag-gray {
    color: var(--wm-text-secondary);
    background: #fafafa;
    border-color: #d9d9d9;
}

/* ---------- 表单字段（弹窗内竖排字段，Ant 视觉规范） ---------- */

.wm-field {
    margin-bottom: 16px;
}

.wm-field-label {
    display: block;
    margin-bottom: 6px;
    font-size: 14px;
    line-height: 22px;
    color: var(--wm-text);
}

/* ===== WM-COMMON:BEGIN 改这里必须同步另一端（scripts/check-wm-css.ps1 -Sync） ===== */

/* --- 页头：标题 + 副标题 + 操作区 --- */
.wm-page-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:16px; }
.wm-page-head-main { min-width:0; }                              /* 长标题可换行，不挤压按钮 */
.wm-page-head h2 { margin:0; font-size:20px; font-weight:600; line-height:28px; }
.wm-page-head p  { margin:4px 0 0; font-size:13px; line-height:20px; color:var(--wm-text-tertiary); }

.wm-page-actions { display:flex; align-items:center; justify-content:flex-end; gap:8px;
                   flex:0 0 auto; white-space:nowrap; }
.wm-page-actions .ant-btn { margin-inline-start:0; }              /* 间距统一交给 gap，覆盖 Ant 的默认左边距 */
@media (max-width:768px) {
  .wm-page-head { flex-direction:column; align-items:stretch; gap:12px; }
  .wm-page-actions { justify-content:flex-start; flex-wrap:wrap; white-space:normal; }
}

/* --- 卡头 --- */
.wm-card-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:8px; min-height:24px; }
.wm-card-head h3 { margin:0; font-size:15px; font-weight:600; line-height:24px; color:var(--wm-text); }
.wm-card-head-extra { display:flex; align-items:center; gap:8px; font-size:12px; color:var(--wm-text-tertiary); white-space:nowrap; }
.wm-card-head-pad { padding:16px 20px 8px; }                      /* 列表卡 BodyStyle=padding:0 时用 */

/* --- 工具条（列表页唯一形态：高 56px = 12+32+12；列表筛选条已统一用 .wm-toolbar） --- */
.wm-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; padding:12px 20px; min-height:56px; border-bottom:1px solid var(--wm-border); }
.wm-toolbar-spacer { flex:1 1 auto; }

/* --- 分页区 --- */
.wm-table-foot { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 20px; border-top:1px solid var(--wm-border); }
.wm-total { font-size:13px; color:var(--wm-text-tertiary); }

/* --- 信息图标（WmInfoTip 组件宿主） --- */
/* 靶区：图标本体只有 12×12，鼠标偏几像素就移出、配合「移开即收」会让长文案读不完。
   padding 把可悬停区扩到 20×20，负 margin 抵消外扩，视觉位置与左侧 4px 间距保持不变。 */
.wm-infotip { display:inline-flex; align-items:center; margin:-4px -4px -4px 0; color:var(--wm-text-tertiary); cursor:pointer; border:0; background:none; padding:4px; vertical-align:-2px; }
.wm-infotip:hover { color:var(--wm-text-secondary); }
.wm-infotip:focus-visible { outline:2px solid var(--wm-primary); outline-offset:2px; border-radius:2px; }
.wm-infotip-body { max-width:320px; font-size:13px; line-height:20px; white-space:normal; }
.wm-infotip-body ul { margin:0; padding-left:16px; }

/* --- 补全「用了但没定义」的类 --- */
.wm-stat-green { color:#389e0d; background:#f6ffed; }                /* 统计卡色板，两端各 2 处在用 */
.wm-section { margin-top:24px; }                                      /* Admin ClassGroupDialog */
.wm-section-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
.wm-section-head h3 { margin:0; font-size:16px; font-weight:600; color:var(--wm-text); }
.wm-word-table { overflow-x:auto; }                                   /* Admin CollectionDetail:139 */

/* --- 文本语义色：只换颜色，不改字号 / 行高 / 背景，用于行内标红 --- */
.wm-text-danger { color:#f5222d; }
.wm-required { color:#f5222d; margin-left:2px; }                      /* 表单必填星号，两端共用 */
.wm-field-error { color:#f5222d; font-size:12px; margin-top:4px; }    /* 字段校验红字，两端共用 */

/* --- 卡片间距与表单卡内边距 --- */
.wm-card + .wm-card { margin-top:16px; }                              /* 替代散落的 Style="margin-top:16px" */
.wm-card.ant-card > .ant-card-body { padding:20px 20px 4px; }

/* --- 表单卡脚：分组表单的统一操作区 ---
   口径：右对齐、主操作永远在最右、按钮间距 8px、不写 Size（默认 Middle）。
   负边距让底色与分隔线铺满卡体（卡体左右内边距 20、底部 4），圆角与卡片一致。 */
.wm-form-actions { display:flex; align-items:center; justify-content:flex-end; gap:8px;
                   margin:16px -20px -4px; padding:12px 20px;
                   border-top:1px solid var(--wm-border); background:#fafafa;
                   border-radius:0 0 8px 8px; }
.wm-form-actions-hint { margin-right:auto; font-size:12px; color:var(--wm-text-tertiary); }
.wm-form-actions .ant-btn { margin-inline-start:0; }                  /* 间距交给 gap，覆盖 Ant 默认左边距 */
@media (max-width:768px) {
  .wm-form-actions { flex-wrap:wrap; }
  .wm-form-actions-hint { flex:1 1 100%; margin:0 0 4px; }
}
/* ===== WM-COMMON:END ===== */

/* ===== 监管师中心新增样式 ===== */

.wm-class-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:16px; }
.wm-card.wm-class-card > .ant-card-body { padding:18px 20px; }   /* 班级卡自有内边距，保持原值 */
.wm-class-head { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.wm-class-name { font-size:16px; font-weight:600; color:#1f1f1f; }
.wm-class-meta { margin-top:6px; font-size:12px; color:#8c8c8c; display:flex; gap:6px; flex-wrap:wrap; }
.wm-class-stats { display:flex; gap:24px; margin:14px 0 6px; }
.wm-class-stats > div { display:flex; flex-direction:column; }
.wm-kv-value { font-size:18px; font-weight:600; color:#1f1f1f; line-height:1.3; }
.wm-kv-label { font-size:12px; color:#8c8c8c; }
.wm-class-actions { display:flex; gap:8px; margin-top:10px; }

.wm-cell-strong { font-weight:500; color:#1f1f1f; }
.wm-cell-sub { font-size:12px; color:#8c8c8c; }
.wm-muted { color:#8c8c8c; }
.wm-acc-good { color:#52c41a; font-weight:600; }
.wm-acc-mid { color:#fa8c16; font-weight:600; }
.wm-acc-bad { color:#f5222d; font-weight:600; }

.wm-seg { display:inline-flex; border:1px solid #d9d9d9; border-radius:6px; overflow:hidden; }
.wm-seg-btn { border:0; background:#fff; padding:4px 12px; font-size:13px; color:#595959; cursor:pointer; }
.wm-seg-btn + .wm-seg-btn { border-left:1px solid #d9d9d9; }
.wm-seg-btn.active { background:#1677ff; color:#fff; }
.wm-seg-btn:hover:not(.active) { background:#f5f5f5; }

.wm-chart { width:100%; }
.wm-chart-svg { width:100%; height:220px; display:block; }
.wm-chart-axis { font-size:11px; fill:#8c8c8c; }
.wm-chart-empty { font-size:13px; fill:#bfbfbf; }
.wm-chart-foot { font-size:12px; color:#8c8c8c; padding-top:4px; }

.wm-empty-pad { padding:32px 0; }
.wm-matrix-head { display:flex; gap:20px; font-size:13px; color:#595959; margin-bottom:12px; }

.wm-progress { height:6px; background:#f0f0f0; border-radius:3px; overflow:hidden; margin-bottom:4px; }
.wm-progress-bar { height:100%; background:#1677ff; border-radius:3px; }

.wm-stat-body { display:flex; flex-direction:column; }
.wm-stat-title { font-size:13px; color:#8c8c8c; }
.wm-stat-value { font-size:24px; font-weight:600; color:#1f1f1f; line-height:1.2; }
.wm-stat-suffix { font-size:13px; font-weight:400; color:#8c8c8c; margin-left:2px; }

.wm-empty { display:flex; flex-direction:column; align-items:center; gap:8px; padding:36px 0; color:#8c8c8c; }
.wm-empty-icon { font-size:28px; color:#d9d9d9; }
.wm-empty-text { font-size:13px; }

.wm-notfound { display:flex; flex-direction:column; align-items:center; gap:10px; padding:120px 0; }
.wm-notfound-code { font-size:72px; font-weight:700; color:#1677ff; line-height:1; }
.wm-notfound-title { font-size:20px; font-weight:600; color:#1f1f1f; }
.wm-notfound-sub { color:#8c8c8c; margin-bottom:12px; }

/* 监管师概览 6 卡：宽屏单行排列，避免第二行只剩两张的留白 */
.wm-stat-grid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }

.wm-msg-list { display:flex; flex-direction:column; }
.wm-msg { display:flex; gap:12px; padding:16px 20px; border-bottom:1px solid #f5f5f5; cursor:pointer; }
.wm-msg:last-child { border-bottom:0; }
.wm-msg:hover { background:#fafafa; }
.wm-msg-dot { width:8px; height:8px; border-radius:50%; margin-top:8px; background:transparent; flex-shrink:0; }
.wm-msg--unread .wm-msg-dot { background:#1677ff; }
.wm-msg-body { flex:1; min-width:0; }
.wm-msg-title-row { display:flex; align-items:center; gap:8px; }
.wm-msg-title { font-size:14px; font-weight:500; color:#1f1f1f; }
.wm-msg--unread .wm-msg-title { font-weight:600; }
.wm-msg-time { margin-left:auto; font-size:12px; color:#bfbfbf; }
.wm-msg-content { margin-top:6px; font-size:13px; color:#595959; }

.wm-boot {
  display: flex; flex-direction: column; gap: 14px;
  align-items: center; justify-content: center;
  height: 100vh; color: #8c8c8c; font-size: 13px;
}
.wm-boot-text { letter-spacing: .5px; }

.wm-tag-orange { background:#fff7e6; color:#fa8c16; border:1px solid #ffd591; }
.wm-tag-red { background:#fff1f0; color:#f5222d; border:1px solid #ffa39e; }
.wm-qr-preview { width:120px; height:120px; object-fit:contain; border:1px solid #f0f0f0; border-radius:6px; background:#fafafa; }
.wm-chip-list { display:flex; flex-wrap:wrap; gap:6px; }
.wm-chip { display:inline-block; padding:2px 10px; border-radius:12px; background:#f5f5f5; color:#595959; font-size:12px; }
.wm-upload-row { display:flex; gap:12px; align-items:flex-start; }
.wm-upload-actions { flex:1; display:flex; flex-direction:column; gap:6px; }
.wm-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:0 16px; }
.wm-field-hint { margin-top:6px; font-size:12px; color:#8c8c8c; }