

/* =======================
   Dark Table – Pro finish
   ======================= */
:root {
	--tbl-bg: transparent; /* table background */
	--tbl-head: #0B313E; /* header background */
	--tbl-ink: #E5E5E5; /* body text */
	--tbl-muted: #B9C6CF; /* secondary text */
	--tbl-line: rgba(255,255,255,.12); /* dividers */
	--tbl-row-a: #001F2A; /* zebra A */
	--tbl-row-b: #002330; /* zebra B */
	--tbl-hover: #0F3A4A; /* hover bg */
	--tbl-radius: 0px;
}

/* Wrap tables to enable safe horizontal scrolling on small screens */
.table-wrap {
	width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border-radius: var(--tbl-radius);
	border: 0px solid var(--tbl-line);
	background: var(--tbl-bg);
}

/* Base table */
.table {
	width: 100%;
	margin: 0;
	border-collapse: separate; /* keeps radius clean */
	border-spacing: 0;
	background: transparent;
	color: var(--tbl-ink);
	font-weight: 400;
	line-height: 1.35;
}

	/* ---- Header ---- */
	.table > thead > tr > th {
		/*position: sticky;*/ /* stays visible when scrolling vertically */
		top: 0;
		z-index: 1;
		padding: 14px 18px;
		background: var(--tbl-head);
		color: #C9CACC;
		font-weight: 500 !important;
		letter-spacing: .4px;
		border: 0px;
		white-space: nowrap;

		font-size: 16px;
		font-style: normal;
		line-height: 130%; /* 20.8px */
	}

	.table thead th:first-child {
		border-top-left-radius: var(--tbl-radius);
	}

	.table thead th:last-child {
		border-top-right-radius: var(--tbl-radius);
	}

	/* ---- Body cells ---- */
	.table > tbody > tr > td {
		border: 0px;
		background: transparent;
		vertical-align: middle;
		font-weight: 300;
		color: #C9CACC;
		font-size: 16px;
		font-style: normal;
		font-weight: 400;
		line-height: 130%; /* 20.8px */
	}

/* Zebra rows */
.table-striped > tbody > tr:nth-of-type(odd) > td {
	background: var(--tbl-row-a) !important;
}

.table-striped > tbody > tr:nth-of-type(even) > td {
	background: var(--tbl-row-b) !important;
}

/* Hover state */
.table > tbody > tr:hover > td {
	background: var(--tbl-hover) !important;
}

/* Rounded corners at bottom */
.table > tbody > tr:last-child > td:first-child {
	border-bottom-left-radius: var(--tbl-radius);
}

.table > tbody > tr:last-child > td:last-child {
	border-bottom-right-radius: var(--tbl-radius);
}

/* Subtle focus outline for accessibility (when a link/input inside gets focus) */
.table > tbody > tr:focus-within > td {
	outline: 0px solid rgba(42,167,230,.35);
	outline-offset: -2px;
}

/* Optional: compact density */
.table--compact > thead > tr > th,
.table--compact > tbody > tr > td {
	padding: 10px 14px;
	font-size: 0.95rem;
}

/* Caption (if used) */
.table caption {
	caption-side: top;
	padding: 10px 2px;
	color: var(--tbl-muted);
	text-align: left;
	font-size: .95rem;
}

.dataTables_wrapper .dataTables_filter input {
	border: 1px solid #0E435D!important;
	border-radius: 60px !important;
	padding: 12px 20px;
	background-color: #142D3BDE;
	margin-left: 3px;
}

.dataTables_wrapper .pagination .page-link {
	background: transparent;
	border: 1px solid rgba(255,255,255,.18);
	color: #e8e8e8;
	border-radius: 8px;
}

	.dataTables_wrapper .pagination .page-link:hover {
		background: rgba(255,255,255,.08);
		color: #fff;
	}

.dataTables_wrapper .pagination .page-item.active .page-link {
	/*background: var(--dt-page);
	border-color: var(--dt-page);
	color: #fff;*/
}

.dt-buttons .btn-secondary {
	border: 0px;
	background-color: transparent;
	color: #696969 !important;
}

.dataTables_filter label {
	color: #696969 !important;
}

.dataTables_info {
	color: #696969 !important;
}

.dataTables_paginate paging_simple_numbers {
	color: #e5e5e5;
}

/* Responsive tweaks */
@media (max-width: 768px) {
	.table > thead > tr > th, .table > tbody > tr > td {
		padding: 12px 14px;
	}
}

@media (max-width: 520px) {
	.table > thead > tr > th,
	.table > tbody > tr > td {
		padding: 10px 12px;
	}
}
