/* Reskins the Fluent Forms markup to match this block's rounded, brand-green design. */

.tii-contact-form__form .ff-el-group {
    margin-bottom: 1rem;
}

.tii-contact-form__form input.ff-el-form-control,
.tii-contact-form__form textarea.ff-el-form-control,
.tii-contact-form__form select.ff-el-form-control {
    display: block;
    width: 100%;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 0.375rem;
    padding: 0.75rem 1rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
    background-color: #fff;
}

.tii-contact-form__form input.ff-el-form-control:focus,
.tii-contact-form__form textarea.ff-el-form-control:focus,
.tii-contact-form__form select.ff-el-form-control:focus {
    outline: none;
    border-color: var(--color-brand-green);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-brand-green) 30%, transparent);
}

.tii-contact-form__form .ff-el-form-check-label {
    font-size: 0.875rem;
}

/* fluentform-public-default.css sets .ff_btn_style to a purple pill by default —
   override to the site's brand-green pill button used elsewhere on the page. */
.tii-contact-form__form button.ff-btn-submit {
    border-radius: 9999px !important;
    background-color: var(--color-brand-green) !important;
    border-color: var(--color-brand-green) !important;
    padding: 0.75rem 2rem !important;
    font-size: 0.875rem !important;
    font-weight: 600 !important;
    color: #000 !important;
}

.tii-contact-form__form button.ff-btn-submit:hover,
.tii-contact-form__form button.ff-btn-submit:focus {
    opacity: 0.95 !important;
    background-color: var(--color-brand-green) !important;
    border-color: var(--color-brand-green) !important;
    color: #000 !important;
}