@font-face {
    font-family: 'Changa';
    src: url('../../fonts/Changa/Changa-VariableFont_wght.ttf') format('truetype');
}
@font-face {
    font-family: 'ReadexPro';
    src: url('../../fonts/Readex_Pro/ReadexPro-VariableFont_HEXP,wght.ttf') format('truetype');
}

body {
    font-family: 'ReadexPro', sans-serif;
}


.form-label {
    color: var(--bs-dark) !important;
    font-size: 12px;
}
.form-label.required::after {
    content: " *";
    color: #e63946;
    font-size: 12px;
    margin: 0 4px;
}
.input-group,
.form-control,
.select2-container .select2-selection--single,
.form-check-input[type="checkbox"] {
    border: 1px solid var(--bs-gray-600) !important;
}
.form-check-input {
    border: none !important;
}
.form-check {
    width: fit-content !important;
}
.textarea {
    text-transform: none !important;
    border-radius: 0 !important;
    transition: all .3s cubic-bezier(.35, 0, .25, 1);
    box-shadow: none;
    font-size: 12px;
    line-height: 20px;
}

.input-group:not(.form-check):not(.form-switch),
.form-control:not(.textarea),
.select2-container .select2-selection--single {
    text-transform: none !important;
    border-radius: 0 !important;
    height: 36px;
    transition: all .3s cubic-bezier(.35, 0, .25, 1);
    box-shadow: none;
    font-size: 12px;
    line-height: 20px;
}
.select2-container .select2-selection--single {
    width: 100% !important;
}

.input-group:focus,
.form-control:focus,
.select2-container .select2-selection--single:focus {
    color: var(--bs-primary) !important;
    border-color: var(--bs-primary) !important;
    box-shadow: none;
}

.form-control.custom-select-control.mat-form-field.mat-focused,
.form-control:focus,
.form-control[readonly]:focus {
    background-color: var(--bs-light);
    color: var(--bs-primary) !important;
    box-shadow: none;
}

.form-control[readonly] {
    background-color: var(--bs-light);
    color: var(--bs-dark) !important;
    box-shadow: none;
}

.select2-results__option {
    font-weight: 400;
    font-size: 12px;
    color: var(--bs-dark);

}

.select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered {
    color: var(--bs-dark);
    font-size: 12px;
}

.btn {
    padding: .5rem 1.2rem !important;
    transition: all .3s cubic-bezier(.35, 0, .25, 1);
    border-radius: 0 !important;
}
.card-footer {
    background-color: var(--bs-secondary-bg) !important;
}
.card-header {
    background-color: var(--bs-secondary-bg) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    height: 60px;
}
.card-header .card-label::before {
    content: '';
    display: inline-block;
    margin-inline-end: 10px;
    height: 14px;
    width: 4px;
    background-color: var(--bs-primary);
}

.card-header,
.card-header .card-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 5px;
}
.card-header:first-child {
    border-radius: 0;
}
.card-title {
    margin: 0 !important;
}
.card-1 {
    /*box-shadow: var(--bs-box-shadow-sm) !important;*/
}
.card-2 {
    box-shadow: none !important;
    /*border: 1px solid var(--bs-gray-700) !important;*/
}
.card {
    margin: 1rem 0;
    border-radius: 0;
}

.card-header .card-label::before,
.modal .modal-header::before {
    content: '';
    display: inline-block;
    margin-inline-end: 12px;
    height: 18px;
    width: 4px;
    background-color: var(--bs-primary, #0d6efd);  /* سماوي نيون */
    vertical-align: middle;
    animation: pulse-gym 1.5s ease-in-out infinite; /* نبض خفيف */
}

@keyframes pulse-gym {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.5;
    }
}

.card-header,
.card-header .card-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 5px;
}

.card-header .card-label,
.modal .modal-title {
    font-size: 1.3rem;
    color: var(--bs-dark);
    text-transform: capitalize;
    letter-spacing: 0;
    display: flex;
    align-items: center;
    font-weight: 500 !important;
}
.card-header .card-description,
.modal .modal-description {
    margin-top: 0.6rem;
}

.modal .modal-header {
    background-color: var(--bs-secondary-bg) !important;
    border-radius: 0 !important;
}
.modal .modal-body {
    border-radius: 0 !important;
    padding-top: 2rem !important;
}

.modal .modal-title {
    font-weight: 500;
    font-size: 1rem;
}

.modal-content,
.flatpickr-calendar {
    border-radius: 0 !important;
}

.toast-title {
    margin-bottom: 1rem !important;
}

.flatpickr-calendar {
    font-size: 12px !important;
}

/* ============================= */
/*   DataTables & Tables {BS5}   */
/* ============================= */

.table > :not(:first-child) {
    border: var(--bs-light) !important;
}

.dt-layout-row:has(.dt-info) {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 20px;
}

.dt-layout-start {
    width: 50%;
}
.dt-layout-end {
    width: 50%;
}

html[dir="rtl"] .dt-layout-row:last-child {
    flex-direction: row-reverse;
}

html[dir="rtl"] .dt-layout-end {
    justify-content: flex-start;
}


/* Pagination container */
.dt-paging {
    display: flex !important;
    justify-content: flex-end !important;
}

/* Pagination buttons spacing */
.dt-paging nav {
    display: flex;
    gap: 6px;
}

/* Buttons */
.dt-paging-button {
    min-width: 35px;
    height: 35px;
    padding: 0 12px !important;
    border: none !important;
    background-color: var(--bs-light) !important;
    color: var(--bs-dark) !important;
    border-radius: 0 !important; /* Bootstrap */
    font-size: 12px;
    font-weight: 400;
    transition: all 0.3s ease-in-out;
}

/* Hover */
.dt-paging-button:hover {
    background-color: var(--bs-primary) !important;
    color: var(--bs-dark) !important;
    border: none !important;
}

/* Active Page */
.dt-paging-button.current {
    background-color: var(--bs-primary) !important;
    color: var(--bs-dark) !important;
    border: none !important;
}

/* Disabled */
.dt-paging-button.disabled {
    color: var(--bs-gray-700) !important;
    background-color: var(--bs-gray-500) !important;
    border: none !important;
    cursor: not-allowed;
    opacity: 0.7;
}

/* First / Last / Prev / Next */
.dt-paging-button.first,
.dt-paging-button.last,
.dt-paging-button.previous,
.dt-paging-button.next {

}
.dt-paging-button.first {
    display: none;
}

.avatar-sm {
    width: 2.5rem;
    height: 2.5rem;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: var(--bs-primary) !important;
}
.nav-link:focus, .nav-link:hover {
    color: var(--bs-primary) !important;
}