/* Văn bản – Biểu mẫu — khối hcmunre/van-ban + tệp đính kèm trang chi tiết. Màu theo theme.json hcmunre (docs/brand.md);
   mobile-first: < 760px bảng kết quả → mỗi văn bản một thẻ (cùng cách làm Danh bạ). */
.hcm-vb, .hcm-vb__xem, .hcm-vb__tep-chi-tiet {
	--hcm-vb-chinh: var(--wp--preset--color--primary, #007A29);
	--hcm-vb-dam: var(--wp--preset--color--primary-dark, #004D1A);
	--hcm-vb-nhan: var(--wp--preset--color--accent-dark, #734D26);
	--hcm-vb-phu: var(--wp--preset--color--muted, #4F5E55);
	--hcm-vb-ke: var(--wp--preset--color--border, #D5DDD8);
	--hcm-vb-nen: var(--wp--preset--color--green-soft, #E8F5EC);
}
.hcm-vb { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.75rem; min-width: 0; }
.hcm-vb[aria-busy="true"] .hcm-vb__ket-qua { opacity: 0.6; }
.hcm-vb__loc { display: grid; gap: 0.75rem; grid-template-columns: minmax(0, 1fr); margin: 0; }
.hcm-vb__o { margin: 0; display: grid; gap: 0.25rem; min-width: 0; }
.hcm-vb__o label { font-weight: 600; }
.hcm-vb__o input,
.hcm-vb__o select {
	box-sizing: border-box;
	width: 100%;
	min-width: 0;
	min-height: 48px;
	padding: 0.5rem 0.75rem;
	border: 1px solid var(--hcm-vb-phu);
	border-radius: 6px;
	font: inherit;
	background: #fff;
	color: inherit;
	text-overflow: ellipsis;
}
.hcm-vb__xoa,
.hcm-vb__so-trang,
.hcm-vb__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0.5rem 1rem;
	border: 2px solid var(--hcm-vb-chinh);
	border-radius: 6px;
	background: #fff;
	color: var(--hcm-vb-chinh);
	font: inherit;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
}
.hcm-vb__xoa:hover, .hcm-vb__so-trang:hover, .hcm-vb__btn:hover { background: var(--hcm-vb-nen); color: var(--hcm-vb-dam); }
.hcm-vb__btn--chinh, .hcm-vb__so-trang[aria-current="page"] { background: var(--hcm-vb-chinh); color: #fff; }
.hcm-vb__btn--chinh:hover { background: var(--hcm-vb-dam); color: #fff; }
.hcm-vb__dem { margin: 0; color: var(--hcm-vb-phu); }
.hcm-vb__trong { margin: 0; padding: 1rem; border-left: 4px solid var(--wp--preset--color--accent, #996633); background: var(--wp--preset--color--cream-soft, #FFFFE6); }
.hcm-vb__bang { width: 100%; border-collapse: collapse; font-size: 0.9375rem; }
.hcm-vb__bang th, .hcm-vb__bang td { padding: 0.5rem 0.625rem; border-bottom: 1px solid var(--hcm-vb-ke); text-align: left; vertical-align: top; }
.hcm-vb__bang thead th { background: var(--hcm-vb-nen); color: var(--hcm-vb-dam); }
.hcm-vb__ten a { color: var(--hcm-vb-dam); font-weight: 600; overflow-wrap: anywhere; }
.hcm-vb__phu { display: block; margin-top: 0.125rem; color: var(--hcm-vb-phu); font-size: 0.875rem; }
.hcm-vb__so, .hcm-vb__ngay { white-space: nowrap; font-variant-numeric: tabular-nums; }
.hcm-vb__hl { display: inline-block; padding: 0.125rem 0.5rem; border-radius: 999px; font-size: 0.8125rem; font-weight: 600; white-space: nowrap; }
.hcm-vb__hl--con { background: var(--hcm-vb-nen); color: var(--hcm-vb-dam); }
.hcm-vb__hl--het { background: #EEF0EF; color: #3D4842; }
.hcm-vb__hl--sua-doi { background: var(--wp--preset--color--cream, #FFFFCC); color: var(--hcm-vb-nhan); }
.hcm-vb__tep-ds { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.25rem; }
.hcm-vb__tep { display: inline-flex; align-items: center; gap: 0.25rem; min-height: 44px; color: var(--hcm-vb-chinh); font-weight: 600; white-space: nowrap; }
.hcm-vb__duoi { display: inline-block; min-width: 2.5rem; padding: 0 0.25rem; border-radius: 4px; background: var(--hcm-vb-nen); color: var(--hcm-vb-dam); font-size: 0.75rem; font-weight: 700; text-align: center; }
.hcm-vb__co { color: var(--hcm-vb-phu); font-weight: 400; font-size: 0.875rem; }
.hcm-vb__trang { display: flex; flex-wrap: wrap; gap: 0.375rem; margin-top: 0.75rem; }

/* Điện thoại: mỗi văn bản một thẻ. */
@media (max-width: 759px) {
	.hcm-vb__bang thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.hcm-vb__bang, .hcm-vb__bang tbody, .hcm-vb__bang tr, .hcm-vb__bang td { display: block; }
	.hcm-vb__bang tr { margin-bottom: 0.75rem; padding: 0.625rem 0.75rem; border: 1px solid var(--hcm-vb-ke); border-radius: 8px; background: #fff; }
	.hcm-vb__bang td { display: grid; grid-template-columns: 6rem minmax(0, 1fr); gap: 0.5rem; padding: 0.25rem 0; border: 0; }
	.hcm-vb__bang td::before { content: attr(data-nhan); color: var(--hcm-vb-phu); font-size: 0.875rem; }
	.hcm-vb__bang td.hcm-vb__ten, .hcm-vb__bang td.hcm-vb__tep-o { display: block; }
	.hcm-vb__bang td.hcm-vb__ten { order: -1; font-size: 1.0625rem; }
	.hcm-vb__bang td:empty { display: none; }
	.hcm-vb__bang tr { display: flex; flex-direction: column; }
}
/* Máy tính/máy tính bảng: ô tìm một hàng; các ô lọc xếp hàng, tự xuống dòng khi không đủ chỗ (không cắt chữ). Ô Nhóm đủ rộng cho
   "Tất cả nhóm" / "Quy trình – Biểu mẫu" / nhóm con "— Tổ chức và Hành chính" (03/10/2026 — trước đây lưới auto-fit ép cột đầu còn "Tấ…"). */
@media (min-width: 760px) {
	.hcm-vb__loc { display: flex; flex-wrap: wrap; align-items: flex-end; }
	.hcm-vb__loc > .hcm-vb__o { flex: 1 1 10rem; }
	.hcm-vb__loc > .hcm-vb__o--tim { flex-basis: 100%; }
	.hcm-vb__loc > .hcm-vb__o--nhom { flex: 1 1 16rem; min-width: min(16rem, 100%); }
	.hcm-vb__loc > .hcm-vb__o--hl { flex: 1 1 11rem; min-width: min(11rem, 100%); }
	.hcm-vb__loc > .hcm-vb__o--nut { flex: 0 0 auto; }
}
/* ≥ 1200px: 4 ô lọc + "Xóa lọc" trên CÙNG một hàng trong khung 760px — thu hẹp Năm, Hiệu lực và lề trong ô (03/10/2026). */
@media (min-width: 1200px) {
	.hcm-vb__loc { gap: 0.625rem; }
	.hcm-vb__loc > .hcm-vb__o--tim { flex-basis: 100%; }
	.hcm-vb__loc > .hcm-vb__o--nhom { flex: 0 0 14.5rem; min-width: 0; }
	.hcm-vb__loc > .hcm-vb__o--loai { flex: 1 1 7rem; }
	.hcm-vb__loc > .hcm-vb__o--nam { flex: 0 0 6.25rem; }
	.hcm-vb__loc > .hcm-vb__o--hl { flex: 0 0 10rem; min-width: 0; }
	.hcm-vb__loc select { padding-inline: 0.5rem 0.25rem; font-size: 0.9375rem; }
	.hcm-vb__loc .hcm-vb__xoa { padding-inline: 0.75rem; white-space: nowrap; }
}
/* Khách: gợi ý cán bộ đăng nhập để thấy nhóm nội bộ. */
.hcm-vb__goi-y { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; margin: 0; padding: 0.5rem 0.75rem; border-left: 4px solid var(--hcm-vb-chinh); background: var(--hcm-vb-nen); color: var(--hcm-vb-dam); font-size: 0.875rem; }
.hcm-vb__goi-y .hcm-vb__btn { min-height: 40px; padding: 0.25rem 0.875rem; font-size: 0.875rem; }
/* Trang chi tiết: danh sách tệp + khung xem PDF. */
.hcm-vb__h { margin-top: 1.5rem; }
.hcm-vb__tep-chi-tiet { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: 0.5rem; }
.hcm-vb__tep-chi-tiet li { display: grid; gap: 0.5rem; padding: 0.625rem 0.75rem; border: 1px solid var(--hcm-vb-ke); border-radius: 8px; }
.hcm-vb__ten-tep { overflow-wrap: anywhere; }
.hcm-vb__nut-tep { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.hcm-vb__nut-tep .hcm-vb__btn { flex: 1 1 8rem; }
@media (min-width: 600px) {
	.hcm-vb__tep-chi-tiet li { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
	.hcm-vb__nut-tep .hcm-vb__btn { flex: 0 0 auto; }
}
.hcm-vb__xem {
	height: min(900px, 78vh);
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid var(--hcm-vb-ke);
	border-radius: 6px;
	background: #f3f5f4;
	overscroll-behavior: contain;
}
.hcm-vb__trang-pdf { margin: 0 auto 0.5rem; background: #fff; }
.hcm-vb__trang-pdf canvas { display: block; max-width: 100%; height: auto; }
.hcm-vb__du-phong { margin: 0; padding: 1rem; }
.hcm-vb__trang-thai { margin: 0.25rem 0 0; color: var(--hcm-vb-phu); font-size: 0.875rem; }