/* DEZA — стили форм Fluent Forms в стиле сайта */

.fluentform {
    color: #161616;
    font-family: inherit;
}

.fluentform .ff-el-group {
    margin-bottom: 18px;
}

.fluentform .ff-el-input--label label,
.fluentform .ff-el-input--label {
    color: #161616;
    font-weight: 600;
    font-size: 15px;
    margin-bottom: 6px;
}

.fluentform .ff-el-input--label.ff-el-is-required.asterisk-right label:after {
    color: #161616;
    opacity: .55;
}

.fluentform .ff-el-form-control,
.fluentform input[type="text"],
.fluentform input[type="email"],
.fluentform input[type="tel"],
.fluentform textarea,
.fluentform select {
    width: 100%;
    box-sizing: border-box;
    color: #161616 !important;
    background-color: #ffffff !important;
    border: 1px solid #d6d6d6 !important;
    border-radius: 12px !important;
    padding: 14px 18px !important;
    font-family: inherit;
    font-size: 16px;
    line-height: 1.4;
    box-shadow: none !important;
    outline: none;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.fluentform textarea {
    min-height: 140px;
    resize: vertical;
}

.fluentform select {
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath fill='%23161616' d='M7 9 0 2l1.4-1.4L7 6.2 12.6.6 14 2z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 18px center !important;
    background-size: 12px 8px !important;
    padding-right: 44px !important;
}

.fluentform .ff-el-form-control:hover,
.fluentform input[type="text"]:hover,
.fluentform input[type="email"]:hover,
.fluentform input[type="tel"]:hover,
.fluentform textarea:hover,
.fluentform select:hover {
    border-color: #00e1dc !important;
}

.fluentform .ff-el-form-control:focus,
.fluentform input[type="text"]:focus,
.fluentform input[type="email"]:focus,
.fluentform input[type="tel"]:focus,
.fluentform textarea:focus,
.fluentform select:focus {
    border-color: #161616 !important;
    box-shadow: 0 0 0 3px rgba(0, 225, 220, .18) !important;
}

.fluentform .ff-el-form-control::placeholder,
.fluentform input::placeholder,
.fluentform textarea::placeholder {
    color: #9b9b9b;
    opacity: 1;
}

/* Кнопка — «радужная», как .b-button-rainbow на сайте */
.fluentform .ff-btn-submit,
.fluentform .ff-btn-submit.deza-form-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(90deg, #FCEA00 0%, #F8E904 11%, #ECE913 25%, #D9E82A 39%, #BFE64C 54%, #9CE476 70%, #73E2AA 86%, #4BE0DD 100%) !important;
    background-color: transparent !important;
    color: #161616 !important;
    border: 0 !important;
    border-radius: 20px !important;
    padding: 16px 38px !important;
    min-width: 200px;
    font-family: inherit;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.1;
    letter-spacing: -0.01em;
    text-decoration: none;
    box-shadow: none;
    cursor: pointer;
    transition: transform .2s ease, filter .2s ease;
}

.fluentform .ff-btn-submit:hover,
.fluentform .ff-btn-submit:focus {
    color: #161616 !important;
    filter: brightness(.96);
    transform: translateY(-1px);
}

.fluentform .ff-btn-submit:active {
    transform: translateY(0);
}

/* Сообщения об ошибках и успехе */
.fluentform .ff-el-is-error .ff-el-form-control {
    border-color: #d63638 !important;
}

.fluentform .error,
.fluentform .ff-errors-in-stack {
    color: #d63638;
    font-size: 14px;
}

.fluentform .ff-message-success {
    color: #161616;
    font-size: 18px;
}

@media (max-width: 600px) {
    .fluentform .ff-btn-submit {
        width: 100%;
        min-width: 0;
        padding: 15px 20px !important;
    }
}