/* login.css — supplements the design team's style.css/layout.css/components.css.
   Only adds validation/messaging styles their files don't include.
   Does NOT restyle the card, inputs, or button (their CSS owns the look). */

/* Inline field error message under each input */
.field-error {
    display: none;
    color: #d23b3b;
    font-size: 12px;
    margin-top: 5px;
}

/* Red highlight on an empty/invalid input */
.login-input-wrap input.input-error {
    border: 1px solid #e05656 !important;
    background: #ffecec !important;
}

/* Server-side message banner (wrong password, inactive, etc.) */
.login-message {
    background: #fdecec;
    border: 1px solid #f3c2c2;
    color: #c0392b;
    font-size: 13px;
    padding: 9px 12px;
    border-radius: 6px;
    margin-bottom: 14px;
}