/*
 * Fix 005 - Contact Us: the derived "Area in question".
 *
 * It replaced a <select>, so it keeps that field's shape - same 15px radius,
 * same 8px/16px padding as the real inputs - and is muted rather than white to
 * say "this is settled for you", not "you forgot to fill this in".
 *
 * Scoped entirely to .ld-area-derived, which only this field renders.
 */
.ld-area-derived__value {
    display: block;
    min-height: 40px;
    padding: 8px 16px;
    border: 1px solid #d5d5d5;
    border-radius: 15px;
    background: #f5f5f5;
    color: #1f2124;
    font-size: 15px;
    line-height: 22px;
    /* The neighbouring select sets no explicit family, so inherit the same. */
    box-sizing: border-box;
}

/*
 * Before a reason is chosen there is no area to show. An empty grey box reads
 * as a field the visitor failed to complete, so say what it is waiting for.
 */
.ld-area-derived__value:empty::before {
    content: attr(data-ld-empty-text);
    color: #767676;
}

/*
 * Fix 006 - a servicing enquiry is a signpost, not a form.
 *
 * The server refuses this reason (Forms\ContactUs::NON_SUBMITTING) and fix 005
 * sends the visitor to the secure messaging site instead, so every field below
 * the reason is about to be discarded. Asking for a name, an email and a message
 * first is work the visitor does for nothing - the live loandepot.com site asks
 * for none of it. So the form collapses to the reason, the reCAPTCHA notice
 * Google requires us to keep visible, the explanation, and the button.
 *
 * Driven by one class on the <form>, added by ld-contact-area.js, so with the
 * script blocked the form stays exactly as Elementor rendered it.
 */
.elementor-form .elementor-field-group-servicing_notice {
    display: none;
}

.elementor-form.ld-servicing .elementor-field-group:not(.elementor-field-group-contact_reason):not(.elementor-field-group-servicing_notice):not(.elementor-field-type-recaptcha):not(.elementor-field-type-submit) {
    display: none;
}

.elementor-form.ld-servicing .elementor-field-group-servicing_notice {
    display: block;
}

/* Reads as a sentence to the visitor, not as a form field. */
.ld-servicing-notice {
    margin: 0;
    color: #1f2124;
}