/*
 * App-specific DataTables overrides.
 *
 * DataTables 3.0 dropped the old "odd"/"even" <tr> classes and the
 * box-shadow/CSS-variable-driven row-stripe & sorted-column tint it ships
 * with by default renders as a near-invisible grey (--dt-row_background-stripe
 * and --dt-column-ordering_background both default to black at very low
 * alpha). We disable that mechanism and restore the pre-3.0 blue/white
 * striping and blue sorted-column highlight ourselves using :nth-child,
 * since that's the modern equivalent of the old odd/even row classes.
 *
 * Only sorting_1 is styled -- this app always sorts by a single column.
 */

:root {
	--dt-row_alpha-stripe: 0;
	--dt-column-ordering_alpha: 0;
	--dt-input_padding: 2px 5px;
}

div.dt-container {
	padding-left: 5px;
	padding-right: 5px;
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * Header text styling, vertical dividers between columns, and a matching
 * top bar
 */
table.dataTable thead th {
	border-top: 1px solid rgba(0, 0, 0, 0.3);
	border-right: 1px solid rgba(0, 0, 0, 0.15);
	background: linear-gradient(to bottom, #fafafa, #e5e5e5);
	text-align: center;
	font-weight: normal;
	font-size: 10px;
	text-transform: uppercase;

	&:first-child {
		border-left: 1px solid rgba(0, 0, 0, 0.15);
	}

	& div.dt-column-header {
		justify-content: center;
	}

	/* DataTables right-aligns auto-detected numeric/date columns (and
	   reverses the header's flex direction to match) -- keep headers
	   centered regardless of column data type. */
	&.dt-type-numeric,
	&.dt-type-date {
		text-align: center;

		& div.dt-column-header {
			flex-direction: row;
			justify-content: center;
		}
	}
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * Row striping and sorted-column highlight
 */
table.display > tbody > tr {
	&:nth-child(odd) {
		background-color: #E8FAFB;

		& > td.sorting_1 {
			background-color: #ccffff;
		}
	}

	&:nth-child(even) {
		background-color: white;

		& > td.sorting_1 {
			background-color: #dffefe;
		}
	}

	/* Priority-row variant: gradeX flags a priority request row */
	&.gradeX:nth-child(odd) {
		background-color: #ffdddd;

		& > td.sorting_1 {
			background-color: #ffc4c4;
		}
	}

	&.gradeX:nth-child(even) {
		background-color: #ffeeee;

		& > td.sorting_1 {
			background-color: #ffd5d5;
		}
	}
}