:root {
    --bs-primary: #3027F6 !important;
    --bs-primary-active: #0224ce !important;
    --bs-pagination-active-bg: #3027F6 !important;
    --bs-component-active-bg: #3027F6 !important;
    --bs-info: #652ddd !important;
    --bs-info-active: #5014D0 !important;
    --bs-nav-link-color: #3027F6 !important;
    --bs-link-color: #3027F6 !important;
    --bs-font-sans-serif: "Tajawal", Helvetica, "sans-serif";
    --bs-form-invalid-color: #ea868f !important;
}

.card {
    --bs-card-border-radius: 15px !important;
}

.btn {
    --bs-btn-disabled-opacity: 0.8 !important;
}

body,
html {
    font-family: var(--bs-font-sans-serif)
}

[type="tel"],
[type="url"],
[type="email"],
[type="number"] {
    direction: inherit;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    -moz-appearance: textfield;
}

.form-check-input:checked {
    background-color: var(--bs-primary) !important;
    border-color: var(--bs-primary) !important;
}

.errorMessage {
    color: var(--bs-form-invalid-color) !important
}

.dt-container {
    margin-top: 5px;
}
.datatable-wrapper-content{
    overflow-x: auto;
}

.image-input-custom-wrapper {
    border: 3px solid var(--bs-body-bg);
    box-shadow: var(--bs-box-shadow);
    width: 120px;
    height: 120px;
    border-radius: 0.475rem;
    background-repeat: no-repeat;
    background-size: cover;
}

.image-input [data-kt-image-input-action="delete"] {
    position: absolute;
    right: 100%;
    top: 100%;
}

html[dir="ltr"] .image-input [data-kt-image-input-action="delete"] {
    left: 100%;
}

html[dir="rtl"] .select2-container--bootstrap5 .select2-dropdown .select2-results__option.select2-results__option--selected:after {
    left: 1.25rem;
    right: auto;
}

a {
    cursor: pointer;
}

table.dataTable {
    text-align: center;
    vertical-align: middle;
}

div.dt-processing {
    position: absolute !important;
    top: 250px !important;
    left: 50% !important;
    width: auto !important;
    text-align: center !important;
}

@media (min-width: 1200px) {
    html[dir="rtl"] .modal {
        right: auto;
    }
}

.modal-dialog-centered {
    display: table;
    min-width: 400px;
}

.logo-default {
    width: 600px;
    height: 600px;
}

@media(min-width:993px) {
    .logo-minimize {
        display: none;
    }
}

.datatable-name {
    width: 400px !important;
}

.user-avatar-wrapper-sub {
    width: 150px;
    padding-right: 10px;
    /* padding-left: 10px; */
}

html[dir="ltr"] .user-avatar-wrapper-sub {
    padding-left: 10px;
    /* padding-right: 60px; */
}

@media (max-width: 992px) {
    .logo-default {
        display: none;
    }

    .logo-minimize {
        width: 300px !important;
        height: 300px !important;
    }
}

@media (max-width: 300px) {
    .logo-default {
        display: none;
    }

    .logo-minimize {
        width: 200px !important;
        height: 200px !important;
    }
}

.table> :not(caption)>*>* {
    padding: 0 8px;
}

.table>thead>tr>th {
    padding: 4.5px 8px;
}

.card-icon {
    font-size: 40px !important;
}

.card-main-title {
    font-size: 18px !important;
}

.card.card-flush>.card-header {
    padding-top: 40px !important;
}

.main-card {
    height: 160px !important;
}


.danger-row {
    background-color: #f8285a36 !important;
}

.dataTable tbody tr:nth-child(even) {
    background-color: #ffffff;
}

.dataTable tbody tr:nth-child(odd) {
    background-color: #1b84ff08;
}

.filterPrintDataShow {
    z-index: 107;
    position: fixed;
    inset: 0px 0px auto auto;
    margin: 0px;
    transform: translate(-1475px, 250px);
    border-radius: 10px;
}

@media(min-width:250px) and (max-width:299px) {
    .filterPrintDataShow {
        transform: translate(0px, 310px);
    }
}

@media(min-width:300px) and (max-width:589px) {
    .filterPrintDataShow {
        transform: translate(-50px, 310px);
    }
    .dataTable thead tr th {
    }
}

@media(min-width:590px) and (max-width:820px) {
    .filterPrintDataShow {
        transform: translate(-350px, 230px);
    }
}

@media(min-width:821px) and (max-width:1024px) {
    .filterPrintDataShow {
        transform: translate(-580px, 250px);
    }
}

@media(min-width:1025px) and (max-width:1120px) {
    .filterPrintDataShow {
        transform: translate(-630px, 250px);
    }
}

@media(min-width:1121px) and (max-width:1400px) {
    .filterPrintDataShow {
        transform: translate(-930px, 250px);
    }
}

@media(min-width:1401px) and (max-width:1650px) {
    .filterPrintDataShow {
        transform: translate(-930px, 250px) !important;
    }
}

@media(min-width:1651px) and (max-width:1785px) {
    .filterPrintDataShow {
        transform: translate(-1330px, 250px) !important;
    }
}

.btn.btn-secondary {
    background-color: var(--bs-secondary) !important;
}

.btn.btn-secondary:focus:not(.btn-active) .show {
    background-color: var(--bs-secondary-active) !important;
}

.buttons-dt-hsm {
    border-radius: 0;
}

.buttons-print-hsm {
    border-left: 3px solid #dee2e6 !important;
}

.dt-buttons {
    display: none !important;
}

[data-bs-theme=dark] .dataTable tbody tr:nth-child(odd) {
    background-color: #000;
}


[data-bs-theme=dark] .danger-row {
    background-color: #f8285a36 !important;
}



[data-bs-theme=dark] .dataTable tbody tr:nth-child(even) {
    background-color: #80829000;
}

.print-btn {
    border-bottom-right-radius: 10px;
    box-shadow: var(--bs-menu-dropdown-box-shadow) !important;
}

.export-btn {
    border-bottom-left-radius: 10px;
    box-shadow: var(--bs-menu-dropdown-box-shadow) !important;
}

[data-bs-theme=dark] .print-title {
    color: #fff !important;
}

[data-bs-theme=dark] .printDataCheckBoxes label {
    color: #fff !important;
}

.form-check {
    cursor: pointer;
    padding: 3px 30px !important;
}

.form-check-label {
    cursor: pointer;
}

.nav-profile-container {
    overflow-x: scroll;
    display: flex;
    overflow-y: hidden;
    flex-wrap: nowrap;
}

.fade:not(.show) {
    opacity: 0;
    display: none;
    /* height: 0; */
}

.dataTable thead {
    background-color: #0d0e12;
    vertical-align: middle;
}

.dataTable thead tr th {
    color: #ffffff !important;
}


.select2-container--bootstrap5 .select2-selection__clear {
    right: auto !important;
    left: 10px;
    width: 10px;
    height: 10px;
}

.select2-container--bootstrap5 .select2-selection--multiple .select2-selection__choice .select2-selection__choice__remove {
    height: 0.6rem;
    width: 0.6rem;
    right: auto !important;
    left: 8px;
}

html[dir="ltr"] .select2-container--bootstrap5 .select2-selection__clear {
    left: auto !important;
    right: 10px !important;
    width: 10px;
    height: 10px;
}

html[dir="ltr"] .select2-container--bootstrap5 .select2-selection--multiple .select2-selection__choice .select2-selection__choice__remove {
    height: 0.6rem;
    width: 0.6rem;
    left: auto !important;
    right: 10px !important;
}

.error-stepper {
    background-color: #F8285A !important;
}

.modal {
    z-index: 1050 !important;
}

.modal-backdrop {
    z-index: 1049 !important;
}