//  =================
//      Imports
//  =================

@import '../../base/base'; // Base Variables

/*      Map     */

#basic_map1 {
    width: 100%;
    border-radius: 12px;
    height: 726px !important;
}

/*  Contact Section Header     */

.cu-contact-section {
    .cu-section-header {
        margin-bottom: 50px;

        h4 {
            color: $m-color_10;
            font-size: 34px;
            font-weight: 600;
        }

        p {
            color: $m-color_7;
            font-size: 15px;
        }
    }

    position: relative;
    padding: 0;
    display: flex;

    .contact-form {
        top: 0;
        right: 0;
        bottom: 0;
        margin-top: auto;
        margin-bottom: auto;
        height: fit-content;
        height: -moz-max-content;
        height: 100%;
        z-index: 2;
        min-width: 365px;

        form {
            padding: 25px 35px;
            height: 100%;

            .input-fields {
                position: relative;

                svg {
                    position: absolute;
                    top: 11px;
                    color: $primary;
                    width: 20px;
                    left: 25px;

                    &.feather-mail {
                        left: 12px;
                        top: 7px;
                    }
                }
            }

            h4 {
                font-size: 22px;
                font-weight: 600;
                margin-bottom: 25px;
                color: $m-color_10;
            }

            input {
                padding: 8px 5px 8px 40px;
                background-color: transparent;

                &::-webkit-input-placeholder,
                &::-ms-input-placeholder,
                &::-moz-placeholder {
                    color: $m-color_6;
                    font-size: 14px;
                }

                box-shadow: none;
                color: $m-color_10;
                font-weight: 400;
                height: calc(1.4em + 1.4rem + 2px);
            }
        }
    }

    p {
        color: $m-color_10;
    }

    .n-chk {
        display: inline-block;

        label {
            color: $m-color_10;
        }
    }
}

/* 	Contact Content 	*/

.new-control.new-radio.radio-success > input:checked ~ span.new-control-indicator {
    background: $primary !important;
}

.cu-contact-section {
    .form-group textarea {
        padding: 8px 5px 8px 43px;
        background-color: transparent;
        resize: none;

        &::-webkit-input-placeholder,
        &::-ms-input-placeholder,
        &::-moz-placeholder {
            color: $m-color_6;
            font-size: 14px;
        }

        color: $m-color_10;
        font-weight: 400;

        &:-ms-input-placeholder {
            color: #7b8489;
        }
    }

    form button {
        border: none;
        padding: 15px 25px;
        display: block;
        width: 100%;
        background-color: $primary !important;
        box-shadow: none;
    }
}

@media (max-width: 991px) {
    .cu-contact-section {
        .contact-form {
            right: 0;
            left: 0;
            margin-right: auto;
            margin-left: auto;
            margin-top: 0;
            margin-bottom: 0;
            position: absolute;

            form {
                max-width: 530px;
                margin: 0 auto;
                width: 100%;
                border-radius: 0;
                height: 100%;
                background-color: rgba(3, 3, 5, 42%);
                background-attachment: fixed;
                background-size: contain;
                -webkit-backdrop-filter: blur(12px);
                backdrop-filter: blur(10px);
            }
        }

        .cu-section-header {
            background-color: rgba(3, 3, 5, 13%);
            background-attachment: fixed;
            background-size: contain;
            -webkit-backdrop-filter: blur(12px);
            backdrop-filter: blur(1px);
            padding: 15px;
            margin-bottom: 80px;
            border-radius: 12px;
        }

        .contact-form form input,
        .form-group textarea {
            box-shadow: none;
            background-color: rgba(3, 3, 5, 13%);
            background-attachment: fixed;
            background-size: contain;
            -webkit-backdrop-filter: blur(12px);
            backdrop-filter: blur(1px);
            border-radius: 12px;
            color: #fff;
            font-weight: 400;
            border: none;
        }

        .contact-form form input {
            box-shadow: none;
            color: $m-color_4;
            font-weight: 400;
        }

        p {
            color: $m-color_4;
        }

        .n-chk {
            display: inline-block;

            label {
                color: $m-color_4;
            }
        }

        .cu-section-header p {
            color: $m-color_4;
            font-size: 15px;
        }

        .contact-form form h4 {
            font-size: 22px;
            font-weight: 600;
            margin-bottom: 25px;
            color: #fff;
        }
    }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .cu-contact-section .contact-form form {
        min-width: 530px;
        width: 100%;
    }
}