:root {
    --app-blue: #0052a5;
    --app-blue-hover: #006cd7;
    --app-text: #1b1b1b;
    --app-muted: #767676;
    --app-grey: #f1f1f1;
    --app-border: #b7b7b7;
    --app-red: #d5233f;
    --app-header-height: 4.5rem;

    --bs-body-font-family: 'Open Sans', Helvetica, Arial, sans-serif;
    --bs-body-color: var(--app-text);
    --bs-emphasis-color: var(--app-text);
    --bs-secondary-color: var(--app-muted);
    --bs-border-color: var(--app-border);
    --bs-border-radius: 4px;
    --bs-link-color: var(--app-blue);
    --bs-link-color-rgb: 0, 82, 165;
    --bs-link-hover-color: var(--app-blue-hover);
    --bs-link-hover-color-rgb: 0, 108, 215;
    --bs-primary: var(--app-blue);
    --bs-primary-rgb: 0, 82, 165;
    --bs-danger: var(--app-red);
    --bs-danger-rgb: 213, 35, 63;
    --bs-focus-ring-color: rgba(0, 82, 165, 0.35);
}

h1, h2, h3, h4, h5, .h1, .h2, .h3, .h4, .h5 {
    font-weight: 700;
}

h1:focus {
    outline: none;
}

.btn {
    font-weight: 600;
}

.btn-primary {
    --bs-btn-bg: var(--app-blue);
    --bs-btn-border-color: var(--app-blue);
    --bs-btn-hover-bg: var(--app-blue-hover);
    --bs-btn-hover-border-color: var(--app-blue-hover);
    --bs-btn-active-bg: #0452a8;
    --bs-btn-active-border-color: #0452a8;
    --bs-btn-disabled-bg: var(--app-blue);
    --bs-btn-disabled-border-color: var(--app-blue);
}

.btn-outline-primary {
    --bs-btn-color: var(--app-blue);
    --bs-btn-border-color: var(--app-blue);
    --bs-btn-hover-bg: var(--app-blue);
    --bs-btn-hover-border-color: var(--app-blue);
    --bs-btn-active-bg: var(--app-blue);
    --bs-btn-active-border-color: var(--app-blue);
    --bs-btn-disabled-color: var(--app-blue);
    --bs-btn-disabled-border-color: var(--app-blue);
}

.btn-outline-danger {
    --bs-btn-color: var(--app-red);
    --bs-btn-border-color: var(--app-red);
    --bs-btn-hover-bg: var(--app-red);
    --bs-btn-hover-border-color: var(--app-red);
    --bs-btn-active-bg: #a7162d;
    --bs-btn-active-border-color: #a7162d;
}

.btn-danger {
    --bs-btn-bg: var(--app-red);
    --bs-btn-border-color: var(--app-red);
    --bs-btn-hover-bg: #a7162d;
    --bs-btn-hover-border-color: #a7162d;
}

.form-control, .form-select {
    border-color: var(--app-border);
}

.form-control:focus, .form-select:focus, .form-check-input:focus, .btn:focus-visible {
    border-color: var(--app-blue);
    box-shadow: 0 0 0 0.2rem rgba(0, 82, 165, 0.25);
}

.form-label {
    font-weight: 600;
    margin-bottom: 0.25rem;
}

.form-label.required::after {
    content: " *";
    color: var(--app-red);
}

.text-danger {
    color: var(--app-red) !important;
}

.table {
    --bs-table-active-bg: #e3edf8;
    --bs-table-hover-bg: #f1f5fa;
}

.table > thead th {
    background-color: var(--app-grey);
    font-weight: 700;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #598527;
}

.invalid {
    outline: 1px solid var(--app-red);
}

.validation-message {
    color: var(--app-red);
}

.blazor-error-boundary {
    background: var(--app-red);
    padding: 1rem;
    color: white;
}

.blazor-error-boundary::after {
    content: "Wystąpił błąd.";
}

html:lang(en) .blazor-error-boundary::after {
    content: "An error has occurred.";
}

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}
