/* ═══ HỒ SƠ GIÁO VIÊN GỬI — phía trường (migration_141, 21/10/2026) ════════════════════════════════════════════════════════
   Hàng chờ kiểu List/Detail: danh sách trái (cuộn 350px), chi tiết phải; màn hẹp xếp chồng. Dùng lại .gh-cuon, .gh-phu,
   .gh-thong-bao, .gh-hang-nut, .gh-thaotac của guihoso.css và .pq-tabs, .og-modal, .badge, .qm của quanly.html. */
#view-hosonhan .hn-bar { display:flex; flex-wrap:wrap; gap:var(--k3); align-items:flex-end; margin:0 0 var(--k4); }
#view-hosonhan .hn-o { flex:0 1 200px; min-width:0; }
#view-hosonhan .hn-o-rong { flex:1 1 260px; }
#view-hosonhan .hn-o > label { display:block; font-size:var(--t-nho); color:var(--n-600); margin-bottom:var(--k1); }
#view-hosonhan .hn-o input, #view-hosonhan .hn-o select { margin:0; }
#view-hosonhan .gh-thong-bao[hidden], #hn-hai-cot[hidden], #hn-ct-noi[hidden], #hn-ct-khung[hidden], #hn-ct-loi-nhan[hidden],
#hn-gv-bang[hidden], #view-hosonhan button[hidden] { display:none; }

.hn-hai-cot { display:grid; grid-template-columns:minmax(0, 2fr) minmax(0, 3fr); gap:var(--k4); align-items:start; }
.hn-ds { max-height:350px; overflow-y:auto; overflow-x:hidden; border:1px solid var(--n-200); border-radius:var(--r-vua); background:var(--trang); }
.hn-muc { display:block; padding:var(--k2) var(--k3); border-bottom:1px solid var(--n-100); cursor:pointer; outline-offset:-2px; }
.hn-muc:last-child { border-bottom:0; }
.hn-muc:hover { background:var(--n-50); }
.hn-muc.chon { background:var(--muc-50); box-shadow:inset 3px 0 0 var(--muc-600); }
.hn-muc b { display:block; font-size:var(--t-nho); overflow-wrap:anywhere; }
.hn-muc small { display:block; color:var(--n-500); font-size:var(--t-sm); margin:2px 0 4px; overflow-wrap:anywhere; }
.hn-muc .badge { margin-left:0; font-size:var(--t-xs); }
.hn-ct { min-width:0; border:1px solid var(--n-200); border-radius:var(--r-vua); padding:var(--k3) var(--k4); background:var(--trang); }
.hn-ct h3 { margin:0; font-size:var(--t-lon); overflow-wrap:anywhere; }
.hn-ct-tt { display:flex; flex-wrap:wrap; align-items:center; gap:var(--k2); margin:var(--k2) 0; }
.hn-ct-tt .badge { margin-left:0; }
.hn-ct-tt .gh-phu { margin:0; }
.hn-loi-nhan { margin:var(--k2) 0; padding:var(--k2) var(--k3); background:var(--muc-50); border-radius:var(--r-vua); font-size:var(--t-nho); overflow-wrap:anywhere; }
#hn-ct-bang { border-collapse:collapse; font-size:var(--t-nho); min-width:100%; }
#hn-ct-bang th, #hn-ct-bang td { padding:6px 8px; border-bottom:1px solid var(--n-100); text-align:left; vertical-align:top; white-space:nowrap; }
#hn-ct-bang th { position:sticky; top:0; z-index:1; background:var(--trang); font-size:var(--t-sm); color:var(--n-600); border-bottom:1px solid var(--n-300); }
#hn-ct-bang td.so { text-align:center; font-variant-numeric:tabular-nums; }
#view-hosonhan .gh-hang-nut button, #hn-gv-bang .gh-thaotac button, #hn-modal-tra .og-hang-nut button {
  margin:0; padding:6px 12px; font-size:var(--t-sm); white-space:nowrap; }
#hn-modal-tra .og-hang-nut { display:flex; flex-wrap:wrap; gap:var(--k2); }
#hn-modal-tra .gh-o > label { display:block; font-size:var(--t-nho); color:var(--n-600); margin-bottom:var(--k1); }
#hn-modal-tra textarea { min-height:96px; margin:0; }

/* Lịch sử kết nối dài thêm mỗi lần gỡ / nối lại → cuộn dọc, không cuộn ngang (bảng có nút). */
.hn-gv-khung { max-height:350px; overflow-y:auto; overflow-x:hidden; }
#hn-gv-bang { width:100%; table-layout:fixed; border-collapse:collapse; font-size:var(--t-nho); }
#hn-gv-bang th { position:sticky; top:0; z-index:1; background:var(--trang); text-align:left; padding:var(--k2) 6px; font-size:var(--t-sm); color:var(--n-600); border-bottom:1px solid var(--n-300); }
#hn-gv-bang td { padding:var(--k2) 6px; border-bottom:1px solid var(--n-100); vertical-align:top; overflow-wrap:anywhere; }
#hn-gv-bang td small { display:block; color:var(--n-500); font-size:var(--t-sm); }
#hn-gv-bang .badge, #view-hosonhan .badge.ngung { margin-left:0; }
#view-hosonhan .badge.ngung { background:var(--n-100); color:var(--n-600); border-color:var(--n-200); }

@media (max-width:900px) {
  .hn-hai-cot { grid-template-columns:minmax(0, 1fr); }
  .hn-ds { max-height:300px; }
}
@media (max-width:640px) {
  #hn-gv-bang colgroup, #hn-gv-bang thead { display:none; }
  #hn-gv-bang, #hn-gv-bang tbody, #hn-gv-bang tr, #hn-gv-bang td { display:block; width:auto; }
  #hn-gv-bang tr { border:1px solid var(--n-200); border-radius:var(--r-vua); margin:0 0 var(--k2); padding:var(--k1) var(--k2); background:var(--trang); }
  #hn-gv-bang tr[hidden] { display:none; }
  #hn-gv-bang td { border:0; padding:4px 0; }
  #hn-gv-bang td[data-nhan]::before { content:attr(data-nhan); display:block; font-size:var(--t-xs); color:var(--n-500); }
  #hn-gv-bang .gh-thaotac { justify-content:flex-start; }
}
#hn-gv-bang .gh-thaotac { display:flex; flex-wrap:wrap; gap:var(--k1); justify-content:flex-end; }
#hn-modal-tra .gh-o { margin-bottom:var(--k3); }