/* === for datatables that take a long time to load, we provide a bootstrap pulsing spinner */
/* === usage
	<div class="datatable-config"
	   <div class="dt-loading-container">
	        <div class="dt-loading-indicator">
	            <div class="spinner-grow spinner-grow-md" role="status">
	                <span class="visually-hidden">Loading table data...</span>
	            </div>
	        </div>
	    </div>
	    <div class="dt-table-container d-none">
	     ...table...
	    </div>
*/
 
/* --- 1. Loading Container Styling --- */

.datatable-config {
    position: relative;
    /* Ensure a minimum height for the loader to be visible */
    min-height: 200px; 
}

/* Container A: The loading panel itself */
.dt-loading-container {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    z-index: 10;
    pointer-events: all;
    /* Apply the light grey background directly to this container */
    background-color: rgba(248, 249, 250, 0.90);
}

/* Spinner Positioning: Near the top of the wrapper */
.dt-loading-indicator {
    position: absolute;
    top: 50%; 
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 11; /* Above the loading container */
    display: block !important; 
}

/* Spinner Color Default: Dark Gray */
.dt-loading-indicator .spinner-grow {
    color: #6c757d !important;
    opacity: 1 !important;
}

/* --- 2. Table Row Border Fix (Bootstrap Norm) --- */

/* Targets the table body rows/cells inside the active table */
.datatable-config table tbody tr td {
    border-top: none !important;
    border-bottom: none !important;
}


/* Re-introduce the standard Bootstrap light gray border to the bottom of cells  */
.datatable-config table tbody tr:not(:last-child) td {
    border-bottom: 1px solid #dee2e6 !important;
}



.datatable-config table tbody tr:last-child td {
    border-bottom: none !important;
}