/**
 * Simplebar theming.
 * https://github.com/Grsmto/simplebar
 */

:root {
	--simplebar-width: 1.75rem;
}

.simplebar-track {
	background-color: var( --bs-light );
}

.simplebar-track.simplebar-vertical {
	width: var( --simplebar-width );
}

.simplebar-track.simplebar-horizontal {
	height: var( --simplebar-width );
}

.simplebar-scrollbar.simplebar-visible:before {
	top: calc( var( --simplebar-width ) * 0.3125 );
	right: calc( var( --simplebar-width ) * 0.3125 );
	bottom: calc( var( --simplebar-width ) * 0.3125 );
	left: calc( var( --simplebar-width ) * 0.3125 );
	background-color: var( --bs-border-color );
	opacity: 1;
}

/**
 * Always white
 */
.table.datasuite-table {
	overflow: hidden; /* For border-radius on table, with tr with background-color inside */
}
.table.datasuite-table tr {
	background: var( --bs-white );
}

/**
 * Form table
 */
.gform_fields.tab-content > .tab-pane > .datatable-wrapper {
	margin-bottom: var( --bs-spacer-4 );
}

/**
 * Desktop scrollable table
 */
@media ( min-width: 992px ) {
	.datatable-overflow-indicator {
		position: relative;
	}
	.datatable-overflow-indicator:after {
		content: " ";
		position: absolute;
		top: 0;
		right: 0;
		bottom: var( --simplebar-width );
		width: var( --bs-spacer-5 );
		background: linear-gradient( to right, rgba( 255, 255, 255, 0 ), rgba( 255, 255, 255, 1 ) );
		z-index: 2;
		pointer-events: none;
	}
	.saas-form-section .datatable-overflow-indicator:after {
		background: linear-gradient( to right, rgba( var( --bs-light-rgb ), 0 ), rgba( var( --bs-light-rgb ), 1 ) );
	}
	.datatable-scroll-wrapper {
		z-index: 3;
	}
	.datatable-scroll-wrapper.simplebar-scrollable-x {
		z-index: 1;
	}
	.simplebar-scrollable-x .simplebar-content > .dataTables_wrapper > .dataTable {
		width: auto !important; /* To overwrite w-100 */
		border-right: var( --bs-spacer-5 ) solid transparent;
		margin-bottom: var( --simplebar-width ) !important;
	}
}

/**
 * Full-width datatable layout (with separated search and collapsible filter bar)
 */
@media ( min-width: 768px ) {
	.dsdt-fullwidth .-search-field-wrapper {
		width: 30rem;
		max-width: 100%;
	}
}
.dsdt-fullwidth .-filter-toggle-button:after {
	content: "";
	position: absolute;
	right: 0;
	bottom: calc( ( 1.5rem + 1px ) * -1 );
	left: 0;
	width: 1rem;
	height: 1rem;
	margin: 0 auto;
	border: 0 solid var( --bs-border-color );
	background: var( --bs-light );
	border-width: 1px 0 0 1px;
	transform: rotate( 45deg );
}
.-filters-toggle:checked ~ .-title-search-filters .-filter-toggle-button:after {
	display: none;
}
.-filters-toggle:not( :checked ) ~ .-title-search-filters .-filter-toggle-button {
	border-color: var( --bs-primary ) !important;
}

/**
 * Row-grouping
 */
.moddst-row-group td {
	background: var( --bs-light );
	pointer-events: none;
	font-weight: bold;
}

/**
 * Matrix table
 */
/* .moddst-matrix-table th.matrix-column {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	font-size: var( --bs-sub-sup-font-size );
	text-transform: none !important;
} */
.moddst-matrix-table .matrix-column {
	text-align: center;
}
.moddst-matrix-table th.matrix-column span {
	display: none;
}
.moddst-matrix-table tr:first-child th img {
	width: 1.5rem !important;
	max-width: 1.5rem !important;
	height: 1.5rem !important;
}

/* Zebra table */
.table.datasuite-table td {
	box-shadow: none !important;
}
.table.datasuite-table.table-striped:not( .table-striped-reverse ) tr.odd td,
.table.datasuite-table.table-striped-reverse tr.even td {
	background-color: var( --bs-light );
}

/**
 * Hover-styling
 */
.table.dataTable.table-hover:not( .moddst-matrix-table ) > tbody > tr:not( tr.dt-hasChild + tr ):hover > td {
	background-color: var( --bs-light-darker ) !important;
}
.table.dataTable.moddst-matrix-table tbody tr:hover td.matrix-column,
.table.dataTable.moddst-matrix-table tbody          td.moddst-column-hover { /* JS manipulation to also highlight the column in case of a matrix table for example */
	background-color: var( --bs-light-darker ) !important;
}
.table.dataTable.moddst-matrix-table tbody tr:hover td.matrix-column.moddst-column-hover {
	background-color: var( --bs-primary ) !important;
	color: var( --bs-white ) !important;
}

/**
 * Pagination / per-page controls
 */
.dataTables_info,
.dataTables_length {
	margin-top: var( --bs-spacer-4 );
}
@media ( min-width: 992px ) {
	.dataTables_info,
	.dataTables_length {
		margin-top: var( --bs-spacer-3 );
		margin-bottom: var( --bs-spacer-3 ); /* Note the horizontal table scrollbar will cover this bottom margin when it's active. */
	}
	.-dsdt-length + .-dsdt-pagination .pagination {
		justify-content: end !important;
	}
}
.dataTables_info {
	padding-top: 0 !important; /* Overwrite default */
}

/*
 * Loading state
 * //todo Combine with old loading state in _tables.scss
 */
/* .dataTables_wrapper.-loading-state {
	display: none;
}
table ~ .-loading-message, /* Before rendering the datatable *
.dataTables_wrapper:not( .-loading-state ) ~ .-loading-message,
.dataTables_wrapper.-error-state ~ .-loading-message {
	display: none;
} */

/**
 * Table caption / bulk-actions bar
 */
.moddst-table-caption {
	position: relative;
	z-index: 3;
	background: var( --bs-primary );
	color: var( --bs-white );
	padding: var( --bs-spacer-2 ) var( --bs-spacer-3 );
}
@media ( min-width: 992px ) {
	.moddst-table-caption:not( .d-none ) ~ .datatable-overflow-indicator table.dataTable {
		margin-top: 0 !important;
		border-top-right-radius: 0 !important;
		border-top-left-radius: 0 !important;
	}
}

/**
 * Diff-table
 */
.moddst-diff-table + div .-dsdt-info,
.moddst-diff-table + div .-dsdt-length {
	display: none !important;
}
.moddst-diff-table .-highlight td {
	background: var( --diff-table-highlight-bg-color, var( --bs-secondary-lighter ) );
	border-color: var( --diff-table-highlight-border-color, var( --bs-secondary-lighter ) );
	color: var( --diff-table-highlight-text-color, var( --bs-dark ) );
	font-weight: var( --diff-table-highlight-font-weight, bold );
}