.tlhp-wrap {
	margin: 1.5em 0;
	font-size: 15px;
}

.tlhp-toolbar {
	margin-bottom: .75em;
	display: flex;
	justify-content: flex-end;
}

.tlhp-search {
	padding: .5em .75em;
	border: 1px solid #ccd0d4;
	border-radius: 6px;
	min-width: 220px;
	max-width: 100%;
	font-size: 14px;
}

.tlhp-table-scroll {
	overflow-x: auto;
	border: 1px solid #e2e4e7;
	border-radius: 8px;
}

table.tlhp-table {
	width: 100%;
	border-collapse: collapse;
	margin: 0;
}

table.tlhp-table th,
table.tlhp-table td {
	padding: .65em .9em;
	text-align: left;
	border-bottom: 1px solid #eef0f2;
	vertical-align: top;
}

table.tlhp-table thead th {
	background: #f6f7f7;
	font-weight: 600;
	white-space: nowrap;
	position: relative;
	user-select: none;
}

table.tlhp-table tbody tr:hover {
	background: #fafbfc;
}

table.tlhp-table tbody tr:last-child td {
	border-bottom: 0;
}

th.tlhp-sortable {
	cursor: pointer;
	padding-right: 1.6em;
}

th.tlhp-sortable::after {
	content: '⇅';
	position: absolute;
	right: .6em;
	opacity: .35;
	font-size: .85em;
}

th.tlhp-sortable.tlhp-asc::after { content: '▲'; opacity: .9; }
th.tlhp-sortable.tlhp-desc::after { content: '▼'; opacity: .9; }

.tlhp-empty {
	text-align: center;
	color: #777;
	padding: 1.5em;
}

tbody.tlhp-loading {
	opacity: .5;
	transition: opacity .15s;
}

.tlhp-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: .75em;
	margin-top: .85em;
}

.tlhp-info {
	color: #555;
	font-size: 13px;
}

.tlhp-pager {
	display: flex;
	gap: .25em;
	flex-wrap: wrap;
}

.tlhp-page {
	min-width: 34px;
	padding: .4em .6em;
	border: 1px solid #ccd0d4;
	background: #fff;
	border-radius: 6px;
	cursor: pointer;
	font-size: 13px;
	line-height: 1;
}

.tlhp-page:hover:not(:disabled):not(.tlhp-active) {
	background: #f0f1f2;
}

.tlhp-page.tlhp-active {
	background: #2271b1;
	border-color: #2271b1;
	color: #fff;
	cursor: default;
}

.tlhp-page:disabled {
	opacity: .45;
	cursor: default;
}

.tlhp-ellipsis {
	padding: .4em .3em;
	color: #888;
}
