.valuation-form {
    position: relative;

    h2 {
        color: #07071C;
        font-size: 27px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        letter-spacing: -0.54px;
    }

    h3 {
        color: #07071C;
        font-size: 18px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
        letter-spacing: -0.36px;
        margin-bottom: 20px;
    }
}

.form-section {
    margin: 40px 0;

    .form-group {

        input,
        select,
        textarea {
            color: #07071C;
            font-size: 16px;
            font-style: normal;
            font-weight: 400;
            line-height: normal;
            letter-spacing: -0.32px;
            padding: 18px 28px;
            border-radius: 7px;
            border: 1px solid #E1DFF2;
            height: auto !important;
            appearance: none;
            -moz-appearance: none;
            -ms-progress-appearance: unset;
            -webkit-appearance: none;
            transition: all 0.2s !important;

            &.field-error {
                border-color: #ff0f0f !important;
            }
        }

        input[type="checkbox"] {
            padding: 0 !important;
            border-radius: 3px;
            border: 1px solid #312F31;
            width: 18px;
            height: 18px !important;
            display: inline-block !important;
            position: relative !important;
            margin: 6px 0 0 0 !important;
            flex: 0 0 18px !important;

            &:checked {
                background: #796af6;
                border-color: #796af6 !important;
                box-shadow: inset 0 0 0 2px #fff;
            }
        }

        select {
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='19' viewBox='0 0 19 19' fill='none'%3E%3Cpath d='M14.8075 6.4998C14.7339 6.4256 14.6463 6.3667 14.5499 6.32651C14.4534 6.28632 14.3499 6.26562 14.2454 6.26562C14.1409 6.26562 14.0374 6.28632 13.941 6.32651C13.8445 6.3667 13.7569 6.4256 13.6833 6.4998L10.0575 10.1256C9.98391 10.1998 9.89635 10.2587 9.79988 10.2989C9.7034 10.3391 9.59993 10.3598 9.49542 10.3598C9.39091 10.3598 9.28743 10.3391 9.19096 10.2989C9.09449 10.2587 9.00693 10.1998 8.93334 10.1256L5.3075 6.4998C5.23391 6.4256 5.14635 6.3667 5.04988 6.32651C4.9534 6.28632 4.84993 6.26562 4.74542 6.26562C4.64091 6.26562 4.53743 6.28632 4.44096 6.32651C4.34449 6.3667 4.25693 6.4256 4.18334 6.4998C4.03589 6.64813 3.95313 6.84878 3.95312 7.05792C3.95313 7.26707 4.03589 7.46772 4.18334 7.61605L7.81709 11.2498C8.2624 11.6946 8.86604 11.9444 9.49542 11.9444C10.1248 11.9444 10.7284 11.6946 11.1738 11.2498L14.8075 7.61605C14.955 7.46772 15.0377 7.26707 15.0377 7.05792C15.0377 6.84878 14.955 6.64813 14.8075 6.4998Z' fill='black'/%3E%3C/svg%3E");
            background-repeat: no-repeat;
            background-position: center right 20px;
        }


        &.form-check {
            display: flex;
            text-align: left;

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

.form-section-checkboxes {
    .form-group {
        display: flex;
        gap: 30px;
        flex-wrap: wrap;

        @media all and (max-width: 575px){
            justify-content: center;
        }

        label {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            color: #07071C;
            text-align: center;
            font-size: 16px;
            font-style: normal;
            font-weight: 400;
            line-height: normal;
            letter-spacing: -0.32px;
            border-radius: 7px;
            border: 1px solid #E1DFF2;
            width: 208px;
            height: 170px;
            margin: 0;
            transition: all 0.2s;
            flex: 0 0 208px;



            &.selected {
                border-color: #796af6;
            }

            input {
                opacity: 0;
                position: absolute;
                z-index: -1;
            }

            svg {
                height: 94px;
                margin-bottom: 13px;
            }
        }
    }
}

.valuation-form-price {
    margin-top: 83px;
    border-radius: 6px;
    background: linear-gradient(90deg, rgba(121, 106, 246, 0.08) 0%, rgba(71, 62, 144, 0.01) 100%);
    padding: 37px;
    margin-bottom: 35px;
    position: relative;

    p {
        color: #07071C;
        font-size: 43px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
        letter-spacing: -0.86px;
        margin: 0;
    }

    h3 {
        margin-bottom: 5px;
    }

    &::before {
        width: 4px;
        height: 77px;
        flex-shrink: 0;
        background: #796AF6;
        content: '';
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
    }
}

.valuation-form-buttons-accept {
    display: none;
}

.valuation-form-buttons-send {
    display: none;
}

.valuation-form-buttons {
    .btn-primary {
        border-radius: 30px;
        background: #EF5D60 !important;
        border-color: #EF5D60 !important;
        color: #FFF;
        font-size: 15px;
        font-style: normal;
        font-weight: 800;
        line-height: normal;
        letter-spacing: -0.45px;
        text-transform: unset !important;
        padding: 14px 70px;

        &.btn-accept {
            display: inline-flex;
            gap: 5px;
            align-items: center;

            svg {
                path {
                    fill: #fff;
                    transition: all 0.2s;
                }
            }
        }

        &:hover {
            color: #EF5D60 !important;
            background: #fff !important;

            svg {
                path {
                    fill: #EF5D60 !important;
                }
            }
        }


    }
}

.loading-placeholder {
    background-color: #f9f9f9;
    position: absolute;
    width: calc(100% + 50px);
    height: calc(100% + 50px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    margin-top: 15px;
    text-align: center;
    font-size: 14px;
    color: #555;
    font-weight: bold;
    top: -25px;
    left: -25px;
    opacity: 0.5;
    border: 0;
}

.form-error-message {
    margin: 20px 0;
}

#valuation-contact-form {
    display: none;
}