header .divider{
    height: 20px;
    background: var(--color-neutral-200);
    width: 1px;
}
.modal-custom .modal-close{
    position: fixed;
    right: 16px;
    top: 16px;
}
.modal-custom.show .modal-close{
    display: block !important;
}
.modal-custom .modal-body{
    padding: 24px;
}
.modal-custom .modal-body .text-l{
    color: var(--color-black);
}
.section-franchising-form-success{
    background: var(--color-pink-50);
    height: 100vh;
    width: 100%;
    overflow: hidden;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    background-image: url("/storage/icons/bg-icon-form.svg");
    background-size: 4792px;
    background-position-x: -871px;
    background-position-y: -209px;
    background-repeat: no-repeat;
}
.form-tabs-controls::-webkit-scrollbar {
    display: none;
}
.form-tabs-controls{
    overflow-x: auto;
    padding-bottom: 1px;
}
.form-tabs-controls .tab-control{
    min-width: 220px;
    display: flex;
    align-items: center;
    column-gap: 8px;
    padding: 8px 8px 8px 0;
    cursor: pointer;
    transition: var(--base-transition);
    position: relative;
}
.form-tabs-controls .tab-control .icon{
    height: 18px;
    width: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    border: 1px dashed var(--color-neutral-200);
    transition: var(--base-transition);
}
.form-tabs-controls .tab-control .icon span{
    width: 12px;
    height: 12px;
    border-radius: 50px;
    background: var(--color-neutral-200);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--base-transition);
}
.form-tabs-controls .tab-control:not(.success, .error):hover .icon,
.form-tabs-controls .tab-control.active .icon{
    border-color: var(--color-purple-200);
}
.form-tabs-controls .tab-control:not(.success, .error):hover .icon span,
.form-tabs-controls .tab-control.active .icon span{
    background: var(--color-purple-500);
}
.form-tabs-controls .tab-control:hover:after,
.form-tabs-controls .tab-control.active:after{
    bottom: -1px;
    left: 1px;
    height: 1px;
    width: 100%;
    background:  var(--color-purple-500);
    z-index: 10;
    display: block;
    content: "";
    position: absolute;
}

.form-tabs-controls .tab-control.error.active:after{
    background:  var(--color-error-1000);
}
.form-tabs-controls .tab-control.error.active .icon,
.form-tabs-controls .tab-control.error .icon,
.form-tabs-controls .tab-control.error.active .icon,
.form-tabs-controls .tab-control.error .icon{
    border: none;
    background: var(--color-error-10);
}
.form-tabs-controls .tab-control.error span,
.form-tabs-controls .tab-control.error.active span{
    color: var(--color-error-1000);
    background: var(--color-error-10);
}
.form-tabs-controls .tab-control.error span:after,
.form-tabs-controls .tab-control.error.active span:after{
    content:"!";
    display: inline;
}

.form-tabs-controls .tab-control.success.active .icon,
.form-tabs-controls .tab-control.success .icon{
    border: none;
    background: var(--color-purple-50);
}
.form-tabs-controls .tab-control.success span,
.form-tabs-controls .tab-control.success.active span{
    color: var(--color-purple-500);
    background: var(--color-purple-50);
}
.form-tabs-controls .tab-control.success span:after,
.form-tabs-controls .tab-control.success.active span:after{
    content:'\0044';
    display: inline;
    font-family: 'plusonemoving';
    font-size: 11px;
}


.section-franchising-steps-form-buttons{
    width: 100%;
    padding: 8px;
    background: var(--color-white);
    z-index: 25;
    left: 0;
    bottom: 0;
    position: fixed;
}
.btn.btn-back{
    color: var(--color-black);
    outline: none;
    background: none;
    border: none;
}
.section-franchising-steps-form{
    padding: 48px 0 85px;
}
.section-franchising-steps-form .form-styles .form-group.has-error .help-block{
    display: none;
}
.form-tabs-content .errors-message{
    padding: 4px 16px;
    border-radius: 8px;
    background: var(--color-error-10);
    color: var(--color-error-1000);
    cursor: pointer;
}
.form-tabs-content .errors-message .text-m-m{
    color: var(--color-error-1000)
}
.modal-custom .modal-body .btns a{
    cursor: pointer;
}

.section-franchising-steps-form-controls,
header{
    position: sticky;
    top: 0;
    left: 0;
    z-index: 119;
    width: 100%;
}
.section-franchising-steps-form-controls{
    top: 60px;
    background: var(--color-white);
}
.form-styles  .radio-list-custom .form-group.required .radio-list-label:after{
    display: none;
}
.radio-list-custom > div > div{
    display: flex;
    align-items: center;
    column-gap: 16px;
}
.form-styles  .radio-list-custom .form-group.required .radio-list-label span,
.form-styles  .radio-list-custom .form-group .radio-list-label span,
.radio-list-custom  .radio-list-label span{
    cursor: pointer;
    display: flex;
    align-items: center;
    column-gap: 4px;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
}
.radio-list-custom  .radio-list-label input{
    display: none;
}
.radio-list-custom  .radio-list-label span:before{
    width: 16px;
    height: 16px;
    border-radius: 50px;
    border: 1.5px solid var(--color-neutral-200);
    flex-shrink: 0;
    content: "";
}
.radio-list-custom  .radio-list-label input:checked + span:before{
    border: 4px solid var(--color-purple-400);
}
.radio-list-custom  .has-error .radio-list-label span:before{
    border-color: var(--color-error-500);
}
.checkbox-item label input{
    display: none;
}
.checkbox-item label span {
    display: flex;
    align-items: flex-start;
    column-gap: 4px;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: var(--color-neutral-700);
    cursor: pointer;
}
.checkbox-item label span:before {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 4px;
    border: 1.5px solid var(--color-neutral-200);
    background: var(--color-white);
    flex-shrink: 0;
    content: "";
    margin-top: 4px;
}
.checkbox-item label input:checked + span:before {
    font-family: 'plusonemoving';
    font-size: 9px;
    line-height: 9px;
    content: '\0044';
    color: var(--color-white);
    background: var(--color-purple-400);
    border-color: var(--color-purple-400);
}
.checkbox-item .has-error label span:before{
    border-color: var(--color-error-500);
}

.franchising-steps-form  .filepond--root{
    margin-bottom: 0;
    border: 1px dashed var(--color-neutral-200);
    border-radius: 8px;
}
.franchising-steps-form .filepond--root .filepond--panel-root{
    border-radius: 0;
    background: none;
}
.franchising-steps-form  .filepond--root .filepond--drop-label label{
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
    vertical-align: middle;
    color: var(--color-neutral-500);;
}

@media (min-width: 576px) {

}
@media (min-width: 768px) {
    .modal-custom .modal-close{
        right: 40px;
        top: 40px;
    }
    header .btn-square{
        width: 48px;
        height: 48px;
    }
    .modal-custom .modal-body{
        padding: 32px;
    }
    .modal-custom .modal-body .mb-24{
        margin-bottom: 32px;
    }
    .modal-custom .modal-body .btns{
        column-gap: 24px;
    }
    .section-franchising-form-success{
        background-position-x: -675px;
        background-position-y: -209px;
    }
    .section-franchising-form-success .logo img{
        height: 64px;
    }
    .section-franchising-steps-form-controls{
        top: 68px;
    }
}
@media (min-width: 992px) {

}
@media (min-width: 1200px) {
    .section-franchising-form-success{
        background-position-x: -339px;
        background-position-y: -209px;
    }
}
@media (min-width: 1440px) {

}