/******** TO BE INCLUDED ON PAGE RIGHT AFTER BOOTSTRAP'S CSS ********/

:root {
  --bs-blue-100: #cfe2ff;
  --bs-blue-200: #9ec5fe;
  --bs-blue-300: #6ea8fe;
  --bs-blue-400: #3d8bfd;
  --bs-blue-500: #0d6efd;
  --bs-blue-600: #0a58ca;
  --bs-blue-700: #084298;
  --bs-blue-800: #052c65;
  --bs-blue-900: #031633;
  --bs-indigo-100: #e0cffc;
  --bs-indigo-200: #c29ffa;
  --bs-indigo-300: #a370f7;
  --bs-indigo-400: #8540f5;
  --bs-indigo-500: #6610f2;
  --bs-indigo-600: #520dc2;
  --bs-indigo-700: #3d0a91;
  --bs-indigo-800: #290661;
  --bs-indigo-900: #140330;
  --bs-purple-100: #e2d9f3;
  --bs-purple-200: #c5b3e6;
  --bs-purple-300: #a98eda;
  --bs-purple-400: #8c68cd;
  --bs-purple-500: #6f42c1;
  --bs-purple-600: #59359a;
  --bs-purple-700: #432874;
  --bs-purple-800: #2c1a4d;
  --bs-purple-900: #160d27;
  --bs-pink-100: #f7d6e6;
  --bs-pink-200: #efadce;
  --bs-pink-300: #e685b5;
  --bs-pink-400: #de5c9d;
  --bs-pink-500: #d63384;
  --bs-pink-600: #ab296a;
  --bs-pink-700: #801f4f;
  --bs-pink-800: #561435;
  --bs-pink-900: #2b0a1a;
  --bs-red-100: #f8d7da;
  --bs-red-200: #f1aeb5;
  --bs-red-300: #ea868f;
  --bs-red-400: #e35d6a;
  --bs-red-500: #dc3545;
  --bs-red-600: #b02a37;
  --bs-red-700: #842029;
  --bs-red-800: #58151c;
  --bs-red-900: #2c0b0e;
  --bs-orange-100: #ffe5d0;
  --bs-orange-200: #fecba1;
  --bs-orange-300: #feb272;
  --bs-orange-400: #fd9843;
  --bs-orange-500: #fd7e14;
  --bs-orange-600: #ca6510;
  --bs-orange-700: #984c0c;
  --bs-orange-800: #653208;
  --bs-orange-900: #331904;
  --bs-yellow-100: #fff3cd;
  --bs-yellow-200: #ffe69c;
  --bs-yellow-300: #ffda6a;
  --bs-yellow-400: #ffcd39;
  --bs-yellow-500: #ffc107;
  --bs-yellow-600: #cc9a06;
  --bs-yellow-700: #997404;
  --bs-yellow-800: #664d03;
  --bs-yellow-900: #332701;
  --bs-green-100: #d1e7dd;
  --bs-green-200: #a3cfbb;
  --bs-green-300: #75b798;
  --bs-green-400: #479f76;
  --bs-green-500: #198754;
  --bs-green-600: #146c43;
  --bs-green-700: #0f5132;
  --bs-green-800: #0a3622;
  --bs-green-900: #051b11;
  --bs-teal-100: #d2f4ea;
  --bs-teal-200: #a6e9d5;
  --bs-teal-300: #79dfc1;
  --bs-teal-400: #4dd4ac;
  --bs-teal-500: #20c997;
  --bs-teal-600: #1aa179;
  --bs-teal-700: #13795b;
  --bs-teal-800: #0d503c;
  --bs-teal-900: #06281e;
  --bs-cyan-100: #d1ecf1;
  --bs-cyan-200: #a2dae3;
  --bs-cyan-300: #74c7d4;
  --bs-cyan-400: #45b5c6;
  --bs-cyan-500: #17a2b8;
  --bs-cyan-600: #128293;
  --bs-cyan-700: #0e616e;
  --bs-cyan-800: #09414a;
  --bs-cyan-900: #052025;
}


:root,
[data-bs-theme=light] {

    --bs-border-color-rgb: 222, 226, 230;
    
    --bs-body-disabled-bg: #f8f9fa; /* --bs-tertiary-bg */

    --bs-border-emphasis: #ced4da; /* --bs-gray-400 */
    --bs-secondary-subtle: #adb5bd; /* --bs-gray-500 */

    /* fixes an issue that may get sorted in BS 5.3 RTM */
    --bs-form-control-bg: #fff;
    --bs-form-control-disabled-bg: #e9ecef;

}

[data-bs-theme=dark] {

    --bs-border-color-rgb: 73, 80, 87;

    --bs-body-disabled-bg: #181c1f;

    --bs-border-emphasis: #6c757d; /* --bs-gray-600 */
    --bs-secondary-subtle: #adb5bd; /* --bs-gray-500 */

    /* fixes an issue that may get sorted in BS 5.3 RTM */
    --bs-form-control-bg: #212529;
    --bs-form-control-disabled-bg: #343a40;
    
}


a { text-decoration: none; }

a.alert-link { font-weight: normal; text-decoration: underline; }
.alert p { line-height: 1.333; }
.alert p:last-of-type { margin: 0; }

h1, .h1 { font-weight: 700; margin-bottom: 1.5rem; line-height: 1.0; }
h2, .h2 { margin-bottom: 1.25rem; line-height: 1.0; letter-spacing: -1px; }
h3, .h3 { margin-bottom: 1rem; line-height: 1.0; }

hr { opacity: .125; }

kbd { color: var(--bs-secondary); background-color: var(--bs-secondary-bg); }

.table thead th { border-bottom-width: 1px; }
.table td, .table th { font-size: .875rem; vertical-align: middle; }
@media (min-width: 576px) { .table td, .table th { font-size: 1rem; } }

.bg-body-disabled { background-color: var(--bs-body-disabled-bg); }

.btn-info { --bs-btn-color: var(--bs-white); --bs-btn-hover-color: var(--bs-white); --bs-btn-active-color: var(--bs-white); --bs-btn-disabled-color: var(--bs-white); }
.btn-outline-info { --bs-btn-hover-color: var(--bs-white); --bs-btn-active-color: var(--bs-white); }

.btn-outline-warning { color: inherit; }

.flex-relative-1 { flex: 1 1 0 !important; }
.flex-relative-2 { flex: 2 1 0 !important; }
.flex-relative-3 { flex: 3 1 0 !important; }
.flex-relative-4 { flex: 4 1 0 !important; }
.flex-relative-5 { flex: 5 1 0 !important; }

.form-check { margin-bottom: 0; }
.form-check-label { text-align: left; }

.form-control::placeholder { color: var(--bs-tertiary-color); }
.form-control:disabled { background-color: var(--bs-tertiary-bg) !important; color: rgba(var(--bs-body-color-rgb), .5); }
.form-control[readonly] { background-color: var(--bs-tertiary-bg) !important; }
.form-select:disabled { background-color: var(--bs-tertiary-bg) !important; color: rgba(var(--bs-body-color-rgb), .5); }

.form-label, .col-form-label { font-style: italic; }
.form-label { margin-bottom: .375rem; line-height: 1.375; }
.form-text { margin-top: .5rem; }
.form-text, .validation-message { text-align: left; }

.fw-medium { font-weight: 500 !important; }

option:disabled { color: var(--bs-tertiary-color); }

pre { font-family: 'SF Mono', monospace; font-size: .875rem; line-height: 1.25; }

.tooltip { --bs-tooltip-max-width: 252px; --bs-tooltip-padding-y: .5rem; --bs-tooltip-padding-x: .75rem; pointer-events: none; }
.tooltip-inner { line-height: 1.25; }

.input-group-text { background-color: var(--bs-tertiary-bg); }

.dropdown-menu { box-shadow: 0 .5rem 1rem rgba(var(--bs-black-rgb), .15) !important; }
[data-bs-theme=dark] .dropdown-menu { --bs-dropdown-border-color: var(--bs-border-color); box-shadow: 0 .5rem 1rem rgba(var(--bs-black-rgb), .75) !important; }

.dropdown-header { text-transform: uppercase; }

.toast:not(:last-child) { margin-bottom: .5rem; }

[data-bs-theme=dark] .modal { --bs-modal-border-color: var(--bs-border-color); }

.modal-content { box-shadow: 0 .5rem 2rem rgba(var(--bs-black-rgb), .25) !important; }
[data-bs-theme=dark] .modal-content { box-shadow: 0 .5rem 2rem rgba(var(--bs-black-rgb), .875) !important; }

.modal-header { align-items: start; }

.nav-tabs .nav-item { font-size: 1.125rem; }
.nav-tabs .nav-link { white-space: nowrap; }

/* -------- Bootstrap styling to Blazor validation attributes (TODO: custom compile Bootstrap or customise Blazor to just make styles match up, or just wait until it's fixed (https://github.com/aspnet/AspNetCore/issues/8695)') -------- */
.form-control[aria-invalid] { border-color: var(--bs-danger); padding-right: calc(1.5em + 0.75rem); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23dc3545' viewBox='-2 -2 7 7'%3e%3cpath stroke='%23dc3545' d='M0 0l3 3m0-3L0 3'/%3e%3ccircle r='.5'/%3e%3ccircle cx='3' r='.5'/%3e%3ccircle cy='3' r='.5'/%3e%3ccircle cx='3' cy='3' r='.5'/%3e%3c/svg%3E"); background-repeat: no-repeat; background-position: center right calc(0.375em + 0.1875rem); background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); }
.form-control[aria-invalid]:focus { border-color: var(--bs-danger); box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25); }
.form-control[aria-invalid] ~ .invalid-feedback,
.form-control[aria-invalid] ~ .invalid-tooltip { display: block; }
textarea.form-control[aria-invalid] { padding-right: calc(1.5em + 0.75rem); background-position: top calc(0.375em + 0.1875rem) right calc(0.375em + 0.1875rem); }
.form-select[aria-invalid] { border-color: var(--bs-danger); padding-right: calc((1em + 0.75rem) * 3 / 4 + 1.75rem); background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.75rem center/8px 10px, url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23dc3545' viewBox='-2 -2 7 7'%3e%3cpath stroke='%23dc3545' d='M0 0l3 3m0-3L0 3'/%3e%3ccircle r='.5'/%3e%3ccircle cx='3' r='.5'/%3e%3ccircle cy='3' r='.5'/%3e%3ccircle cx='3' cy='3' r='.5'/%3e%3c/svg%3E") var(--bs-white) no-repeat center right 1.75rem/calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); }
.form-select[aria-invalid]:focus { border-color: var(--bs-danger); box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25); }
.form-select[aria-invalid] ~ .invalid-feedback,
.form-select[aria-invalid] ~ .invalid-tooltip { display: block; }
.form-check-input[aria-invalid] ~ .form-check-label { color: inherit; }
.form-check-input[aria-invalid] ~ .invalid-feedback,
.form-check-input[aria-invalid] ~ .invalid-tooltip { display: block; }
.validation-message { width: 100%; margin-top: 0.25rem; font-size: 80%; color: var(--bs-danger); }

@media (min-width: 768px) {
    .modal-dialog { max-width: 600px; }
    .modal-xs { max-width: 300px; }
    .modal-sm { max-width: 450px; }
}

@media (min-width: 992px) {
    .modal-lg, .modal-xl, .modal-xxl { max-width: 800px; }
}

@media (min-width: 1200px) {
    .modal-xl, .modal-xxl { max-width: 1140px; }
}

@media (min-width: 1400px) {
    .modal-xxl { max-width: min(96%, 1600px); }
}