html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    background-color: var(--app-bg);
    color: var(--app-text);
}

a, .btn-link {
    color: var(--app-link);
}

a:hover, .btn-link:hover {
    color: var(--app-link-hover);
}

.btn-primary {
    color: var(--app-primary-contrast);
    background-color: var(--app-primary);
    border-color: var(--app-primary);
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem var(--app-bg), 0 0 0 0.25rem var(--app-focus-ring);
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid var(--app-success);
}

.invalid {
    outline: 1px solid var(--app-danger);
}

.validation-message {
    color: var(--app-danger);
}

.blazor-error-boundary {
    position: relative;
    background: var(--error-boundary-bg);
    padding: 1rem 1rem 1rem 3.7rem;
    color: var(--error-ui-text);
}

.blazor-error-boundary::before {
    content: "";
    position: absolute;
    left: 1rem;
    top: 1rem;
    width: 1.8rem;
    height: 1.8rem;
    background-color: var(--error-boundary-icon);
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='49' viewBox='0 0 56 49'%3E%3Cpath d='M28.506 0C29.717 0 30.813 0.4837 31.606 1.2658l0.446 0.5329 0.487 0.8296 22.646 38.5548 0.36 0.6119 0.111 0.2011c0.221 0.517 0.344 1.0855 0.344 1.6822C56 46.0651 54.038 48 51.617 48H5.383C2.963 48 1 46.0651 1 43.6782c0-.2983 0.031-0.5896 0.089-0.8708l0.249-0.791 0.52-0.8848L24.473 2.6294l0.488-0.8309 0.446-0.5327C26.2 0.4837 27.296 0 28.506 0ZM28.586 15.0183c-2.849 0-4.273 1.1062-4.273 3.3187 0 .2732 0.019 0.5238 0.058 0.7517l2.424 13.9274h3.585l2.441-14.2686c0.039-0.0166 0.058-0.1598 0.058-0.4296 0-2.1997-1.431-3.2996-4.293-3.2996Zm-0.01 20.0364c-2.527 0-3.79 1.2458-3.79 3.7374 0 2.4916 1.263 3.7374 3.79 3.7374 2.54 0 3.811-1.2458 3.811-3.7374 0-2.4916-1.271-3.7374-3.811-3.7374Z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='49' viewBox='0 0 56 49'%3E%3Cpath d='M28.506 0C29.717 0 30.813 0.4837 31.606 1.2658l0.446 0.5329 0.487 0.8296 22.646 38.5548 0.36 0.6119 0.111 0.2011c0.221 0.517 0.344 1.0855 0.344 1.6822C56 46.0651 54.038 48 51.617 48H5.383C2.963 48 1 46.0651 1 43.6782c0-.2983 0.031-0.5896 0.089-0.8708l0.249-0.791 0.52-0.8848L24.473 2.6294l0.488-0.8309 0.446-0.5327C26.2 0.4837 27.296 0 28.506 0ZM28.586 15.0183c-2.849 0-4.273 1.1062-4.273 3.3187 0 .2732 0.019 0.5238 0.058 0.7517l2.424 13.9274h3.585l2.441-14.2686c0.039-0.0166 0.058-0.1598 0.058-0.4296 0-2.1997-1.431-3.2996-4.293-3.2996Zm-0.01 20.0364c-2.527 0-3.79 1.2458-3.79 3.7374 0 2.4916 1.263 3.7374 3.79 3.7374 2.54 0 3.811-1.2458 3.811-3.7374 0-2.4916-1.271-3.7374-3.811-3.7374Z'/%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
}

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

.darker-border-checkbox.form-check-input {
    border-color: var(--app-border-strong);
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

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

body {
    background-color: var(--app-bg);
    color: var(--app-text);
}

h1, h2, h3, h4, h5, h6 {
    color: var(--app-text);
}

p, li, label, strong {
    color: inherit;
}

input, select, textarea, button {
    font: inherit;
}

input, select, textarea {
    background-color: var(--app-surface);
    color: var(--app-text);
    border-color: var(--app-border);
}

input::placeholder,
textarea::placeholder {
    color: var(--app-text-soft);
}

hr {
    border-color: var(--app-border);
    opacity: 1;
}