.form-progress {
    position: relative;
    display: block;
    margin: 3rem auto;
    width: 100%;
    max-width: 400px;
}

progress {
    display: block;
    position: relative;
    top: 5px;
    left: 5px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: #052264;
    width: 100%;
    height: 5px;
    background: none;
    transition: 1s;
    will-change: contents;
}
progress::-webkit-progress-bar {
    background-color: #ddd;
}
progress::-webkit-progress-value {
    background-color: #052264;
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

.form-progress-indicator {
    position: absolute;
    top: -12px;
    left: 0;
    display: inline-block;
    width: 35px;
    height: 35px;
    background: white;
    border: 2px solid #ddd;
    border-radius: 50%;
    transition: all 0.2s ease-in-out;
    transition-delay: 0.3s;
    will-change: transform;
}
.form-progress-indicator.one {
    left: 0;
}
.form-progress-indicator.two {
    left: 100%;
}
.form-progress-indicator.active {
    -webkit-animation: bounce 0.5s forwards;
    animation: bounce 0.5s forwards;
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
    border-color: #052264;
    background: #052264;
}

.animation-container {
    position: relative;
    width: 100%;
    transition: 0.3s;
    will-change: padding;
    overflow: hidden;
}

.form-step {
    position: absolute;
    transition: 1s ease-in-out;
    transition-timing-function: ease-in-out;
    will-change: transform, opacity;
}

.form-step.leaving {
    -webkit-animation: left-and-out 0.5s forwards;
    animation: left-and-out 0.5s forwards;
}

.form-step.waiting {
    transform: translateX(400px);
}

.form-step.coming {
    -webkit-animation: right-and-in 0.5s forwards;
    animation: right-and-in 0.5s forwards;
}

@-webkit-keyframes left-and-out {
    100% {
        opacity: 0;
        transform: translateX(-400px);
    }
}

@keyframes left-and-out {
    100% {
        opacity: 0;
        transform: translateX(-400px);
    }
}
@-webkit-keyframes right-and-in {
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}
@keyframes right-and-in {
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}
@-webkit-keyframes bounce {
    50% {
        transform: scale(1.5);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes bounce {
    50% {
        transform: scale(1.5);
    }
    100% {
        transform: scale(1);
    }
}

.progress-title {
    position: absolute;
    left: -70px;
    width: max-content;
    font-size: 12px;
    top: 36px;
    color: black;
}



@media screen and (max-width: 760px) {
    .form-progress-indicator.one .progress-title{
        left: 0;
    }
    .form-progress-indicator.two .progress-title{
        left: -170px;
    }

    .lang__zgh .form-progress-indicator.two .progress-title{
        left: -30px;
    }
}
@media screen and (max-width: 400px) {
    .form-progress-indicator .progress-title{
        font-size: 10px;
    }
    .form-progress-indicator.two .progress-title{
        left: -130px;
    }

    .lang__zgh .form-progress-indicator.two .progress-title{
        left: -40px;
    }
}

.custom-tooltip {
    --bs-tooltip-bg: #052264;
}

body.rtl .form-progress-indicator.one{
    right: 0;
    left: inherit;
}
body.rtl .form-progress-indicator.two{
    left: 0;
    right: inherit;
}
body.rtl progress.form-progress-bar{
    left: -3px;
    right: 0;
}
body.rtl .custom-control-label{
    text-align: right;
    width: 100%;
    margin-right: 10px;
}
body.rtl .custom-control-label::before,
body.rtl .custom-control-label::after{
    right: -1.5rem;
    left: inherit;
}
body.rtl .form-label{
    float: right;
}
body.rtl .rtl_arab{
    text-align: right;
}
body.rtl .form-group .text-danger{
    text-align: right;
    display: block;
}
body.rtl .form-label .text-danger{
    text-align: right;
    display: initial;
}
body.rtl .progress-title{
    right: -20px;
    left: inherit;
}
.daterangepicker.rtl{
    direction: rtl;
    text-align: right;
}
body.rtl input#custom-phone,
body.rtl input#inputCode,
body.rtl input#inputCodePhone,
body.rtl input#phone_parent,
body.rtl input#modifynumber1{
    direction: ltr;
    text-align: right;
}

.lang__zgh .progress-title{
    left: -20px;
}
body.rtl .daterangepicker .calendar-table .prev span{
    transform: rotate(320deg);
    -webkit-transform: rotate(320deg);
}
body.rtl .daterangepicker .calendar-table .next span {
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
}
body.rtl .modal-header .close{
    margin: -1rem auto -1rem -1rem;
}
body.rtl .select2-results__option{
    text-align: right;
}
body.rtl .select2-container--bootstrap4 .select2-search--inline{
    text-align: right;
}
body.rtl .select2-container--bootstrap4 .select2-selection--multiple .select2-selection__clear {
    top: 30px;
    left: 0.7em;
    right: inherit;
    color: #052264;
}
body.rtl .select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice{
    float: right;
}
body.rtl .response_access,
body.rtl .email_message_confirm
{
    text-align: right;
}
body.rtl .buttons-signup{
    direction: ltr;
}