/*@font-face {
    font-family: "IranYekan";
    src: url(Assets/Fonts/YekanBakhFaNum/woff/YekanBakhFaNum-Regular.woff);
    font-weight: 400;
}*/

@font-face {
    font-family: IRANYekanX;
    font-style: normal;
    font-weight: 100;
    src: url("Assets/Fonts/IranYekanX/woff/IRANYekanX-Regular.woff") format("woff"), url("Assets/Fonts/IranYekanX/woff2/IRANYekanX-Regular.woff2") format("woff2");
}

/* 
@font-face {
  font-family: "IranYekan";
  src: url(../Fonts/iransansweb.ttf);
  font-weight: 400;
} */

::-webkit-inner-spin-button {
    display: none;
}

body {
    overflow-x: hidden;
    direction: rtl;
}

*,
body {
    font-family: IRANYekanX !important;
    -moz-font-feature-settings: "ss03";
    -webkit-font-feature-settings: "ss03";
    font-feature-settings: "ss03";
}

.loginbtn {
    width: 125px;
    height: 40px;
    min-height: 40px;
    border-radius: 8px;
    padding-top: 8px;
    padding-right: 16px;
    padding-bottom: 8px;
    padding-left: 16px;
    gap: 8px;
}

.SamanOrder-CatItems {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
}

.CategoryName {
    margin-top: 16px;
    color: #b0b0b0;
}

.Warpper section {
    min-height: 30vh;
}

/*********/

.Device-Value-block {
    margin-bottom: 100px;
}

.Device-Range {
    text-align: right;
}

.Device-Value-block-title {
    text-align: right;
}

    .Device-Value-block-title h3 {
        font-weight: 700;
        font-size: 18px;
        /*line-height: 32px;*/
        letter-spacing: 0;
        text-align: right;
        color: #454545;
    }

    .Device-Value-block-title span {
        font-weight: 400;
        font-size: 12px;
        line-height: 24px;
        letter-spacing: 0;
        text-align: right;
        color: #4b5563;
    }

.SamananPlanBox {
    background-color: #fff;
    text-align: right;
    margin-bottom: 10px;
    box-shadow: 0px 0px 14px 0px #d1d1d140;
}

.SamananPlanBox-header {
    background-color: #f6f6f6;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 16px;
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
}

.PlanBox-title span {
    color: #1a7684;
}

.PlanBox-title {
    display: flex;
    align-items: center;
    gap: 14px;
    font-weight: 300;
    font-size: 16px;
    line-height: 32px;
    letter-spacing: 0;
    vertical-align: middle;
}

.PlanBox-headerBtn a {
    color: #6d6d6d;
    text-decoration: none;
}

.PlanBox-content-Right ul {
    list-style: none;
    padding: 0;
}

.SamananPlanBox-content {
    display: flex;
    justify-content: space-between;
    padding: 18px 16px !important;
    /*padding: 8px 16px 0px;*/
}

.PlanBox-content-left {
    float: left;
    text-align: left;
}

.PlanBox-discount-price {
    color: #b0b0b0;
}

.PlanBoxBtn {
    background: #1893a2;
    width: 235px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    margin-top: 70px;
}

    .PlanBoxBtn a {
        color: #fff;
        text-decoration: none;
    }

.Plantitle {
    color: #454545;
    font-weight: bold;
    font-size: 16px;
    line-height: 32px;
    letter-spacing: 0;
}

.PlanBox-content-Right ul li:first-child span {
    color: #f2073e;
    font-weight: bold;
}

.PlanBox-content-Right ul li {
    margin-top: 12px;
}

@media (max-width: 767px) {
    .SamananPlanBox-content {
        display: block;
    }

    .PlanBox-Price {
        display: flex;
        justify-content: space-between;
    }

    .PlanBox-content-left {
        width: 100%;
    }

    .PlanBoxBtn {
        width: 100%;
    }

    .SamanOrder-CatItems {
        gap: 77px;
        min-width: 350px;
        overflow-x: scroll;
    }

    .CreateCertificateDialog .StatusStep .Caption {
        font-weight: 700;
        font-size: 13px !important;
        line-height: 1.5rem !important;
        letter-spacing: 0px;
        color: #14317A;
        place-content: center;
    }

    .CreateCertificateDialog .confirmForm .Caption {
        font-weight: 700;
        font-size: 13px;
        line-height: 100%;
        letter-spacing: 0px;
        text-align: right;
        color: #14317A;
        place-content: center;
        white-space: nowrap;
    }

    .CreateCertificateDialog .confirmForm p {
        font-weight: 700;
        font-size: 12px;
        line-height: 100%;
        letter-spacing: 0px;
        text-align: right;
        place-content: center;
    }

    .StatusBtn {
        width: 100% !important;
    }

    .GreenLine::before {
        margin-right: unset !important;
    }
}

/********/
input[type="range"] {
    -webkit-appearance: none;
    width: 100%;
    height: 4px;
    border-radius: 5px;
    outline: none;
    transition: background 0.2s ease;
    margin: 20px 0;
    direction: ltr;
}

    input[type="range"]::-webkit-slider-runnable-track {
        height: 4px;
        border-radius: 5px;
        background: transparent;
    }

    input[type="range"]::-webkit-slider-thumb {
        -webkit-appearance: none;
        appearance: none;
        width: 16px;
        height: 16px;
        background-color: #f2073e;
        border-radius: 50%;
        cursor: pointer;
        margin-top: -6px;
    }

    input[type="range"]:focus {
        outline: none;
    }

#price-display {
    font-weight: bold;
    font-size: 18px;
}

.PlanBox-content-Right ul li span {
    color: #888888;
}

span.black-color {
    color: #5d5d5d !important;
    font-weight: bold;
}

.PlanBox-price {
    color: #454545;
    font-weight: bold;
    margin-top: 8px;
}

p {
    margin-bottom: 0;
}

.SamanRegisterDeviceBlock.mt-5 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
}

.SamananPlanBox-header {
    background-color: #f6f6f6;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 16px;
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
}

.SamanRegisterTop-title {
    display: flex;
    align-items: end;
}

.SamanRegisterDeviceBlock h2 {
    color: #4f5253;
    font-weight: bold;
    font-size: 24px;
    margin-right: 8px;
}

.SamanRegisterTop-title img {
    width: 42px;
}

.SamanRegisterTopBtn.Deactive {
    background: #e7e7e7;
    width: 123px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
}

    .SamanRegisterTopBtn.Deactive a {
        color: #d1d1d1;
        text-decoration: none;
    }

.SamanRegisterTopBtn img {
    margin-right: 8px;
}

.SamanRegisterDesign-value span:first-child {
    padding: 0px 6px;
}

.SamanRegisterDesignNameBlock .PlanBox-title strong {
    color: #1a7684;
}

.SamanRegisterDesignNameBlock .PlanBox-title span {
    color: #1893a2;
    font-weight: bold;
}

/*****Wizard*****/
.step-wrapper {
    padding: 20px 0;
    display: none;
}

    .step-wrapper.active {
        display: block;
    }

.step-indicator {
    border-collapse: separate;
    display: table;
    margin-left: 0px;
    position: relative;
    table-layout: fixed;
    text-align: center;
    vertical-align: middle;
    padding-left: 0;
    padding-top: 20px;
}

    .step-indicator li {
        display: table-cell;
        position: relative;
        float: none;
        padding: 0;
        width: 1%;
    }

        .step-indicator li:after {
            background-color: #b0b0b0;
            content: "";
            display: block;
            height: 1px;
            position: absolute;
            width: 100%;
            top: 9px;
        }

        .step-indicator li:after {
            left: 50%;
        }

        /*.step-indicator li:last-child:after {*/
        /*	display: none;*/
        /*}*/

        .step-indicator li:first-child:after {
            display: none;
        }

        .step-indicator li.fail .step {
            color: #e83f6f;
        }

        .step-indicator li.fail .caption {
            color: #e83f6f;
        }

        .step-indicator li.complete:after {
            background-color: #1893a2;
        }

        .step-indicator li.complete .step {
            color: #45c3e0;
        }

        .step-indicator li.fail:after {
            background-color: #e83f6f;
        }

        .step-indicator li span {
            color: #454545;
        }

        .step-indicator li.fail .step {
            color: #e83f6f;
        }

        .step-indicator li.fail .caption {
            color: #e83f6f;
        }

.complete .step {
    background-image: url("../Images/CheckActiveCircle.svg");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

li:not(.complete) .step {
    background-image: url("../Images/Check-DeactiveCircle.svg");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

.step-indicator .step {
    background-color: #fff;
    border-radius: 50%;
    color: #ccc;
    font-size: 24px;
    height: 24px;
    line-height: 24px;
    margin: -3px auto;
    position: relative;
    width: 24px;
    z-index: 1;
}

.one-case {
    margin-top: 24px;
}

.step-indicator .step:hover {
    cursor: pointer;
}

.step-indicator .caption {
    color: #ccc;
    padding: 11px 16px;
}

/*******/
.Saman-RegisterCardBox {
    background-color: #fff;
    text-align: right;
    margin: 64px 0px;
    box-shadow: 0px 0px 14px 0px #d1d1d140;
}

.Saman-RegisterCardBox-header {
    background: #f6f6f6;
    background-color: #f6f6f6;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 16px;
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
    height: 48px;
}

    .Saman-RegisterCardBox-header h4 {
        color: #1893a2;
        font-weight: bold;
        margin: 0;
        font-size: 16px;
    }

.Saman-EduAlert span {
    color: #1893a2;
}

.Saman-RegisterCardBox-Content {
    padding: 32px 16px 16px;
    display: flex;
    justify-content: space-between;
}

.Saman-RegisterCardBox-Content-Text p {
    color: #454545;
}

.Saman-EduAlert {
    margin-bottom: 16px;
}

/****Input Type File****/
.upload-files-container {
    border-radius: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.browse-files {
    display: grid;
    color: #6d6d6d;
    font-size: 13px;
}

.drag-file-area {
    border: 2px dashed #e7e7e7;
    border-radius: 16px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    width: 100%;
    height: 130px;
    justify-content: center;
}

    .drag-file-area .upload-icon {
        font-size: 18px;
        color: #6d6d6d;
    }

    .drag-file-area h3 {
        font-size: 26px;
        margin: 15px 0;
    }

    .drag-file-area label {
        font-size: 19px;
    }

        .drag-file-area label .browse-files-text {
            color: #7b2cbf;
            font-weight: bolder;
            cursor: pointer;
        }

.browse-files span {
    position: relative;
    top: -25px;
}

.default-file-input {
    opacity: 0;
    height: 0;
}

.cannot-upload-message {
    background-color: #ffc6c4;
    font-size: 17px;
    display: flex;
    align-items: center;
    margin: 5px 0;
    padding: 5px 10px 5px 30px;
    border-radius: 5px;
    color: #bb0000;
    display: none;
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.cannot-upload-message span,
.upload-button-icon {
    padding-right: 10px;
}

    .cannot-upload-message span:last-child {
        padding-left: 20px;
        cursor: pointer;
    }

.file-block {
    color: #f7fff7;
    background-color: #7b2cbf;
    transition: all 1s;
    width: 390px;
    position: relative;
    display: none;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin: 10px 0 15px;
    padding: 10px 20px;
    border-radius: 25px;
    cursor: pointer;
}

.file-info {
    display: flex;
    align-items: center;
    font-size: 15px;
}

.file-icon {
    margin-right: 10px;
}

.file-name,
.file-size {
    padding: 0 3px;
}

.remove-file-icon {
    cursor: pointer;
}

.progress-bar {
    display: flex;
    position: absolute;
    bottom: 0;
    left: 4.5%;
    width: 0;
    height: 5px;
    border-radius: 25px;
    background-color: #4bb543;
}

.upload-button {
    font-family: "Montserrat";
    background-color: #7b2cbf;
    color: #f7fff7;
    display: flex;
    align-items: center;
    font-size: 18px;
    border: none;
    border-radius: 20px;
    margin: 10px;
    padding: 7.5px 50px;
    cursor: pointer;
}

.CardBox-UploadBlock {
    position: relative;
    width: 30%;
    float: left;
}

.Saman-RegisterCardBox-Content-Text {
    width: 70%;
    padding-left: 40px;
}

    .Saman-RegisterCardBox-Content-Text .SorryText {
        font-weight: bold;
        color: #454545;
        margin-bottom: 16px;
    }

.Device.SerialBox {
    display: flex;
    align-items: center;
    margin-top: 12px;
    gap: 12px;
}

    .Device.SerialBox > div {
        display: flex;
        flex-direction: column;
    }

    .Device.SerialBox label {
        color: #6d6d6d;
        font-size: 14px;
    }

    .Device.SerialBox img {
        margin-right: 4px;
    }

    .Device.SerialBox input {
        border: 1px solid #b0b0b0;
        border-radius: 8px;
        height: 40px;
        color: #6d6d6d;
        text-align: left;
        direction: ltr;
        padding-left: 14px;
    }

        .Device.SerialBox input:focus {
            outline: unset;
            box-shadow: unset;
        }

.SamanRegisterTopBtn.Active {
    background: #1893a2;
    height: 40px;
    display: flex;
    align-items: center;
    width: 123px;
    justify-content: center;
    border-radius: 8px;
}

    .SamanRegisterTopBtn.Active a {
        color: #fff;
        text-decoration: unset;
    }

        .SamanRegisterTopBtn.Active a img {
            filter: brightness(0) invert(1);
        }

.Saman-RegisterCardBox-Content.flex-direction-column {
    flex-direction: column;
}

.UniqueDeviceserialNumberBlock ul {
    list-style: none;
    padding-right: 0;
    margin: 12px 0px 0px;
}

    .UniqueDeviceserialNumberBlock ul li {
        margin-bottom: 4px;
    }

.UniqueDeviceserialNumberBlock {
    margin-top: 16px;
    display: flex;
    justify-content: space-between;
}

span.gray-color {
    color: #6d6d6d;
}

/************/

.copy-text {
    position: relative;
    border: 1px solid #b0b0b0;
    border-radius: 8px;
    display: flex;
    height: 40px;
    padding: 0px 8px;
    width: 326px;
    justify-content: space-between;
}

    .copy-text input.text {
        font-size: 15px;
        color: #454545;
        border: none;
        outline: none;
        padding: 0px 8px;
        text-align: left;
        font-weight: 700;
    }

    .copy-text span {
        font-size: 14px;
    }

    .copy-text button {
        padding: 0px;
        color: #1893a2;
        font-size: 18px;
        border: none;
        outline: none;
        border-radius: 10px;
        cursor: pointer;
        background: transparent;
    }

        .copy-text button:active {
            color: #1893a2;
        }

        .copy-text button::before {
            content: "کپی شد";
            position: absolute;
            bottom: -45px;
            right: 0px;
            background: transparent;
            padding: 8px 10px;
            border-radius: 20px;
            font-size: 15px;
            display: none;
            color: #1893a2;
        }

        .copy-text button::after {
            content: "";
            position: absolute;
            top: -20px;
            right: 25px;
            width: 10px;
            height: 10px;
            color: #1893a2;
            transform: rotate(45deg);
            display: none;
        }

    .copy-text.active button::before,
    .copy-text.active button::after {
        display: block;
    }

.btn.btn-Send-Link-ToMobile.text-left {
    text-align: left;
    width: 100%;
    margin-top: 28px;
    padding: 0;
}

    .btn.btn-Send-Link-ToMobile.text-left a {
        background: #1893a2;
        color: #fff;
        text-decoration: none;
        height: 40px;
        padding: 8px 20px;
        border-radius: 8px;
    }

.modal-header .btn-close {
    opacity: 1;
}

.modal-header {
    border-bottom: 0px;
}

.Loginfooter {
    justify-self: center;
}

.LoginModal .main-title {
    margin-bottom: 16px;
}

    .LoginModal .main-title span {
        color: #2e3192;
        font-size: 18px;
        font-weight: 700;
        font-size: 18px;
        line-height: 32px;
        letter-spacing: 0;
        text-align: right;
    }

.Modal-desc p {
    color: #545454;
    margin-bottom: 16px;
    font-weight: 400;
    font-size: 14px;
    line-height: 20.59px;
    letter-spacing: 0;
    text-align: justify;
}

.Modal-PhoneNumber div:first-child label {
    color: #1893a2;
    font-weight: 400;
    font-size: 17px;
    line-height: 23.53px;
    letter-spacing: 0;
    text-align: right;
}

.Modal-PhoneNumber div:last-child label {
    color: #6d6d6d;
    font-weight: 400;
    font-size: 12px;
    line-height: 14.71px;
    letter-spacing: 0;
    text-align: right;
    color: #6d6d6d;
}

.Modal-PhoneNumber input {
    height: 48px;
    border: 1px solid #1893a2;
    background-color: #f6f6f6;
    color: #454545;
    border-radius: 8px;
    width: 100%;
    margin: 8px 0px;
    text-align: left;
    direction: ltr;
    padding-left: 16px;
    letter-spacing: 3.3px;
}

    .Modal-PhoneNumber input::placeholder {
        letter-spacing: 0px;
    }

    .Modal-PhoneNumber input:focus {
        outline: unset;
    }

.btn.btn-containue {
    width: 100%;
    background: #1893a2;
    height: 48px;
    border-radius: 8px;
    margin: 16px 0px;
}

    .btn.btn-containue button {
        color: #f6f6f6;
        text-decoration: unset;
    }

.btn.BtnBack {
    text-align: center;
    width: 100%;
    margin-bottom: 24px;
}

    .btn.BtnBack button {
        color: #1893a2;
        font-size: 18px;
    }

.Loginrole {
    text-align: center;
    margin-bottom: 16px;
    font-size: 12px;
}

    .Loginrole p span {
        color: #1893a2;
    }

.btn.btn-containue img {
    transform: rotate(180deg);
    filter: brightness(0) invert(1);
    margin-right: 8px;
}

.modal-content {
    padding: 20px;
}

.LoginModal .modal-content {
    border-radius: 12px;
}

.Verification-TopBlock {
    justify-content: space-between;
}

.text-left {
    text-align: left;
}

/****OTP******/

.Verification-OtpBox form {
    display: flex;
    gap: 6px;
}

    .Verification-OtpBox form input {
        width: 34px;
        height: 40px;
        color: #1a7684;
        direction: ltr;
        text-align: center;
        border: 1px solid #d1d1d1;
        border-radius: 8px;
    }

        .Verification-OtpBox form input.active {
            border: 1px solid #1a7684;
        }

.Verification-OtpBox {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-top: 16px;
}

    .Verification-OtpBox .mud-input.mud-input-outlined .mud-input-outlined-border {
        border-radius: 8px;
    }

.digit-group.wrong input {
    border: 1px solid #f2073e;
}

    .digit-group.wrong input::placeholder {
        color: #f2073e;
    }

.btn.btn-containue.btn-warning {
    background-color: #f2073e;
}

.Resend span {
    color: #1893a2;
}

.Verification-Shownumber span {
    color: #2e3192;
    font-weight: bold;
}

@media (max-width: 767px) {
    .LoginModal .modal-content {
        border-radius: 12px 12px 0px 0px;
    }

    .LoginModal .modal-content {
        overflow: hidden;
        /*position: absolute;*/
    }

    .mud-dialog:has(.LoginModal) {
        position: absolute;
        bottom: 0;
        width: 100%;
    }

    .LoginModal .modal-dialog {
        margin: 0;
    }
}

.complete.Current span {
    color: #1893a2;
}

.input-numbers {
    position: relative;
}

.danger-alert {
    background: #df1d17;
    color: white;
    padding: 17px 10px;
}

.fontSize-8 {
}

.fontSize-10 {
}

.fontSize-11 {
}

.fontSize-12 {
}

.fontSize-14 {
}

.fontSize-16 {
}

.fontSize-18 {
}

.fontSize-20 {
}

.fontSize-24 {
}

.fontSize-md-8 {
}

.fontSize-md-10 {
}

.fontSize-md-11 {
}

.fontSize-md-12 {
}

.fontSize-md-14 {
}

.fontSize-md-16 {
}

.fontSize-md-18 {
}

.fontSize-md-20 {
}

.fontSize-md-24 {
}

.uploadedFile {
    position: relative;
    display: inline-block;
}

.image-preview {
    display: block;
    width: 180px;
    height: 180px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.mud-step-label-icon {
    border: double;
}

.TextHeaderPayment {
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    text-align: right;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #1893a2;
}

.TextSubHeader {
    font-size: 15px;
    font-weight: 400;
    line-height: 21px;
    text-align: justify;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #6d6d6d;
}

    .TextSubHeader span {
        color: #1893a2;
    }

.btnpaylog {
    font-size: 16px;
    font-weight: 700;
    line-height: 20.8px;
    text-align: center;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #1893a2;
}

.btnpaylogDivar {
    min-height: 40px;
    max-height: 40px;
    padding: 8px 16px 8px 16px;
    gap: 8px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 700;
    line-height: 20.8px;
    text-align: center;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #FFFFFF;
    background-color: var(--bimeSaman-divar-button-color);
}

.btnpaylogOutlined {
    min-height: 40px;
    max-height: 40px;
    padding: 8px 16px 8px 16px;
    gap: 8px;
    border-radius: 8px;
    border: 1px solid #1893a2;
    font-size: 16px;
    font-weight: 700;
    line-height: 20.8px;
    text-align: center;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #1893a2;
}

.btnpayDivar {
    min-height: 40px;
    max-height: 40px;
    padding: 8px 16px 8px 16px;
    gap: 8px;
    border-radius: 8px;
    border: 1px solid #1893a2;
    font-size: 16px;
    font-weight: 700;
    line-height: 20.8px;
    text-align: center;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #1893a2;
}

.CardTitle {
    background: #1893a2;
    font-size: 18px;
    font-weight: 700;
    line-height: 32px;
    text-align: right;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #eefdfd;
}

.PaymentHeaderText {
    border-right: 1px solid #d1d1d1;
    margin-block: 10px;
}

    .PaymentHeaderText :nth-child(1) {
        font-size: 16px;
        font-weight: 400;
        line-height: 23.53px;
        text-align: right;
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
        color: #2a2aa9;
    }

    .PaymentHeaderText :nth-child(2) {
        font-size: 16px;
        font-weight: 600;
        line-height: 23.8px;
        text-align: right;
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
        color: #2a2aa9;
        margin-top: 12px;
    }

.shadowCustom {
    box-shadow: 0px 0px 8px 0px #d1d1d140;
}

.InfoPayment {
    height: 72px;
    border-right: 1px solid #d1d1d1;
    margin-block: 10px;
}

    .InfoPayment :nth-child(1) {
        font-size: 16px;
        font-weight: 400;
        line-height: 23.53px;
        text-align: right;
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
        color: #6d6d6d;
        filter: grayscale(1);
    }

    .InfoPayment :nth-child(2) {
        font-size: 16px;
        font-weight: 600;
        line-height: 20.8px;
        text-align: right;
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
        color: #454545;
        margin-top: 12px;
    }

    .InfoPayment :nth-child(3) {
        font-size: 16px;
        font-weight: 600;
        line-height: 20.8px;
        text-align: right;
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
        color: #454545;
        margin-top: 12px;
    }

.fixPayment {
    box-shadow: 0px 0px 8px 0px #d1d1d140;
}

    .fixPayment .mud-expand-panel-header {
        background: #f6f6f6;
    }

    .fixPayment .mud-expand-panel-text {
        font-size: 16px;
        font-weight: 700;
        line-height: 32px;
        text-align: right;
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
        color: #454545;
    }

    .fixPayment .mud-collapse-container.mud-collapse-entered {
        margin-block: 16px;
        font-size: 14px;
        font-weight: 400;
        line-height: 28px;
        text-align: justify;
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
    }

.Issue
.fixPayment:has(.PayCustomerInfo)
.mud-collapse-container.mud-collapse-entered {
    height: 420px !important;
    max-height: auto;
}

.InfoAllPay {
    font-size: 14px;
    font-weight: 400;
    line-height: var(--TitleLargeLineHeight);
    text-align: justify;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #545454;
}

.singleTextHeaderPayment {
    font-weight: 700;
    font-size: 24px;
    line-height: 36px;
    letter-spacing: 0;
    text-align: right;
    color: #4f5253;
}

.linkBeneficiary {
    font-weight: 600;
    font-size: 20px;
    line-height: 26px;
    letter-spacing: 0;
    text-align: center;
    color: #1893a2;
}

.beneTitle {
    font-weight: 700;
    font-size: 18px;
    line-height: 32px;
    letter-spacing: 0;
    text-align: right;
    color: #eefdfd;
}

.searchTitle {
    font-weight: 700;
    font-size: 16px;
    line-height: 32px;
    letter-spacing: 0;
    text-align: right;
    color: #454545;
}

.InputBeneficiarySearch {
    background: #ffffff !important;
    border-width: 1px !important;
    margin: 8px !important;
}

    .InputBeneficiarySearch .mud-input-outlined-border {
        border-radius: 12px !important;
    }

.checkFilter {
    font-weight: 600;
    font-size: 14px;
    line-height: 18.2px;
    letter-spacing: 0;
    text-align: right;
}

.fixFilter {
    box-shadow: 0px 0px 4px 0px #d1d1d140;
    background: #f6f6f6;
}

    .fixFilter .gap {
        gap: 40px;
    }

.linktable {
    font-weight: 700;
    font-size: 16px;
    line-height: 20.8px;
    letter-spacing: 0;
    text-align: center;
    color: #b0b0b0 !important;
}

.TableName {
    font-weight: 600;
    font-size: 14px;
    line-height: 18.2px;
    letter-spacing: 0;
    text-align: right;
    color: #454545;
}

.TableSubTitle {
    font-weight: 400;
    font-size: 10px;
    line-height: 14.71px;
    letter-spacing: 0%;
    text-align: right;
    color: #6d6d6d;
}

.custom-table-header {
    font-weight: 600;
    font-size: 14px;
    line-height: 18.2px;
    letter-spacing: 0;
    text-align: right;
    color: #6d6d6d;
}

.bordergray {
    border: 1px solid #e7e7e7;
}

.overLink {
    direction: ltr;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.CActive {
    color: #1893a2;
    font-weight: 500;
    font-size: 11px;
    line-height: 14.71px;
    letter-spacing: 0;
    text-align: right;
}

.CDActive {
    color: #f2073e;
    font-weight: 500;
    font-size: 11px;
    line-height: 14.71px;
    letter-spacing: 0;
    text-align: right;
}

.RegisterData .fontEdit {
    font-weight: 400;
    font-size: 16px;
    line-height: 32px;
    letter-spacing: 0;
    text-align: right;
    color: #454545;
}

.RegisterData .fontEditPrice {
    font-weight: 700;
    font-size: 22px;
    line-height: 27px;
    letter-spacing: 0;
    color: #454545;
}

.RegisterData .txtLearn {
    padding-left: 2rem;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    letter-spacing: 0;
    text-align: justify;
}

.RegisterData .pictureLearn {
    font-family: IRANYekanX;
    font-weight: 500;
    font-size: 14px;
    line-height: 21px;
    letter-spacing: 0;
    text-align: justify;
    color: #1893a2;
}

.RegisterData .comp-title {
    font-family: IRANYekanX;
    font-weight: 500;
    font-size: 14px;
    line-height: 21px;
    letter-spacing: 0;
    text-align: justify;
    color: #454545;
}

/*.mud-dialog-title h6 :has(.RegisterData) {
    font-weight: 600;
    font-size: 12px;
    line-height: 18px;
    letter-spacing: 0;
    text-align: right;
    color: #1893A2;
}*/

.RegisterData .mud-step-label-active .mud-step-label-content p {
    font-weight: 600;
    font-size: 12px;
    line-height: 18px;
    letter-spacing: 0;
    text-align: right;
    color: #1893a2;
}

.toman {
    font-weight: 700;
    font-size: 15px;
    line-height: 27px;
    letter-spacing: 0;
    position: relative;
    bottom: 4px;
    right: 2px;
}

.car-price span.price {
    font-weight: 700;
    font-size: 20px;
    line-height: 27px;
    letter-spacing: 0;
    text-align: right;
}

.BasePlanTitle {
    font-weight: 600;
    font-size: 16px;
    line-height: 32px;
    letter-spacing: 0;
    color: #1a7684;
}

.changePlan {
    font-weight: 700;
    font-size: 12px;
    line-height: 15.6px;
    letter-spacing: 0;
    text-align: center;
    color: #1893a2;
    gap: 4px;
    padding-inline: 8px;
}

.GetImei .comp-title {
    font-weight: 400;
    font-size: 14px;
    line-height: 20.59px;
    letter-spacing: 0;
    text-align: justify;
    color: #545454;
}

.textposs {
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0;
    text-align: justify;
    color: #454545;
}

.LinkText {
    border: 1px solid #b0b0b0;
    border-radius: 7px;
}

    .LinkText input {
        text-align: end;
    }

.Payment .boxbody .info :nth-child(1) {
    font-weight: 400;
    font-size: 14px;
    line-height: 20.59px;
    letter-spacing: 0;
    text-align: right;
    color: #6d6d6d !important;
}

.Payment .boxbody .info :nth-child(2) {
    font-weight: 500;
    font-size: 14px;
    line-height: 20.59px;
    letter-spacing: 0;
    color: #454545 !important;
}

.InfoEdit .DiscountText input,
.SelectPlan .DiscountText input {
    text-align: center;
    font-weight: 600;
    font-size: 16px;
    line-height: 20.8px;
    letter-spacing: 0;
    direction: ltr;
}

.uploaderList span.fw-bold {
    font-weight: 700;
    font-size: 16px;
    line-height: 23.53px;
    letter-spacing: 0;
    text-align: justify;
    color: #625950;
}

.textdanger {
    font-weight: 400;
    font-size: 14px;
    line-height: 28px;
    letter-spacing: 0;
    text-align: justify;
    color: #545454;
}

    .textdanger b.danger {
        font-weight: 700;
        font-size: 14px;
        line-height: 28px;
        letter-spacing: 0;
        text-align: justify;
    }

.mud-input-control.mud-input-required > .mud-input-control-input-container > .mud-input-label::after {
    content: "*";
    color: #ff0000;
    font-size: 15px;
}

.titlePay {
    font-weight: 700;
    font-size: 18px;
    line-height: 32px;
    letter-spacing: 0;
    text-align: right;
    color: #eefdfd;
}

.OSParagraph {
    font-weight: 400;
    font-size: 14px;
    line-height: 28px;
    letter-spacing: 0;
    text-align: justify;
    color: #545454;
}

.HeaderDiscount {
    max-width: 926px;
}

.firstTitleFont {
    font-weight: 700;
    font-size: 24px;
    line-height: 36px;
    letter-spacing: 0;
    text-align: right;
    color: #4f5253;
}

.mudnumericfield-align-left input {
    text-align: left;
    direction: ltr;
}

del span {
    font-weight: 700;
    font-size: 14px;
    line-height: 21px;
    letter-spacing: 0;
}

    del span.toman {
        font-weight: 700;
        font-size: 11px;
        line-height: 21px;
        letter-spacing: 0;
        position: relative;
        bottom: 4px;
        right: 2px;
    }

.showpay {
    font-weight: 700;
    font-size: 18px;
    line-height: 26.47px;
    letter-spacing: 0;
    text-align: right;
    color: #6d6d6d;
}

.showPrice {
    font-weight: 700;
    font-size: 18px;
    line-height: 27px;
    letter-spacing: 0;
    text-align: center;
}

.infotext {
    font-weight: 600;
    font-size: 14px;
    line-height: 28px;
    letter-spacing: 0;
    text-align: justify;
    color: #545454 !important;
}

.mdp-5 {
    padding-inline: 2rem;
}

.PhoneNumber {
    font-weight: 700;
    font-size: 18px;
    line-height: 32px;
    letter-spacing: 0;
    color: #2e3192;
}

.successTextSendCode {
    font-weight: 400;
    font-size: 14px;
    line-height: 20.59px;
    letter-spacing: 0;
    text-align: justify;
    color: #545454;
}

.CertificateCode {
    font-weight: 700;
    font-size: 18px;
    line-height: 32px;
    letter-spacing: 0;
    text-align: right;
}

.tamdid {
    font-weight: 700;
    font-size: 16px !important;
    line-height: 20.8px;
    letter-spacing: 0;
    text-align: center;
}

.BoltList:nth-child(1) {
    background-image: url("./Assets/Images/Sale.svg");
    background-repeat: no-repeat;
    background-position: right;
}

    .BoltList:nth-child(1) span {
        font-weight: 700;
        font-size: 14px;
        letter-spacing: 0;
        text-align: right;
    }

.BoltList:nth-child(2) {
    background-image: url("./Assets/Images/VerifiedCheck.svg");
    background-repeat: no-repeat;
    background-position: right;
}

.BoltList:nth-child(3) {
    background-image: url("./Assets/Images/Document.svg");
    background-repeat: no-repeat;
    background-position: right;
}

.BoltList:nth-child(n + 2) span {
    font-weight: 600;
    font-size: 12px;
    letter-spacing: 0;
}

.poshesh {
    font-weight: 600;
    font-size: 12px;
    line-height: 32px;
    letter-spacing: 0;
}

.StepIcon {
    border: 1px solid;
    border-radius: 50%;
}

.showLg {
    display: block;
}

.showSm {
    display: none;
}

.justsmmd {
    justify-content: start;
}

.titleDetail {
    flex-direction: row;
}

.FontChangePlan {
    font-weight: 400;
    font-size: 16px;
    line-height: 32px;
    letter-spacing: 0;
    text-align: right;
    color: #454545;
}

.TitleChangePrice {
    font-weight: 700;
    font-size: 14px;
    line-height: 32px;
    letter-spacing: 0;
    text-align: right;
    color: #2a2aa9;
}

.SubtitleChangePriceDialog {
    font-weight: 700;
    font-size: 14px;
    line-height: 32px;
    letter-spacing: 0;
    text-align: right;
}

.TextChangePriceDialog {
    font-weight: 400;
    font-size: 12px;
    line-height: 17.65px;
    letter-spacing: 0;
    text-align: justify;
    color: #545454;
}

.sliderPrice,
.sliderPrice .toman {
    font-weight: 400;
    font-size: 10px;
    line-height: 15px;
    letter-spacing: 0;
    color: #454545;
}

.serial input {
    direction: ltr;
    letter-spacing: 4px;
}

.rowMobileAndTitle {
    font-weight: 700;
    font-size: 24px;
    line-height: 36px;
    letter-spacing: 0;
    text-align: right;
}

.BimehName {
    font-weight: 600;
    font-size: 18px;
    line-height: 23.4px;
    letter-spacing: 0;
}

.listB {
    font-weight: 600;
    font-size: 14px;
    line-height: 21px;
    letter-spacing: 0;
}

.btnTamdid {
    font-weight: 700;
    font-size: 16px;
    line-height: 20.8px;
    letter-spacing: 0;
    text-align: center;
}

.display {
    display: flex;
}

.issuViewHeader {
    font-weight: 700;
    font-size: 24px;
    line-height: 36px;
    letter-spacing: 0;
    text-align: right;
}

/**/
.gradientBox1 {
    width: 767px;
    height: 767px;
    position: absolute;
    background: linear-gradient( 112.05deg, rgba(255, 199, 0, 0.15) -103%, rgba(255, 27, 27, 0.15) 223.9% );
    filter: blur(250px);
}

    .gradientBox1 .box:nth-child(1) {
        /* position: absolute; */
        width: 196px;
        height: 196px;
        background: linear-gradient( 19.74deg, rgba(255, 255, 255, 0.15) 20.39%, rgba(229, 122, 24, 0.15) 86.6% );
        border: 3px solid #ffffff;
        box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.1);
        backdrop-filter: blur(4px);
        border-radius: 123.5px;
        /* transform: rotate(90deg); */
    }

footer {
    background: #ebebeb;
    /*height: 847px;*/
    bottom: 0;
}

.headfooter {
    background: white;
    margin-bottom: 5rem;
}

.Fparagraph {
    font-size: 14px;
    font-weight: 500;
    text-align: right;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #132558;
}

.cyrcle {
    width: 12px;
    height: 12px;
    background: #bbddff;
    border-radius: 50%;
}

.footer-link h4 {
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 21px;
    display: flex;
    align-items: center;
    color: #132558;
    margin-block: 2rem;
}

.linkinfooter {
    font-size: 14px;
    font-weight: 400;
    line-height: 18.2px;
    text-align: right;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #132558;
}

.border-bottom-color {
    color: #989898;
}

.copywrite {
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 16px;
    display: flex;
    align-items: center;
    color: #132558;
}

.h2StyleMobile {
    display: none;
}

.showCirclePosition {
    /* top: -600px; */
    position: relative;
}

.boxHomePage {
    width: 220px;
    height: 220px;
    /* top: 8px;
  left: 196px; */
    border-radius: 123.5px;
    border-width: 3px;
    background: linear-gradient( 287.43deg, rgba(255, 255, 255, 0.15) 27.54%, rgba(229, 122, 24, 0.15) 104.34% );
    border: 3px solid #ffffff;
    backdrop-filter: blur(8px);
    box-shadow: 0px 0px 24px 0px #0000001a;
    text-align: left;
    /* transform: rotate(-90deg); */
}

    .boxHomePage span {
        font-weight: 400;
        font-size: 16px;
        line-height: 23.53px;
        letter-spacing: 0;
        text-align: center;
        /* transform: rotate(90deg); */
    }

.swiper {
    width: 100%;
    height: 100%;
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    /*background: #fff;*/
    display: flex;
    justify-content: center;
    align-items: center;
}

    .swiper-slide img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.swiper-button-next {
    color: gray !important;
    position: absolute !important;
    top: 95.5% !important;
    left: 45% !important;
    font-size: 10px !important;
    z-index: 30 !important;
}

.swiper-button-prev {
    color: gray !important;
    position: absolute !important;
    top: 95.5% !important;
    right: 45% !important;
    font-size: 10px !important;
    z-index: 30 !important;
}

    .swiper-button-prev::after,
    .swiper-button-next::after {
        font-size: 13px !important;
    }

.h1Swiper {
    font-weight: 700;
    font-size: 24px;
    line-height: 36px;
    letter-spacing: 0;
    text-align: right;
    color: #4f5253;
}

.h2Swiper {
    font-weight: 400;
    font-size: 16px;
    line-height: 36px;
    letter-spacing: 0;
    text-align: right;
    color: #4f5253;
}

.mySwiper {
    max-height: 400px;
}

.swiper .PlanBoxBtn {
    background: #1893a2;
    width: 253px;
    line-height: 1;
    height: 48px;
    padding-inline: 32px;
    top: -1.8rem;
    left: 1rem;
    position: relative;
}

.swiper img.slides {
    width: 340px;
    height: 340px;
}

.reqtangle {
    position: relative;
    width: 342px;
    height: 9px;
    top: -100px;
    left: -100px;
    border-radius: 16px;
    z-index: -1;
    background: linear-gradient(119.73deg, #25cad2 4.61%, #10e1e6 88.9%);
}

.reqtangle2 {
    position: relative;
    width: 312px;
    height: 9px;
    top: -100px;
    left: -90px;
    border-radius: 16px;
    z-index: -1;
    background: linear-gradient(119.73deg, #25cad2 4.61%, #10e1e6 88.9%);
}

.background {
    position: absolute;
    width: 369px;
    height: 372px;
    top: 82px;
    left: 721px;
    background: linear-gradient( 119.73deg, rgba(16, 225, 230, 0.5) -29.04%, rgba(16, 225, 230, 0.5) 88.9% );
    filter: blur(500px);
}

/* table */
.comparison-table {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
}

    .comparison-table th {
        color: white;
        font-weight: bold;
        padding: 12px;
        text-align: center;
    }

    .comparison-table td {
        padding: 12px;
        vertical-align: middle;
    }

/* .comparison-table tbody tr:nth-child(odd) td {
  background-color: #fff3e0;
}

.comparison-table tbody tr:nth-child(even) td {
  background-color: #ffecb3;
} */

.feature-column {
    background-color: transparent !important;
    border: 0 !important;
    color: #333;
    font-weight: bold;
    width: 210px;
    min-width: 220px;
}

/* Colored Dots */
.dot {
    height: 12px;
    width: 12px;
    border-radius: 50%;
    display: inline-block;
}

.orange {
    background-color: #ff9500;
}

.green {
    background-color: #5a8e22;
}

.blue {
    background-color: #0072cf;
}

/* RTL Specific Styles */
html[dir="rtl"] .comparison-table th:first-child,
html[dir="rtl"] .comparison-table td:first-child {
    text-align: right;
}

/* Make the table responsive */
.table-responsive {
    overflow-x: auto;
}

.table th {
    font-weight: 500;
    font-size: 20px;
    line-height: 26px;
    letter-spacing: 0;
    text-align: center;
    color: #f6f6f6;
}

.table > :not(caption) > * > * {
    border-bottom-width: 3px;
    border-bottom-color: white;
}

.table tr th {
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

.table tr td:first-child {
    font-weight: 500;
    font-size: 18px;
    line-height: 26px;
    letter-spacing: 0%;
    text-align: center;
    color: #454545;
}

.table tr td:nth-child(2) {
    background: #e9f3fb;
}

.table tr td:nth-child(3) {
    background: #f0f4ec;
}

.table tr td:nth-child(4) {
    background: #ffd3d3;
}

.table tr td:nth-child(5) {
    background: #ffedd3;
}

.endTextTable {
    font-weight: 400;
    font-size: 16px;
    line-height: 28px;
    letter-spacing: 0;
    text-align: center;
    font-weight: 400;
    font-size: 16px;
    color: #545454;
    display: block;
}

.stepTitle {
    font-weight: 700;
    font-size: 24px;
    line-height: 31.2px;
    letter-spacing: 0%;
    color: #464646;
}

.Table-Bg-Gradient {
    position: absolute;
    width: 761px;
    height: 767px;
    top: 2673px;
    left: 820px;
    background: linear-gradient( 112.05deg, rgba(255, 199, 0, 0.15) -103%, rgba(255, 27, 27, 0.15) 223.9% );
    filter: blur(250px);
}

.stepper-Bg-Gradient {
    position: absolute;
    width: 939px;
    height: 946px;
    top: 3289px;
    left: 0;
    background: linear-gradient( 112.05deg, rgba(0, 87, 255, 0.3) -103%, rgba(27, 255, 228, 0.3) 223.9% );
    filter: blur(250px);
}

.stepper {
    position: relative;
    margin-top: 200px;
    /* top: -1700px; */
}

.headerTextStepper {
    font-weight: 700;
    font-size: 16px;
    line-height: 28px;
    letter-spacing: 0%;
    text-align: justify;
    color: #454545;
}

.subTextStepper {
    font-weight: 400;
    font-size: 16px;
    line-height: 28px;
    letter-spacing: 0%;
    text-align: right;
    color: #545454;
}

.imgStepper {
    width: 146px;
    height: 274px;
    border-radius: 8px;
    border-width: 3px;
    border: 3px solid #ffffff;
    box-shadow: 0px 0px 31px 0px #00000040;
}

.cardPoshesh {
    background: #ffddc3;
    width: 280px;
    height: 318px;
    gap: 8px;
    border-radius: 16px;
    padding: 18px;
    text-align: center;
    align-content: center;
}

.cardPosheshTitle {
    font-weight: 600;
    font-size: 12px;
    line-height: 18px;
    letter-spacing: 0;
    text-align: right;
    color: #181717;
    text-align: center;
    margin-block: 16px;
}

.cardPosheshText {
    font-weight: 400;
    font-size: 12px;
    line-height: 18px;
    letter-spacing: 0;
    text-align: right;
    color: #464646;
    text-align: right;
}

.bgblue {
    height: 375px;
    padding-inline: 200px;
    padding-block: 40px;
    /*margin-top: 150px;*/
    gap: 16px;
    background-color: #1893a2;
}

.bgblueTitle {
    font-weight: 700;
    font-size: 24px;
    line-height: 36px;
    letter-spacing: 0%;
    text-align: right;
    color: #eefdfd;
}

.bgblueText {
    margin-top: 25px;
    font-weight: 500;
    font-size: 16px;
    line-height: 28px;
    letter-spacing: 0%;
    text-align: justify;
    color: #eefdfd;
}

.fixheight {
    height: 120px;
}

.headerText {
    font-size: 24px;
    font-weight: 700;
    line-height: 31.2px;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #454545;
    text-align: center;
}

.text {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 28px;
    letter-spacing: 0;
    text-align: right;
    justify-content: center;
    padding-inline: 0rem;
    text-transform: uppercase;
    color: #545454;
    /* padding-inline: 14rem; */
    text-align: justify;
}

.mt20 {
    margin-top: 100px !important;
}
/**/
.Modal-PhoneNumber input {
    background-color: #f6f6f6 !important;
}

footer.border-top {
    padding-bottom: 8rem;
}

@media screen and (max-width: 768px) {
    .issuViewHeader {
        font-weight: 700;
        font-size: 15px;
        line-height: 36px;
        letter-spacing: 0;
        text-align: right;
    }

    .btnTamdid {
        font-weight: 700;
        font-size: 12px;
        line-height: 15.6px;
        letter-spacing: 0;
        text-align: center;
    }

        .btnTamdid button {
            border: unset !important;
        }

    .display {
        display: block;
    }

    .listB {
        font-weight: 400;
        font-size: 12px;
        line-height: 17.65px;
        letter-spacing: 0;
        text-align: right;
    }

        .listB .justify {
            justify-content: space-between;
            margin-block: 3px;
        }

    .justify p:nth-child(2) {
        font-weight: 700;
        font-size: 12px;
        line-height: 18px;
        letter-spacing: 0;
    }

    .tamdid {
        font-weight: 700;
        font-size: 12px !important;
        line-height: 15.6px;
        letter-spacing: 0;
        text-align: center;
    }

    .CertificateCode {
        font-weight: 700;
        font-size: 12px;
        line-height: 32px;
        letter-spacing: 0;
    }

        .CertificateCode img {
            display: none;
        }

    .rowMobileAndTitle {
        font-weight: 700;
        font-size: 14px;
        line-height: 36px;
        letter-spacing: 0;
        text-align: right;
    }

    .MobileSize {
        color: #2a2aa9;
    }

    .beneTitle {
        font-weight: 700;
        font-size: 18px;
        line-height: 32px;
        letter-spacing: 0;
        text-align: right;
        color: #eefdfd;
    }

    .linkBeneficiary {
        font-weight: 600;
        font-size: 12px;
        line-height: 32px;
        letter-spacing: 0;
        text-align: center;
        margin-bottom: 1rem;
    }

    .btnpaylog,
    .btnpaylogOutlined {
        font-weight: 700;
        font-size: 12px;
        line-height: 15.6px;
        letter-spacing: 0;
        text-align: center;
    }

    .checkFilter {
        font-weight: 600;
        font-size: 10px;
        line-height: 13px;
        letter-spacing: 0;
        text-align: right;
    }

    .singleTextHeaderPayment {
        font-weight: 700;
        font-size: 12px;
        /*font-size: 14px;*/
        line-height: 36px;
        letter-spacing: 0;
        text-align: right;
    }

    .beneTitle {
        font-family: IRANYekanX;
        font-weight: 700;
        font-size: 12px;
        line-height: 32px;
        letter-spacing: 0;
    }

    .bordergray {
        max-height: 30px;
        color: #b0b0b0;
        margin-block: 5px;
    }

    .datestyle {
        font-weight: 400;
        font-size: 10px;
        line-height: 14.71px;
        letter-spacing: 0;
        text-align: right;
        color: #b0b0b0;
    }

    .TitleTLike {
        font-weight: 600;
        font-size: 12px;
        line-height: 15.6px;
        letter-spacing: 0;
        text-align: right;
    }

    .Verification-OtpBox {
        display: flex;
        flex-direction: column;
        justify-content: center;
        margin-block: 16px;
        align-items: center;
    }

    /*    footer {
        display: none;
    }*/

    .headerText {
        font-weight: 700;
        font-size: 14px;
        line-height: 18.2px;
        letter-spacing: 0;
    }

    .text {
        font-weight: 400;
        font-size: 12px;
        line-height: 28px;
        letter-spacing: 0;
        text-align: right;
        justify-content: center;
        padding-inline: 0rem;
    }

    .h1Style,
    .h1Swiper {
        color: #4f5253;
        font-weight: 700;
        font-size: 14px;
        line-height: 24px;
        letter-spacing: 0;
        text-align: right;
    }

    .h2Style {
        display: none;
    }

    .h2StyleMobile,
    .h2Swiper {
        display: block;
        color: #4f5253;
        font-weight: 400;
        font-size: 10px;
        line-height: 26px;
        letter-spacing: 0;
        text-align: right;
    }

    .slides {
        position: relative;
        width: 160px !important;
        height: 160px !important;
        top: 0px;
        z-index: 1;
    }

    .reqtangle {
        position: absolute;
        width: 130px;
        height: 3px;
        top: 114px;
        right: 50px;
        border-radius: 16px;
        z-index: 0;
    }

    .reqtangle2 {
        position: absolute;
        width: 120px;
        height: 3px;
        top: 114px;
        right: 35px;
        border-radius: 16px;
        z-index: 0;
    }

    .btn-mobile {
        margin-top: 10px !important;
    }

    .PlanBoxBtn {
        background: #1893a2;
        width: 100%;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 600;
        font-size: 10px;
        line-height: 13px;
        letter-spacing: 0;
        text-align: center;
        margin-top: unset;
    }

    .showLg {
        display: none !important;
    }

    .showSm {
        display: block;
    }

    .swiper .PlanBoxBtn {
        background: #1893a2;
        width: 130px;
        height: 25px;
        line-height: 1;
        padding-inline: 32px;
        top: -0.9rem;
        left: 1rem;
        position: relative;
        font-weight: 600;
        font-size: 10px;
        letter-spacing: 0;
        text-align: center;
        white-space: nowrap;
    }

    .swiper-button-next {
        /*color: gray !important;
        position: absolute !important;
        top: 90.5% !important;
        left: 40% !important;
        font-size: 10px !important;
        z-index: 30 !important;*/
        display: none;
    }

    .swiper-button-prev {
        /*color: gray !important;
        position: absolute !important;
        top: 90.5% !important;
        right: 40% !important;
        font-size: 10px !important;
        z-index: 30 !important;*/
        display: none;
    }

    .firstTitleFont {
        font-weight: 700;
        font-size: 12px;
        line-height: 36px;
        letter-spacing: 0;
        text-align: right;
    }

    div.mb-10.text-center.p-3:has(span.firstTitleFont) {
        margin-bottom: 0 !important;
    }

    .Device-Value-block-title h3 {
        font-weight: 700;
        font-size: 13px;
        text-align: right;
        line-height: 32px;
        letter-spacing: 0;
        margin-top: 32px !important;
        color: #454545;
    }

    .Divar .Device-Value-block-title h3 {
        margin-top: 0px !important;
        margin-bottom: 0 !important;
    }

    .Plantitle {
        color: #454545;
        font-weight: 700;
        font-size: 12px;
        line-height: 32px;
        letter-spacing: 0;
    }

    .InfoPayment :nth-child(2),
    .PaymentHeaderText :nth-child(2) {
        margin-top: unset !important;
    }

    .gap5 {
        gap: 3rem;
    }

    .FullWMobile {
        width: 100%;
    }

    .RegisterData .txtLearn {
        padding-left: 0rem;
    }

    .footerPageStep button:nth-child(1) {
        color: #1893a2;
    }

    .footerPageStep button:nth-child(2) {
        color: #ffffff;
    }

    .footerPageStep button span,
    .footerPageStep button span b {
        font-weight: 700;
        font-size: 14px;
        line-height: 18.2px;
        letter-spacing: 0;
        text-align: center;
    }

    .InfoPayment,
    .PaymentHeaderText {
        height: unset;
        border-right: unset;
        margin-block: 10px;
    }

    .justsmmd {
        justify-content: center;
    }

    .titleDetail {
        flex-direction: column-reverse;
    }

    .PlanBox-headerBtn {
        font-weight: 600;
        font-size: 10px;
        line-height: 32px;
        letter-spacing: 0;
        white-space: nowrap;
    }

    .PlanBox-title {
        font-weight: 400;
        font-size: 12px !important;
        letter-spacing: 0;
        gap: 5px;
    }

    .TextSubHeader {
        font-weight: 400;
        font-size: 12px;
        line-height: 18px;
        letter-spacing: 0;
        text-align: justify;
    }

        .TextSubHeader span {
            color: #2a2aa9;
            font-weight: 700;
            font-size: 12px;
            line-height: 18px;
            letter-spacing: 0;
            text-align: justify;
        }

    .titlePay,
    .CardTitle h5 {
        font-weight: 600;
        font-size: 12px;
        line-height: 32px;
        letter-spacing: 0;
    }

    .PaymentHeaderText :nth-child(1) {
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
        color: #2a2aa9;
        font-weight: 400;
        font-size: 12px;
        line-height: 17.65px;
        letter-spacing: 0;
        text-align: right;
    }

    .PaymentHeaderText :nth-child(2) {
        text-align: right;
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
        color: #2a2aa9;
        /*margin-top: 12px;*/
        font-weight: 600;
        font-size: 12px;
        line-height: 17.65px;
        letter-spacing: 0;
    }

    .InfoPayment :nth-child(1) {
        font-weight: 400;
        font-size: 12px;
        line-height: 17.65px;
        letter-spacing: 0;
        text-align: right;
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
        color: #6d6d6d;
        filter: grayscale(1);
    }

    .InfoPayment :nth-child(2) {
        text-align: right;
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
        color: #454545;
        /*margin-top: 12px;*/
        font-weight: 600;
        font-size: 12px;
        line-height: 17.65px;
        letter-spacing: 0;
    }

    .btnpaylogDivar,
    .btnpaylogOutlined,
    .btnpaylog {
        font-weight: 700;
        font-size: 12px;
        line-height: 15.6px;
        letter-spacing: 0;
        text-align: center;
        border: unset;
        white-space: nowrap;
    }

    .Issue
    .fixPayment:has(.PayCustomerInfo)
    .mud-collapse-container.mud-collapse-entered {
        height: unset !important;
        max-height: auto;
    }

    .price {
        font-weight: 700 !important;
        font-size: 12px !important;
        line-height: 18px !important;
        letter-spacing: 0 !important;
    }

        .price .toman {
            font-weight: 700 !important;
            font-size: 10px !important;
            line-height: 18px !important;
            letter-spacing: 0 !important;
        }

    .h6infos {
        font-weight: 700;
        font-size: 12px;
        line-height: 15.6px;
        letter-spacing: 0;
        text-align: center;
    }

    .TextHeaderPayment {
        font-weight: 700;
        font-size: 12px;
        line-height: 18px;
        letter-spacing: 0;
        text-align: right;
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
        color: #1893a2;
    }

    .InfoAllPay {
        line-height: 28px;
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
        color: #545454;
        font-weight: 400;
        font-size: 12px;
        letter-spacing: 0;
        text-align: justify;
    }

    .PriceAdd {
        font-weight: 400;
        font-size: 14px;
        line-height: 20.59px;
        letter-spacing: 0;
        text-align: right;
    }

    .fixheight {
        height: 50px !important;
    }

    .gradientBox1 {
        width: -webkit-fill-available !important;
    }

    .headerTextStepper {
        font-weight: 700;
        font-size: 12px;
        line-height: 28px;
        letter-spacing: 0;
        text-align: justify;
    }

    .subTextStepper {
        font-weight: 400;
        font-size: 12px;
        line-height: 28px;
        letter-spacing: 0;
        text-align: right;
    }

    .bgblue {
        height: auto;
        padding-inline: 30px;
        padding-block: 40px;
        margin-top: 50px;
        gap: 16px;
        background-color: #1893a2;
    }

    .topMobile {
        margin-top: 8px !important;
    }

    .endTextTable {
        font-weight: 400;
        font-size: 12px;
        line-height: 28px;
        letter-spacing: 0;
        text-align: right;
    }

    .table tr th,
    .table tr td {
        font-weight: 500 !important;
        font-size: 10px !important;
        line-height: 15.6px !important;
        letter-spacing: 0 !important;
        text-align: center !important;
    }

    .imgStepper {
        width: 124px;
        height: 231px;
        border-radius: 8px;
        border-width: 3px;
    }

    .firstStep {
        margin-bottom: 100px;
    }

    .boxHomePage {
        margin-bottom: -100px;
    }

    .dot {
        height: 8px;
        width: 8px;
        border-radius: 50%;
        display: inline-block;
    }

    .feature-column {
        background-color: transparent !important;
        border: 0 !important;
        color: #333;
        font-weight: bold;
        width: 100px;
        min-width: 123px;
    }

    .Fparagraph {
        font-size: 14px;
        font-weight: 500;
        text-align: right;
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
        color: #132558;
    }

    .FooterLinkMobile {
        flex-direction: column;
        gap: 10px;
    }

    .linkinfooter {
        font-size: 12px;
        font-weight: 400;
        line-height: 18.2px;
        text-align: right;
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
        color: #132558;
    }

    footer.border-top {
        margin-bottom: 14rem;
        padding-bottom: 20px;
    }

    .BoxResponsive {
        flex-direction: column !important;
    }

    .MobileWidth {
        width: 100% !important;
    }

    .MobileAlign {
        justify-content: center !important;
    }

    .sticky-element {
        top: 10px !important;
        background: #f6f9f9 !important;
    }

    .sticky-element2 {
        top: 12rem !important;
        background: #f6f9f9 !important;
    }

    .sticky-element3 {
        top: 5.3rem !important;
        background: #f6f9f9 !important;
    }

    .divar {
        margin-top: unset;
        min-width: 100%;
        justify-self: center;
    }

        .divar .DivarTitle {
            font-weight: 500;
            font-size: 13px;
            line-height: 36px;
            letter-spacing: 0;
            text-align: right;
            vertical-align: middle;
            color: #a62426;
        }

        .divar .DivarSubtitle {
            font-weight: 400;
            font-size: 10px;
            line-height: 36px;
            letter-spacing: 0;
            text-align: right;
            vertical-align: middle;
            color: #4f5253;
            text-align: justify;
        }

        .divar .DivarImage {
            min-width: 300px;
            width: 370px;
        }

    .TextUpload {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        width: 8rem;
    }
}

@media screen and (max-width: 400px) {
    .divar .DivarImage {
        min-width: 300px;
        width: 300px;
    }

    .divar .DivarTitle {
        font-weight: 500;
        font-size: 12px;
        line-height: 36px;
        letter-spacing: 0;
        text-align: right;
        vertical-align: middle;
        color: #a62426;
    }

    .divar .DivarSubtitle {
        font-weight: 400;
        font-size: 9px;
        line-height: 36px;
        letter-spacing: 0;
        text-align: right;
        vertical-align: middle;
        color: #4f5253;
        text-align: justify;
    }
}

.MobileWidth {
    width: 50%;
}

.sticky-element {
    position: sticky;
    top: 30px;
    z-index: 1;
    background: #f6f9f9;
}

.sticky-element2 {
    position: sticky;
    top: 18rem;
    z-index: 1;
    background: #f6f9f9;
    /*background: linear-gradient(90deg, rgb(244 249 249) 0%, rgba(219, 246, 246, 1) 50%);*/
    /*background-color: rgb(239 248 248);*/
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;
}

.sticky-element3 {
    position: sticky;
    top: 5.3rem;
    z-index: 1;
    background: #f6f9f9;
    padding-block: 10px;
    animation: slideFadeIn 0.4s forwards;
}

@keyframes slideFadeIn {
    0% {
        opacity: 0;
        transform: translateY(-20px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.c1 {
    height: 300px;
    margin-bottom: 20px;
    padding: 10px;
}

.c2 {
    margin-bottom: 0;
}

.fixshowback {
    position: absolute;
    width: 369px;
    height: 372px;
    top: 82px;
    left: 721px;
    background: linear-gradient( 119.73deg, rgba(16, 225, 230, 0.5) -29.04%, rgba(16, 225, 230, 0.5) 88.9% );
    filter: blur(500px);
}

/* divar */
.divar {
    /* margin-top: 100px; */
    max-width: 70%;
    justify-self: center;
}

    .divar .fixgrid {
        display: flex;
        flex-direction: row;
        align-items: center;
    }

    .divar .DivarBox {
        padding: 20px;
        border-radius: 8px;
        box-shadow: 0px 0px 14px 0px #d1d1d140;
        background: rgba(164, 6, 43, 0.02);
        background: linear-gradient( 90deg, rgba(164, 6, 43, 0.15) 10%, rgba(255, 255, 255, 1) 77% );
    }

    .divar .DivarImage {
        border-radius: 8px;
        border-width: 2px;
        border-radius: 8px;
        border: 2px solid #edcece;
    }

    .divar .DivarTitle {
        font-weight: 800;
        font-size: 21px;
        line-height: 36px;
        letter-spacing: 0;
        text-align: right;
        vertical-align: middle;
        color: #a62426;
    }

    .divar .DivarSubtitle {
        font-weight: 700;
        font-size: 16px;
        line-height: 36px;
        letter-spacing: 0;
        text-align: right;
        vertical-align: middle;
        color: #4f5253;
    }

.childSpnLtr > span {
    direction: ltr !important;
}

.CreateCertificateDialog .Caption {
    font-weight: 700;
    font-size: 22px;
    line-height: 100%;
    letter-spacing: 0;
    text-align: right;
    color: #14317A;
}

.CreateCertificateDialog .mud-input.mud-input-outlined .mud-input-outlined-border {
    border-radius: 10px !important
}

.CreateCertificateDialog .bg-red {
    color: red;
    font-size: 10px;
}

.CreateCertificateDialog .control-label span {
    font-weight: 400;
    font-size: 15px;
    line-height: 100%;
    letter-spacing: 0;
    text-align: right;
    color: #767785;
}

.CreateCertificateDialog .mud-timeline-horizontal.mud-timeline-position-bottom::before {
    top: auto;
    bottom: 47px;
    width: 83%;
    justify-self: anchor-center;
}

.CreateCertificateDialog .mud-radio-group, .BeneficiaryPayment .mud-radio-group {
    gap: 10px;
}

.CreateCertificateDialog .RadioCustom, .BeneficiaryPayment .RadioCustom {
    margin-block: 8px !important;
    border-radius: 10px;
    padding-left: 16px;
    gap: 10px;
    border: 1px solid #767785;
}

    .CreateCertificateDialog .RadioCustom:has(.mud-checked), .BeneficiaryPayment .RadioCustom:has(.mud-checked) {
        margin-block: 8px !important;
        border-radius: 10px;
        padding-left: 16px;
        gap: 10px;
        color: #2C60EA;
        background: #F0F3FF;
        border: 1px solid #2C60EA
    }

.RadioCustom span, .RadioCustom p {
    font-size: 15px;
}

.video-file {
    width: 100%;
    height: auto;
    max-width: unset !important;
    max-height: unset !important;
}

    .video-file video {
        width: 100%;
        height: auto;
    }

.CreateCertificateDialog .confirmForm .Caption {
    font-weight: 700;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0px;
    text-align: right;
    color: #14317A;
    place-content: center;
}

.CreateCertificateDialog .confirmForm .SimplePreview {
    align-self: center;
}

.selectUpload {
    font-weight: 700;
    font-size: 15px;
    line-height: 100%;
    letter-spacing: 0;
    text-align: right;
    color: #2C60EA;
    background: #F0F3FF;
    width: 114px;
    height: 32px;
    border-radius: 8px;
    padding-block: 8px;
    padding-inline: 32px;
}

.CreateCertificateDialog .mud-progress-linear.mud-progress-linear-color-warning:not(.mud-progress-linear-buffer)::before {
    background-color: unset !important;
}

.CreateCertificateDialog .mud-progress-linear .mud-progress-linear-bars {
    border-radius: 8px;
}

.GreenLine::before {
    top: auto;
    bottom: 47px;
    content: "";
    height: 2px;
    position: absolute;
    width: 16%;
    background: green;
    margin-right: 40px;
}

.StatusBtn {
    width: 166px;
    height: 48px;
    border-radius: 8px;
    padding-block: 8px;
    padding-inline: 32px;
    gap: 10px;
}

.CreateCertificateDialog .StatusStep .Caption {
    font-weight: 700;
    font-size: 18px;
    line-height: 2.5rem;
    letter-spacing: 0;
    color: #14317A;
}