#toast-container>div{
	background-repeat: no-repeat !important;
    background-position-y: center !important;
    background-position-y: center !important;}
.toast-error{
	background:red !important;

}.toast-success{
	background:green !important;
}
.formio-component-ar *{
	text-align:right !important
}
.avatar img{
    width:40px !important;
    height:40px !important;
}

[dir=rtl] table.dataTable thead th{
    text-align: center;
}

  
  .loader-rm-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    z-index: 999999;
}

.logo {
    width: 100px;
    /* Adjust size as needed */
    height: 100px;
    /* Replace 'path_to_your_logo.png' with your logo */
    background-size: contain;
    background-repeat: no-repeat;
}

.app-brand-logo img {
    object-fit: contain;
    width:150px;
    height:70px
}

.circles {
    display: flex;
    margin-top: 20px;
}

.circle {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: #007bff;
    /* Adjust color as needed */
    margin: 0 5px;
    animation: moveUpDown 0.5s infinite alternate;
    animation-delay: calc(0.2s * var(--index));
    /* Stagger the animation */
}

@keyframes moveUpDown {
    from {
        transform: translateY(0);
    }

    to {
        transform: translateY(10px);
    }
}

.hide-loader {
    animation: godown 1s forwards;

}

@keyframes godown {
    from {
        transform: translateY(0%);
    }

    to {
        transform: translateY(20%);
        opacity: 0;
        visibility: hidden;
    }
}

.timeline .timeline-item .timeline-event {
    min-height: auto;
    padding: 1.1rem 1.5rem 0.2rem;
}

.light-style table.dataTable th, .light-style table.dataTable td {
    border-color: var(--bs-border-color) !important;
}
.dataTables_scrollHeadInner, table.table.table-hover.text-nowrap.text-center.ajax-server.dataTable.no-footer {
    min-width: 100%;
}
.dir-rtl{
    direction: rtl !important;
}

/* ==========================================================================
   Universal Arabic / RTL Select & Select2 Styling Fix
   ========================================================================== */

/* 1. Universal Select2 Single Selection in RTL */
html[dir="rtl"] .select2-container--default .select2-selection--single,
body[dir="rtl"] .select2-container--default .select2-selection--single,
[dir="rtl"] .select2-container--default .select2-selection--single,
.select2-container--default[dir="rtl"] .select2-selection--single {
    height: 38px !important;
    min-height: 38px !important;
    border: 1px solid #d9dee3 !important;
    border-radius: 0.375rem !important;
    background-color: #ffffff !important;
    display: flex !important;
    align-items: center !important;
    position: relative !important;
}

/* 2. Select2 Single Rendered Text in RTL */
html[dir="rtl"] .select2-container--default .select2-selection--single .select2-selection__rendered,
body[dir="rtl"] .select2-container--default .select2-selection--single .select2-selection__rendered,
[dir="rtl"] .select2-container--default .select2-selection--single .select2-selection__rendered,
.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__rendered,
html[dir="rtl"] .light-style .select2-container--default .select2-selection--single .select2-selection__rendered,
body[dir="rtl"] .light-style .select2-container--default .select2-selection--single .select2-selection__rendered,
[dir="rtl"] .light-style .select2-container--default .select2-selection--single .select2-selection__rendered {
    direction: rtl !important;
    text-align: right !important;
    padding-right: 14px !important;
    padding-left: 36px !important;
    line-height: 36px !important;
    color: #566a7f !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* 3. Select2 Single Arrow in RTL - Placed on the LEFT */
html[dir="rtl"] .select2-container--default .select2-selection--single .select2-selection__arrow,
body[dir="rtl"] .select2-container--default .select2-selection--single .select2-selection__arrow,
[dir="rtl"] .select2-container--default .select2-selection--single .select2-selection__arrow,
.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow,
html[dir="rtl"] .light-style .select2-container--default .select2-selection--single .select2-selection__arrow,
body[dir="rtl"] .light-style .select2-container--default .select2-selection--single .select2-selection__arrow,
[dir="rtl"] .light-style .select2-container--default .select2-selection--single .select2-selection__arrow {
    left: 8px !important;
    right: auto !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    height: 20px !important;
    width: 20px !important;
    position: absolute !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

html[dir="rtl"] .select2-container--default .select2-selection--single .select2-selection__arrow b,
body[dir="rtl"] .select2-container--default .select2-selection--single .select2-selection__arrow b,
[dir="rtl"] .select2-container--default .select2-selection--single .select2-selection__arrow b,
.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow b {
    position: static !important;
    margin: 0 !important;
}

/* 4. Select2 Clear button in RTL */
html[dir="rtl"] .select2-container--default .select2-selection--single .select2-selection__clear,
body[dir="rtl"] .select2-container--default .select2-selection--single .select2-selection__clear,
[dir="rtl"] .select2-container--default .select2-selection--single .select2-selection__clear,
.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear {
    float: left !important;
    margin-left: 24px !important;
    margin-right: 0 !important;
    color: #a5a3ae !important;
}

/* 5. Select2 Dropdown and Options in RTL */
html[dir="rtl"] .select2-dropdown,
body[dir="rtl"] .select2-dropdown,
[dir="rtl"] .select2-dropdown {
    direction: rtl !important;
    text-align: right !important;
    border-color: #dbdade !important;
    border-radius: 0.375rem !important;
}

html[dir="rtl"] .select2-results__option,
body[dir="rtl"] .select2-results__option,
[dir="rtl"] .select2-results__option {
    direction: rtl !important;
    text-align: right !important;
    padding-right: 12px !important;
    padding-left: 12px !important;
}

html[dir="rtl"] .select2-search--dropdown .select2-search__field,
body[dir="rtl"] .select2-search--dropdown .select2-search__field,
[dir="rtl"] .select2-search--dropdown .select2-search__field {
    direction: rtl !important;
    text-align: right !important;
    padding-right: 10px !important;
    padding-left: 10px !important;
}

/* 6. Native HTML Select & Bootstrap form-select in RTL */
html[dir="rtl"] select.form-select,
body[dir="rtl"] select.form-select,
[dir="rtl"] select.form-select,
html[dir="rtl"] select.form-control,
body[dir="rtl"] select.form-control,
[dir="rtl"] select.form-control {
    direction: rtl !important;
    text-align: right !important;
    background-position: left 0.75rem center !important;
    padding-left: 2.25rem !important;
    padding-right: 0.875rem !important;
}

/* 7. Choices.js / Form.io Select in RTL */
html[dir="rtl"] .choices,
body[dir="rtl"] .choices,
[dir="rtl"] .choices {
    direction: rtl !important;
    text-align: right !important;
}

html[dir="rtl"] .choices[data-type*="select-one"]:after,
body[dir="rtl"] .choices[data-type*="select-one"]:after,
[dir="rtl"] .choices[data-type*="select-one"]:after {
    left: 14px !important;
    right: auto !important;
}

html[dir="rtl"] .choices[data-type*="select-one"] .choices__button,
body[dir="rtl"] .choices[data-type*="select-one"] .choices__button,
[dir="rtl"] .choices[data-type*="select-one"] .choices__button {
    right: auto !important;
    left: 28px !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
}

html[dir="rtl"] .choices[data-type*="select-one"] .choices__inner,
body[dir="rtl"] .choices[data-type*="select-one"] .choices__inner,
[dir="rtl"] .choices[data-type*="select-one"] .choices__inner {
    padding-right: 14px !important;
    padding-left: 55px !important;
    text-align: right !important;
    min-height: 38px !important;
    border-radius: 0.375rem !important;
}

html[dir="rtl"] .choices__list--single,
body[dir="rtl"] .choices__list--single,
[dir="rtl"] .choices__list--single {
    padding-right: 0 !important;
    padding-left: 0 !important;
    text-align: right !important;
}

html[dir="rtl"] .choices__list--single .choices__item,
body[dir="rtl"] .choices__list--single .choices__item,
[dir="rtl"] .choices__list--single .choices__item {
    text-align: right !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

html[dir="rtl"] .choices__list--dropdown,
body[dir="rtl"] .choices__list--dropdown,
[dir="rtl"] .choices__list--dropdown {
    direction: rtl !important;
    text-align: right !important;
    border-radius: 0.375rem !important;
}

html[dir="rtl"] .choices__list--dropdown .choices__item,
body[dir="rtl"] .choices__list--dropdown .choices__item,
[dir="rtl"] .choices__list--dropdown .choices__item {
    text-align: right !important;
    padding-right: 14px !important;
    padding-left: 14px !important;
}

html[dir="rtl"] .choices__list--dropdown .choices__item--selectable:after,
body[dir="rtl"] .choices__list--dropdown .choices__item--selectable:after,
[dir="rtl"] .choices__list--dropdown .choices__item--selectable:after {
    left: 12px !important;
    right: auto !important;
}

html[dir="rtl"] .choices__list--dropdown .choices__input,
body[dir="rtl"] .choices__list--dropdown .choices__input,
[dir="rtl"] .choices__list--dropdown .choices__input {
    text-align: right !important;
    direction: rtl !important;
    padding-right: 12px !important;
    padding-left: 12px !important;
}

html[dir="rtl"] .choices[data-type*="select-multiple"] .choices__inner,
body[dir="rtl"] .choices[data-type*="select-multiple"] .choices__inner,
[dir="rtl"] .choices[data-type*="select-multiple"] .choices__inner {
    padding-right: 8px !important;
    padding-left: 8px !important;
    text-align: right !important;
    border-radius: 0.375rem !important;
}

html[dir="rtl"] .choices[data-type*="select-multiple"] .choices__list--multiple .choices__item,
body[dir="rtl"] .choices[data-type*="select-multiple"] .choices__list--multiple .choices__item,
[dir="rtl"] .choices[data-type*="select-multiple"] .choices__list--multiple .choices__item {
    float: right !important;
    margin-right: 0 !important;
    margin-left: 6px !important;
    padding-right: 8px !important;
    padding-left: 4px !important;
    direction: rtl !important;
}

html[dir="rtl"] .choices[data-type*="select-multiple"] .choices__list--multiple .choices__item .choices__button,
body[dir="rtl"] .choices[data-type*="select-multiple"] .choices__list--multiple .choices__item .choices__button,
[dir="rtl"] .choices[data-type*="select-multiple"] .choices__list--multiple .choices__item .choices__button {
    float: left !important;
    margin: 0 6px 0 -2px !important;
    padding-left: 0 !important;
    padding-right: 14px !important;
    border-left: none !important;
    border-right: 1px solid rgba(255, 255, 255, 0.4) !important;
}