@charset "UTF-8";


:root {
    --webyan-dark-blue: #1D3B8B;
    --webyan-sky-blue: #27C4F4;
    --webyan-light-bg: #F5F7FA;
    --webyan-border: #E9ECEF;
    --webyan-text-dark: #2D3748;
    --webyan-text-muted: #718096;
    --webyan-success: #48BB78;
    --webyan-danger: #E53E3E;
    --webyan-warning: #ECC94B;
    --webyan-white: #FFFFFF;
    --webyan-shadow: 0 4px 20px rgba(29, 59, 139, 0.08);
    --webyan-shadow-hover: 0 8px 30px rgba(29, 59, 139, 0.12);
    --webyan-radius: 16px;
    --webyan-radius-sm: 10px;
    --webyan-radius-xs: 6px;
    --webyan-transition: all 0.3s ease;
    --webyan-primary: #1D3B8B;
    --webyan-primary-light: #2a4fa3;
    --webyan-secondary: #27C4F4;
    --webyan-light: #F5F7FA;
    --webyan-light-alt: #E9ECEF;
    --webyan-dark: #1a1a2e;
    --webyan-text: #333;
    --webyan-text-muted: #6c757d;
    --webyan-success: #28a745;
    --webyan-border: #dee2e6;
    --webyan-shadow: 0 4px 20px rgba(29, 59, 139, 0.1);
    --webyan-shadow-hover: 0 8px 30px rgba(29, 59, 139, 0.15);
    --webyan-radius: 16px;
    --webyan-radius-sm: 10px;
}



@font-face {
    font-family: IBMPlexSansArabic-Regular;
    src: url(../fonts/IBMPlexSansArabic-Regular.ttf) format("truetype")
}

@font-face {
    font-family: IBMPlexSansArabic-Medium;
    src: url(../fonts/IBMPlexSansArabic-Medium.ttf) format("truetype")
}

@font-face {
    font-family: IBMPlexSansArabic-SemiBold;
    src: url(../fonts/IBMPlexSansArabic-SemiBold.ttf) format("truetype")
}

@font-face {
    font-family: IBMPlexSansArabic-Bold;
    src: url(../fonts/IBMPlexSansArabic-Bold.ttf) format("truetype")
}

.font-webyan-bold {
    font-family: IBMPlexSansArabic-Bold;
    font-weight: 700 !important
}

.font-webyan-semibold {
    font-family: IBMPlexSansArabic-SemiBold;
    font-weight: 600 !important
}

.font-webyan-medium {
    font-family: IBMPlexSansArabic-Medium;
    font-weight: 500 !important
}

.font-webyan-regular {
    font-family: IBMPlexSansArabic-Regular;
    font-weight: 400 !important
}

.ts-control {
    border: 1px solid var(--bs-border-color);
    padding: .375rem .75rem;
    width: 100%;
    overflow: hidden;
    position: relative;
    z-index: 1;
    box-sizing: border-box;
    box-shadow: none;
    border-radius: var(--bs-border-radius);
    display: flex;
    flex-wrap: wrap
}

.ts-wrapper.multi.has-items .ts-control {
    padding: calc(.375rem - 1px + -0) .75rem calc(.375rem - 4px + -0)
}

.full .ts-control {
    background-color: var(--bs-body-bg)
}

.disabled .ts-control, .disabled .ts-control * {
    cursor: default !important
}

.focus .ts-control {
    box-shadow: none
}

.ts-control > * {
    vertical-align: baseline;
    display: inline-block
}

.ts-wrapper.multi .ts-control > div {
    cursor: pointer;
    margin: 0 3px 3px 0;
    padding: 1px 5px;
    background: #efefef;
    color: #343a40;
    border: 0 solid #dee2e6
}

    .ts-wrapper.multi .ts-control > div.active {
        background: #0d6efd;
        color: #fff;
        border: 0 solid rgba(0,0,0,0)
    }

.ts-wrapper.multi.disabled .ts-control > div, .ts-wrapper.multi.disabled .ts-control > div.active {
    color: #878787;
    background: #fff;
    border: 0 solid white
}

.ts-control > input {
    flex: 1 1 auto;
    min-width: 7rem;
    display: inline-block !important;
    padding: 0 !important;
    min-height: 0 !important;
    max-height: none !important;
    max-width: 100% !important;
    margin: 0 !important;
    text-indent: 0 !important;
    border: 0 none !important;
    background: none !important;
    line-height: inherit !important;
    -webkit-user-select: auto !important;
    -moz-user-select: auto !important;
    user-select: auto !important;
    box-shadow: none !important
}

    .ts-control > input::-ms-clear {
        display: none
    }

    .ts-control > input:focus {
        outline: none !important
    }

.has-items .ts-control > input {
    margin: 0 4px !important
}

.ts-control.rtl {
    text-align: right
}

    .ts-control.rtl.single .ts-control:after {
        left: calc(.75rem + 5px);
        right: auto
    }

    .ts-control.rtl .ts-control > input {
        margin: 0 4px 0 -2px !important
    }

.disabled .ts-control {
    opacity: .5;
    background-color: var(--bs-secondary-bg)
}

.input-hidden .ts-control > input {
    opacity: 0;
    position: absolute;
    left: -10000px
}

.ts-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    z-index: 10;
    border: 1px solid #d0d0d0;
    background: var(--bs-body-bg);
    margin: .25rem 0 0;
    border-top: 0 none;
    box-sizing: border-box;
    box-shadow: 0 1px 3px #0000001a;
    border-radius: 0 0 var(--bs-border-radius) var(--bs-border-radius)
}

    .ts-dropdown [data-selectable] {
        cursor: pointer;
        overflow: hidden
    }

        .ts-dropdown [data-selectable] .highlight {
            background: #ffed2866;
            border-radius: 1px
        }

    .ts-dropdown .option, .ts-dropdown .optgroup-header, .ts-dropdown .no-results, .ts-dropdown .create {
        padding: 3px .75rem
    }

    .ts-dropdown .option, .ts-dropdown [data-disabled], .ts-dropdown [data-disabled] [data-selectable].option {
        cursor: inherit;
        opacity: .5
    }

    .ts-dropdown [data-selectable].option {
        opacity: 1;
        cursor: pointer
    }

    .ts-dropdown .optgroup:first-child .optgroup-header {
        border-top: 0 none
    }

    .ts-dropdown .optgroup-header {
        color: #6c757d;
        background: var(--bs-body-bg);
        cursor: default
    }

    .ts-dropdown .active {
        background-color: var(--bs-tertiary-bg);
        color: var(--bs-body-color)
    }

        .ts-dropdown .active.create {
            color: var(--bs-body-color)
        }

    .ts-dropdown .create {
        color: #343a4080
    }

    .ts-dropdown .spinner {
        display: inline-block;
        width: 30px;
        height: 30px;
        margin: 3px .75rem
    }

        .ts-dropdown .spinner:after {
            content: " ";
            display: block;
            width: 24px;
            height: 24px;
            margin: 3px;
            border-radius: 50%;
            border: 5px solid #d0d0d0;
            border-color: #d0d0d0 transparent #d0d0d0 transparent;
            animation: lds-dual-ring 1.2s linear infinite
        }

@keyframes lds-dual-ring {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

.ts-dropdown-content {
    overflow: hidden auto;
    max-height: 200px;
    scroll-behavior: smooth
}

.ts-wrapper.plugin-drag_drop .ts-dragging {
    color: transparent !important
}

    .ts-wrapper.plugin-drag_drop .ts-dragging > * {
        visibility: hidden !important
    }

.plugin-checkbox_options:not(.rtl) .option input {
    margin-right: .5rem
}

.plugin-checkbox_options.rtl .option input {
    margin-left: .5rem
}

.plugin-clear_button {
    --ts-pr-clear-button: 1em
}

    .plugin-clear_button .clear-button {
        opacity: 0;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: calc(.75rem - 5px);
        margin-right: 0 !important;
        background: transparent !important;
        transition: opacity .5s;
        cursor: pointer
    }

    .plugin-clear_button.form-select .clear-button, .plugin-clear_button.single .clear-button {
        right: max(var(--ts-pr-caret),.75rem)
    }

    .plugin-clear_button.focus.has-items .clear-button, .plugin-clear_button:not(.disabled):hover.has-items .clear-button {
        opacity: 1
    }

.ts-wrapper .dropdown-header {
    position: relative;
    padding: 6px .75rem;
    border-bottom: 1px solid #d0d0d0;
    background: color-mix(var(--bs-body-bg),#d0d0d0,85%);
    border-radius: var(--bs-border-radius) var(--bs-border-radius) 0 0
}

.ts-wrapper .dropdown-header-close {
    position: absolute;
    right: .75rem;
    top: 50%;
    color: #343a40;
    opacity: .4;
    margin-top: -12px;
    line-height: 20px;
    font-size: 20px !important
}

    .ts-wrapper .dropdown-header-close:hover {
        color: #000
    }

.plugin-dropdown_input.focus.dropdown-active .ts-control {
    box-shadow: none;
    border: 1px solid var(--bs-border-color);
    box-shadow: var(--bs-box-shadow-inset)
}

.plugin-dropdown_input .dropdown-input {
    border: 1px solid #d0d0d0;
    border-width: 0 0 1px;
    display: block;
    padding: .375rem .75rem;
    box-shadow: none;
    width: 100%;
    background: transparent
}

.plugin-dropdown_input.focus .ts-dropdown .dropdown-input {
    border-color: #86b7fe;
    outline: 0;
    box-shadow: 0 0 0 .25rem #0d6efd40
}

.plugin-dropdown_input .items-placeholder {
    border: 0 none !important;
    box-shadow: none !important;
    width: 100%
}

.plugin-dropdown_input.has-items .items-placeholder, .plugin-dropdown_input.dropdown-active .items-placeholder {
    display: none !important
}

.ts-wrapper.plugin-input_autogrow.has-items .ts-control > input {
    min-width: 0
}

.ts-wrapper.plugin-input_autogrow.has-items.focus .ts-control > input {
    flex: none;
    min-width: 4px
}

    .ts-wrapper.plugin-input_autogrow.has-items.focus .ts-control > input::-moz-placeholder {
        color: transparent
    }

    .ts-wrapper.plugin-input_autogrow.has-items.focus .ts-control > input::placeholder {
        color: transparent
    }

.ts-dropdown.plugin-optgroup_columns .ts-dropdown-content {
    display: flex
}

.ts-dropdown.plugin-optgroup_columns .optgroup {
    border-right: 1px solid #f2f2f2;
    border-top: 0 none;
    flex-grow: 1;
    flex-basis: 0;
    min-width: 0
}

    .ts-dropdown.plugin-optgroup_columns .optgroup:last-child {
        border-right: 0 none
    }

    .ts-dropdown.plugin-optgroup_columns .optgroup:before {
        display: none
    }

.ts-dropdown.plugin-optgroup_columns .optgroup-header {
    border-top: 0 none
}

.ts-wrapper.plugin-remove_button .item {
    display: inline-flex;
    align-items: center
}

    .ts-wrapper.plugin-remove_button .item .remove {
        color: inherit;
        text-decoration: none;
        vertical-align: middle;
        display: inline-block;
        padding: 0 5px;
        border-radius: 0 2px 2px 0;
        box-sizing: border-box
    }

        .ts-wrapper.plugin-remove_button .item .remove:hover {
            background: #0000000d
        }

.ts-wrapper.plugin-remove_button.disabled .item .remove:hover {
    background: none
}

.ts-wrapper.plugin-remove_button .remove-single {
    position: absolute;
    right: 0;
    top: 0;
    font-size: 23px
}

.ts-wrapper.plugin-remove_button:not(.rtl) .item {
    padding-right: 0 !important
}

    .ts-wrapper.plugin-remove_button:not(.rtl) .item .remove {
        border-left: 1px solid #dee2e6;
        margin-left: 5px
    }

    .ts-wrapper.plugin-remove_button:not(.rtl) .item.active .remove {
        border-left-color: #0000
    }

.ts-wrapper.plugin-remove_button:not(.rtl).disabled .item .remove {
    border-left-color: #fff
}

.ts-wrapper.plugin-remove_button.rtl .item {
    padding-left: 0 !important
}

    .ts-wrapper.plugin-remove_button.rtl .item .remove {
        border-right: 1px solid #dee2e6;
        margin-right: 5px
    }

    .ts-wrapper.plugin-remove_button.rtl .item.active .remove {
        border-right-color: #0000
    }

.ts-wrapper.plugin-remove_button.rtl.disabled .item .remove {
    border-right-color: #fff
}

:root {
    --ts-pr-clear-button: 0;
    --ts-pr-caret: 0;
    --ts-pr-min: .75rem
}

.ts-wrapper.single .ts-control, .ts-wrapper.single .ts-control input {
    cursor: pointer
}

.ts-control:not(.rtl) {
    padding-right: max(var(--ts-pr-min),var(--ts-pr-clear-button) + var(--ts-pr-caret)) !important
}

.ts-control.rtl {
    padding-left: max(var(--ts-pr-min),var(--ts-pr-clear-button) + var(--ts-pr-caret)) !important
}

.ts-wrapper {
    position: relative
}

.ts-dropdown, .ts-control, .ts-control input {
    color: #343a40;
    font-family: inherit;
    font-size: inherit;
    line-height: 1.5
}

.ts-control, .ts-wrapper.single.input-active .ts-control {
    background: var(--bs-body-bg);
    cursor: text
}

.ts-hidden-accessible {
    border: 0 !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    width: 1px !important;
    white-space: nowrap !important
}

.ts-dropdown, .ts-dropdown.form-control, .ts-dropdown.form-select {
    height: auto;
    padding: 0;
    z-index: 1000;
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color-translucent);
    border-radius: .375rem;
    box-shadow: 0 6px 12px #0000002d
}

    .ts-dropdown .optgroup-header {
        font-size: .875rem;
        line-height: 1.5
    }

    .ts-dropdown .optgroup:first-child:before {
        display: none
    }

    .ts-dropdown .optgroup:before {
        content: " ";
        display: block;
        height: 0;
        overflow: hidden;
        border-top: 1px solid var(--bs-border-color-translucent);
        margin: .5rem -.75rem
    }

    .ts-dropdown .create {
        padding-left: .75rem
    }

.ts-dropdown-content {
    padding: 5px 0
}

.ts-control {
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    display: flex;
    align-items: center
}

@media (prefers-reduced-motion: reduce) {
    .ts-control {
        transition: none
    }
}

.focus .ts-control {
    border-color: #86b7fe;
    outline: 0;
    box-shadow: 0 0 0 .25rem #0d6efd40
}

.ts-control .item {
    display: flex;
    align-items: center
}

.ts-wrapper.is-invalid, .was-validated .invalid, .was-validated :invalid + .ts-wrapper {
    border-color: var(--bs-form-invalid-color)
}

    .ts-wrapper.is-invalid:not(.single), .was-validated .invalid:not(.single), .was-validated :invalid + .ts-wrapper:not(.single) {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
        background-position: right calc(.375em + .1875rem) center;
        background-size: calc(.75em + .375rem) calc(.75em + .375rem);
        background-repeat: no-repeat
    }

    .ts-wrapper.is-invalid.single, .was-validated .invalid.single, .was-validated :invalid + .ts-wrapper.single {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"),url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
        background-position: right .75rem center,center right 2.25rem;
        background-size: 16px 12px,calc(.75em + .375rem) calc(.75em + .375rem);
        background-repeat: no-repeat
    }

    .ts-wrapper.is-invalid.focus .ts-control, .was-validated .invalid.focus .ts-control, .was-validated :invalid + .ts-wrapper.focus .ts-control {
        border-color: var(--bs-form-invalid-color);
        box-shadow: 0 0 0 .25rem rgba(var(--bs-form-invalid-color),.25)
    }

.ts-wrapper.is-valid, .was-validated .valid, .was-validated :valid + .ts-wrapper {
    border-color: var(--bs-form-valid-color)
}

    .ts-wrapper.is-valid:not(.single), .was-validated .valid:not(.single), .was-validated :valid + .ts-wrapper:not(.single) {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
        background-position: right calc(.375em + .1875rem) center;
        background-size: calc(.75em + .375rem) calc(.75em + .375rem);
        background-repeat: no-repeat
    }

    .ts-wrapper.is-valid.single, .was-validated .valid.single, .was-validated :valid + .ts-wrapper.single {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"),url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
        background-position: right .75rem center,center right 2.25rem;
        background-size: 16px 12px,calc(.75em + .375rem) calc(.75em + .375rem);
        background-repeat: no-repeat
    }

    .ts-wrapper.is-valid.focus .ts-control, .was-validated .valid.focus .ts-control, .was-validated :valid + .ts-wrapper.focus .ts-control {
        border-color: var(--bs-form-valid-color);
        box-shadow: 0 0 0 .25rem rgba(var(--bs-form-valid-color),.25)
    }

.ts-wrapper {
    min-height: calc(1.5em + .75rem + calc(var(--bs-border-width) * 2));
    display: flex
}

    .input-group-sm > .ts-wrapper, .ts-wrapper.form-select-sm, .ts-wrapper.form-control-sm {
        min-height: calc(1.5em + .5rem + calc(var(--bs-border-width) * 2))
    }

        .input-group-sm > .ts-wrapper .ts-control, .ts-wrapper.form-select-sm .ts-control, .ts-wrapper.form-control-sm .ts-control {
            border-radius: var(--bs-border-radius-sm);
            font-size: .875rem
        }

        .input-group-sm > .ts-wrapper.has-items .ts-control, .ts-wrapper.form-select-sm.has-items .ts-control, .ts-wrapper.form-control-sm.has-items .ts-control {
            font-size: .875rem;
            padding-bottom: 0
        }

        .input-group-sm > .ts-wrapper.multi.has-items .ts-control, .ts-wrapper.form-select-sm.multi.has-items .ts-control, .ts-wrapper.form-control-sm.multi.has-items .ts-control {
            padding-top: calc((calc(1.5em + .5rem + calc(var(--bs-border-width) * 2)) - 1.5 * .875rem - calc((var(--bs-border-width) + 1px) * 2)) / 2) !important
        }

    .ts-wrapper.multi.has-items .ts-control {
        padding-left: calc(.75rem - 5px);
        --ts-pr-min: calc(.75rem - 5px)
    }

    .ts-wrapper.multi .ts-control > div {
        border-radius: calc(var(--bs-border-radius) - 1px)
    }

    .input-group-lg > .ts-wrapper, .ts-wrapper.form-control-lg, .ts-wrapper.form-select-lg {
        min-height: calc(1.5em + 1rem + calc(var(--bs-border-width) * 2))
    }

        .input-group-lg > .ts-wrapper .ts-control, .ts-wrapper.form-control-lg .ts-control, .ts-wrapper.form-select-lg .ts-control {
            border-radius: var(--bs-border-radius-lg);
            font-size: 1.25rem
        }

    .ts-wrapper:not(.form-control,.form-select) {
        padding: 0;
        border: none;
        height: auto;
        box-shadow: none;
        background: none
    }

        .ts-wrapper:not(.form-control,.form-select).single .ts-control {
            background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
            background-repeat: no-repeat;
            background-position: right .75rem center;
            background-size: 16px 12px
        }

    .ts-wrapper.form-select, .ts-wrapper.single {
        --ts-pr-caret: 2.25rem
    }

    .ts-wrapper.form-control, .ts-wrapper.form-select {
        padding: 0 !important;
        height: auto;
        box-shadow: none;
        display: flex
    }

        .ts-wrapper.form-control .ts-control, .ts-wrapper.form-control.single.input-active .ts-control, .ts-wrapper.form-select .ts-control, .ts-wrapper.form-select.single.input-active .ts-control {
            border: none !important
        }

        .ts-wrapper.form-control:not(.disabled) .ts-control, .ts-wrapper.form-control:not(.disabled).single.input-active .ts-control, .ts-wrapper.form-select:not(.disabled) .ts-control, .ts-wrapper.form-select:not(.disabled).single.input-active .ts-control {
            background: transparent !important
        }

.input-group > .ts-wrapper {
    flex-grow: 1;
    width: 1%
}

    .input-group > .ts-wrapper:not(:nth-child(2)) > .ts-control {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0
    }

    .input-group > .ts-wrapper:not(:last-child) > .ts-control {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0
    }

[data-theme=light] {
    --background-white: #ffffff;
    --background-body: #f9fafb;
    --background-app-bar: rgba(249, 250, 251, .9490196078);
    --background-card: #ffffff;
    --background-menu: #ffffff;
    --background-notification: #ffffff;
    --background-notification-info: #f5faff;
    --background-oncolor: #ffffff;
    --background-oncolor-light: rgba(255, 255, 255, .3);
    --background-oncolor-lightest: rgba(255, 255, 255, .2);
    --background-neutral-25: #263c84;
    --background-neutral-50: #f9fafb;
    --background-neutral-100: #f3f4f6;
    --background-neutral-200: #e5e7eb;
    --background-neutral-300: #263c84;
    --background-neutral-400: #9da4ae;
    --background-neutral-800: #1f2a37;
    --background-black: #0d121c;
    --background-primary: #24c2ec;
    --background-primary-light: #e6f4f2;
    --background-primary-300: #ffffff;
    --background-primary-700: #263c84;
    --background-bottom-nav: #00493a;
    --background-nav-header: #00493a;
    --background-rate: #f8b83d;
    --background-warning: #d28f0f;
    --background-info: #1570ef;
    --background-success: #067647;
    --background-danger: #df6441;
    --background-error: #d92d20;
    --background-success-25: #f6fef9;
    --background-info-25: #f5faff;
    --background-warning-25: #fefaf3;
    --background-error-25: #fffbfa;
    --background-secondary: #003f6a;
    --background-secondary-500: #336588;
    --border-black: #0d121c;
    --border-white: #ffffff;
    --border-primary: #24c2ec;
    --border-secondary: #003f6a;
    --border-secondary-hover: #92acc0;
    --border-neutral-primary: #263c84;
    --border-neutral-secondary: #e5e7eb;
    --border-neutral-tertiary: #f3f4f6;
    --border-background-white: #ffffff;
    --border-white-40: rgba(255, 255, 255, .4);
    --border-oncolor-transparent-30: rgba(255, 255, 255, .3);
    --border-transparent-10: rgba(255, 255, 255, .1);
    --border-info: #175cd3;
    --border-success: #067647;
    --border-warning: #d28f0f;
    --border-error: #d92d20;
    --border-disable: #e5e7eb;
    --border-default-disabled: #9da4ae;
    --border-primary-light: #f2f9f8;
    --border-secondary-light: #92acc0;
    --border-neutral-light: #f9fafb;
    --border-info-light: #84caff;
    --border-success-light: #75e0a7;
    --border-warning-light: #fcda99;
    --border-error-light: #fda29b;
    --button-background-primary-default: #263c84;
    --button-background-primary-hovered: #24c2ec;
    --button-background-primary-pressed: #00493a;
    --button-background-primary-select: #00493a;
    --button-background-primary-focused: #263c84;
    --button-background-neutral-default: #f3f4f6;
    --button-background-neutral-hovered: #f3f4f6;
    --button-background-neutral-pressed: #e5e7eb;
    --button-background-neutral-select: #e5e7eb;
    --button-background-neutral-focused: #f3f4f6;
    --button-background-error-default: #d92d20;
    --button-background-error-hovered: #b42318;
    --button-background-error-pressed: #7a271a;
    --button-background-error-select: #7a271a;
    --button-background-error-focused: #d92d20;
    --button-background-transparent-default: rgba(255, 255, 255, 0);
    --button-background-transparent-hovered: rgba(255, 255, 255, .2);
    --button-background-transparent-pressed: rgba(255, 255, 255, .4);
    --button-background-transparent-select: rgba(255, 255, 255, .3);
    --button-background-transparent-focused: rgba(255, 255, 255, 0);
    --chart-primary-main: #263c84;
    --chart-primary-second: #24c2ec;
    --chart-primary-third: #ffffff;
    --chart-primary-forth: #e6f4f2;
    --chart-primary-fifth: #24c2ec;
    --chart-primary-sixth: #00493a;
    --chart-colored-main: #fcda99;
    --chart-colored-second: #24c2ec;
    --chart-colored-third: #ffffff;
    --chart-colored-forth: #84caff;
    --chart-colored-fifth: #80519f;
    --chart-colored-sixth: #e58367;
    --chart-primary-seventh: #384250;
    --chart-colored-seventh: #003f6a;
    --control-primary: rgba(255, 255, 255, 0);
    --control-primary-checked: #24c2ec;
    --control-primary-hovered: #24c2ec;
    --control-primary-pressed: #00493a;
    --control-primary-focused: #24c2ec;
    --control-pressed: #263c84;
    --control-ripple-effect: #f3f4f6;
    --control-neutral-checked: #0d121c;
    --control-neutral-hovered: #4d5761;
    --control-neutral-pressed: #6c737f;
    --control-neutral-focused: #0d121c;
    --control-border: #6c737f;
    --control-border-disabled: #9da4ae;
    --control-disabled: #263c84;
    --control-icon-hovered: #ffffff;
    --control-icon-pressed: #ffffff;
    --control-icon-disabled: #ffffff;
    --field-background-default: #ffffff;
    --field-background-lighter: #263c84;
    --field-background-darker: #f3f4f6;
    --field-background-pressed: #f3f4f6;
    --field-text-label: #0d121c;
    --field-text-filled: #0d121c;
    --field-text-placeholder: #6c737f;
    --field-border-default: #9da4ae;
    --field-border-hover: #384250;
    --field-border-pressed: #0d121c;
    --field-border-error: #b42318;
    --field-border-success: #067647;
    --option-background-hover: #f3f4f6;
    --option-background-pressed: #e5e7eb;
    --datecell-today-background-default: rgba(255, 255, 255, 0);
    --datecell-today-background-hover: #e5e7eb;
    --datecell-today-background-pressed: #263c84;
    --datecell-today-background-focused: rgba(255, 255, 255, 0);
    --datecell-background-disabled: #ffffff;
    --datecell-background-100: #e6f4f2;
    --textarea-scrollbar-bar: #263c84;
    --input-text-disabled: #9da4ae;
    --background-disabled: #e5e7eb;
    --background-inverse-disabled: #f3f4f6;
    --background-primary-disabled: #ffffff;
    --background-secondary-disabled: #92acc0;
    --icon-default: #0d121c;
    --icon-default-light: #9da4ae;
    --icon-oncolor: #ffffff;
    --icon-primary: #263c84;
    --icon-secondary: #003f6a;
    --icon-neutral: #384250;
    --icon-success: #067647;
    --icon-info: #175cd3;
    --icon-warning: #d28f0f;
    --icon-error: #b42318;
    --icon-default-disabled: #9da4ae;
    --icon-background-primary-light: #f2f9f8;
    --icon-background-secondary-light: #f2f5f7;
    --icon-background-neutral-light: #f9fafb;
    --icon-background-success-light: #ecfdf3;
    --icon-background-info-light: #eff8ff;
    --icon-background-warning-light: #fefaf3;
    --icon-background-error-light: #fef3f2;
    --text-default: #0d121c;
    --text-primary: #263c84;
    --text-secondary: #003f6a;
    --text-display: #f3f4f6;
    --text-tertiary: #6c737f;
    --text-primary-paragraph: #384250;
    --text-secondary-paragraph: #6c737f;
    --text-success: #067647;
    --text-info: #175cd3;
    --text-warning: #8d600a;
    --text-error: #b42318;
    --text-default-disabled: #9da4ae;
    --text-oncolor: #ffffff;
    --text-offcolor: #000000;
    --text-oncolor-secondary: rgba(255, 255, 255, .8);
    --text-oncolor-tertiary: rgba(13, 18, 28, .7);
    --text-notification-info: #175cd3;
    --tag-background-neutral-light: #f9fafb;
    --tag-text-neutral: #1f2a37;
    --tag-icon-neutral: brightness(0) saturate(100%) invert(14%) sepia(46%) saturate(393%) hue-rotate(173deg) brightness(93%) contrast(95%);
    --tag-background-warning-light: #fefaf3;
    --tag-text-warning: #8d600a;
    --tag-icon-warning: brightness(0) saturate(100%) invert(41%) sepia(62%) saturate(1251%) hue-rotate(17deg) brightness(97%) contrast(90%);
    --tag-background-success-light: #ecfdf3;
    --tag-text-success: #067647;
    --tag-icon-success: brightness(0) saturate(100%) invert(27%) sepia(70%) saturate(1376%) hue-rotate(126deg) brightness(96%) contrast(95%);
    --tag-background-info-light: #eff8ff;
    --tag-text-info: #175cd3;
    --tag-icon-info: brightness(0) saturate(100%) invert(25%) sepia(66%) saturate(2579%) hue-rotate(209deg) brightness(93%) contrast(95%);
    --tooltip-background-light: #ffffff;
    --tooltip-background-dark: #1f2a37;
    --notification-info-background: #f5faff;
    --notification-info-text: #1570ef;
    --notification-info-border: #1570ef
}

[data-theme=dark] {
    --background-white: #0d121c;
    --background-body: #0d121c;
    --background-app-bar: rgba(13, 18, 28, .9490196078);
    --background-card: #1f2a37;
    --background-menu: #000000;
    --background-notification: #000000;
    --background-notification-info: #414752;
    --background-oncolor: #000000;
    --background-oncolor-light: rgba(13, 18, 28, .3);
    --background-oncolor-lightest: rgba(13, 18, 28, .2);
    --background-neutral-25: #0d121c;
    --background-neutral-50: #111927;
    --background-neutral-100: rgba(255, 255, 255, .1);
    --background-neutral-200: #384250;
    --background-neutral-300: #4d5761;
    --background-neutral-400: #6c737f;
    --background-neutral-800: #f3f4f6;
    --background-black: #263c84;
    --background-primary: #24c2ec;
    --background-primary-light: #e6f4f2;
    --background-primary-300: #ffffff;
    --background-primary-700: #263c84;
    --background-bottom-nav: #00493a;
    --background-nav-header: #00493a;
    --background-rate: #f8b83d;
    --background-warning: #d28f0f;
    --background-info: #1570ef;
    --background-success: #067647;
    --background-danger: #df6441;
    --background-error: #d92d20;
    --background-success-25: #f6fef9;
    --background-info-25: #f5faff;
    --background-warning-25: #fefaf3;
    --background-error-25: #fffbfa;
    --background-secondary: #003f6a;
    --background-secondary-500: #336588;
    --border-black: #263c84;
    --border-white: #000000;
    --border-primary: #24c2ec;
    --border-secondary: #003f6a;
    --border-secondary-hover: #92acc0;
    --border-neutral-primary: #1f2a37;
    --border-neutral-secondary: #e5e7eb;
    --border-neutral-tertiary: #4d5761;
    --border-background-white: #000000;
    --border-white-40: rgba(255, 255, 255, .4);
    --border-oncolor-transparent-30: rgba(255, 255, 255, .3);
    --border-transparent-10: rgba(255, 255, 255, .1);
    --border-info: #175cd3;
    --border-success: #067647;
    --border-warning: #d28f0f;
    --border-error: #d92d20;
    --border-disable: #e5e7eb;
    --border-default-disabled: #9da4ae;
    --border-primary-light: #f2f9f8;
    --border-secondary-light: rgba(255, 255, 255, .4);
    --border-neutral-light: #f9fafb;
    --border-info-light: #84caff;
    --border-success-light: #75e0a7;
    --border-warning-light: #fcda99;
    --border-error-light: #fda29b;
    --button-background-primary-default: #263c84;
    --button-background-primary-hovered: #24c2ec;
    --button-background-primary-pressed: #00493a;
    --button-background-primary-select: #00493a;
    --button-background-primary-focused: #263c84;
    --button-background-neutral-default: #1f2a37;
    --button-background-neutral-hovered: #f3f4f6;
    --button-background-neutral-pressed: #e5e7eb;
    --button-background-neutral-select: #e5e7eb;
    --button-background-neutral-focused: #f3f4f6;
    --button-background-error-default: #d92d20;
    --button-background-error-hovered: #b42318;
    --button-background-error-pressed: #7a271a;
    --button-background-error-select: #7a271a;
    --button-background-error-focused: #d92d20;
    --button-background-transparent-default: rgba(255, 255, 255, 0);
    --button-background-transparent-hovered: rgba(255, 255, 255, .2);
    --button-background-transparent-pressed: rgba(255, 255, 255, .4);
    --button-background-transparent-select: rgba(255, 255, 255, .3);
    --button-background-transparent-focused: rgba(255, 255, 255, 0);
    --chart-primary-main: #263c84;
    --chart-primary-second: #24c2ec;
    --chart-primary-third: #ffffff;
    --chart-primary-forth: #e6f4f2;
    --chart-primary-fifth: #24c2ec;
    --chart-primary-sixth: #00493a;
    --chart-colored-main: #fcda99;
    --chart-colored-second: #24c2ec;
    --chart-colored-third: #ffffff;
    --chart-colored-forth: #84caff;
    --chart-colored-fifth: #80519f;
    --chart-colored-sixth: #e58367;
    --chart-primary-seventh: #384250;
    --chart-colored-seventh: #003f6a;
    --control-primary: rgba(255, 255, 255, 0);
    --control-primary-checked: #24c2ec;
    --control-primary-hovered: #24c2ec;
    --control-primary-pressed: #00493a;
    --control-primary-focused: #24c2ec;
    --control-pressed: #263c84;
    --control-ripple-effect: #f3f4f6;
    --control-neutral-checked: #0d121c;
    --control-neutral-hovered: #4d5761;
    --control-neutral-pressed: #6c737f;
    --control-neutral-focused: #0d121c;
    --control-border: #6c737f;
    --control-border-disabled: #9da4ae;
    --control-disabled: #263c84;
    --control-icon-hovered: #ffffff;
    --control-icon-pressed: #ffffff;
    --control-icon-disabled: #ffffff;
    --field-background-default: #0d121c;
    --field-background-lighter: #263c84;
    --field-background-darker: #f3f4f6;
    --field-background-pressed: #f3f4f6;
    --field-text-label: #0d121c;
    --field-text-filled: #0d121c;
    --field-text-placeholder: #6c737f;
    --field-border-default: #9da4ae;
    --field-border-hover: #384250;
    --field-border-pressed: #0d121c;
    --field-border-error: #b42318;
    --field-border-success: #067647;
    --option-background-hover: #f3f4f6;
    --option-background-pressed: #e5e7eb;
    --datecell-today-background-default: rgba(255, 255, 255, 0);
    --datecell-today-background-hover: #e5e7eb;
    --datecell-today-background-pressed: #263c84;
    --datecell-today-background-focused: rgba(255, 255, 255, 0);
    --datecell-background-disabled: #ffffff;
    --datecell-background-100: #e6f4f2;
    --textarea-scrollbar-bar: #263c84;
    --input-text-disabled: #9da4ae;
    --background-disabled: #e5e7eb;
    --background-inverse-disabled: #f3f4f6;
    --background-primary-disabled: #ffffff;
    --background-secondary-disabled: #92acc0;
    --icon-default: #0d121c;
    --icon-default-light: #9da4ae;
    --icon-oncolor: #ffffff;
    --icon-primary: #263c84;
    --icon-secondary: #003f6a;
    --icon-neutral: #384250;
    --icon-success: #067647;
    --icon-info: #175cd3;
    --icon-warning: #d28f0f;
    --icon-error: #b42318;
    --icon-default-disabled: #9da4ae;
    --icon-background-primary-light: #f2f9f8;
    --icon-background-secondary-light: #f2f5f7;
    --icon-background-neutral-light: #f9fafb;
    --icon-background-success-light: #ecfdf3;
    --icon-background-info-light: #eff8ff;
    --icon-background-warning-light: #fefaf3;
    --icon-background-error-light: #fef3f2;
    --text-default: #ffffff;
    --text-primary: #24c2ec;
    --text-secondary: #ffffff;
    --text-display: #1f2a37;
    --text-tertiary: #263c84;
    --text-primary-paragraph: #e5e7eb;
    --text-secondary-paragraph: #263c84;
    --text-success: #067647;
    --text-info: #175cd3;
    --text-warning: #8d600a;
    --text-error: #b42318;
    --text-default-disabled: #e5e7eb;
    --text-oncolor: #000000;
    --text-offcolor: #ffffff;
    --text-oncolor-secondary: rgba(13, 18, 28, .8);
    --text-oncolor-tertiary: rgba(13, 18, 28, .7);
    --tag-text-neutral: #f3f4f6;
    --tag-icon-neutral: brightness(0) saturate(100%) invert(98%) sepia(11%) saturate(288%) hue-rotate(177deg) brightness(99%) contrast(94%);
    --tag-background-warning-light: rgba(248, 184, 61, .15);
    --tag-text-warning: #fefaf3;
    --tag-icon-warning: brightness(0) saturate(100%) invert(97%) sepia(3%) saturate(1176%) hue-rotate(319deg) brightness(103%) contrast(100%);
    --tag-background-success-light: rgba(23, 178, 106, .15);
    --tag-text-success: #ecfdf3;
    --tag-icon-success: brightness(0) saturate(100%) invert(83%) sepia(12%) saturate(1281%) hue-rotate(94deg) brightness(92%) contrast(97%);
    --tag-background-info-light: rgba(21, 112, 239, .15);
    --tag-text-info: #eff8ff;
    --tag-icon-info: brightness(0) saturate(100%) invert(66%) sepia(76%) saturate(388%) hue-rotate(179deg) brightness(101%) contrast(102%);
    --text-notification-info: #d1e9ff;
    --tag-background-neutral-light: rgba(255, 255, 255, .2);
    --tooltip-background-light: #ffffff;
    --tooltip-background-dark: #1f2a37;
    --notification-info-background: rgba(245, 250, 255, .2);
    --notification-info-text: #d1e9ff;
    --notification-info-border: #84caff
}

:root {
    --bs-body-bg: var(--background-white) !important;
    --bs-body-bg-rgb: var(--background-body) !important;
    --bs-body-color: var(--text-default) !important;
    --bs-card-bg: var(--background-card) !important;
    --bs-border-color-translucent: var(--border-neutral-secondary) !important;
    --bs-modal-bg: var(--background-card) !important;
    --bs-accordion-active-color: var(--text-default) !important;
    --bs-white-rgb: var(--text-oncolor) !important;
    --bs-link-color-rgb: var(--text-default) !important
}

[data-theme=dark] .bg-primary-s {
    background-color: #fff3 !important
}

    [data-theme=dark] .bg-primary-s img {
        filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(0%) hue-rotate(212deg) brightness(105%) contrast(106%) !important
    }

[data-theme=dark] .btn-outline-secondary svg {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(0%) hue-rotate(212deg) brightness(105%) contrast(106%) !important
}

[data-theme=dark] .card-case-description {
    -webkit-backdrop-filter: blur(15px);
    backdrop-filter: blur(15px);
    background-color: #0d121cf2
}

.background-white, .bg-white {
    background-color: var(--background-white) !important
}

.text-white {
    color: var(--background-white) !important
}

.tag-background-neutral-light {
    background-color: var(--tag-background-neutral-light);
    border: var(--border-neutral-secondary) !important
}

.border-neutral-secondary {
    border: var(--border-neutral-secondary) !important
}

.card-case-description {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    background-color: var(--background-white)
}


.main-header {
    background-color: #fff
}

@media screen and (max-width: 992px) {
    .main-header:has(.navbar-collapse.collapse.show) {
        /* background-color: #263c84; */
    }
}

.webyan-user-menu {
    transform: none !important;
    min-width: 100% !important
}

.remove-scrollbar::-webkit-scrollbar {
    display: none
}

.remove-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none
}

.little-donor-link {
    transition: all 1s ease
}

    .little-donor-link a.nav-link {
        background-image: url(../images/little-donor-bg.svg)
    }

    .little-donor-link:hover a.nav-link {
        background-color: #e6f4f2 !important;
        transition: all 1s ease
    }

        .little-donor-link:hover a.nav-link:before {
            content: none !important
        }

    .little-donor-link:hover .little-donor-face {
        inset-inline-end: -30px !important;
        transition: all 1s ease
    }

@media (max-width: 767.98px) {
    .little-donor-link {
        position: static !important
    }

        .little-donor-link a.nav-link {
            background-image: none !important;
            background-color: transparent !important;
            position: static !important
        }
}

::-webkit-scrollbar-thumb:hover {
    background: #12a875
}

#quickDonationWrapper {
    transition: width .3s ease,opacity .3s ease;
    overflow: hidden;
    width: 0;
    opacity: 0;
    white-space: nowrap;
    display: inline-block
}

    #quickDonationWrapper.show {
        width: 330px;
        opacity: 1
    }

.qd-btn-select {
    transition: background-color .5s ease-out,color .5s ease-out
}

.loading-circles {
    font-size: 100px;
    --duration: 1s;
    --num-dot: 10;
    --color-dot: $primary-6;
    --box-color: rgb(50, 50, 50)
}

    .loading-circles > * {
        position: absolute;
        top: 50px;
        left: 50px;
        transform: rotate(calc(360deg / var(--num-dot) * var(--index)))
    }

        .loading-circles > *:before {
            position: absolute;
            content: "";
            top: 18px;
            left: 1px;
            width: 10px;
            height: 10px;
            transform: scale(0);
            border-radius: 50%;
            background-color: #24c2ec;
            animation: scaleTo1 var(--duration) ease-in-out calc(var(--duration) / var(--num-dot) * var(--index)) infinite reverse
        }

@keyframes scaleTo1 {
    0% {
        transform: scale(0)
    }

    to {
        transform: scale(1)
    }
}

.loading-circles {
    width: 100px;
    aspect-ratio: 1;
    position: relative
}

    .loading-circles:before {
        content: "";
        position: absolute;
        top: 1px;
        left: 1px;
        right: 1px;
        bottom: 1px;
        border-radius: 50%;
        background-color: #f3f4f6
    }

.issue-image .progress-bar[aria-valuenow="100"]:after {
    content: "";
    position: absolute;
    inset-inline-end: 4px;
    z-index: 100000000;
    width: 21px;
    height: 21px;
    background-repeat: no-repeat;
    bottom: 0;
    background-size: 18px
}

.border-dashed {
    border-style: dashed !important
}

.navbar-toggler-icon {
    display: block
}

.navbar-toggler[aria-expanded=true] .navbar-toggler-icon {
    display: none
}

.navbar-toggler[aria-expanded=true]:after {
    content: "✕";
    font-size: 24px;
    font-weight: 700;
    display: block;
    color: #000;
    padding: 0 5px
}

.overlay {
    position: fixed;
    top: 0;
    right: calc(100% - 138px);
    width: 100%;
    height: 100%;
    background: #00000080;
    z-index: 100;
    opacity: 0;
    visibility: hidden;
    transition: opacity .3s ease-in-out,visibility .3s ease-in-out
}

.navbar-toggler[aria-expanded=true] ~ .overlay {
    opacity: 1;
    visibility: visible
}

.search-bar {
    left: 50%;
    transform: translate(-50%);
    padding: 50px;
    background-color: #fff
}

@media (min-width: 768px) {
    .search-responsive {
        position: relative
    }
}

@media (max-width: 767px) {
    .search-responsive {
        position: absolute;
        top: 41px;
        inset-inline-start: 0;
        padding: 10px
    }

    .search-bar {
        left: 50%;
        transform: translate(-50%);
        padding: 50px;
        background-color: #fff;
        z-index: 555
    }
}

footer {
    background-color: #263c84;
}

    footer .border-bottom {
        --border-opacity: .3;
        border-bottom: 1px solid rgba(255,255,255,.3) !important
    }

    footer .footer-link:hover {
        text-decoration: underline
    }

.share-modal.popup-modal {
    background: transparent
}

.share-modal .modal-head {
    display: flex;
    align-items: center;
    margin-block-end: 44px
}

    .share-modal .modal-head h6, .share-modal .modal-head .h6 {
        color: #75e0a7;
        font-size: 24px
    }

    .share-modal .modal-head .modal-close {
        font-size: 20px;
        margin-inline-end: 15px;
        color: #fcda99;
        opacity: 1
    }

.share-modal .seperator {
    width: 100%;
    height: 2px;
    background: #263c84;
    margin-block-end: 30px
}

.share-modal .link-label {
    display: flex;
    align-items: center;
    margin-block-end: 15px
}

    .share-modal .link-label .text {
        font-size: 18px;
        color: #175cd3
    }

.share-modal .social-icons .btn {
    padding: 2px;
    border: 2px solid transparent;
    transition: all .3s ease-in
}

    .share-modal .social-icons .btn > div {
        width: 24px;
        height: 24px;
        display: flex;
        justify-content: center;
        align-items: center;
        transition: all .3s ease-in
    }

        .share-modal .social-icons .btn > div img {
            max-width: 100%;
            max-height: 50%
        }

.share-modal .social-icons .watsapp:hover {
    border: 2px solid #17b26a
}

    .share-modal .social-icons .watsapp:hover > div {
        box-shadow: 0 0 3px #17b26a
    }

.share-modal .social-icons .twitter:hover {
    border: 2px solid #1570ef
}

    .share-modal .social-icons .twitter:hover > div {
        box-shadow: 0 0 3px #1570ef
    }

.share-modal .social-icons .facebook:hover {
    border: 2px solid #194185
}

    .share-modal .social-icons .facebook:hover > div {
        box-shadow: 0 0 3px #194185
    }

.title-only-modal .modal-title {
    max-width: 300px
}

#customWizard .step-wrapper:not(:last-child):after {
    content: "";
    position: absolute;
    width: -webkit-fill-available;
    height: 2px;
    top: 16px;
    inset-inline-start: 32px;
    background-color: #263c84;
    opacity: .5
}

@media screen and (max-width: 768px) {
    #customWizard .step-wrapper.mahdi-details-step:after {
        width: 80%
    }
}

#customWizard .step-wrapper.active:not(:last-child):after {
    background-color: #24c2ec
}

#customWizard .step-wrapper.complete-step .step-label {
    background-color: #24c2ec
}

#customWizard .step-wrapper.complete-step .complete-step-icon {
    display: inline !important
}

#customWizard .step-wrapper.complete-step .step-number {
    display: none
}

#customWizard .step-wrapper.current-step .step-label {
    border-color: #24c2ec !important
}

#customWizard .step-wrapper.current-step .step-number {
    color: #24c2ec
}

.waqf-home-wrapper {
    position: relative
}

    .waqf-home-wrapper:before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: #24c2ec;
        opacity: .05
    }

.video-container {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    border-radius: 20px
}

#youtubeVideo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
    z-index: 2;
    border-radius: 21px;
    padding: 3px
}

.progress-line {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    pointer-events: none;
    z-index: 2
}

    .progress-line .line {
        position: absolute;
        background-color: #24c2ec
    }

    .progress-line .top, .progress-line .bottom {
        height: 2%;
        width: 0
    }

@media (max-width: 767.98px) {
    .progress-line .top, .progress-line .bottom {
        height: 5%
    }
}

.progress-line .left, .progress-line .right {
    width: 2%;
    height: 0
}

@media (max-width: 767.98px) {
    .progress-line .left, .progress-line .right {
        width: 5%
    }
}

#donations-feilds .bg-size-cover {
    box-shadow: #00493a 0 -216px 86px -136px inset
}

.services {
    display: -webkit-box;
    max-width: 100%;
    line-height: 1.4;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis
}

@media screen and (max-width: 768px) {
    .services {
        line-height: 1.5
    }
}

.opportunitiesCarousel .card {
    min-width: 340px !important
}

@media (max-width: 575.98px) {
    .opportunitiesCarousel .card {
        min-width: 300px !important
    }
}

.opportunitiesCarousel .d-home-block {
    display: block !important
}

.opportunitiesCarousel .d-home-none {
    display: none !important
}

.just-validate-error-label, .phone-login-error:not(:empty), #SenderNameErr, #mobileNumberErr, #SenderNameErrSyn, #otpErrorMsg, #errorWrapper, #requiredFiles, .field-validation-error {
    flex: 0 0 auto;
    width: 100%;
    display: flex;
    color: #b42318 !important;
    font-size: 12px !important;
    margin-inline: 4px !important;
    align-items: center
}

    .just-validate-error-label:before, .phone-login-error:not(:empty):before, #SenderNameErr:before, #mobileNumberErr:before, #SenderNameErrSyn:before, #otpErrorMsg:before, #errorWrapper:before, #requiredFiles:before, .field-validation-error:before {
        content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M8.00065 10.6654V7.9987M8.00065 5.33203H8.00732M14.6673 7.9987C14.6673 11.6806 11.6826 14.6654 8.00065 14.6654C4.31875 14.6654 1.33398 11.6806 1.33398 7.9987C1.33398 4.3168 4.31875 1.33203 8.00065 1.33203C11.6826 1.33203 14.6673 4.3168 14.6673 7.9987Z' stroke='%23B42318' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
        width: 21px;
        height: 15px
    }

#SenderNameErr, #mobileNumberErr, #SenderNameErrSyn {
    margin: 6px
}

.phone-login-error:not(:empty) {
    margin-top: 8px
}

input:has(+.phone-login-error:not(:empty)) {
    border-color: #b42318 !important
}

.input-group > .ts-wrapper {
    flex-grow: unset;
    width: 115px
}

.ts-dropdown-content {
    text-align: start
}

.input-group .ts-dropdown {
    width: -moz-min-content !important;
    width: min-content !important
}

.input-group > .ts-wrapper:not(:nth-child(2)) > .ts-control {
    border-start-start-radius: 0;
    border-end-start-radius: 0;
    border-inline-start: 0;
    border-end-end-radius: var(--bs-border-radius);
    border-start-end-radius: var(--bs-border-radius)
}

.input-group .ts-control {
    padding: 7px .75rem !important;
    justify-content: center;
    opacity: 1 !important
}

.form-select, .ts-wrapper:not(.form-control,.form-select).single .ts-control {
    background-position: left .75rem center;
    background-color: transparent !important
}

.ts-wrapper.form-control:not(.disabled) .ts-control {
    color: var(--background-neutral-800) !important
}

.ts-dropdown .active {
    background-color: var(--background-neutral-50) !important;
    color: var(--background-neutral-800) !important
}

.ts-control {
    padding-inline: .75rem !important
}

    .ts-control > input {
        min-width: auto !important
    }

.focus .ts-control {
    box-shadow: none !important;
    border-color: var(--bs-border-color) !important
}

.cart-content .focus .ts-control {
    border-color: var(--bs-border-color) !important
}

.ts-wrapper.multi .ts-control > div {
    padding-right: 11px !important
}

.custom-select-focus.input-hidden .ts-control > input {
    left: 0 !important
}

.ts-control:not(.rtl) {
    padding-inline: .75rem !important;
    padding-inline-start: .75rem !important;
    padding-inline-end: .75rem !important
}

.ts-wrapper {
    height: 40px !important
}

    .ts-wrapper .ts-control {
        height: 40px !important;
        padding: 0 !important
    }

.form-select {
    background-color: var(--field-background-default) !important
}

    .form-select:focus {
        box-shadow: none
    }

    .form-select:disabled {
        color: #9da4ae;
        border-color: #263c84 !important
    }

    .form-select::-moz-placeholder {
        color: var(--field-text-placeholder)
    }

    .form-select::placeholder {
        color: var(--field-text-placeholder)
    }

    .form-select .ts-control {
        padding-inline: 12px !important
    }

    .form-select .ts-dropdown {
        background-color: #fff !important
    }

.ts-wrapper .ts-control {
    padding-inline-start: 8px !important
}

body {
    --bs-body-font-family: IBMPlexSansArabic-Medium !important;
    --bs-body-font-size: 16px !important;
    -webkit-font-smoothing: antialiased;
    font-synthesis: none !important
}

::-webkit-input-placeholder {
    color: var(--field-text-placeholder)
}

:-moz-placeholder {
    color: var(--field-text-placeholder);
    opacity: 1
}

::-moz-placeholder {
    color: var(--field-text-placeholder);
    opacity: 1
}

:-ms-input-placeholder {
    color: var(--field-text-placeholder)
}

.g-recaptcha > div {
    margin: 0 auto
}

.rc-anchor-light {
    background-color: var(--background-body) !important;
    color: var(--text-default) !important
}

.ejar-btn .btn-check:checked + .btn, .ejar-btn :not(.btn-check) + .btn:active, .ejar-btn .btn:first-child:active, .ejar-btn .btn.active, .ejar-btn .btn.show {
    background-color: #263c84
}

@media screen and (max-width: 768px) {
    body:has(.g-recaptcha) {
        overflow-x: hidden
    }

    #recaptcha-container {
        transform: scale(.77);
        -webkit-transform: scale(.77);
        transform-origin: 0 0;
        -webkit-transform-origin: 0 0
    }

    .g-recaptcha-bubble-arrow {
        display: none
    }

        .g-recaptcha-bubble-arrow + div {
            position: fixed !important;
            left: 50%;
            top: 50%;
            transform: translate(-50%,-50%);
            -webkit-transform: translate(-50%,-50%)
        }
}

.ejar-just-validate .just-validate-error-label {
    position: absolute
}

.ejar-just-validate-header .just-validate-error-label {
    position: absolute;
    top: 48px
}

.custom-bullet-list {
    list-style: none;
    padding-right: 1.5rem;
    font-family: webyan-regular,sans-serif
}

    .custom-bullet-list li {
        position: relative;
        margin-bottom: .5rem
    }

        .custom-bullet-list li:before {
            content: "";
            position: absolute;
            right: -13px;
            top: .8em;
            width: 4px;
            height: 4px;
            border-radius: 50%;
            background-color: #000
        }

.gheras-grid {
    table-layout: fixed;
    width: 100%
}

    .gheras-grid th {
        background-color: #f3f4f6
    }

    .gheras-grid tr:nth-child(2n) {
        --bs-table-bg: $neutral-s;
        background-color: #f9fafb
    }

@media (min-width: 768px) {
    .opacity-md-100 {
        opacity: 100% !important
    }
}

@media screen and (max-width: 768px) {
    .invoice-container {
        background-color: #fff
    }
}

@media screen and (max-width: 768px) {
    .login.header_inner_main {
        justify-content: center
    }
}

#loginAnimationDev {
    width: 100%;
    transition: all 1.3s ease-in-out
}

.text-white {
    color: #fff !important
}




::-webkit-scrollbar {
    width: 6px;
}



::-webkit-scrollbar-thumb {
    background: #263c84;
    border-radius: 5px;
}

    ::-webkit-scrollbar-thumb:hover {
        background: #24c2ec;
    }




/*////ccc*/

@media (min-width: 1400px) {
    .w-xxl-72px {
        width: 72px !important
    }

    .h-xxl-72px {
        height: 72px !important
    }

    .m-w-xxl-72px {
        min-width: 72px !important
    }

    .m-h-xxl-72px {
        min-height: 72px !important
    }
}

.w-75px {
    width: 75px
}

.h-75px {
    height: 75px
}

.min-w-75px {
    min-width: 75px !important
}

.min-h-75px {
    min-height: 75px
}

.min-vh-75px {
    min-height: calc(100vh - 75px)
}

.max-w-75px {
    max-width: 75px !important
}

.max-h-75px {
    max-height: 75px
}

.border-width-75px {
    border-width: 75px !important
}

@media (max-width: 575.98px) {
    .w-sm-75px {
        width: 75px !important
    }

    .h-sm-75px {
        height: 75px !important
    }

    .m-w-sm-75px {
        min-width: 75px !important
    }

    .m-h-sm-75px {
        min-height: 75px !important
    }
}

@media (min-width: 768px) {
    .w-md-75px {
        width: 75px !important
    }

    .h-md-75px {
        height: 75px !important
    }

    .max-w-md-75px {
        max-width: 75px !important
    }

    .m-w-md-75px {
        min-width: 75px !important
    }

    .m-h-md-75px {
        min-height: 75px !important
    }
}

@media (min-width: 992px) {
    .w-lg-75px {
        width: 75px !important
    }

    .h-lg-75px {
        height: 75px !important
    }

    .m-w-lg-75px {
        min-width: 75px !important
    }

    .m-h-lg-75px {
        min-height: 75px !important
    }
}

@media (min-width: 1200px) {
    .w-xl-75px {
        width: 75px !important
    }

    .h-xl-75px {
        height: 75px !important
    }

    .m-w-xl-75px {
        min-width: 75px !important
    }

    .m-h-xl-75px {
        min-height: 75px !important
    }
}

@media (min-width: 1400px) {
    .w-xxl-75px {
        width: 75px !important
    }

    .h-xxl-75px {
        height: 75px !important
    }

    .m-w-xxl-75px {
        min-width: 75px !important
    }

    .m-h-xxl-75px {
        min-height: 75px !important
    }
}

.w-80px {
    width: 80px
}

.h-80px {
    height: 80px
}

.min-w-80px {
    min-width: 80px !important
}

.min-h-80px {
    min-height: 80px
}

.min-vh-80px {
    min-height: calc(100vh - 80px)
}

.max-w-80px {
    max-width: 80px !important
}

.max-h-80px {
    max-height: 80px
}

.border-width-80px {
    border-width: 80px !important
}

@media (max-width: 575.98px) {
    .w-sm-80px {
        width: 80px !important
    }

    .h-sm-80px {
        height: 80px !important
    }

    .m-w-sm-80px {
        min-width: 80px !important
    }

    .m-h-sm-80px {
        min-height: 80px !important
    }
}

@media (min-width: 768px) {
    .w-md-80px {
        width: 80px !important
    }

    .h-md-80px {
        height: 80px !important
    }

    .max-w-md-80px {
        max-width: 80px !important
    }

    .m-w-md-80px {
        min-width: 80px !important
    }

    .m-h-md-80px {
        min-height: 80px !important
    }
}

@media (min-width: 992px) {
    .w-lg-80px {
        width: 80px !important
    }

    .h-lg-80px {
        height: 80px !important
    }

    .m-w-lg-80px {
        min-width: 80px !important
    }

    .m-h-lg-80px {
        min-height: 80px !important
    }
}

@media (min-width: 1200px) {
    .w-xl-80px {
        width: 80px !important
    }

    .h-xl-80px {
        height: 80px !important
    }

    .m-w-xl-80px {
        min-width: 80px !important
    }

    .m-h-xl-80px {
        min-height: 80px !important
    }
}

@media (min-width: 1400px) {
    .w-xxl-80px {
        width: 80px !important
    }

    .h-xxl-80px {
        height: 80px !important
    }

    .m-w-xxl-80px {
        min-width: 80px !important
    }

    .m-h-xxl-80px {
        min-height: 80px !important
    }
}

.w-88px {
    width: 88px
}

.h-88px {
    height: 88px
}

.min-w-88px {
    min-width: 88px !important
}

.min-h-88px {
    min-height: 88px
}

.min-vh-88px {
    min-height: calc(100vh - 88px)
}

.max-w-88px {
    max-width: 88px !important
}

.max-h-88px {
    max-height: 88px
}

.border-width-88px {
    border-width: 88px !important
}

@media (max-width: 575.98px) {
    .w-sm-88px {
        width: 88px !important
    }

    .h-sm-88px {
        height: 88px !important
    }

    .m-w-sm-88px {
        min-width: 88px !important
    }

    .m-h-sm-88px {
        min-height: 88px !important
    }
}

@media (min-width: 768px) {
    .w-md-88px {
        width: 88px !important
    }

    .h-md-88px {
        height: 88px !important
    }

    .max-w-md-88px {
        max-width: 88px !important
    }

    .m-w-md-88px {
        min-width: 88px !important
    }

    .m-h-md-88px {
        min-height: 88px !important
    }
}

@media (min-width: 992px) {
    .w-lg-88px {
        width: 88px !important
    }

    .h-lg-88px {
        height: 88px !important
    }

    .m-w-lg-88px {
        min-width: 88px !important
    }

    .m-h-lg-88px {
        min-height: 88px !important
    }
}

@media (min-width: 1200px) {
    .w-xl-88px {
        width: 88px !important
    }

    .h-xl-88px {
        height: 88px !important
    }

    .m-w-xl-88px {
        min-width: 88px !important
    }

    .m-h-xl-88px {
        min-height: 88px !important
    }
}

@media (min-width: 1400px) {
    .w-xxl-88px {
        width: 88px !important
    }

    .h-xxl-88px {
        height: 88px !important
    }

    .m-w-xxl-88px {
        min-width: 88px !important
    }

    .m-h-xxl-88px {
        min-height: 88px !important
    }
}

.w-90px {
    width: 90px
}

.h-90px {
    height: 90px
}

.min-w-90px {
    min-width: 90px !important
}

.min-h-90px {
    min-height: 90px
}

.min-vh-90px {
    min-height: calc(100vh - 90px)
}

.max-w-90px {
    max-width: 90px !important
}

.max-h-90px {
    max-height: 90px
}

.border-width-90px {
    border-width: 90px !important
}

@media (max-width: 575.98px) {
    .w-sm-90px {
        width: 90px !important
    }

    .h-sm-90px {
        height: 90px !important
    }

    .m-w-sm-90px {
        min-width: 90px !important
    }

    .m-h-sm-90px {
        min-height: 90px !important
    }
}

@media (min-width: 768px) {
    .w-md-90px {
        width: 90px !important
    }

    .h-md-90px {
        height: 90px !important
    }

    .max-w-md-90px {
        max-width: 90px !important
    }

    .m-w-md-90px {
        min-width: 90px !important
    }

    .m-h-md-90px {
        min-height: 90px !important
    }
}

@media (min-width: 992px) {
    .w-lg-90px {
        width: 90px !important
    }

    .h-lg-90px {
        height: 90px !important
    }

    .m-w-lg-90px {
        min-width: 90px !important
    }

    .m-h-lg-90px {
        min-height: 90px !important
    }
}

@media (min-width: 1200px) {
    .w-xl-90px {
        width: 90px !important
    }

    .h-xl-90px {
        height: 90px !important
    }

    .m-w-xl-90px {
        min-width: 90px !important
    }

    .m-h-xl-90px {
        min-height: 90px !important
    }
}

@media (min-width: 1400px) {
    .w-xxl-90px {
        width: 90px !important
    }

    .h-xxl-90px {
        height: 90px !important
    }

    .m-w-xxl-90px {
        min-width: 90px !important
    }

    .m-h-xxl-90px {
        min-height: 90px !important
    }
}

.w-93px {
    width: 93px
}

.h-93px {
    height: 93px
}

.min-w-93px {
    min-width: 93px !important
}

.min-h-93px {
    min-height: 93px
}

.min-vh-93px {
    min-height: calc(100vh - 93px)
}

.max-w-93px {
    max-width: 93px !important
}

.max-h-93px {
    max-height: 93px
}

.border-width-93px {
    border-width: 93px !important
}

@media (max-width: 575.98px) {
    .w-sm-93px {
        width: 93px !important
    }

    .h-sm-93px {
        height: 93px !important
    }

    .m-w-sm-93px {
        min-width: 93px !important
    }

    .m-h-sm-93px {
        min-height: 93px !important
    }
}

@media (min-width: 768px) {
    .w-md-93px {
        width: 93px !important
    }

    .h-md-93px {
        height: 93px !important
    }

    .max-w-md-93px {
        max-width: 93px !important
    }

    .m-w-md-93px {
        min-width: 93px !important
    }

    .m-h-md-93px {
        min-height: 93px !important
    }
}

@media (min-width: 992px) {
    .w-lg-93px {
        width: 93px !important
    }

    .h-lg-93px {
        height: 93px !important
    }

    .m-w-lg-93px {
        min-width: 93px !important
    }

    .m-h-lg-93px {
        min-height: 93px !important
    }
}

@media (min-width: 1200px) {
    .w-xl-93px {
        width: 93px !important
    }

    .h-xl-93px {
        height: 93px !important
    }

    .m-w-xl-93px {
        min-width: 93px !important
    }

    .m-h-xl-93px {
        min-height: 93px !important
    }
}

@media (min-width: 1400px) {
    .w-xxl-93px {
        width: 93px !important
    }

    .h-xxl-93px {
        height: 93px !important
    }

    .m-w-xxl-93px {
        min-width: 93px !important
    }

    .m-h-xxl-93px {
        min-height: 93px !important
    }
}

.w-95px {
    width: 95px
}

.h-95px {
    height: 95px
}
.top-95px {
    inset-block-start: 95px
}
.start-100px {
    inset-inline-start: 100px
}

.end-100px, .left-100px, .inset-end-100px {
    inset-inline-end: 100px
}

.right-100px {
    inset-inline-start: 100px
}

.top-100px {
    inset-block-start: 100px
}

.bottom-100px {
    inset-block-end: 100px
}

@media (max-width: 575.98px) {
    .start-sm-100px {
        inset-inline-start: 100px !important
    }

    .end-sm-100px, .left-sm-100px, .inset-end-sm-100px {
        inset-inline-end: 100px !important
    }

    .right-sm-100px {
        inset-inline-start: 100px !important
    }

    .top-sm-100px {
        inset-block-start: 100px !important
    }

    .bottom-sm-100px {
        inset-block-end: 100px !important
    }
}

@media (min-width: 768px) {
    .start-md-100px {
        inset-inline-start: 100px !important
    }

    .end-md-100px, .left-md-100px, .inset-end-md-100px {
        inset-inline-end: 100px !important
    }

    .right-md-100px {
        inset-inline-start: 100px !important
    }

    .top-md-100px {
        inset-block-start: 100px !important
    }

    .bottom-md-100px {
        inset-block-end: 100px !important
    }
}

@media (min-width: 992px) {
    .start-lg-100px {
        inset-inline-start: 100px !important
    }

    .end-lg-100px, .left-lg-100px, .inset-end-lg-100px {
        inset-inline-end: 100px !important
    }

    .right-lg-100px {
        inset-inline-start: 100px !important
    }

    .top-lg-100px {
        inset-block-start: 100px !important
    }

    .bottom-lg-100px {
        inset-block-end: 100px !important
    }
}

@media (min-width: 1200px) {
    .start-xl-100px {
        inset-inline-start: 100px !important
    }

    .end-xl-100px, .left-xl-100px, .inset-end-xl-100px {
        inset-inline-end: 100px !important
    }

    .right-xl-100px {
        inset-inline-start: 100px !important
    }

    .top-xl-100px {
        inset-block-start: 100px !important
    }

    .bottom-xl-100px {
        inset-block-end: 100px !important
    }
}

@media (min-width: 1400px) {
    .start-xxl-100px {
        inset-inline-start: 100px !important
    }

    .end-xxl-100px, .left-xxl-100px, .inset-end-xxl-100px {
        inset-inline-end: 100px !important
    }

    .right-xxl-100px {
        inset-inline-start: 100px !important
    }

    .top-xxl-100px {
        inset-block-start: 100px !important
    }

    .bottom-xxl-100px {
        inset-block-end: 100px !important
    }
}

.start-110px {
    inset-inline-start: 110px
}

.end-110px, .left-110px, .inset-end-110px {
    inset-inline-end: 110px
}

.right-110px {
    inset-inline-start: 110px
}

.top-110px {
    inset-block-start: 110px
}

.bottom-110px {
    inset-block-end: 110px
}

@media (max-width: 575.98px) {
    .start-sm-110px {
        inset-inline-start: 110px !important
    }

    .end-sm-110px, .left-sm-110px, .inset-end-sm-110px {
        inset-inline-end: 110px !important
    }

    .right-sm-110px {
        inset-inline-start: 110px !important
    }

    .top-sm-110px {
        inset-block-start: 110px !important
    }

    .bottom-sm-110px {
        inset-block-end: 110px !important
    }
}

.min-w-95px {
    min-width: 95px !important
}

.min-h-95px {
    min-height: 95px
}

.min-vh-95px {
    min-height: calc(100vh - 95px)
}

.max-w-95px {
    max-width: 95px !important
}

.max-h-95px {
    max-height: 95px
}

.border-width-95px {
    border-width: 95px !important
}

@media (max-width: 575.98px) {
    .w-sm-95px {
        width: 95px !important
    }

    .h-sm-95px {
        height: 95px !important
    }

    .m-w-sm-95px {
        min-width: 95px !important
    }

    .m-h-sm-95px {
        min-height: 95px !important
    }
}

@media (min-width: 768px) {
    .w-md-95px {
        width: 95px !important
    }

    .h-md-95px {
        height: 95px !important
    }

    .max-w-md-95px {
        max-width: 95px !important
    }

    .m-w-md-95px {
        min-width: 95px !important
    }

    .m-h-md-95px {
        min-height: 95px !important
    }
}
.start-10px {
    inset-inline-start: 10px
}
.right-130px {
    inset-inline-start: 130px
}

.top-130px {
    inset-block-start: 130px
}

.bottom-130px {
    inset-block-end: 130px
}

@media (min-width: 992px) {
    .w-lg-95px {
        width: 95px !important
    }

    .h-lg-95px {
        height: 95px !important
    }

    .m-w-lg-95px {
        min-width: 95px !important
    }

    .m-h-lg-95px {
        min-height: 95px !important
    }
}

@media (min-width: 1200px) {
    .w-xl-95px {
        width: 95px !important
    }

    .h-xl-95px {
        height: 95px !important
    }

    .m-w-xl-95px {
        min-width: 95px !important
    }

    .m-h-xl-95px {
        min-height: 95px !important
    }
}

@media (min-width: 1400px) {
    .w-xxl-95px {
        width: 95px !important
    }

    .h-xxl-95px {
        height: 95px !important
    }

    .m-w-xxl-95px {
        min-width: 95px !important
    }

    .m-h-xxl-95px {
        min-height: 95px !important
    }
}

.w-100px {
    width: 100px
}

.h-100px {
    height: 100px
}

.min-w-100px {
    min-width: 100px !important
}

.min-h-100px {
    min-height: 100px
}

.min-vh-100px {
    min-height: calc(100vh - 100px)
}

.max-w-100px {
    max-width: 100px !important
}

.max-h-100px {
    max-height: 100px
}

.border-width-100px {
    border-width: 100px !important
}
.h-100 {
    height: 100% !important
}


@media (max-width: 575.98px) {
    .w-sm-100px {
        width: 100px !important
    }

    .h-sm-100px {
        height: 100px !important
    }

    .m-w-sm-100px {
        min-width: 100px !important
    }

    .m-h-sm-100px {
        min-height: 100px !important
    }
}

@media (min-width: 768px) {
    .w-md-100px {
        width: 100px !important
    }

    .h-md-100px {
        height: 100px !important
    }

    .max-w-md-100px {
        max-width: 100px !important
    }

    .m-w-md-100px {
        min-width: 100px !important
    }

    .m-h-md-100px {
        min-height: 100px !important
    }
}

@media (min-width: 992px) {
    .w-lg-100px {
        width: 100px !important
    }

    .h-lg-100px {
        height: 100px !important
    }

    .m-w-lg-100px {
        min-width: 100px !important
    }

    .m-h-lg-100px {
        min-height: 100px !important
    }
}

@media (min-width: 1200px) {
    .w-xl-100px {
        width: 100px !important
    }

    .h-xl-100px {
        height: 100px !important
    }

    .m-w-xl-100px {
        min-width: 100px !important
    }

    .m-h-xl-100px {
        min-height: 100px !important
    }
}

@media (min-width: 1400px) {
    .w-xxl-100px {
        width: 100px !important
    }

    .h-xxl-100px {
        height: 100px !important
    }

    .m-w-xxl-100px {
        min-width: 100px !important
    }

    .m-h-xxl-100px {
        min-height: 100px !important
    }
}

.w-104px {
    width: 104px
}

.h-104px {
    height: 104px
}

.min-w-104px {
    min-width: 104px !important
}

.min-h-104px {
    min-height: 104px
}

.min-vh-104px {
    min-height: calc(100vh - 104px)
}

.max-w-104px {
    max-width: 104px !important
}

.max-h-104px {
    max-height: 104px
}

.border-width-104px {
    border-width: 104px !important
}

@media (max-width: 575.98px) {
    .w-sm-104px {
        width: 104px !important
    }

    .h-sm-104px {
        height: 104px !important
    }

    .m-w-sm-104px {
        min-width: 104px !important
    }

    .m-h-sm-104px {
        min-height: 104px !important
    }
}

@media (min-width: 768px) {
    .w-md-104px {
        width: 104px !important
    }

    .h-md-104px {
        height: 104px !important
    }

    .max-w-md-104px {
        max-width: 104px !important
    }

    .m-w-md-104px {
        min-width: 104px !important
    }

    .m-h-md-104px {
        min-height: 104px !important
    }
}

@media (min-width: 992px) {
    .w-lg-104px {
        width: 104px !important
    }

    .h-lg-104px {
        height: 104px !important
    }

    .m-w-lg-104px {
        min-width: 104px !important
    }

    .m-h-lg-104px {
        min-height: 104px !important
    }
}

@media (min-width: 1200px) {
    .w-xl-104px {
        width: 104px !important
    }

    .h-xl-104px {
        height: 104px !important
    }

    .m-w-xl-104px {
        min-width: 104px !important
    }

    .m-h-xl-104px {
        min-height: 104px !important
    }
}

@media (min-width: 1400px) {
    .w-xxl-104px {
        width: 104px !important
    }

    .h-xxl-104px {
        height: 104px !important
    }

    .m-w-xxl-104px {
        min-width: 104px !important
    }

    .m-h-xxl-104px {
        min-height: 104px !important
    }
}
.w-fit-content {
    width: -moz-fit-content !important;
    width: fit-content !important
}
.py-40px {
    padding-block: 40px
}
.w-22px {
    width: 22px
}

.h-22px {
    height: 22px
}

.min-w-22px {
    min-width: 22px !important
}

.w-24px {
    width: 24px
}

.h-24px {
    height: 24px
}
.w-48px {
    width: 48px
}

.h-48px {
    height: 48px
}

.min-w-48px {
    min-width: 48px !important
}

.min-h-48px {
    min-height: 48px
}

.min-vh-48px {
    min-height: calc(100vh - 48px)
}

.h-100 {
    height: 100% !important
}

.h-auto {
    height: auto !important
}

.mh-100 {
    max-height: 100% !important
}

.vh-100 {
    height: 100vh !important
}

.min-vh-100 {
    min-height: 100vh !important
}

.top-95px {
    inset-block-start: 95px
}

@media (min-width: 768px) {
    .w-md-440px {
        width: 440px !important
    }

    .h-md-440px {
        height: 440px !important
    }

    .max-w-md-440px {
        max-width: 440px !important
    }

    .m-w-md-440px {
        min-width: 440px !important
    }

    .m-h-md-440px {
        min-height: 440px !important
    }
}
.w-40px {
    width: 40px
}

.h-40px {
    height: 40px
}
.w-330px {
    width: 330px
}

.h-330px {
    height: 330px
}

.min-w-330px {
    min-width: 330px !important
}
.bg-success-ss {
    background-color: #f6fef9 !important
}

.bg-success-s {
    background-color: #ecfdf3 !important
}

.end-20px, .left-20px, .inset-end-20px {
    inset-inline-end: 20px
}
.border-success-5 {
    border-color: #17b26a !important
}
.border-width-8px {
    border-width: 8px !important
}
.toast {
    --bs-toast-zindex: 1090;
    --bs-toast-padding-x: .75rem;
    --bs-toast-padding-y: .5rem;
    --bs-toast-spacing: 1.5rem;
    --bs-toast-max-width: 350px;
    --bs-toast-font-size: .875rem;
    --bs-toast-color:;
    --bs-toast-bg: rgba(var(--bs-body-bg-rgb), .85);
    --bs-toast-border-width: var(--bs-border-width);
    --bs-toast-border-color: var(--bs-border-color-translucent);
    --bs-toast-border-radius: var(--bs-border-radius);
    --bs-toast-box-shadow: var(--bs-box-shadow);
    --bs-toast-header-color: var(--bs-secondary-color);
    --bs-toast-header-bg: rgba(var(--bs-body-bg-rgb), .85);
    --bs-toast-header-border-color: var(--bs-border-color-translucent);
    width: var(--bs-toast-max-width);
    max-width: 100%;
    font-size: var(--bs-toast-font-size);
    color: var(--bs-toast-color);
    pointer-events: auto;
    background-color: var(--bs-toast-bg);
    background-clip: padding-box;
    border: var(--bs-toast-border-width) solid var(--bs-toast-border-color);
    box-shadow: var(--bs-toast-box-shadow);
    border-radius: var(--bs-toast-border-radius)
}

    .toast.showing {
        opacity: 0
    }

    .toast:not(.show) {
        display: none
    }

.toast-container {
    --bs-toast-zindex: 1090;
    position: absolute;
    z-index: var(--bs-toast-zindex);
    width: -moz-max-content;
    width: max-content;
    max-width: 100%;
    pointer-events: none
}

    .toast-container > :not(:last-child) {
        margin-bottom: var(--bs-toast-spacing)
    }

.toast-header {
    display: flex;
    align-items: center;
    padding: var(--bs-toast-padding-y) var(--bs-toast-padding-x);
    color: var(--bs-toast-header-color);
    background-color: var(--bs-toast-header-bg);
    background-clip: padding-box;
    border-bottom: var(--bs-toast-border-width) solid var(--bs-toast-header-border-color);
    border-start-start-radius: calc(var(--bs-toast-border-radius) - var(--bs-toast-border-width));
    border-start-end-radius: calc(var(--bs-toast-border-radius) - var(--bs-toast-border-width))
}

    .toast-header .btn-close {
        margin-right: calc(-.5 * var(--bs-toast-padding-x));
        margin-left: var(--bs-toast-padding-x)
    }

.toast-body {
    padding: var(--bs-toast-padding-x);
    word-wrap: break-word
}

.toast .btn-close {
    background-size: 10px
}

.z-3 {
    z-index: 3 !important
}
.z-50 {
    z-index: 50
}
.btn-close {
    --bs-btn-close-color: #000000;
    --bs-btn-close-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e");
    --bs-btn-close-opacity: .5;
    --bs-btn-close-hover-opacity: .75;
    --bs-btn-close-focus-shadow: 0 0 0 .25rem rgba(0, 145, 116, .25);
    --bs-btn-close-focus-opacity: 1;
    --bs-btn-close-disabled-opacity: .25;
    --bs-btn-close-white-filter: invert(1) grayscale(100%) brightness(200%);
    box-sizing: content-box;
    width: 1em;
    height: 1em;
    padding: .25em;
    color: var(--bs-btn-close-color);
    background: transparent var(--bs-btn-close-bg) center/1em auto no-repeat;
    border: 0;
    border-radius: .375rem;
    opacity: var(--bs-btn-close-opacity)
}

    .btn-close:hover {
        color: var(--bs-btn-close-color);
        text-decoration: none;
        opacity: var(--bs-btn-close-hover-opacity)
    }

    .btn-close:focus {
        outline: 0;
        box-shadow: var(--bs-btn-close-focus-shadow);
        opacity: var(--bs-btn-close-focus-opacity)
    }

    .btn-close:disabled, .btn-close.disabled {
        pointer-events: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
        opacity: var(--bs-btn-close-disabled-opacity)
    }

.btn-close-white, [data-bs-theme=dark] .btn-close {
    filter: var(--bs-btn-close-white-filter)
}
.start-10px {
    inset-inline-start: 10px
}

@media (max-width: 575.98px) {
    .start-sm-0 {
        inset-inline-start: 0 !important
    }

    .end-sm-0, .left-sm-0, .inset-end-sm-0 {
        inset-inline-end: 0 !important
    }

    .right-sm-0 {
        inset-inline-start: 0 !important
    }

    .top-sm-0 {
        inset-block-start: 0 !important
    }

    .bottom-sm-0 {
        inset-block-end: 0 !important
    }
}

.w--webkit-fill-available {
    width: -webkit-fill-available !important
}

.w-fit-content {
    width: -moz-fit-content !important;
    width: fit-content !important
}

@media (max-width: 575.98px) {
    .w-sm-fit-content {
        width: -moz-fit-content !important;
        width: fit-content !important
    }
}
.sr-only {
    clip: rect(0,0,0,0);
    border: 0;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}

.ltr-direction {
    direction: ltr;
    text-align: end
}
@media (min-width: 768px) {
    .w-md-fit-content {
        width: -moz-fit-content !important;
        width: fit-content !important
    }
}
.toast-error {
    background-color: #d92d20 !important
}
.toast-success {
    background-color: #17b26a !important
}