/*
    The one field-error style for the whole site: portal, login/register and the public pages.
    Border --error-30, text --error-100, no gap above the message. Page stylesheets keep only
    layout (slots, animation, placement) and never set these properties themselves.
    Loaded by all three layouts, after the theme/Bootstrap so it wins over their own reds.
*/

/* ---- Invalid control: border ---- */
.form-control.is-invalid,
.form-control.is-invalid:focus,
.form-control.input-validation-error,
.form-control.input-validation-error:focus,
.bootstrap-select:has(select.is-invalid) > .dropdown-toggle,
.bootstrap-select:has(select.input-validation-error) > .dropdown-toggle,
.wp-ccy:has(.form-control.is-invalid) .wp-ccy__toggle,
.wp-ccy:has(.form-control.input-validation-error) .wp-ccy__toggle,
.otp-box.otp-box--error {
    border-color: var(--error-30);
}

/* ---- Error message: text ---- */
.invalid-feedback,
.field-validation-error,
.auth-field__error,
.reg-field-error__text,
.wp-field__error-text,
.wp-cf__err,
.wp-err,
.wp-errslot,
.otp-error {
    margin-top: 0;
    font-size: .9rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--error-100);
}