body {
    font-family: Tajawal;
}


@font-face {
    font-family: 'Tajawal';
    src: url('Fnts/Tajawal-Bold.ttf') format('truetype');
}

.arabicfont {
    font-family: Tajawal;
}
.table > thead {
    vertical-align: bottom;
    background-color: #4b38b3;
    color: white;
    font-size: 14px;
}


table.table-bordered.dataTable th, table.table-bordered.dataTable td {
    border-left-width: 1px;
}

table.dataTable {
  
    text-align: center;
    font-size:14px;
}



.navbar-menu .navbar-nav .nav-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: .625rem 1.5rem;
    color: white;
    font-size: .925rem;
    font-family: Tajawal;
}
.navbar-menu .navbar-nav .nav-sm .nav-link {
    padding: .55rem 1.5rem !important;
    color: white;
    position: relative;
    font-size: .8125rem;
    font-family: Tajawal;
}
.fw-semibold {
    font-weight: 500 !important;
}

.menu-title {
    letter-spacing: .05em;
    cursor: default;
    font-size: 14px;
    text-transform: uppercase;
    color: white;
    font-weight: 800;
}


.table > :not(caption) > * > * {
    padding: .1rem .2rem;
  
}

.table:not(.table-bordered) > :not(:first-child) {
    border-color: #1b1818fa;
    border-width: 1px;
    border-style: solid;
}

thead, th {
    border-color: inherit;
    border-style: solid;
    border-width: 0;
    background-color: white;
    font-size: 12px;
    font-weight: 400;
}
.modal-title {
    font-weight: 300;
}

table.dataTable td.dataTables_empty, table.dataTable th.dataTables_empty {
    text-align: center;
    padding: 50px;
    font-weight: 400;
    --vz-table-accent-bg: #efefef00;
}

itable.table-bordered.dataTable th, table.table-bordered.dataTable td {
    border-left-width: 1px;
}

.btn-group, .btn-group-vertical {
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    vertical-align: middle;
    gap: 10px;
}

.dt-buttons :is(button.dt-button,div.dt-button,a.dt-button,input.dt-button) {
    border-color: #ffbe0b;
    background: #ffbe0b;
    color: #111212;
}

.page-title-box h4 {
    font-weight: 400;
    font-size: 14px !important;
    font-family: Tajawal;
    text-transform: uppercase;
}

:is(.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6) {
    font-family: Tajawal;
    font-weight: 400;
}


/*.active > .page-link, .page-link.active {
    z-index: 3;
    color: #242c64;
    background-color: #24bbec;
    border-color: #24bbec;
}*/


.navbar-menu {
    width: var(--vz-vertical-menu-width);
    z-index: 1002;
/*    background: white;
    border-left: 1px solid var(--vz-vertical-menu-border);*/
    bottom: 0;
    margin-top: 0;
    position: fixed;
    top: 0;
    -webkit-box-shadow: var(--vz-vertical-menu-box-shadow);
    box-shadow: var(--vz-vertical-menu-box-shadow);
    padding: 0 0 calc(70px + 25px) 0;
    -webkit-transition: all .1s ease-out;
    transition: all .1s ease-out;
}
    .navbar-menu .navbar-nav .nav-link:hover {
        color: white !important;
    }

    .navbar-menu .navbar-nav .nav-link[data-bs-toggle=collapse][aria-expanded=true] {
        color: white !important;
    }
    .navbar-menu .navbar-nav .nav-link:hover {
        color: white !important;
    }
    .navbar-menu .navbar-nav .nav-sm .nav-link:hover {
        color: white;
    }
    .navbar-menu .navbar-nav .nav-sm .nav-link:before {
        content: "";
        width: 6px;
        height: 1.5px;
        background-color: white;
    }

    .navbar-menu .navbar-nav .nav-link[data-bs-toggle=collapse][aria-expanded=true]:after {
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg);
        color: white;
    }

.numInputWrapper span {
   
    opacity: 50 !important;
}
.flatpickr-months {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    background-color: #556eed !important;
    border-radius: 5px 5px 0 0;
}
    .flatpickr-months .flatpickr-prev-month svg path, .flatpickr-months .flatpickr-next-month svg path {
        -webkit-transition: fill .1s;
        transition: fill .1s;
        fill: #161617;
    }
    .flatpickr-months .flatpickr-prev-month:hover, .flatpickr-months .flatpickr-next-month:hover {
        color: black;
    }
    .flatpickr-months .flatpickr-next-month.flatpickr-prev-month, .flatpickr-months .flatpickr-prev-month.flatpickr-prev-month {
        /* right: 0; */
    }
    .flatpickr-months .flatpickr-next-month.flatpickr-next-month, .flatpickr-months .flatpickr-prev-month.flatpickr-next-month {
        /* left: 0; */
    }
.flatpickr-calendar {
    background: transparent;
    opacity: 0;
    display: none;
    text-align: center;
    visibility: hidden;
    padding: 0;
    -webkit-animation: none;
    animation: none;
    direction: rtl !important;
    border: 0;
    font-size: 14px;
    line-height: 24px;
    border-radius: 5px;
    position: absolute;
    width: 307.875px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    background: var(--vz-secondary-bg);
    -webkit-box-shadow: 1px 0 0 var(--vz-border-color), -1px 0 0 var(--vz-border-color), 0 1px 0 var(--vz-border-color), 0 -1px 0 var(--vz-border-color), 0 3px 13px rgba(0, 0, 0, 0.08);
    box-shadow: 1px 0 0 var(--vz-border-color), -1px 0 0 var(--vz-border-color), 0 1px 0 var(--vz-border-color), 0 -1px 0 var(--vz-border-color), 0 3px 13px rgba(0, 0, 0, 0.08);
}
div.dt-buttons {
    float: left !important;
}

div.dataTables_wrapper div.dataTables_filter {
    text-align: right !important;
}