/* =============================================================================
   PHẢ HỆ — danh sách thành viên theo đời
   ============================================================================ */

.gp-thanh-tim {
	display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
	margin-bottom: 10px;
}
.gp-o-tim {
	display: flex; align-items: center; gap: 7px;
	background: var(--gp-trang); border: 1px solid var(--gp-vien);
	border-radius: 18px; padding: 5px 14px;
}
.gp-o-tim input { border: 0; outline: 0; width: 200px; background: none; color: var(--gp-muc); }

.gp-bang-quyen {
	background: #fff8e5; border: 1px solid #e8c98a; border-left: 4px solid var(--gp-canh-bao);
	border-radius: 8px; padding: 9px 14px; font-size: 12.5px; color: #8a5a00; margin-bottom: 10px;
}
.gp-bang-quyen a { color: var(--gp-son); font-weight: 600; }

.gp-thanh-loc {
	display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
	background: var(--gp-trang); border: 1px solid var(--gp-vien); border-radius: 8px;
	padding: 9px 14px; font-size: 12.5px; color: var(--gp-muc-nhat); margin-bottom: 10px;
}
.gp-chip {
	background: #f6efd9; border: 1px solid var(--gp-vien); color: var(--gp-muc);
	border-radius: 14px; padding: 4px 12px; cursor: pointer; font-size: 12.5px;
}
.gp-chip:hover { background: #f0e5c4; }
.gp-chip.gp-dang-chon { background: var(--gp-son); border-color: var(--gp-son-dam); color: #fff3dc; }
.gp-chip b { font-weight: 700; }

/* ---------- Bố cục ---------- */

.gp-phahe-boc {
	display: grid; grid-template-columns: 116px 1fr;
	border: 1px solid var(--gp-vien); border-radius: 10px; overflow: hidden;
	background: var(--gp-trang);
}

.gp-cot-doi { background: var(--gp-giay-dam); border-right: 1px solid #d5c9a2; padding: 12px 8px; }
.gp-moc {
	width: 100%; text-align: center; background: var(--gp-trang);
	border: 1px solid var(--gp-vien); border-radius: var(--gp-r);
	padding: 8px 6px; margin-bottom: 7px; cursor: pointer; display: block;
}
.gp-moc:hover { background: #fff6e2; }
.gp-moc.gp-dang-chon { background: var(--gp-son); border-color: var(--gp-son-dam); color: #fff6e0; }
.gp-moc .gp-nhan {
	display: block; font-size: 9.5px; letter-spacing: .6px;
	text-transform: uppercase; color: var(--gp-muc-nhat);
}
.gp-moc.gp-dang-chon .gp-nhan { color: #f4d9a8; }
.gp-moc .gp-so { display: block; font-family: Georgia, serif; font-size: 21px; font-weight: 700; line-height: 1.1; }
.gp-moc .gp-gioi { display: block; font-size: 10.5px; color: var(--gp-muc-nhat); font-variant-numeric: tabular-nums; }
.gp-moc.gp-dang-chon .gp-gioi { color: #f4d9a8; }

.gp-vung-ds { min-width: 0; }

/* ---------- Dải tổng ---------- */

.gp-dai-tong {
	display: flex; align-items: center; gap: 34px;
	background: #f7ecd0; border-bottom: 1px solid var(--gp-vien); padding: 12px 20px;
}
.gp-o-tong { text-align: center; }
.gp-o-tong b { display: block; font-size: 19px; font-family: Georgia, serif; }
.gp-o-tong span { font-size: 11.5px; color: var(--gp-muc-nhat); }
.gp-o-tong--nam b { color: #1d5fa8; }
.gp-o-tong--nu b { color: #b03a6a; }
.gp-dai-tong .gp-nut { margin-left: auto; }

/* ---------- Danh sách ---------- */

.gp-nhom-dau {
	padding: 9px 20px 5px; font-size: 12.5px; color: var(--gp-muc-nhat);
	background: var(--gp-trang); border-bottom: 1px solid #f0e8cf;
}
.gp-nhom-dau b { color: var(--gp-muc); }

.gp-dong {
	display: grid;
	grid-template-columns: 46px minmax(180px, 1.4fr) 110px 110px 110px 40px;
	align-items: center; gap: 12px;
	padding: 9px 20px; cursor: pointer;
	border-bottom: 1px solid rgba(255, 255, 255, .18);
}
.gp-ds--admin .gp-dong { grid-template-columns: 46px minmax(170px, 1.3fr) 104px 96px 96px 78px 40px; }

.gp-dong--chinh { background: var(--gp-son); color: #fff3dc; }
.gp-dong--chinh:hover { background: #a01212; }
.gp-dong--phu { background: var(--gp-trang); color: var(--gp-muc); border-bottom: 1px solid #f0e8cf; }
.gp-dong--phu:hover { background: #fdf6e2; }

.gp-dong .gp-anh {
	width: 40px; height: 40px; border-radius: 6px; background: #f0cba4;
	display: flex; align-items: center; justify-content: center;
	font-size: 17px; color: var(--gp-the-vien); position: relative; overflow: hidden;
}
.gp-dong .gp-anh img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gp-dong--phu .gp-anh { background: #ece7d8; color: #8b7d63; }

.gp-the-vai {
	position: absolute; left: 0; right: 0; bottom: 0;
	background: var(--gp-the); color: #5b1a0f; font-size: 8px; font-weight: 700;
	text-align: center; letter-spacing: .3px;
}

.gp-ten-dong { font-weight: 700; letter-spacing: .2px; text-transform: uppercase; font-size: 13.5px; }
.gp-phu-dong { font-size: 11.5px; opacity: .85; }
.gp-cham {
	display: inline-block; width: 7px; height: 7px; border-radius: 50%;
	background: #4ad07a; margin-right: 5px; vertical-align: middle;
}
.gp-cham--mat { background: #b9b9b9; }

.gp-so-cot { font-size: 13px; text-align: center; font-variant-numeric: tabular-nums; }

.gp-mo-ra {
	width: 26px; height: 26px; border-radius: 50%; border: 1px solid currentColor;
	background: none; color: inherit; cursor: pointer;
	display: flex; align-items: center; justify-content: center; font-size: 11px; opacity: .8;
}
.gp-thao-tac { display: flex; gap: 5px; justify-content: flex-end; }
.gp-dong .gp-nut-nho {
	width: 27px; height: 27px; border: 1px solid currentColor;
	background: rgba(255, 255, 255, .12); color: inherit;
}
.gp-dong .gp-nut-nho:hover { background: #fff; color: var(--gp-son); }

.gp-dong--khoa { cursor: default; }
.gp-dong--khoa:hover { background: var(--gp-son); }
.gp-dong--phu.gp-dong--khoa:hover { background: var(--gp-trang); }

.gp-trong { padding: 40px 20px; text-align: center; color: var(--gp-muc-nhat); }

/* ---------- In ---------- */

@media print {
	.gp-thanh-tren, .gp-cot-doi, .gp-ho-so, .gp-mo-ra,
	.gp-dai-tong .gp-nut, .gp-bang-quyen, .gp-thanh-loc,
	.gp-thanh-tim, .gp-thao-tac { display: none !important; }
	.gp-phahe-boc { grid-template-columns: 1fr; border: 0; }
	.gp-dong--chinh { background: #f3e6c8 !important; color: #000 !important; }
	.gp-than { background: #fff; padding: 0; border: 0; }
}

@media (max-width: 900px) {
	.gp-phahe-boc { grid-template-columns: 1fr; }
	.gp-cot-doi { display: flex; gap: 8px; overflow-x: auto; border-right: 0; border-bottom: 1px solid #d5c9a2; }
	.gp-moc { min-width: 86px; margin-bottom: 0; }
	.gp-dong, .gp-ds--admin .gp-dong { grid-template-columns: 44px 1fr 40px; }
	.gp-so-cot, .gp-thao-tac { display: none; }
}
