:root { --hps-red: rgb(195,32,50); --hps-red-50: rgba(195,32,50,0.5); --hps-grey:rgb(221,222,223) }

a[href]:not(.btn) { color: var(--hps-red) }
a:not([href]) { color: initial; text-decoration: none }

.alert-danger, .alert-danger td { color: var(--bs-danger-text-emphasis); background-color: var(--bs-danger-bg-subtle) }
.alert-info, .alert-info td { color: var(--bs-info-text-emphasis); background-color: var(--bs-info-bg-subtle) }
.alert-success, .alert-success td { color: var(--bs-success-text-emphasis); background-color: var(--bs-success-bg-subtle) }
.alert-warning, .alert-warning td { color: var(--bs-warning-text-emphasis) black; background-color: var(--bs-warning-bg-subtle) }

.bg-dark, .thead-dark, .thead-dark th { background-color: var(--hps-red) !important; }

body { font-size: 14px; font-family: Arial }

.border { border-color: #ced4da !important }

.btn,
.form-control,
.form-select { font-size: inherit }

.container { padding: 0 }

[data-parameter-name="LoginName"] { display: none; }

.date-time-display { white-space: nowrap }

[disabled]:not(td),
[disabled] + label { opacity: 0.5; cursor: not-allowed !important }

.error:not(tr,td,tbody), .error[type="file"] + label,
.valid:not(tr,td,tbody), .valid[type="file"] + label { border: medium solid !important }
.error:not(tr,td,tbody), .error[type="file"] + label { border-color: red !important }
.valid:not(tr,td,tbody), .valid[type="file"] + label { border-color: green !important }

.flash { -webkit-animation: flash 1s ease-out; -webkit-animation-iteration-count: 1 }

.form-check-input:checked { background-color: var(--hps-red) }
.form-check-input, .form-select { cursor: pointer }
.form-floating label:after { background-color: transparent !important }
.form-switch .form-check-input { height: 30px; width: 60px; border-color: #ced4da }

.form-control:disabled:not(.please-wait) { background-color: transparent; border: none }

.form-floating .error + label:before, .form-floating .valid + label:before, .list.checkbox.error label:not(.form-check-label):before, .list.checkbox.valid label:not(.form-check-label):before, input[type="number"].error:before, input[type="number"].valid:before { font-family: "FontAwesome"; margin-right: 5px }
.form-floating .error + label:before, .list.checkbox.error label:not(.form-check-label):before, input[type="number"].error:before { content: "\f057" /* circle-xmark */; color: red }
.form-floating .valid + label:before, .list.checkbox.valid label:not(.form-check-label):before, input[type="number"].valid:before { content: "\f058" /* circle-check */; color: green; }
.form-floating input[type="text"], .form-floating select:not(.list-show), .list.checkbox { min-height: 60px; }

#Home a { width: 115px; aspect-ratio: 1/1; white-space: normal !important; display: inline-table !important; }
    #Home a.level1[href="/"] { display: none !important; }
    #Home a:focus { background-color: var(--hps-red); color: white; }
#Home a, #Home legend { font-size: medium; }
    #Home a.static { text-decoration: none }
#Home fieldset { display: inline; width: auto; padding-top: 0 !important }
#Home fieldset, #Home a { margin: 2px; border-width: 1px !important }
    #Home fieldset.level1 { border-color: black !important; }
        #Home fieldset.level1 > legend { font-weight: bold !important; }
    #Home fieldset.level2 { border-color: gray !important }
    #Home fieldset.level3 { border-color: silver !important }
    #Home fieldset.level2, #Home fieldset.level3, #Home fieldset.level4 { margin-top: 0 !important }
#Home .border-top { border: none !important }
#Home legend { padding: 0 5px; }

hr + hr { display: none; }

input:is(:checked) + .btn:not(.list-select-toggle) { background-color: var(--hps-red) !important; color: white !important; }
input:is(:checked):hover + .btn:not(.list-select-toggle) { color: white }

input[type="date"] { cursor: text }
input[type="number"] { -moz-appearance: textfield; }
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0 }

input::placeholder { font-size: smaller }

.list.checkbox.expanded .when-expanded { display: block; }

.list.checkbox:not(.expanded) .when-expanded { display: none !important; }

.list.checkbox .list-toggle .btn { cursor: initial }

.list.checkbox options > div { max-height: 250px; overflow-y: auto }

.list.checkbox options.show-all { /* Do nothing. */ }

.list.checkbox options.show-checked input[type="checkbox"]:not(:checked),
.list.checkbox options.show-checked input[type="checkbox"]:not(:checked) ~ span,
.list.checkbox options.show-unchecked input[type="checkbox"]:checked,
.list.checkbox options.show-unchecked input[type="checkbox"]:checked ~ span { opacity: 0.25 }

.list-header { cursor: pointer }

.list.radio[disabled="disabled"] options { background-color: rgb(233,236,239) }

[data-parameter-name="UserADRoles"] { display: none }

.please-wait:not(.list.checkbox, .list.radio, tbody, .no-wait):before,
.please-wait.list.checkbox .list-header label:before,
.please-wait.list.radio options:before,
.please-wait.list.dropdown + label:before,
input[type="file"].please-wait + label:before { font-family: "FontAwesome"; content: "\f110" /* spinner */ !important; -webkit-animation: fa-spin 2s infinite linear; -moz-animation: fa-spin 2s infinite linear; animation: fa-spin 2s infinite linear; display: inline-block; }

.please-wait.list.checkbox { background-color: #e9ecef }

a.please-wait:before { color: silver }
main.please-wait:before { width: 100%; text-align: center }
img.please-wait { display: none; }

#Results { scroll-margin-top: 50px }
    #Results.please-wait:before { display: block; text-align: center }

.row { margin: 0; padding: 0 }

.sr-only { display: none; }

.table .alert-info { background-color: #cff4fc }

.table-bordered { border-collapse: separate; border-spacing: 0 }
    .table-bordered th { border-top-width: thin; border-bottom-width: thin; border-right-width: thin }
    .table-bordered td { border-bottom-width: thin; border-right-width: thin }
    .table-bordered th:first-child, table-bordered td:first-child { border-left-width: thin }

.text-white a:not(.btn, .text-dark), thead.text-white th { color: white; }

main .sticky-top { top: 50px }

tr.alert-danger td, tr.alert-warning td { background: inherit; color: inherit }

tr.border td { border-left: none; border-right: none }
    tr.border td:first-child { border-left: inherit }
    tr.border td:last-child { border-right: inherit }
tr.border-top td { border-top: thin solid silver }

tr.border-bottom td { border-bottom: thin solid black }

tr:not(.edit-mode) .edit-mode { display: none }
tr.edit-mode .view-mode { display: none }

tr.invalid td, tbody.invalid td { background-color: var(--bs-danger-bg-subtle); color: var(--bs-danger) }

tr.pb-0 td, tr.pb-0 th { padding-bottom: 0 }
tr.pt-0 td, tr.pt-0 th { padding-top: 0 }

.treeview-node .roles { display: none }
.treeview-node:hover .roles { display: initial }
.treeview-node .roles:not(:empty), .menu .roles { color: silver; cursor: pointer }
    .treeview-node .roles.expanded, .menu .roles.expanded { border: thin solid silver; border-radius: 5px; padding-right: 5px; font-size: 10px; }
    .treeview-node .roles:not(:empty):before { font-family: "FontAwesome"; content: "\f084" /* key */; padding: 0 5px; font-size: 10px }


.ui-dialog { z-index: 2000; max-width: 80% }
    .ui-dialog .dialog-hide { overflow: hidden; text-overflow: clip; max-width: 0; white-space: nowrap }
    .ui-dialog tr.dialog-hide { display: none; }
    .ui-dialog .sticky-top { top: 0 }

.ui-dialog-content { max-height: 350px !important; }

.ui-dialog-titlebar-close { border: none; background-color: transparent; top: 40% !important }
    .ui-dialog-titlebar-close:after { font-family: "FontAwesome"; content: "\f00d" /* xmark */; }

.w-20 { width: 18% }
.w-25.m-1 { width: 24% !important }

.when-admin:not(:empty):before { font-family: "FontAwesome"; content: "\f3ed"; padding-right: 2px; opacity: 0.25 /* shield-halved */ }

.x-small { font-size: 0.75em }
.xx-small { font-size: 0.5em }

.border-2 { border-width: 2px }

.treeview-node .btn { display: none }
.treeview-node:hover .btn { display: initial }

.w-sm-auto { width: auto !important }

@-webkit-keyframes flash {
    0% { background-color: transparent; }
    50% { background-color: var(--hps-red-50); }
    100% { background-color: transparent; }
}