:root {
    --primary-blue: rgb(72, 127, 255);
}
h1 {
    color: black !important;
}
h1 .card-title{
    color: black !important;
}

.dt-layout-cell.dt-layout-start {
    margin: 0 !important;
}
.dt-layout-cell.dt-layout-end {
    margin: 0 !important;
}

html[dir="rtl"] .dataTable thead th {
    text-align: right !important;
    
    background-color: #e3f1ff !important;
    color: #121111 !important;
    font-weight: 600 !important;
    padding: 12px !important;
}

html[dir="ltr"] .dataTable thead th {
    text-align: left !important;

    background-color: #e3f1ff !important;
    color: #121111 !important;
    font-weight: 600 !important;
    padding: 12px !important;
}

/* ---------------------------- TD -------------------- */

html[dir="rtl"] .dataTable td {
    text-align: right !important;
    vertical-align: middle !important;

    border: 1px solid rgba(128, 128, 128, 0.2);
    padding: 10px !important;

}

html[dir="ltr"] .dataTable td {
    text-align: left !important;
    vertical-align: middle !important;

    border: 1px solid rgba(128, 128, 128, 0.2);
    padding: 10px !important;

}

.dataTable tbody tr:hover {
    background-color: rgba(72, 127, 255, 0.1) !important;
}


/* Pagination and info text */
.dt-paging-button {
    color: rgb(72, 127, 255) !important;
    border: 0.3px solid rgb(72, 127, 255) !important;
    background-color: white !important;
    border-radius: 6px !important;
    padding: 6px 12px !important;
    margin: 0 4px !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
    cursor: pointer !important;
}

/* Active page */
.dt-paging-button .current {
    background-color: rgb(72, 127, 255) !important;
    color: white !important;
    border-color: rgb(72, 127, 255) !important;
}

/* Disabled buttons */
.dt-paging-button .disabled .first {
    background-color: #b12b2b !important;
    color: #aaa !important;
    border-color: #ddd !important;
    cursor: not-allowed !important;
}

.dt-paging-button .next{
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.dt-paging-button .previous{
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.dt-action {
    width: 150px !important;
}

/* Badge example */
.badge.active {
    background-color: var(--primary-blue) !important;
    color: white !important;
    padding: 4px 8px !important;
    border-radius: 12px !important;
    font-size: 0.85rem !important;
}