/* form-errors.css — bold red highlight on inputs and tabs that failed server-side validation */

/* Individual input marked by JS after receiving <meta name="form-errors"> */
.has-server-error,
input.has-server-error,
select.has-server-error,
textarea.has-server-error {
    border: 2px solid #d9534f !important;
    background: #fff8f8 !important;
}

.has-server-error:focus {
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(217, 83, 79, .25) !important;
    border-color: #d9534f !important;
}

/* Nav-tabs whose pane contains an error get a red bold label with a dot */
.nav-tabs .nav-link.has-error {
    color: #d9534f !important;
    font-weight: 700 !important;
}
.nav-tabs .nav-link.has-error::after {
    content: " \25CF";
    color: #d9534f;
    margin-left: 4px;
}

/* Make the <small class="text-danger"><strong> already emitted by @error louder */
small.text-danger {
    display: inline-block;
    margin-top: 4px;
    font-size: 0.85rem;
}
small.text-danger strong {
    color: #d9534f;
    font-weight: 700;
}

/* Label of an error input can be tinted too when JS marks it */
label.has-error-label {
    color: #d9534f !important;
    font-weight: 700 !important;
}