/* ═══════════════════════════════════════════════════════════════
   EP Classroom — "📊 Feature usage" tab of the Teachers panel
   (owner only, js/teachers.js). Reuses .tm-table / .tm-badge /
   .tm-intro from teachers.css; only the extras live here.
═══════════════════════════════════════════════════════════════ */
.fu-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; }
.fu-select {
  background: var(--bg-input, #1e2535); color: var(--text, #e6edf3);
  border: 1px solid var(--border-l, #2a3550); border-radius: 8px;
  padding: 7px 10px; font: inherit; font-size: 13px; cursor: pointer;
}
.fu-select:focus { outline: none; border-color: var(--accent, #4f8ef7); }

.fu-summary {
  background: var(--bg-panel2, #1c2333); border: 1px solid var(--border-l, #2a3550);
  border-radius: 10px; padding: 10px 14px; margin: 0 0 12px;
  font-size: 13.5px; color: var(--muted, #7a8aab);
}
.fu-summary b { color: var(--text, #e6edf3); }

.fu-table .fu-num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.fu-table .fu-top { font-size: 12.5px; color: var(--muted, #7a8aab); }
.fu-row { cursor: pointer; }
.fu-row:hover td { background: var(--bg-hover, #232c3f); }
.fu-row.open td { background: var(--bg-active, #2a3550); }
.fu-row.fu-sub td { color: var(--muted, #7a8aab); font-size: 12.5px; }
.fu-row.fu-sub td:first-child { padding-left: 26px; }
.fu-detail td { background: var(--bg-panel2, #1c2333); padding: 10px 12px; }

.fu-h { margin: 18px 0 8px; font-weight: 600; font-size: 14px; color: var(--text, #e6edf3); }
.fu-idle-h { margin: 8px 0 6px; font-size: 12.5px; color: var(--muted, #7a8aab); }

.fu-chip {
  display: inline-block; margin: 0 6px 6px 0; padding: 3px 9px; border-radius: 999px;
  background: rgba(79, 142, 247, .14); border: 1px solid rgba(79, 142, 247, .35);
  color: var(--text, #e6edf3); font-size: 12.5px;
}
.fu-chip b { margin-left: 4px; color: var(--accent, #4f8ef7); }
.fu-chip.stu { background: rgba(63, 185, 80, .12); border-color: rgba(63, 185, 80, .35); }
.fu-chip.stu b { color: #3fb950; }
.tm-badge.fu-stu { background: rgba(63, 185, 80, .15); color: #3fb950; }

/* ── New teacher credentials modal (js/teachers.js) ── */
.tm-creds-overlay { z-index: 9600; }
.tm-creds-modal { width: 460px; }
.tm-creds-lead { color: var(--text, #e6edf3) !important; margin-bottom: 14px; }
.tm-creds-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 12px; color: #c9d1d9; font-size: 13.5px; }
.tm-creds-label { width: 100%; font-size: 12.5px; font-weight: 600; color: #9aa4bd; }
.tm-creds-code { background: #0d1117; border: 1px solid rgba(255,255,255,.12); border-radius: 6px; padding: 6px 10px; font-size: 15px; color: #7dd3fc; letter-spacing: .03em; }
.tm-creds-warn { color: #fde68a !important; font-size: 13px !important; margin-top: 4px; }
.tm-creds-actions { justify-content: flex-end; }
.tm-creds-ok { background: #238636; color: #fff; border: none; border-radius: 8px; padding: 9px 26px; font-weight: 700; font-size: 14px; cursor: pointer; font-family: inherit; }
.tm-creds-ok:hover { background: #2ea043; }