﻿.loading-spinner {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 106;
    background-color: #ffffff45;
}

a {
    text-decoration: none;
}

.footer.footer-ctx, .secRateFees, .testimonial-slider-main, .divmarchantlist, .secmembership-plans, .mdtrackModal {
    font-family: anekdevanagari-regular;
}

    .footer.footer-ctx h5, .footer.footer-ctx h2, .secRateFees h5, .secRateFees h2, .testimonial-slider-main h5, .testimonial-slider-main h2, .divmarchantlist h5, .divmarchantlist h2, .secmembership-plans h5, .secmembership-plans h2, .mdtrackModal h5, .mdtrackModal h2, .footer.footer-ctx h4, .secRateFees h4, .testimonial-slider-main h4, .divmarchantlist h4, .secmembership-plans h4, .mdtrackModal h4 {
        font-family: anekdevanagari-medium;
    }

.sfPageContainer .RadDock .rdContent {
    font-family: anekdevanagari-regular !important;
}

body[lang='ar'] .footer.footer-ctx, body[lang='ar'] .secRateFees, body[lang='ar'] .testimonial-slider-main, body[lang='ar'] .divmarchantlist, body[lang='ar'] .secmembership-plans, body[lang='ar'] .mdtrackModal {
    font-family: tajawal-regular;
}

    body[lang='ar'] .footer.footer-ctx h5, body[lang='ar'] .footer.footer-ctx h2, body[lang='ar'] .secRateFees h5, body[lang='ar'] .secRateFees h2, body[lang='ar'] .testimonial-slider-main h5, body[lang='ar'] .testimonial-slider-main h2, body[lang='ar'] .divmarchantlist h5, body[lang='ar'] .divmarchantlist h2, body[lang='ar'] .secmembership-plans h5, body[lang='ar'] .secmembership-plans h2, body[lang='ar'] .mdtrackModal h5, body[lang='ar'] .mdtrackModal h2, body[lang='ar'] .footer.footer-ctx h4, body[lang='ar'] .secRateFees h4, body[lang='ar'] .testimonial-slider-main h4, body[lang='ar'] .divmarchantlist h4, body[lang='ar'] .secmembership-plans h4, body[lang='ar'] .mdtrackModal h4 {
        font-family: tajawal-medium;
    }

body[lang='ar'] .sfPageContainer .RadDock .rdContent {
    font-family: tajawal-regular !important;
}

.backimge {
    background-image: url(/Assets/Images/Background.png);
    background-repeat: no-repeat;
    background-size: 100%;
    max-width: 100%;
    background-color: #FAFAFC;
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(-360deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(-360deg);
    }
}

.loading-spinner.js-spinner {
    z-index: 999999999999999999 !important;
}


div:not(:has(input)), ul:not(:has(input)) {
    caret-color: transparent;
}

.mt-32 {
    margin-top: 32px;
}

.mt-8 {
    margin-top: 8px;
}

.ms-16 {
    margin-left: 16px;
}

/*.................................DropDown.........................*/
.select2-dropdown {
    font-family: anekdevanagari-regular !important;
}

.drpdwn-with-label {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--Spaces-Space-2Xsmall, 4px);
}

    .drpdwn-with-label .select2-container {
        width: 100% !important;
        font-family: anekdevanagari-regular !important;
    }

    .drpdwn-with-label .select2-container--default .select2-selection--single .select2-selection__rendered {
        height: 56px !important;
        padding-top: 14px;
        line-height: unset !important;
    }

    .drpdwn-with-label .select2-container .select2-selection {
        height: 56px !important;
    }

    .drpdwn-with-label .select2-selection__rendered span {
        height: fit-content;
    }

.select2-with-icon .select2-container--default .select2-selection--single .select2-selection__arrow b {
    background-image: url(../Images/dropdown-arrow.svg);
    background-color: transparent;
    background-size: contain;
    border: none !important;
    height: 14px !important;
    width: 16px !important;
    margin: auto !important;
    top: 4px;
    left: auto !important;
}

.select2-with-icon .select2-container--default .select2-selection--single .select2-selection__arrow {
    top: 18px;
    right: 8px;
}

body[lang="ar"] .select2-with-icon .select2-container--default .select2-selection--single .select2-selection__arrow {
    left: 8px;
    right: 0px;
}

/*.................................Input.........................*/
.input-with-label {
}

.form-input-text {
    display: flex;
    padding: var(--Spaces-Space-Meduim, 16px);
    align-items: center;
    gap: var(--Spaces-Space-Small, 12px);
    align-self: stretch;
    border: 1px solid var(--Colors-Borders-Border-Secondary, #DFDEE7);
    background: var(--Colors-Surface-Surface-White, #FFF);
    width: 100%;
}

/*..................................Buttons......................*/
.button-org {
    display: flex;
    padding: var(--Spaces-Space-XSmall, 8px) var(--Spaces-Space-Meduim, 16px);
    justify-content: center;
    align-items: center;
    gap: var(--Spaces-Space-XSmall, 8px);
    background: var(--Colors-Surface-Surface-Brand, #FF795C);
    border: 1px solid var(--Colors-Borders-Border-Primary, #FF795C);
    color: #fff;
}

    .button-org:disabled {
        opacity: 0.5;
        cursor: not-allowed;
    }

.button-white {
    display: flex;
    padding: var(--Spaces-Space-XSmall, 8px) var(--Spaces-Space-Meduim, 16px);
    justify-content: center;
    align-items: center;
    gap: var(--Spaces-Space-XSmall, 8px);
    border: 1px solid var(--Colors-Borders-Border-Primary, #28255C);
    color: #28255C;
    background-color: #fff;
}

    .button-white:disabled {
        opacity: 0.5;
        cursor: not-allowed;
    }


label.error {
    color: #ff7959;
    font-size: 12px;
    padding-top: 1px;
}

.offcanvas-backdrop.show {
    opacity: 0;
}

#spinnerContainer {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 106;
    background-color: #ffffff45;
}

.lottiePlayer {
    position: fixed;
    left: 45%;
    top: 40%;
    z-index: 130;
    width: 100px;
    height: 100px;
}

.modal-header {
    justify-content: center !important;
}


.modal-body {
    font-family: 'Anek Devanagari';
    color: black !important;
    font-weight: 500;
    font-size: 1.5em;
    text-align: center;
    margin-top: 0px !important;
    padding-top: 0px !important;
}

.modal-footer button {
    font-family: 'Anek Devanagari';
    color: white;
    font-weight: 500;
    text-align: center;
    margin-top: 0px !important;
    width: 90%;
    border: none;
    padding-top: 2%;
    border-radius: 0px;
    background-color: #FF795C;
}

.modal-footer {
    border-top: none;
    display: flex;
    justify-content: center;
}

.modal-description {
    font-family: 'Anek Devanagari';
    color: #737195 !important;
    font-weight: 500;
    font-size: 1.2em;
    text-align: center;
    margin-top: 0px !important;
    padding-top: 0px !important;
    margin: 2% 2%;
}

/* */
.dialog-banner {
}

.dialog-banner-ctx {
    position: relative;
    margin: 0 auto;
}

.dialog-banner.full-bg {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}

.dialog-banner.center {
    text-align: center;
}

.dialog-banner .banner-box {
    position: relative;
}

    .dialog-banner .banner-box h2 {
        display: none;
        position: absolute;
        bottom: 0;
        color: #262262;
        font-family: tajawal-bold;
        font-weight: bold;
        letter-spacing: -0.8px;
        font-size: 2.7em;
    }

.dialog-banner .banner-box-details {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    margin: 0 auto;
    width: 50%;
}

    .dialog-banner .banner-box-details h2 {
        font-family: tajawal-bold;
        font-weight: bold;
        letter-spacing: -0.8px;
        font-size: 3.6em;
        padding-left: 2.6em;
        margin-top: 0px;
        color: #262262;
        text-transform: uppercase;
    }

    .dialog-banner .banner-box-details p {
        font-size: 1.8em;
        font-family: tajawal-regular;
        margin-bottom: 1.5em;
        padding-top: 0.7em;
        padding-left: 1.5em;
    }

    .dialog-banner .banner-box-details ul {
        padding: 0;
        margin: 0;
        padding-top: 1em;
        margin-bottom: 1.5em;
    }

        .dialog-banner .banner-box-details ul li {
            font-size: 1.8em;
            font-family: tajawal-regular;
            position: relative;
        }

            .dialog-banner .banner-box-details ul li:before {
                content: "";
                background-color: white;
                height: 3px;
                width: 20px;
                display: inline-block;
                position: absolute;
                bottom: 0;
                top: 0;
                right: -20px;
                margin: auto 0;
                z-index: 0;
            }

.dialog-banner .form-control {
    font-size: 1.4em;
}

.dialog-banner #inline-search {
    display: inline-block;
    padding-top: 4px;
    width: 100%;
    margin-bottom: 2.5em;
    margin-top: 1.4em;
}

    .dialog-banner #inline-search .search-block {
        display: inline-block;
        float: left;
        width: 100%;
    }

    .dialog-banner #inline-search input[type*="text"] {
        float: left;
        margin: 0;
        background: white;
        border: 1px solid #000;
        border-radius: 0px;
        padding: 0 12.5px;
        width: calc(100% - 36px);
        height: 34px;
        text-align: right;
        font-size: 1.5em;
        font-family: tajawal-regular;
        text-transform: uppercase;
    }

        .dialog-banner #inline-search input[type*="text"]::-webkit-input-placeholder { /* Chrome/Opera/Safari */
            color: #262262 !important;
            font-family: tajawal-bold;
            font-weight: bold;
            letter-spacing: -0.8px;
            letter-spacing: 0px;
        }

        .dialog-banner #inline-search input[type*="text"]::-moz-placeholder { /* Firefox 19+ */
            color: #262262 !important;
            font-family: tajawal-bold;
            font-weight: bold;
            letter-spacing: -0.8px;
            letter-spacing: 0px;
            opacity: 1 !important;
        }

        .dialog-banner #inline-search input[type*="text"]:-ms-input-placeholder { /* IE 10+ */
            color: #262262 !important;
            font-family: tajawal-bold;
            font-weight: bold;
            letter-spacing: -0.8px;
            letter-spacing: 0px;
            line-height: 8px;
        }

        .dialog-banner #inline-search input[type*="text"]:-moz-placeholder { /* Firefox 18- */
            color: #262262 !important;
            font-size: 1.6em;
            font-family: tajawal-bold;
            font-weight: bold;
            letter-spacing: -0.8px;
            letter-spacing: 0px;
            opacity: 1 !important;
        }

    .dialog-banner #inline-search input[type*="button"] {
        float: left;
        background-image: url(../../images/images/icon-search-white.webp);
        background-color: #262262;
        margin: 0;
        padding: 14px 15px;
        border-radius: 0;
        border: 3px solid #262262;
        box-shadow: none;
        height: 34px;
        background-repeat: no-repeat;
        background-position: center center;
    }

.dialog-banner.center .banner-box-details h1 {
    padding-left: 0;
}

.dialog-banner.center .banner-box-details {
    position: relative;
    width: 70%; /* text-align: center; */
    padding: 6em 0;
    left: 0;
    top: 0;
    margin: 0 auto; /* float: right; */
}

    .dialog-banner.center .banner-box-details.wide {
        width: 86%;
    }

.dialog-banner.right-side .banner-box-details {
    position: relative;
    width: 50%; /* text-align: center; */
    padding: 6em 15px;
    left: 0;
    top: 0;
    margin: 0;
    float: left;
}

#dialogLogin .dialog-banner.right-side .banner-box-details, #dialogSuccess .dialog-banner.right-side .banner-box-details {
    float: right !important;
}

.dialog-banner .banner-box-details.white-bg {
    background-color: white;
    padding: 6em 1.4em;
}

.dialog-banner.right-side .banner-box-details.white-bg h1, .dialog-banner.right-side .banner-box-details.white-bg p {
    margin-right: -30px;
}

.dialog-banner.full-bg .banner-box img {
    width: 100%;
}

/* */
.offcanvas-backdrop.show {
    opacity: .1 !important;
}

.drpdwn-with-label.select2-with-icon .select2-container--default .select2-selection--single .select2-selection__rendered {
    border: 1px solid #dfdee7;
    border-radius: 0;
    transition: all 0.3s;
    box-shadow: none !important;
    outline: none !important;
    height: 50px;
}

.drpdwn-with-label.select2-with-icon .select2-container--default .select2-selection--single .select2-selection__rendered {
    direction: ltr !important;
}

.drpdwn-with-label.select2-with-icon .select2-selection__rendered span {
    display: flex;
    align-items: center;
    gap: 8px;
}

[lang="ar"] .drpdwn-with-label.select2-with-icon .select2-container--default .select2-results__option {
    justify-content: right;
}

[lang="ar"] .drpdwn-with-label.select2-with-icon .select2-container--default .select2-selection--single .select2-selection__rendered {
    direction: rtl !important;
}

[lang="ar"] .select2-results__option {
    text-align: right !important;
    direction: rtl !important;
    font-family: 'tajawal-regular';
}


.select2-selection__rendered {
    font-family: 'tajawal-regular';
}


.drpdwn-with-label {
    font-size: 13px;
}

input[type="search"]::-webkit-search-cancel-button {
    display: none;
}

.unclickable {
    pointer-events: none;
}

.flag-img-simple {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    margin-right: 5px;
}

/* file dropzone */
.upload-dropzone .dropzone-form {
    align-content: stretch;
    background: #f3f5fb;
    border: 1px dashed #28255C;
    display: flex;
    gap: 16px;
    justify-content: center;
    padding: 24px 32px;
}

    .upload-dropzone .dropzone-form .icon-upload {
        align-self: center;
        cursor: pointer;
    }

    .upload-dropzone .dropzone-form .icon-upload-img {
        border: 1px solid #dfdee7;
        background: #E9E8EE;
        box-sizing: content-box;
        height: 32px;
        padding: 12px;
        width: 32px;
    }

    .upload-dropzone .dropzone-form .dz-message {
        align-self: center;
        flex-grow: 1;
        font-size: 1.5em;
        margin: 0;
        text-align: inherit;
    }

    .upload-dropzone .dropzone-form .dz-message-upload {
        font-size: 18px;
        font-weight: 500;
        line-height: 24px;
    }

    .upload-dropzone .dropzone-form .dz-message-browse {
        color: #FF795C;
        cursor: pointer;
        margin: 0 0 4px 0;
    }

    .upload-dropzone .dropzone-form .dz-message-drop {
        color: #737195;
    }

    .upload-dropzone .dropzone-form .dz-message-max {
        color: #737195;
        font-size: 12px;
        font-weight: 500;
        line-height: 16px;
    }

    .upload-dropzone .dropzone-form .dz-preview:hover .dz-details {
        z-index: 1001;
    }

    .upload-dropzone .dropzone-form .dz-preview .dz-remove {
        background: transparent;
        cursor: pointer;
    }

        .upload-dropzone .dropzone-form .dz-preview .dz-remove:hover {
            text-decoration: none;
        }

        .upload-dropzone .dropzone-form .dz-preview .dz-remove .icon-cancel-circle {
            cursor: pointer;
        }

    .upload-dropzone .dropzone-form .dz-image-preview {
        background: transparent;
    }


#ui-datepicker-div {
    /*display: none!important;*/
}

ul.ui-autocomplete {
    z-index: 1100;
}

.signupNow {
    border: none;
    padding: 2.5% 4% 2.5% 4%;
    background-color: #FF795C;
    color: white;
    font-family: "anekdevanagari-regular", sans-serif;
    font-size: 1.1em;
}

    .signupNow:hover {
        border: none;
        padding: 2.5% 4% 2.5% 4%;
        color: white;
        font-family: "anekdevanagari-regular", sans-serif;
        font-size: 1.1em;
        background-image: linear-gradient(to right, #bb5ac4, #FF795C);
        box-shadow: 0px 4px 20px 0px rgba(255, 121, 92, 0.75) !important;
        transition: all .4s ease;
        -webkit-transition: all .3s ease;
    }


.form-userinfo-field-inner:has(.error) .form-userinfo-calendar {
    margin: 0 !important;
}


.removeBorder {
    border: none !important;
}


a.dropdown-item {
    display: block !important;
}

ul.dropdown-menu.show {
    display: block !important;
}


#geo-block-message {
    display: block;
    font-family: "anekdevanagari-medium", sans-serif;
    font-weight: 600;
    text-align: center;
    padding: 4% 0% 4% 0%;
    background-image: url(/Assets/Images/Background.png);
    background-repeat: no-repeat;
    background-size: 100%;
    max-width: 100%;
    background-color: #FAFAFC;
}


.pageNotFound {
    display: block;
    font-size: 1.5em;
    color: #FF795C;
    font-family: 'anekdevanagari-bold';
}


.pageNotFoundMsg {
    margin: 1% 0%;
    font-size: 2em;
    font-weight: 100;
}


.blockedCountryName {
    font-family: 'anekdevanagari-bold';
}


.changeCountryMsg {
    color: #737195;
    font-size: 1.2em;
    font-weight: 400;
    margin: 2%;
}


.countryNotAvailableImg {
    width: 300px;
    margin: 1% 0%;
}


body[lang="ar"] #geo-block-message {
    font-family: 'tajawal-regular' !important;
    direction: rtl;
}


    body[lang="ar"] #geo-block-message .blockedCountryName {
        font-family: 'tajawal-regular' !important;
    }


.minWidth {
    width: min-content !important;
}


.reviewTermsAndConditions {
    text-decoration: underline;
    font-weight: 600;
    cursor: pointer;
}


.whiteBtn {
    background-color: white !important;
    color: #FF795C !important;
    border: solid 2px #FF795C !important;
}


@media (max-width: 767px) {
    .resetPasswordDiv {
        padding: 13%;
    }
}
