/* 教师端增量样式：公共移动外壳见 static/common/css/mobile.css，
   这里只放教师端独有的（配色、考勤网格、补录弹层、名单行、解锁码）。 */

:root {
    /* 与管理端/家长端区分：教师端主色取绿 */
    --p-primary: #1a8a5f;
    --p-primary-light: rgba(26, 138, 95, .1);
}

/* ---------- 班级切换胶囊（复用家长端 .p-child-pill 外观，多班时可横向滚） ---------- */
.t-classbar { display: flex; gap: 8px; overflow-x: auto; margin-bottom: 12px; padding-bottom: 2px; }

/* ---------- 点名概览 ---------- */
.t-roll-name { flex: 1; font-size: 14px; }
.t-row { display: flex; align-items: center; padding: 10px 2px; border-bottom: 1px solid var(--p-border); }
.t-row:last-child { border-bottom: none; }
.t-row-ico {
    flex: 0 0 auto; width: 22px; height: 22px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 12px; color: #fff; margin-right: 9px;
}
.t-row-ico.normal { background: var(--p-success); }
.t-row-ico.late { background: var(--p-warning); }
.t-row-ico.absent { background: var(--p-danger); }
.t-row-slot { font-size: 12px; color: var(--p-text-sub); }

/* ---------- 考勤矩阵：一行一个学生，一格一个时段（当日最坏状态） ---------- */
.t-matrix { overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 4px; }
.t-mrow { display: flex; align-items: center; gap: 3px; margin-bottom: 3px; }
.t-mname {
    flex: 0 0 68px; position: sticky; left: 0; background: var(--p-card);
    font-size: 13px; z-index: 2; padding-right: 4px; white-space: nowrap;
    overflow: hidden; text-overflow: ellipsis;
}
.t-mdot { flex: 0 0 18px; height: 18px; border-radius: 4px; background: #eef1f7; }
.t-mdot.normal { background: var(--p-success); }
.t-mdot.late { background: var(--p-warning); }
.t-mdot.absent { background: rgba(255, 77, 79, .55); }
.t-mlabel { flex: 0 0 18px; height: 16px; font-size: 10px; line-height: 16px; text-align: center; color: var(--p-text-sub); }
.t-mhead { border-bottom: 1px solid var(--p-border); padding-bottom: 4px; margin-bottom: 6px; }
.t-legend { display: flex; gap: 12px; font-size: 12px; color: var(--p-text-sub); margin-top: 8px; }
.t-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 4px; vertical-align: -1px; }

/* ---------- 学生名单 ---------- */
.t-student { display: flex; align-items: center; padding: 10px 2px; border-bottom: 1px solid var(--p-border); }
.t-student:last-child { border-bottom: none; }
.t-avatar {
    flex: 0 0 40px; width: 40px; height: 40px; border-radius: 50%; object-fit: cover;
    background: var(--p-primary-light); color: var(--p-primary);
    display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 700;
    margin-right: 10px; overflow: hidden;
}
.t-avatar img { width: 100%; height: 100%; object-fit: cover; }
.t-student-main { flex: 1; min-width: 0; }
.t-student-name { font-weight: 600; }
.t-student-meta { font-size: 12px; color: var(--p-text-sub); margin-top: 2px; }

/* ---------- 底部弹层（补录 / 发通知 / 传轮播） ---------- */
.t-mask {
    position: fixed; left: 0; right: 0; top: 0; bottom: 0;
    background: rgba(20, 26, 40, .45); z-index: 90;
}
.t-sheet {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 91;
    background: #fff; border-radius: 16px 16px 0 0;
    padding: 16px 14px calc(16px + env(safe-area-inset-bottom, 0));
    max-height: 82vh; overflow-y: auto; -webkit-overflow-scrolling: touch;
}
.t-sheet-title { margin: 0 0 12px; font-size: 16px; font-weight: 700; text-align: center; }
.t-sheet-actions { display: flex; gap: 10px; margin-top: 6px; }
.t-sheet-actions .p-btn { flex: 1; }

/* ---------- 内容管理（通知 / 紧急通知 / 轮播） ---------- */
.t-item { padding: 11px 0; border-bottom: 1px solid var(--p-border); }
.t-item:last-child { border-bottom: none; }
.t-item-head { display: flex; align-items: center; gap: 6px; }
.t-item-title { flex: 1; font-weight: 600; font-size: 14px; }
.t-item-body { font-size: 13px; line-height: 1.6; margin-top: 5px; white-space: pre-wrap; word-break: break-all; }
.t-item-foot { display: flex; align-items: center; font-size: 12px; color: var(--p-text-sub); margin-top: 6px; }
.t-item-foot .ops { margin-left: auto; display: flex; gap: 8px; }
.t-item-foot .ops a { color: var(--p-primary); cursor: pointer; }
.t-fab {
    position: fixed; right: 16px; bottom: 76px; z-index: 60;
    width: 48px; height: 48px; border-radius: 50%; border: none;
    background: var(--p-primary); color: #fff; font-size: 24px; line-height: 1;
    box-shadow: 0 4px 14px rgba(26, 138, 95, .35); cursor: pointer;
}
.t-thumb { width: 100%; height: 120px; object-fit: cover; border-radius: 10px; background: #eef1f7; }
.t-preview { max-height: 120px; max-width: 100%; border-radius: 10px; margin-top: 8px; }

/* ---------- 班牌解锁码 ---------- */
.t-code {
    text-align: center; font-size: 40px; font-weight: 700; letter-spacing: 6px;
    color: var(--p-primary); margin: 10px 0 4px; font-variant-numeric: tabular-nums;
}
.t-code-meta { text-align: center; font-size: 12px; color: var(--p-text-sub); word-break: break-all; }
#qr-reader { width: 100%; max-width: 320px; margin: 0 auto; }
#qr-reader video { border-radius: 10px; }

/* ---------- 首页宫格补充一行 5 列时的紧凑排版 ---------- */
.t-grid-5 { display: flex; gap: 8px; }
.t-grid-5 .p-home-entry { padding: 12px 2px 10px; font-size: 12px; }