/* Tables */
.thead-bold th {
    color: #000;
    background-color: #bbb;
    font: 13px Arial;
    font-weight: bold;
}

.column-safe-fullname,
.column-fullname {
    white-space: nowrap;
}

.column-action {
    text-align: center;
    white-space: nowrap;
}

[data-bs-theme=dark] {
    .table-striped tbody tr:hover td {
        background-color: #444;
    }

    .table-striped tbody tr:nth-of-type(odd) {
        background-color: #333;
    }
}

[data-bs-theme=light] {
    .table-striped tbody tr:hover td {
        background-color: #ccc;
    }

    .table-striped tbody tr:nth-of-type(odd) {
        background-color: #fafafa;
    }
}

/* Required Red Star */
.required:after {
    content: '*';
    color: red;
    padding-left: 5px;
    font-weight: bold;
}

.required1 {
    font-weight: bold;
}

/* Buttons */
td .btn {
    color: #fff;
    text-align: left;
    text-decoration: none;
}

.btn:hover {
    color: #333333;
    text-align: left;
    text-decoration: none;
}

.btn-default {
    background: rgb(66, 139, 202);
    background: rgba(66, 139, 202, 1);
    background-clip: padding-box;
}

.btn-default:hover, a .btn-default:hover {
    background-color: #428BCA;
    background: rgba(66, 139, 202, 1);
    background-clip: padding-box;
    box-sizing: inherit;
}

.btn-xs, .btn-group-xs > .btn, .btn-xs:hover, .btn-group-xs > .btn:hover {
    border-radius: 3px 3px 3px 3px;
    padding-top: 1px;
    padding-left: 5px;
    padding-right: 5px;
    padding-bottom: 1px;
    font-size: 12px;
}

.btn-xs, .btn-xs:hover {
    font-size: 10px;
}

.btn-primary {
    text-align: center;
}

.btn-primary:hover {
    text-align: center;
}

.disabled-button {
    background-color: LightCoral;
}

.disabled-button:hover {
    background-color: LightCoral;
}

.disabled-request-button {
    background-color: #F5B041;
}

.disabled-request-button:hover {
    background-color: #F5B041;
}


/* Display size max 768px */
@media only screen and (max-width: 767px) {
    /* Table */
    #content-tables-responsive {
        direction: ltr;
    }

    /* Force table to not be like tables anymore */
    #content-tables-responsive table:not(.t1),
    #content-tables-responsive thead:not(.t1),
    #content-tables-responsive tbody:not(.t1),
    #content-tables-responsive tfoot:not(.t1),
    #content-tables-responsive th:not(.t1),
    #content-tables-responsive td:not(.t1),
    #content-tables-responsive tr:not(.t1) {
        display: block;
    }

    #content-tables-responsive thead tr td:not(.t1) {
        margin-top: -20px;
        width: 10%;
    }

    #content-tables-responsive thead tr th:not(.t1) {
        margin-top: -20px;
        width: 10%;
    }

    #content-tables-responsive tfoot tr td:not(.t1) {
        display: flex;
    }

    #content-tables-responsive tfoot tr th:not(.t1) {
        display: flex;
    }

    #content-tables-responsive thead tr td {
        width: 10%;
    }

    #content-tables-responsive thead tr td span {
        width: 100% !important;
    }

    #content-tables-responsive thead tr td span form {
        width: 100% !important;
    }

    #content-tables-responsive thead tr td span form span {
        width: 100% !important;
    }

    #content-tables-responsive thead tr td span span input {
        height: 90%;
        width: 100%;
        text-align: center;
        position: relative;
        margin: 1px !important;
    }

    #content-tables-responsive thead tr td span span select {
        height: 90%;
        width: 100%;
        text-align: center;
        position: relative;
        margin: 1px !important;
    }

    #content-tables-responsive thead tr td span span:first-of-type input {
        margin-top: -20px !important;
    }

    #content-tables-responsive thead tr td span button {
        position: relative;
        width: 100%;
        margin: 1px !important;
        text-align: center;
    }

    /* Hide table headers (but not display: none;, for accessibility) */
    #content-tables-responsive thead tr th:not(.t1) {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    #content-tables-responsive tr:not(.t1) {
        border: 1px solid #ccc;
    }

    /* Behave  like a "row" */
    #content-tables-responsive td:not(.t1) {
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        padding-left: 50%;
        white-space: normal;
        text-align: right;
    }

    /* Now like a table header */
    /* Top/left values mimic padding */
    #content-tables-responsive td:not(.t1):before {
        position: absolute;
        top: 6px;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
        text-align: left;
        font-weight: bold;
    }

    #content-tables-responsive tbody tr td:not(.t1) {
        border-bottom: 1px solid #ccc;
        min-height: 25px;
    }

    #content-tables-responsive tbody tr td:not(.t1):before {
        border-right: 1px solid #ccc;
        line-height: 100%;
        box-sizing: content-box;
    }

    /* Label the data */
    #content-tables-responsive td:not(.t1):before {
        content: attr(data-title);
    }

    /* end of Content Table in small display */
}

/* end of max-width: 767px */