html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    background: #0C0C0C;
    color: #F2F2F2;
}

a, .btn-link {
    color: #4D8BFF;
}

/* Override Bootstrap focus ring to match brutalist system */
.btn:focus, .btn:active:focus, .btn-link.nav-link:focus,
.form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 2px #FF4D4A;
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 2px solid #36C46B;
}

.invalid {
    outline: 2px solid #FF4D4A;
}

.validation-message {
    color: #FF4D4A;
    font-size: .78rem;
    font-weight: 700;
}

.blazor-error-boundary {
    background: #1A0808;
    border-left: 3px solid #FF4D4A;
    padding: 1rem;
    color: #FF8A9C;
}

.blazor-error-boundary::after {
    content: "An unhandled error has occurred."
}

.darker-border-checkbox.form-check-input {
    border-color: #333;
}

.form-floating > .form-control-plaintext::placeholder,
.form-floating > .form-control::placeholder {
    color: #333;
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder,
.form-floating > .form-control:focus::placeholder {
    text-align: start;
}