/* Minification failed. Returning unminified contents.
(228,14): run-time error CSS1039: Token not allowed after unary operator: '-c1'
(229,19): run-time error CSS1039: Token not allowed after unary operator: '-c3'
(235,33): run-time error CSS1039: Token not allowed after unary operator: '-c4'
(258,24): run-time error CSS1039: Token not allowed after unary operator: '-c4'
(272,20): run-time error CSS1039: Token not allowed after unary operator: '-c4'
(277,21): run-time error CSS1039: Token not allowed after unary operator: '-c2'
(292,20): run-time error CSS1039: Token not allowed after unary operator: '-c3'
(294,15): run-time error CSS1039: Token not allowed after unary operator: '-c1'
(300,34): run-time error CSS1039: Token not allowed after unary operator: '-c4'
(301,33): run-time error CSS1039: Token not allowed after unary operator: '-c4'
(325,44): run-time error CSS1039: Token not allowed after unary operator: '-hover'
(330,45): run-time error CSS1039: Token not allowed after unary operator: '-hover'
(335,44): run-time error CSS1039: Token not allowed after unary operator: '-hover'
(339,45): run-time error CSS1039: Token not allowed after unary operator: '-hover'
(343,44): run-time error CSS1039: Token not allowed after unary operator: '-hover'
(343,80): run-time error CSS1039: Token not allowed after unary operator: '-c4'
(347,45): run-time error CSS1039: Token not allowed after unary operator: '-hover'
(355,44): run-time error CSS1039: Token not allowed after unary operator: '-hover'
(362,45): run-time error CSS1039: Token not allowed after unary operator: '-hover'
(397,20): run-time error CSS1039: Token not allowed after unary operator: '-c3'
(534,15): run-time error CSS1039: Token not allowed after unary operator: '-c1'
(569,15): run-time error CSS1039: Token not allowed after unary operator: '-nav'
(596,15): run-time error CSS1039: Token not allowed after unary operator: '-nav'
(597,27): run-time error CSS1039: Token not allowed after unary operator: '-c4'
 */
/* ── Reset scoped — không dùng selector * hay body toàn cục ── */
html, body {
	margin: 0;
	padding: 0;
}

.ptd-shell * {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

.ptd-shell {
	display: flex;
	min-height: 100vh;
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	background: #f5f5f4;
	color: #1a1a1a;
}

/* ── Sidebar ── */
.ptd-sidebar {
	width: 200px;
	background: #fff;
	border-right: .5px solid #e5e5e5;
	padding: 0;
	flex-shrink: 0;
	display: flex;
	flex-direction: column;
}

.ptd-logo {
	display: block;
	padding: .75rem 1.25rem;
	font-size: 14px;
	font-weight: 500;
	border-bottom: .5px solid #e5e5e5;
	margin-bottom: .5rem;
	text-decoration: none;
	color: #1a1a1a;
}

	.ptd-logo span {
		color: #aaa;
		font-weight: 400;
	}

.ptd-nav-item {
	display: block;
	padding: 7px 1.25rem;
	font-size: 13.5px;
	color: #888;
	cursor: pointer;
	user-select: none;
	transition: color .15s;
}

	.ptd-nav-item:hover,
	.ptd-nav-item:focus,
	.ptd-nav-sub:hover,
	.ptd-nav-sub:focus {
		color: #2563eb;
		outline: none;
	}

	.ptd-nav-item.ptd-active {
		color: #2563eb;
		font-weight: 500;
	}

	.ptd-nav-item.ptd-has-sub {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

.ptd-nav-sub-arrow, .ptd-nav-sub-arrow-close {
	font-size: 13px;
	color: #bbb;
}

.ptd-nav-sub-arrow-close {
	display: none;
}

.ptd-nav-item.ptd-sub-expanded .ptd-nav-sub-arrow {
	display: none;
}

.ptd-nav-item.ptd-sub-expanded .ptd-nav-sub-arrow-close {
	display: inline;
}

.ptd-nav-subs {
	display: none;
}

	.ptd-nav-subs.ptd-open {
		display: block;
	}

.ptd-nav-sub {
	display: block;
	padding: 5px 1.25rem 5px 2rem;
	font-size: 12.5px;
	color: #aaa;
	cursor: pointer;
	user-select: none;
	transition: color .15s;
}

.ptd-nav-sep {
	margin: .5rem 1.25rem;
	border: none;
	border-top: .5px solid #f0f0f0;
}

/* ── Main ── */
.ptd-main {
	flex: 1;
	padding: .75rem 1.5rem 1.5rem;
	min-width: 0;
}

.ptd-topbar {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 1.5rem;
	border-bottom: .5px solid #e5e5e5;
	padding-bottom: .75rem;
}

.ptd-hamburger {
	display: none;
	background: none;
	border: none;
	cursor: pointer;
	font-size: 18px;
	color: #888;
	padding: 2px;
	line-height: 1;
}

.ptd-breadcrumb {
	display: flex;
	align-items: center;
	gap: 5px;
	font-size: 13px;
	color: #bbb;
	font-style: italic;
}

	.ptd-breadcrumb a {
		color: #2563eb;
		text-decoration: none;
		cursor: pointer;
	}

		.ptd-breadcrumb a:hover {
			text-decoration: underline;
		}

	.ptd-breadcrumb .ptd-current {
		color: #888;
	}

/* ── Stat cards ── */
.ptd-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 10px;
	margin-bottom: 1.5rem;
}

.ptd-card {
	background: #fff;
	border: .5px solid #e5e5e5;
	border-radius: 8px;
	padding: .5rem .5rem .5rem .75rem;
}

.ptd-card-label {
	font-size: 11px;
	color: #aaa;
	margin-bottom: 6px;
	text-transform: uppercase;
	letter-spacing: .04em;
}

.ptd-card-value {
	font-size: 20px;
	font-weight: 500;
}

.ptd-card-sub {
	font-size: 11px;
	color: #bbb;
	margin-top: 4px;
}

.ptd-up {
	color: #16a34a;
}

.ptd-dn {
	color: #dc2626;
}

/* ── Panels ── */
.ptd-row2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
}

.ptd-box {
	background: #fff;
	border: .5px solid #e5e5e5;
	border-radius: 8px;
	padding: .5rem 1.25rem;
	min-width: 0;
	overflow: hidden;
}

.ptd-box-title {
	font-size: 11px;
	color: var(--c1);
	background: var(--c3);
	text-transform: uppercase;
	letter-spacing: .04em;
	font-weight: 500;
	padding: 6px 1.25rem;
	margin: -.5rem -1.25rem 0;
	border-bottom: .5px solid var(--c4);
}

.ptd-box .ptd-table-wrap, .ptd-box .ptd-table-wrapmin {
	margin: 0 -1.25rem -1rem;
	border-radius: 0 0 8px 8px;
	border-left: none;
	border-right: none;
	border-bottom: none;
}

.ptd-box + .ptd-box {
	margin-top: 1rem;
}

/* ── Table wrap ── */
/* ── Table wrap & Table wrap min ── */
.ptd-table-wrap, .ptd-table-wrapmin {
	overflow: auto;
	max-height: 220px;
	border-radius: 4px;
	border: .5px solid #e5e5e5;
	scrollbar-width: thin;
	scrollbar-color: var(--c4) #f0f0f0;
}

	.ptd-table-wrap::-webkit-scrollbar, .ptd-table-wrapmin::-webkit-scrollbar {
		height: 6px;
		width: 6px;
	}

	.ptd-table-wrap::-webkit-scrollbar-track, .ptd-table-wrapmin::-webkit-scrollbar-track {
		background: #f0f0f0;
		border-radius: 3px;
	}

	.ptd-table-wrap::-webkit-scrollbar-thumb, .ptd-table-wrapmin::-webkit-scrollbar-thumb {
		background: var(--c4);
		border-radius: 99px;
	}

		.ptd-table-wrap::-webkit-scrollbar-thumb:hover, .ptd-table-wrapmin::-webkit-scrollbar-thumb:hover {
			background: var(--c2);
		}

	.ptd-table-wrap table, .ptd-table-wrapmin table {
		width: auto;
		min-width: 640px;
		border-collapse: separate;
		border-spacing: 0;
		font-size: 13px;
	}

	.ptd-table-wrap thead th, .ptd-table-wrapmin thead th {
		position: sticky;
		top: 0;
		z-index: 20;
		background: var(--c3);
		text-align: left;
		color: var(--c1);
		font-weight: 500;
		padding: 7px 10px;
		font-size: 11px;
		text-transform: uppercase;
		letter-spacing: .04em;
		border-bottom: .5px solid var(--c4);
		border-right: .5px solid var(--c4);
	}

		.ptd-table-wrap thead th:last-child, .ptd-table-wrapmin thead th:last-child {
			border-right: none;
		}

	.ptd-table-wrap tbody td, .ptd-table-wrap tbody th, .ptd-table-wrapmin tbody td, .ptd-table-wrapmin tbody th {
		padding: 5px 5px;
		border-bottom: 1px solid #c8c8c6;
		border-right: 1px solid #c8c8c6;
		isolation: isolate;
	}

		.ptd-table-wrap tbody td:last-child, .ptd-table-wrap tbody th:last-child, .ptd-table-wrapmin tbody td:last-child, .ptd-table-wrapmin tbody th:last-child {
			border-right: none;
		}

	.ptd-table-wrap tbody tr:last-child td, .ptd-table-wrap tbody tr:last-child th, .ptd-table-wrapmin tbody tr:last-child td, .ptd-table-wrapmin tbody tr:last-child th {
		border-bottom: none;
	}

	.ptd-table-wrap table.ptd-hoverable tbody tr:hover td, .ptd-table-wrap table.ptd-hoverable tbody tr:hover th,
	.ptd-table-wrapmin table.ptd-hoverable tbody tr:hover td, .ptd-table-wrapmin table.ptd-hoverable tbody tr:hover th {
		box-shadow: inset 0 0 0 9999px rgba(var(--hover), 0.05), inset -1px 0 0 #c8c8c6;
	}

		.ptd-table-wrap table.ptd-hoverable tbody tr:hover td:last-child, .ptd-table-wrap table.ptd-hoverable tbody tr:hover th:last-child,
		.ptd-table-wrapmin table.ptd-hoverable tbody tr:hover td:last-child, .ptd-table-wrapmin table.ptd-hoverable tbody tr:hover th:last-child {
			box-shadow: inset 0 0 0 9999px rgba(var(--hover), 0.05);
		}

	/* col-hover — chỉ áp dụng cho ptd-table-wrap */
	.ptd-table-wrap table.ptd-hoverable tbody td.ptd-col-hover, .ptd-table-wrap table.ptd-hoverable tbody th.ptd-col-hover {
		box-shadow: inset 0 0 0 9999px rgba(var(--hover), 0.05), inset -1px 0 0 #c8c8c6;
	}

		.ptd-table-wrap table.ptd-hoverable tbody td.ptd-col-hover:last-child, .ptd-table-wrap table.ptd-hoverable tbody th.ptd-col-hover:last-child {
			box-shadow: inset 0 0 0 9999px rgba(var(--hover), 0.05);
		}

	.ptd-table-wrap table.ptd-hoverable thead th.ptd-col-hover {
		box-shadow: inset 0 0 0 9999px rgba(var(--hover), 0.05), inset -1px 0 0 var(--c4);
	}

		.ptd-table-wrap table.ptd-hoverable thead th.ptd-col-hover:last-child {
			box-shadow: inset 0 0 0 9999px rgba(var(--hover), 0.05);
		}

	/* === Row selected === */
	.ptd-table-wrap table.ptd-hoverable tbody tr.ptd-row-selected td,
	.ptd-table-wrap table.ptd-hoverable tbody tr.ptd-row-selected th,
	.ptd-table-wrapmin table.ptd-hoverable tbody tr.ptd-row-selected td,
	.ptd-table-wrapmin table.ptd-hoverable tbody tr.ptd-row-selected th {
		box-shadow: inset 0 0 0 9999px rgba(var(--hover), 0.05), inset -1px 0 0 #c8c8c6;
	}

		.ptd-table-wrap table.ptd-hoverable tbody tr.ptd-row-selected td:last-child,
		.ptd-table-wrap table.ptd-hoverable tbody tr.ptd-row-selected th:last-child,
		.ptd-table-wrapmin table.ptd-hoverable tbody tr.ptd-row-selected td:last-child,
		.ptd-table-wrapmin table.ptd-hoverable tbody tr.ptd-row-selected th:last-child {
			box-shadow: inset 0 0 0 9999px rgba(var(--hover), 0.05);
		}

	.ptd-table-wrap table.ptd-hoverable tbody tr,
	.ptd-table-wrapmin table.ptd-hoverable tbody tr {
		cursor: pointer;
	}

	/* ── Input / select / textarea trong table ── */
	.ptd-table-wrap table input, .ptd-table-wrap table select, .ptd-table-wrap table textarea,
	.ptd-table-wrapmin table input, .ptd-table-wrapmin table select, .ptd-table-wrapmin table textarea {
		border: none;
		background: #fff;
		font: inherit;
	}

	.ptd-table-wrap thead th input, .ptd-table-wrap thead th select, .ptd-table-wrap thead th textarea,
	.ptd-table-wrapmin thead th input, .ptd-table-wrapmin thead th select, .ptd-table-wrapmin thead th textarea {
		font-size: 13px;
	}

	.ptd-table-wrap table input:focus, .ptd-table-wrap table textarea:focus, .ptd-table-wrap table select:focus,
	.ptd-table-wrapmin table input:focus, .ptd-table-wrapmin table textarea:focus, .ptd-table-wrapmin table select:focus {
		outline: 1px solid #e8a020;
	}

	.ptd-table-wrap tbody th, .ptd-table-wrapmin tbody th {
		font-weight: normal;
		text-align: left;
	}

	.ptd-table-wrap thead th:first-child, .ptd-table-wrapmin thead th:first-child {
		position: sticky;
		left: 0;
		z-index: 21;
		background: var(--c3);
	}

	.ptd-table-wrap tbody td:first-child, .ptd-table-wrap tbody th:first-child,
	.ptd-table-wrapmin tbody td:first-child, .ptd-table-wrapmin tbody th:first-child {
		position: sticky;
		left: 0;
		background: #fff;
		z-index: 2;
		isolation: auto;
	}

/* ── Status badges ── */
.ptd-status {
	font-size: 11px;
	padding: 2px 7px;
	border-radius: 99px;
	white-space: nowrap;
}

.ptd-s-done {
	background: #dcfce7;
	color: #15803d;
}

.ptd-s-pend {
	background: #dbeafe;
	color: #2563eb;
}

.ptd-s-warn {
	background: #fef9c3;
	color: #a16207;
}

.ptd-s-fail {
	background: #fee2e2;
	color: #b91c1c;
}

/* ── Bar chart — width gán inline trực tiếp, không dùng CSS custom property ── */
.ptd-bar-row {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 9px;
}

	.ptd-bar-row:last-child {
		margin-bottom: 0;
	}

.ptd-bar-label {
	width: 65px;
	font-size: 12px;
	color: #aaa;
	flex-shrink: 0;
}

.ptd-bar-track {
	flex: 1;
	height: 4px;
	background: #f0f0f0;
	border-radius: 99px;
	overflow: hidden;
}

.ptd-bar-fill {
	height: 100%;
	background: #2563eb;
}

.ptd-bar-val {
	width: 32px;
	text-align: right;
	font-size: 11px;
	color: #bbb;
}

/* ── Overlay (mobile) ── */
.ptd-overlay {
	display: none;
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,.25);
	z-index: 99;
}

	.ptd-overlay.ptd-open {
		display: block;
	}

/* ── Responsive ── */
@media (max-width: 640px) {
	.ptd-hamburger {
		display: block;
	}

	.ptd-sidebar {
		position: fixed;
		left: -200px;
		top: 0;
		height: 100vh;
		z-index: 100;
		transition: left .2s;
	}

		.ptd-sidebar.ptd-open {
			left: 0;
			box-shadow: 2px 0 16px rgba(0,0,0,.1);
		}

	.ptd-row2 {
		grid-template-columns: 1fr;
	}
}
/* ── Multi-row sticky header ── */
.ptd-table-wrap thead th.ptd-title {
	text-align: center;
	letter-spacing: .1em;
	font-size: 12px;
}

.ptd-table-wrap thead th .ptd-sum {
	display: block;
	font-weight: 600;
	margin-top: 2px;
	letter-spacing: 0;
}

.ptd-table-wrap thead th.ptd-filter-reset {
	text-align: center;
	font-size: 14px;
	cursor: pointer;
}

	.ptd-table-wrap thead th.ptd-filter-reset:hover {
		color: var(--c1);
	}
/* span wrapper ASP.NET sinh ra bên trong DataPager */
/* span trang hiện tại — phải đủ cụ thể để không bị override bởi rule > span ở trên */
/* ── DataPager wrapper ── */
.ptd-pager {
	display: inline-flex;
	align-items: center;
	gap: 2px;
	flex-wrap: wrap;
	background: transparent;
	border: none;
}

	.ptd-pager table, .ptd-pager td {
		background: transparent;
		border: none;
		padding: 0;
		margin: 0;
	}

	.ptd-pager input[type="submit"] {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 28px;
		height: 28px;
		padding: 0 6px;
		font-size: 12px;
		font-weight: 600;
		cursor: pointer;
		line-height: 1;
		border-radius: 4px;
		border: none;
		background: transparent;
		color: var(--nav);
		font-family: inherit;
		transition: opacity .12s;
		appearance: none;
		-webkit-appearance: none;
	}

		.ptd-pager input[type="submit"]:hover {
			opacity: .6;
		}

		.ptd-pager input[type="submit"]:active {
			opacity: .4;
		}

	.ptd-pager span {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 28px;
		height: 28px;
		padding: 0 6px;
		font-size: 12px;
		font-weight: 600;
		line-height: 1;
		border-radius: 4px;
		background: transparent;
		color: var(--nav);
		border: .5px solid var(--c4);
	}