.form-loading {
    background: url(/images/loading.gif) no-repeat center 100px;
    min-height: 700px;
}

.mbd-submit-default {
    display: block;
    position: relative;
    padding: 15px;
    margin: 0;
    font-size: 14px;
}

.mbd-submit-default .sd-fields {
    position: relative;
}

.mbd-submit-default .sd-fields .sd-field {
    min-height: 60px;
}

.mbd-submit-default .sd-fields .sd-field .sd-field-text {
    display: inline-block;
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 8px;
}

.mbd-submit-default .sd-fields .sd-field .sd-field-required span {
    font-weight: 700;
    display: block;
    color: #ecbc4b;
    padding: 1em;
    background-color: #fff6de;
    margin-top: 10px;
}

.steps .disabled {
    opacity: 0.5
}

.inputunit {
    border-radius: var(--b-radius) 0 0 var(--b-radius);
}

.fieldnumber {
    position: relative;

    input {
        padding-left: 4rem !important;
        width: 100% !important;
    }

    .numberunit {
        left: 4rem;
        top: 3px;
        white-space: nowrap;
    }
}

.BarterGroup {
    .primary.button {
        background: transparent;
        border: 1px solid var(--accent-color);
        width: 100%;
        color: var(--accent-color);
        padding: 1rem 0;

        &:hover {
            background: var(--accent-color);
            color: var(-White)
        }
    }
}

.mbd-newsletter-submit {
    .NewsLetterHeader {
        margin-top: 4.857rem;
        margin-bottom: 1.714rem;
        padding: 2.571rem 2rem;
        background: radial-gradient(1512.05% 200.69% at 7.09% 19.64%, #00C4D8 0%, #005C81 100%);
    }

    .imgBox {
        top: 0;

        .img {
            z-index: 2;

            &:before {
                content: "";
                border-radius: var(--radius-12);
                background: var(--text-light-4);
                box-shadow: 0px 0px 2px 0px rgba(40, 41, 61, 0.04), 0px 4px 8px 0px rgba(96, 97, 112, 0.16);
                width: 22.214rem;
                height: 20rem;
                position: absolute;
                z-index: -1;
                top: 3.428rem;
            }
        }
    }

    .NewsLetterGroup {
        margin-bottom: 2.5rem;
    }
}

.contact-theme {
    position: relative;
    padding: 2.28rem 1.45rem;

    &:before,
    &:after {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        min-height: 35.35rem;
        border-radius: var(--radius-12);
        background: linear-gradient(278deg, #1C8BB8 -8.8%, #005C81 65.15%);
        -webkit-border-radius: var(--radius-12);
        -moz-border-radius: var(--radius-12);
        -ms-border-radius: var(--radius-12);
        -o-border-radius: var(--radius-12);
    }

    &:after {
        background-image: url('/portals/0/images/contact-logo.png');
        background-position: right bottom;
        background-repeat: no-repeat;
        background-size: cover;
    }

    .main-title {
        display: block;
        font-size: 1.28rem;
        margin-bottom: 0.3rem;
    }

    .sub-title {
        display: block;
        font-size: 0.91rem;
    }


    .contact-info-col,
    .contact-form-col {
        position: relative;
        display: inline-block;
        width: 50%;
        padding: 1.14rem;
        z-index: 1;
    }

    .contact-info-col {
        padding: 0;

        * {
            color: var(--White);
        }

        .info-item {
            display: flex;
            flex-direction: column;
            align-items: start;
            gap: 0.57rem;
            margin-top: 0.85rem;

            .title-box {
                display: flex;
                align-items: center;

                .title {
                    font-size: 1.07rem;
                }
            }

            .desc {
                font-size: 0.91rem;
            }
        }

        .support,
        .social {
            .title {
                display: block;
                margin-bottom: 0.57rem;
            }
        }

        .support {
            margin-top: 0.85rem;

            .btn-holder {

                .link-btn {
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    gap: 0.57rem;
                    padding: 0.45rem 1rem;
                    font-size: 0.85rem;
                    white-space: nowrap;
                    border-radius: var(--b-radius);
                    -webkit-border-radius: var(--b-radius);
                    -moz-border-radius: var(--b-radius);
                    -ms-border-radius: var(--b-radius);
                    -o-border-radius: var(--b-radius);

                    svg {
                        display: block;
                        width: 1.71rem;
                        height: 1.71rem;
                    }

                    &.ticket {
                        background: var(--secondary-darker);
                    }

                    &.chat {
                        background: var(--primary-main);
                    }
                }
            }
        }

        .social {
            margin-top: 0.85rem;

            .items-wrapper {
                padding: 0.5rem 0;

                .item {
                    display: inline-block;
                    vertical-align: middle;
                    margin-left: 0.6rem;

                    svg {
                        display: block;
                        width: 1.71rem;
                        height: 1.71rem;
                    }
                }
            }
        }
    }

    .contact-form-col {
        width: 46%;
        margin-right: 4%;
        border-radius: var(--radius-12);
        background: var(--White);
        box-shadow: var(--box-shadow);
        -webkit-border-radius: var(--radius-12);
        -moz-border-radius: var(--radius-12);
        -ms-border-radius: var(--radius-12);
        -o-border-radius: var(--radius-12);
    }

    .ng-scope {
        margin: 0 !important;
    }

    .sd-fields {

        .sd-field {
            padding: 0 !important;
            margin-bottom: 0.57rem;

            .sd-field-text {
                display: block;
                margin-bottom: 0.57rem !important;
                font-size: 13px;
                font-weight: 500;
            }
        }
    }

    .ui.input input,
    .ui.input textarea,
    .selectize-control.single .selectize-input,
    .selectize-dropdown.single {
        border-radius: 0.57rem !important;
        border: solid 1px var(--text-light-1) !important;
        -webkit-border-radius: 0.57rem !important;
        -moz-border-radius: 0.57rem !important;
        -ms-border-radius: 0.57rem !important;
        -o-border-radius: 0.57rem !important;

        &::placeholder {
            color: var(--text-light-0);
        }
    }

    .ui.input input {
        height: 40px;
    }

    .mbd-field-uploadphoto {
        position: relative;
        height: 3.5rem;
        min-height: unset;
        border-radius: 0.57rem !important;
        border: solid 1px var(--text-light-1) !important;
        padding: 1rem;
        text-align: center;
        -webkit-border-radius: 0.57rem !important;
        -moz-border-radius: 0.57rem !important;
        -ms-border-radius: 0.57rem !important;
        -o-border-radius: 0.57rem !important;

        input[type="file"] {
            font-size: 0;
            cursor: pointer;
            background: transparent;
            position: absolute;
            top: 0;
            height: 100% !important;
            z-index: 2;
            width: calc(100% - calc(var(--bs-gutter-x) * 1));
            border: 1px dashed rgb(142, 142, 142);
            outline: 0;
            padding: 1rem;
            border: none !important;
        }

        .mbd-field-uploadphoto {
            height: 17vh;
            gap: 15px;
            margin: 0px;
        }

        .Uploadtext {
            width: max-content;
            white-space: nowrap;
            color: var(--accent-color);
            padding: 5px 15px;
            border-radius: 8px;
            margin-bottom: 1rem;

            svg {
                stroke: var(--accent-color) !important;
            }
        }

        input::focus {
            border: none !important;
        }

        input[type="file"]:focus {
            /* border-color: unset !important; */
        }

        input[type="file"]::file-selector-button {
            display: none;
        }


        .text-input.theme-default {}
    }

    .submit-btn {
        display: inline-block;
        padding: 0;
    }

    .ui.primary.button {
        min-width: 8rem;
        font-size: 1rem;
        border-radius: var(--b-radius);
        -webkit-border-radius: var(--b-radius);
        -moz-border-radius: var(--b-radius);
        -ms-border-radius: var(--b-radius);
        -o-border-radius: var(--b-radius);
        background: var(--system-green-0);
        font-weight: 700;
        padding: 1rem 1rem;
    }

    @media(max-width: 990px) {

        &:before,
        &:after {
            min-height: 50%;
        }

        .contact-info-col,
        .contact-form-col {
            width: 100%;
            margin: 0;
        }

        .contact-form-col {
            margin-top: 2rem;
        }
    }
}

.inline-radio {
    display: flex;
    align-items: center;
    gap: 1rem;

    .mbd-field-radiobutton {
        flex-direction: row !important;
        align-items: center;
    }

    .sd-field-text {
        margin: 0 !important;
    }

    .checkbox.theme-default input,
    .radio.theme-default input {
        opacity: 1;
        position: relative !important;
        margin: 0 !important;
    }

}