/* ================= TABLE ================= */

/* @group table, righe etc.*/
table{
	border-collapse: collapse;
	border-spacing: 0;
	max-width: 100% !important;
	color: var(--body-color) !important;
}
.table-hover tbody tr:hover{
	color: var(--body-color) !important;
}
.table-dark{
	color: white !important;
}
.table > thead > tr > th{
	border-bottom: none;
}
td, th{
	vertical-align: top;
}
.bg1{
	background-color: transparent;
}
.bg2{
	background-color: var(--bg-light);
}
/* @end */


@media (max-width: 991.98px){
	/*---table---*/
	.no-table-mobile table,.no-table-mobile thead, .no-table-mobile tbody, 
	.no-table-mobile th,.no-table-mobile td, .no-table-mobile tr{
		display: block;
	}
	.no-table-mobile .table > tbody > tr > td, 
	.no-table-mobile .table > tbody > tr > th, 
	.no-table-mobile .table > tfoot > tr > td, 
	.no-table-mobile .table > tfoot > tr > th, 
	.no-table-mobile .table > thead > tr > td, 
	.no-table-mobile .table > thead > tr > th{
		padding: 4px;
	}
	.table-bordered > tbody > tr > td,
	.table-bordered > tbody > tr > th,
	.table-bordered > tfoot > tr > td,
	.table-bordered > tfoot > tr > th,
	.table-bordered > thead > tr > td,
	.table-bordered > thead > tr > th{
		border: none;
	}
	/* Hide table headers (but not display: none;, for accessibility) */
	.no-table-mobile thead tr{
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	.no-table-mobile tr{
		margin: 0 0 1rem 0;
	}
   .table-striped-xs tr:nth-child(odd){
		background: #e1e1e1 !important;
	}
	.no-table-mobile td{
		/* Behave like a "row" */
		border: none;
		position: relative;
		white-space: normal;
	}
	.no-table-mobile td.td-title{
		padding-left: 50% !important; 
	}
	.no-table-mobile td.td-title:before{ 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
		text-align: left;
		font-weight: bold;
	}
	.no-table-mobile td.td-title:before{ 
		content: attr(data-title); 
	}
	.no-table-mobile .th-label, .no-table-mobile .th-help{
		display: inline-block;		
	}
	.no-table-mobile .th-label{
		width: 88%;
		font-weight:bold;
	}
	.no-table-mobile .th-help{
		width: 10%;
		text-align: right;
	}
}