/*PlusOneX Custom Style*/
@import url(theme.css);

:root,
body {
    accent-color: var(--bs-primary);
    /* For use of default bootstrap alerts, override the default colours with colours from the theme */
    --bs-warning-text: var(--bs-danger);
    --bs-warning-bg-subtle: var(--bs-normal-bg);
    --bs-warning-border-subtle: var(--bs-orange);
}

div {
    color: inherit;
    font-size: inherit;
}

#ifrmMenu {
    transition: all .2s ease-in-out;
}

.section-title,
.section-title-sm {
    font-weight: 600;
    border-bottom: 1px solid var(--bs-body-color);
}

.form-check-control input,
.panelCustom {
    -webkit-appearance: none;
    -moz-appearance: none;
}

.contentHolder,
.header-container,
.header_black,
.middle_header,
.middle_header > *,
.pad_top_0 {
    position: relative;
}

.fit button,
.nav-container button,
.ui-datepicker .ui-datepicker-next,
.ui-datepicker .ui-datepicker-prev {
    top: 50%;
    transform: translateY(-50%);
}

:focus-visible {
    outline: 0;
}

::selection {
    background-color: var(--bs-primary-bg-subtle);
}

::marker {
    color: var(--bs-primary);
}

:is( ::-webkit-calendar-picker-indicator, ::-webkit-clear-button, ::-webkit-inner-spin-button, ::-webkit-outer-spin-button) {
    color: var(--bs-primary);
}

body,
html {
    height: 100%;
}

body {
    background-image: none !important;
    color: var(--bs-body-color) !important;
    font-size: 100%;
}

@media (max-width:1400px) {
    body {
        font-size: 90%;
    }
}

html {
    scrollbar-width: 0.25rem;
    scrollbar-color: var(--bs-primary) var(--bs-light);
}

::-webkit-scrollbar {
    width: 0.25rem;
    height: 0.25rem;
}

::-webkit-scrollbar-track {
    background: var(--bs-light);
}

::-webkit-scrollbar-thumb {
    background: var(--bs-primary);
    border-radius: 0.25rem;
    transition: 0.2s ease-in-out;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: var(--bs-secondary);
}

thead {
    background-color: var(--bs-secondary) !important;
}

hr {
    border: thin var(--bs-secondary) solid !important;
}

table {
    empty-cells: hide;
    border-spacing: 0;
    position: relative;
}


img:-moz-broken {
    opacity: 0;
}

img {
    position: relative;
}

img::before {
    content: 'No data available';
    width: 100%;
    height: 100%;
    background-color: #f2f2f2;
    border-radius: 0.625rem;
    position: absolute;
    top: 0;
    left: -0.125rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

th:empty,
td:empty {
    visibility: hidden;
    padding: 0;
    display: none;
}

th div:empty,
td div:empty {
    visibility: hidden;
    padding: 0;
    display: none;
}

.col-auto:empty,
.col:empty {
    display: none;
}

.CssDataList td:empty,
.CssDataList th:empty
.CssStandardListGrid th:empty,
.CssStandardListGrid td:empty,
.CssTable th:empty,
.CssTable td:empty,
.CusTable th:empty,
.CusTable td:empty {
    visibility: visible;
    padding: 0.25em;
    display: table-cell;
}

.section-title {
    text-transform: uppercase;
    font-size: 1.125rem;
    padding: 1.5rem 0 0.5rem;
}

.section-title-sm {
    font-size: 0.85rem;
    padding: 1rem 0 0.4rem;
}

.BrollOnlineLogoWrapper {
    width: auto !important;
}

.spacing30 {
    height: 2rem;
}

.cpCellText {
    width: 8%;
    text-align: left !important;
}

.float-right {
    float: right !important;
}

.cpCellItem {
    width: 23%;
    padding-right: 4.375rem;
}

.add-doc:hover {
    background-color: inherit !important;
    color: var(--bs-primary) !important;
    transition: all .2s ease-in-out;
}

.CssTextBoxClear,
.CssTextBoxNegative,
.panelCustom {
    padding: 0.375rem 0.75rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--bs-body-color);
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    font-size: 1rem;
    background-clip: padding-box;
}

.form-check-control {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.form-check-control div {
    display: inline-flex;
    margin-right: 1rem;
    /*min-height: 1.5rem;*/
    padding-left: 1.5em;
    margin-bottom: 0;
    gap: 0.5em;
    align-items: flex-start;
}

.form-check-control div span {
    display: inherit;
    gap: 0.5em;
    align-items: center;
    margin-left: -1.5em;
}

.form-check-control input[type="checkbox"] {
    border-radius: 0.25em;
}

.form-check-control input[type="radio"] {
    border-radius: 50%;
}

.form-check-control input {
    float: left;
    margin-left: -1.5em;
    --bs-form-check-bg: var(--bs-form-control-bg);
    width: 1em;
    height: 1em;
    margin-top: 0;
    vertical-align: top;
    background-color: var(--bs-form-check-bg);
    background-image: var(--bs-form-check-bg-image);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    border: var(--bs-border-width) solid var(--bs-border-color);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-print-color-adjust: exact;
    color-adjust: exact;
    print-color-adjust: exact;
}

.form-check-control span input {
    margin-left: 0;
}

.mt-0 input {
    margin-top: 0;
}

.form-check-control span[disabled] {
    pointer-events: none;
    filter: none;
    opacity: .5;
}

.form-check-control input:checked[type="checkbox"] {
    --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}

.form-check-control input:checked[type="radio"] {
    --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
}

.form-check-control input:checked {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
}

.fit .form-check-control input:checked {
    background-color: var(--bs-primary);
    border-color: var(--bs-white);
}

.form-check-control label {
    line-height: 1;
}

.form-control:read-only {
    background: var(--bs-gray-200);
}

.CssTextboxBold {
    color: var(--bs-primary) !important;
}
.form-control-sm{
    padding:0.25rem 0.25rem;
}
.form-control-label {
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--bs-body-color);
    background-color: var(--bs-form-control-bg);
    background-clip: padding-box;
    border: var(--bs-border-width) solid var(--bs-border-color);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0.375rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.form-control:focus,
.form-select:focus,
.form-check-control input:focus {
    border-color: var(--bs-primary);
    box-shadow: 0 0 0 0.25rem rgba(var(--bs-primary-rgb), 0.25);
}

.panelCustom {
    background-color: var(--bs-form-control-bg);
    border: var(--bs-border-width) solid var(--bs-border-color) !important;
    appearance: none;
    border-radius: 0.375rem;
}

.form-check-control input:active {
    filter: brightness(90%);
}

.CssTextBoxClear,
.CssTextBoxNegative {
    display: block;
    width: auto;
    border: var(--bs-border-width) solid var(--bs-border-color);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0.375rem;
}

.ui-dialog .ui-dialog-buttonpane button {
    color: #000;
    background-color: var(--bs-light);
    border: 1px solid var(--bs-light);
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    border-radius: 0.375rem;
    display: inline-block;
    transition: all .2s ease-in-out;
}

.ui-dialog .ui-dialog-buttonpane button:hover {
    color: #000;
    background-color: #d3d4d5;
    border-color: #c6c7c8;
}

.CssItemNegative:disabled {
    background-color: MistyRose;
}

.CssItemPositive:disabled,
.CssItemReject2:disabled {
    background-color: lightcyan;
}

.CssItemAllocated:disabled {
    background-color: bisque;
}

.CssItemNegative2:disabled,
.CssItemHighlight:disabled,
.CssItemColorCase2:disabled,
.CssItemItems120:disabled,
.CssItemCompleted:disabled {
    background-color: LightYellow;
}

.btn {
    transition: all 0s ease-in-out; 
}


.btn:disabled,
.btn.disabled,
fieldset:disabled .btn {
    background: var(--bs-btn-disabled-bg);
}

[type="button"] {
    --bs-btn-padding-y: 0.25rem;
    --bs-btn-padding-x: 0.5rem;
    /*--bs-btn-font-size: 0.875rem;*/
    --bs-btn-border-radius: 0.25rem;
    display: inline-block;
    font-size: var(--bs-btn-font-size);
    padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
    border-radius: var(--bs-btn-border-radius);
    cursor: pointer;
    outline: 0;
    border-width: 1px;
}

/*.btn {
    --bs-btn-padding-x: 0.75rem;
    --bs-btn-padding-y: 0.375rem;
    --bs-btn-font-size: 1rem;
    --bs-btn-font-weight: 400;
    --bs-btn-line-height: 1.5;
}*/

.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-primary-bg-subtle);
    --bs-btn-hover-border-color: var(--bs-primary-bg-subtle);
    --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
    --bs-btn-active-color: var(--bs-primary);
    --bs-btn-active-bg: var(--bs-primary-bg-subtle);
    --bs-btn-active-border-color: var(--bs-primary-bg-subtle);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--bs-primary-bg-subtle);
    --bs-btn-disabled-border-color: var(--bs-primary-bg-subtle);
    background: linear-gradient(180deg, var(--bs-primary) 0, var(--bs-secondary) 100%);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background: var(--bs-primary);
}

.btn-primary:disabled, .btn-primary[disabled] {
    color: var(--bs-btn-disabled-color);
    pointer-events: none;
    background-color: var(--bs-btn-disabled-bg);
    border-color: var(--bs-btn-disabled-border-color);
    opacity: var(--bs-btn-disabled-opacity);
}

.btn-holder input[type="submit"],
.btn-holder input[type="button"] {
    --bs-btn-padding-y: 0.25rem;
    --bs-btn-padding-x: 0.5rem;
    --bs-btn-font-size: 0.875rem;
    --bs-btn-border-radius: 0.25rem;
    --bs-btn-font-weight: 400;
    --bs-btn-line-height: 1.5;
    --bs-btn-color: #212529;
    --bs-btn-bg: transparent;
    --bs-btn-border-width: var(--bs-border-width);
    --bs-btn-border-color: transparent;
    --bs-btn-hover-border-color: transparent;
    --bs-btn-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
    --bs-btn-disabled-opacity: 0.65;
    --bs-btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), .5);
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-primary-bg-subtle);
    --bs-btn-hover-border-color: var(--bs-primary-bg-subtle);
    --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
    --bs-btn-active-color: var(--bs-primary);
    --bs-btn-active-bg: var(--bs-primary-bg-subtle);
    --bs-btn-active-border-color: var(--bs-primary-bg-subtle);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--bs-primary-bg-subtle);
    --bs-btn-disabled-border-color: var(--bs-primary-bg-subtle);
    display: inline-block;
    padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
    font-family: var(--bs-btn-font-family);
    font-size: var(--bs-btn-font-size);
    font-weight: var(--bs-btn-font-weight);
    line-height: var(--bs-btn-line-height);
    color: var(--bs-btn-color);
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    border: var(--bs-btn-border-width) solid var(--bs-btn-border-color);
    border-radius: var(--bs-btn-border-radius);
    background: linear-gradient(180deg, var(--bs-primary) 0, var(--bs-secondary) 100%);
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.btn-holder input[type="submit"]:hover,
.btn-holder input[type="submit"]:focus,
.btn-holder input[type="submit"]:active,
.btn-holder input[type="button"]:hover,
.btn-holder input[type="button"]:focus,
.btn-holder input[type="button"]:active {
    background: var(--bs-primary);
}

.btn-secondary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--bs-secondary);
    --bs-btn-border-color: var(--bs-secondary);
    --bs-btn-hover-color: var(--bs-secondary);
    --bs-btn-hover-bg: var(--bs-secondary-bg-subtle);
    --bs-btn-hover-border-color: var(--bs-secondary-bg-subtle);
    --bs-btn-focus-shadow-rgb: var(--bs-secondary-rgb);
    --bs-btn-active-color: var(--bs-secondary);
    --bs-btn-active-bg: var(--bs-secondary-bg-subtle);
    --bs-btn-active-border-color: var(--bs-secondary-bg-subtle);
    --bs-btn-disabled-color: var(--bs-secondary);
    --bs-btn-disabled-bg: var(--bs-secondary-bg-subtle);
    --bs-btn-disabled-border-color: var(--bs-secondary-bg-subtle);
    background: linear-gradient(180deg, var(--bs-secondary-bg-subtle) 0, var(--bs-secondary) 100%);
}

.btn-lg {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--bs-secondary);
    --bs-btn-border-color: var(--bs-secondary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-primary);
    --bs-btn-hover-border-color: var(--bs-secondary-bg-subtle);
    --bs-btn-focus-shadow-rgb: var(--bs-secondary-rgb);
    --bs-btn-active-color: var(--bs-secondary);
    --bs-btn-active-bg: var(--bs-secondary-bg-subtle);
    --bs-btn-active-border-color: var(--bs-secondary-bg-subtle);
    --bs-btn-disabled-color: var(--bs-secondary);
    --bs-btn-disabled-bg: var(--bs-secondary-bg-subtle);
    --bs-btn-disabled-border-color: var(--bs-secondary-bg-subtle);
    border-radius: 1.25rem;
    background: var(--bs-secondary);
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active {
    background: var(--bs-secondary-bg-subtle);
}

.btn-secondary:disabled, .btn-secondary[disabled] {
    color: var(--bs-btn-disabled-color);
    pointer-events: none;
    background-color: var(--bs-btn-disabled-bg);
    border-color: var(--bs-btn-disabled-border-color);
    opacity: var(--bs-btn-disabled-opacity);
}

.btn-light {
    --bs-btn-color: #000;
    --bs-btn-bg: var(--bs-light);
    --bs-btn-border-color: #c6c7c8;
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: #d3d4d5;
    --bs-btn-hover-border-color: #c6c7c8;
    --bs-btn-active-color: #000;
    --bs-btn-active-bg: #c6c7c8;
    --bs-btn-active-border-color: #c6c7c8;
    --bs-btn-disabled-color: #000;
    --bs-btn-disabled-bg: var(--bs-light);
    --bs-btn-disabled-border-color: var(--bs-light);
    background: linear-gradient(180deg, #efefef 0, var(--bs-light) 100%);
}

.btn-light:disabled, .btn-light[disabled] {
    color: var(--bs-btn-disabled-color);
    pointer-events: none;
    background-color: var(--bs-btn-disabled-bg);
    border-color: var(--bs-btn-disabled-border-color);
    opacity: var(--bs-btn-disabled-opacity);
}

.btn-light:hover,
.btn-light:focus,
.btn-light:active {
    background: #efefef;
}

.btn-danger {
    --bs-btn-bg: var(--bs-danger);
    --bs-btn-hover-bg: #fb7380;
    background: linear-gradient(180deg, var(--bs-btn-hover-bg) 0, var(--bs-btn-bg) 100%);
}

.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active {
    background: var(--bs-btn-hover-bg);
}

.btn-danger:disabled, .btn-danger[disabled] {
    color: var(--bs-btn-disabled-color);
    pointer-events: none;
    background-color: var(--bs-btn-disabled-bg);
    border-color: var(--bs-btn-disabled-border-color);
    opacity: var(--bs-btn-disabled-opacity);
}



.Browse {
    border: 1px solid #c6c7c8 !important;
    padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x) !important;
    margin: 0 !important;
    background: linear-gradient(180deg, #efefef 0, var(--bs-light) 100%) !important;
    display: inline-block;
    cursor: pointer;
    color: #000;
}

.Browse:hover {
    color: #000 !important;
    background: var(--bs-light) !important;
    border-color: #c6c7c8 !important;
}

.BrowseDisabled {
    border: 1px solid var(--bs-light) !important;
    padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x) !important;
    margin: 0 !important;
    background: var(--bs-light) !important;
    display: inline-block;
    color: #000 !important;
    pointer-events: none;
    opacity: 0.65;
}

.CssDataGridHeaderStyle,
.CssDataListHeaderStyle,
.CssGridHeaderStyle {
    color: #fff !important;
    /*border-radius: 5px !important;*/
    background-color: var(--bs-secondary) !important;
}

.divHeader {
    background-color: var(--bs-secondary) !important;
    color: #fff !important;
}

/* .table-container {
    border-radius: 0.3125rem;
    overflow: hidden;
    width: fit-content;
    border: 1px solid rgba(255,255,255,0.5);
    position:relative;
}*/

.CssDataList,
.CssStandardListGrid {
    background: #fff !important;
    border-radius: 0.3125rem;
    /*overflow: hidden;*/
    border: 0 !important;
}

.CssDataList td.CssDataListHeaderStyle,
.CssStandardListGrid td.CssDataListHeaderStyle {
    border-top-left-radius: 0.3125rem;
    border-top-right-radius: 0.3125rem;
}

.CssDataList tr.CssGridHeaderStyle td:first-child,
.CssStandardListGrid tr.CssDataListHeaderStyle td:first-child,
.CssDataList tr.CssGridHeaderStyle td:first-child,
.CssStandardListGrid tr.CssGridHeaderStyle td:first-child,
.CssDataList tr.CssDataGridHeaderStyle td:first-child,
.CssStandardListGrid tr.CssDataGridHeaderStyle td:first-child,
.CssDataList tr.CssGridHeaderStyle th:first-child,
.CssStandardListGrid tr.CssDataListHeaderStyle th:first-child,
.CssDataList tr.CssGridHeaderStyle th:first-child,
.CssStandardListGrid tr.CssGridHeaderStyle th:first-child,
.CssDataList tr.CssDataGridHeaderStyle th:first-child,
.CssStandardListGrid tr.CssDataGridHeaderStyle th:first-child,
.CssDataList tr.CssTableHeader td:first-child,
.CssStandardListGrid tr.CssTableHeader td:first-child,
.CssDataList tr.CssTableHeader th:first-child,
.CssStandardListGrid tr.CssTableHeader th:first-child {
    border-top-left-radius: 0.3125rem;
}

.CssDataList tr.CssGridHeaderStyle td:last-child,
.CssStandardListGrid tr.CssDataListHeaderStyle td:last-child,
.CssDataList tr.CssGridHeaderStyle td:last-child,
.CssStandardListGrid tr.CssGridHeaderStyle td:last-child,
.CssDataList tr.CssDataGridHeaderStyle td:last-child,
.CssStandardListGrid tr.CssDataGridHeaderStyle td:last-child,
.CssDataList tr.CssGridHeaderStyle th:last-child,
.CssStandardListGrid tr.CssDataListHeaderStyle th:last-child,
.CssDataList tr.CssGridHeaderStyle th:last-child,
.CssStandardListGrid tr.CssGridHeaderStyle th:last-child,
.CssDataList tr.CssDataGridHeaderStyle th:last-child,
.CssStandardListGrid tr.CssDataGridHeaderStyle th:last-child,
.CssDataList tr.CssTableHeader td:last-child,
.CssStandardListGrid tr.CssTableHeader td:last-child,
.CssDataList tr.CssTableHeader th:last-child,
.CssStandardListGrid tr.CssTableHeader th:last-child {
    border-top-right-radius: 0.3125rem;
}



.CssDataGridFooterStyle,
.CssDataListFooterStyle {
    background-color: var(--bs-secondary) !important;
    text-align: center;
    border-bottom-left-radius: 0.3125rem;
    border-bottom-right-radius: 0.3125rem;
}

.CssDataGridFooterStyle a,
.CssDataListFooterStyle a {
    color: #fff;
}

.CssDataGridFooterStyle a:hover,
.CssDataListFooterStyle a:hover {
    color: var(--bs-primary);
}

.CssDataGridFooterStyle td > *,
.CssDataListFooterStyle td > * {
    margin: 0 1.25rem;
}

.CssDataList td,
.CssDataList th,
.CssStandardListGrid td,
.CssStandardListGrid td,
.CssStandardListGrid th {
    padding: 0.25em;
    /*border: 1px inset;*/
}

td.CssDataListItemStyle,
td.CssTableItemStyle,
td.CssGridRowStyle,
td.CssDataGridItemStyle {
    background-color: #f3f0f0;
}

td.CssDataListAlternatingItemStyle,
td.CssTableAlternatingItemStyle,
td.CssGridAlternatingRowStyle,
td.CssDataGridAlternatingItemStyle {
    background-color: #ffffff;
}

td.CssDataListItemStyle2 {
    background-color: #e0fbff;
}

.table-borderless > :not(caption) > * > * {
    border-width: 0px;
}

.CssItemAlloctedItems.CssLabelWhite {
    color: var(--bs-secondary);
}

.CssDataList .CssItemAlloctedItems.CssLabelWhite,
.CssStandardListGrid .CssItemAlloctedItems.CssLabelWhite {
    color: #ffffff;
}

.CssStandardListGrid .CssDataList .CssGridHeaderStyle .CssDataListHeaderStyle {
    border: none !important;
    /*border-radius: 5px !important;*/
}

.CssDataList td table,
.CssStandardListGrid td table,
.CssDataList th table,
.CssStandardListGrid th table {
    margin: -0.25em;
}

.table-borderless > :not(caption) > * > * > table {
    margin: 0;
}

/*.CssDataList td table td,
.CssDataList th table td,
.CssStandardListGrid td table td,
.CssStandardListGrid th table td {
    border-top: 0;
}*/

.CssDataGridHeaderStyle,
.CssDataListHeaderStyle,
.CssGridHeaderStyle {
    background-color: var(--bs-secondary);
    white-space: normal;
}

.CssLabelHeader,
.header-row-style {
    border: 2px solid var(--bs-secondary) !important;
    background-color: var(--bs-secondary) !important;
    padding: 0.3125rem;
}

.internal-table {
    width: calc(100% + 0.5em);
}

.internal-table + .internal-table {
    margin-top: 0.25em;
}

.divCategory {
    height: 1.5625rem !important;
    border-top-left-radius: 0.3125rem;
    border-top-right-radius: 0.3125rem;
}

.BrollOnlinePageButtonSmall {
    padding: 0.25rem !important;
}

.pinned {
    padding-top: 0.0625rem;
    color: var(--bs-primary) !important;
}

.table > thead > tr > th {
    border-style: none !important;
}

.table > tbody > tr > th {
    border-style: none !important;
}

.headerLogFault,
.BrollOnlinePageButton,
.BrollOnlinePageButtonSmall,
.BrollOnlinePageButtonSmaller,
.BrollOnlinePageHeader,
.BrollOnlineSubPageHeader {
    color: #fff;
    background-color: var(--bs-secondary) !important;
    background: -webkit-linear-gradient(bottom, rgba(var(--bs-primary-rgb), 0.5), rgba(var(--bs-secondary-rgb), 1)) !important;
    background: -o-linear-gradient(bottom, rgba(var(--bs-primary-rgb), 0.5), rgba(var(--bs-secondary-rgb), 1)) !important;
    background: -moz-linear-gradient(bottom, rgba(var(--bs-primary-rgb), 0.5), rgba(var(--bs-secondary-rgb), 1)) !important;
    background: linear-gradient(to bottom, rgba(var(--bs-primary-rgb), 0.5), rgba(var(--bs-secondary-rgb), 1)) !important;
    border-top: 1px solid var(--bs-primary) !important;
    border-left: 1px solid var(--bs-primary) !important;
    border-bottom: 3px solid var(--bs-primary) !important;
    border-right: 3px solid var(--bs-primary) !important;
}

.CssDataList .BrollOnlinePageButton {
    font-size: 1rem !important;
}

.CssMandatory,
.CssReadOnlyColor,
.CssTextboxAttention {
    background-color: #ffeff0 !important;
}

.CssButtonHold,
.CssItemDisputedItems,
.CssTextBoxNegative {
    background-color: var(--bs-primary-bg-subtle) !important;
    color: var(--bs-secondary);
}

.CssItemError,
.CssItemUrgent {
    background-color: var(--bs-danger) !important;
    color: inherit;
}

.ui-widget-header {
    border: 0 solid #000;
    background: 0 0;
    color: #fff;
    font-weight: 700;
    background: linear-gradient(90deg, var(--bs-primary) 0, var(--bs-secondary) 100%);
}

.ui-dialog .ui-dialog-titlebar {
    padding: 1em 1em;
}

/*.AuthorisedGreen,
.CssItemAVAIL,
.CssItemActive,
.CssItemAuthorise,
.CssItemColorUpcoming,
.CssItemJournals,
.CssItemPositive,
.CssItemPosted,
.CssItemReadyForRelease,
.accepted {
    background-color: var(--bs-primary-bg-subtle) !important;
}*/

.header-container {
    background: var(--bs-primary);
    background: linear-gradient(90deg, var(--bs-primary) 0, var(--bs-secondary) 100%);
    width: 100%;
    margin: auto;
    height: 3em;
    color: #fff;
}

.header-container::after {
    content: "";
    position: absolute;
    height: 3.75rem;
    left: 0;
    bottom: -3.75rem;
    background: var(--bs-primary);
    background: linear-gradient(90deg, var(--bs-primary) 0, var(--bs-secondary) 100%);
    width: 100%;
}

.h-grid {
    display: grid !important;
    grid-template-columns: 5% 95%;
    background: var(--bs-primary);
    background: linear-gradient(90deg, var(--bs-primary) 0, var(--bs-secondary) 100%);
}

.grid-container {
    display: grid !important;
    grid-template-columns: 95% 5%;
    padding-left: 1em;
}

.middle_header {
    text-align: left;
    padding-top: 0.75em;
    margin-left: 2.5rem;
}

.middle_header > * {
    position: relative;
    z-index: 9;
}

.middle_header::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    height: 5.5rem;
    width: 100%;
    background-color: red;
    background-image: linear-gradient(red, orange);
    z-index: 1;
}

.middle_header::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: -5.5rem;
    height: 5.5rem;
    width: 5.5rem;
    background-color: red;
    background-image: linear-gradient(red, orange);
    z-index: 1;
    border-radius: 0px 0px 0px 5rem;
}

@media (min-width: 900px) {
    .middle_header::before {
        height: 7.5rem;
    }

    .middle_header::after {
        height: 7.5rem;
    }
}

.fit {
    width: 100%;
    padding: 0.75em 1em 0.75em 7.5%;
    display: flex;
    align-items: center;
    color: #fff;
    gap: 2rem;
    overflow-y: auto;
    font-size: 0.7rem;
}

.fit div {
    color: #fff;
    font-size: 0.7rem;
}

.crumb,
.link,
.crumb a,
.link a {
    text-align: center;
    color: #f2f2f2;
}

.fit button {
    position: absolute;
    right: 2rem;
    top: 50%;
    transform: translateY(-50%);
}

.link {
    cursor: pointer;
    font-size: 0.7rem;
    white-space: nowrap;
}

div.link:hover {
    color: #1d0e0c;
    cursor: pointer;
}

div.link:active {
    color: #1d0e0c;
}

div.link:empty {
    display: none;
}

.crumb {
    padding-left: 0;
    font-weight: 700;
}

.block {
    display: inline-block;
    padding-right: 1em;
}

.pad_top_0 {
    padding-top: 0 !important;
    z-index: 0;
}

.triangle {
    width: 0;
    height: 0;
    border-top: 3em solid transparent;
    border-left: 5em solid transparent;
}

.header_black {
    color: #fff;
    background-image: linear-gradient(#3a3737, #1d0e0c);
    --r-top: 0px;
    --r-right: 0px;
    --r-bottom: 0px;
    --r-left: 5em;
    border-radius: var(--r-top) var(--r-right) var(--r-bottom) var(--r-left);
    text-align: left;
    padding-top: 1em;
    padding-left: 3em;
    z-index: 9;
}

div.header_black:before {
    border-top: 6.25rem solid #3a3737cc;
    border-left: 3.125rem solid transparent;
    border-right: 3.125rem solid transparent;
}

.header_black a {
    color: #ffffff;
}

.contentHolder {
    -webkit-border-top-right-radius: 3.75rem;
    -moz-border-radius-topright: 3.75rem;
    border-top-right-radius: 3.75rem;
    z-index: 99;
    background: #f2f2f2;
    -webkit-box-shadow: 0 -0.25rem 0.3125rem 0 rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 -0.25rem 0.3125rem 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 -0.25rem 0.3125rem 0 rgba(0, 0, 0, 0.1);
    min-height: calc(100vh - 5.75rem);
}

.button {
    font: bold 0.6875rem Arial;
    text-decoration: none;
    background-color: #e52e71 !important;
    color: #333;
    padding: 0.125rem 0.375rem;
    border-top: 1px solid #e52e71 !important;
    border-right: 1px solid #e52e71 !important;
    border-bottom: 1px solid #e52e71 !important;
    border-left: 1px solid #e52e71 !important;
}

a {
    transition: 0.2s ease-in-out;
    text-decoration: none;
}



.divModal iframe {
    height: 100% !important;
}

.divModal iframe,
table.CssTableHeader {
    width: 100% !important;
    border-radius: 0.3125rem !important;
}

.ui-widget-header .ui-icon {
    background-image: url(../../jquery-ui-1.11.2.custom/images/ui-icons_FFE4E1_256x240.png);
}

.ui-state-hover .ui-icon,
.ui-state-focus .ui-icon {
    background-image: url(../../jquery-ui-1.11.2.custom/images/ui-icons_443266_256x240.png);
}

.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus {
    border: 0;
    background: var(--bs-primary);
    color: #ffffff;
}

/*.ui-dialog .ui-dialog-content {
    padding: 0.5em 1em;
}*/

.toast {
    --bs-toast-max-width: 100%;
}

.toast-header-fix {
    --bs-toast-zindex: 1090;
    --bs-toast-padding-x: 0.75rem;
    --bs-toast-padding-y: 0.5rem;
    --bs-toast-spacing: 1.5rem;
    --bs-toast-max-width: 21.875rem;
    --bs-toast-font-size: 0.875rem;
    --bs-toast-border-width: var(--bs-border-width);
    --bs-toast-border-color: var(--bs-border-color-translucent);
    --bs-toast-border-radius: var(--bs-border-radius);
    /* width: var(--bs-toast-max-width);*/
    max-width: 100%;
    font-size: var(--bs-toast-font-size);
    color: var(--bs-toast-color);
    pointer-events: auto;
    background-clip: padding-box;
    border: 0px;
    border-radius: var(--bs-toast-border-radius);
    background-color: var(--bs-primary) !important;
    color: #fff !important;
    background: linear-gradient(90deg, var(--bs-primary) 0, var(--bs-secondary) 100%) !important;
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
    color: var(--bs-primary);
    background-color: var(--bs-primary-bg-subtle);
    border-color: var(--bs-primary-bg-subtle);
}

.ui-state-default:active,
.ui-state-default:focus,
.ui-state-default:hover,
.ui-widget-content .ui-state-default:active,
.ui-widget-content .ui-state-default:focus,
.ui-widget-content .ui-state-default:hover,
.ui-widget-header .ui-state-default:active,
.ui-widget-header .ui-state-default:focus,
.ui-widget-header .ui-state-default:hover {
    color: #fff;
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {
    border: 1px solid var(--bs-primary-bg-subtle);
    color: #fff;
    background: var(--bs-primary);
    background-color: var(--bs-primary);
}

.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
    border: 1px solid var(--bs-primary);
    background: var(--bs-primary-bg-subtle);
    color: var(--bs-secondary);
}

#frmMenu {
    min-height: 100%;
    background-color: #4e596f;
    padding: 0.9375rem 0;
}

.CssliClass,
.CssliClassClick {
    background-color: transparent !important;
    color: #fff !important;
    font-weight: 600;
}

.CssNotesColor,
.CssliClass:hover,
.CssliClassClick:hover,
.asp-calendar-selected-day a,
.light-text {
    color: var(--bs-primary) !important;
}

.ui-datepicker .ui-datepicker-title select,
input.CssMoneyTextBox {
    font-weight: 400;
    line-height: 1.5;
    color: var(--bs-body-color);
    background-color: var(--bs-form-control-bg);
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

#Menu a {
    font-size: 0.875rem;
    padding: 0.3125rem 0.625rem;
}

#Menu li ul {
    margin-bottom: 1.25rem;
}

.CssliSubClassClick {
    background-color: transparent !important;
    color: #fff !important;
}

.button-cs1,
.button-cs2 {
    appearance: none;
    box-shadow: rgba(27, 31, 35, 0.1) 0 1px 0;
    box-sizing: border-box;
    color: #fff;
    display: inline-block;
    font-family: -apple-system, system-ui, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.25rem;
    padding: 0.0625rem 1rem;
    text-align: center;
    text-decoration: none;
    touch-action: manipulation;
    vertical-align: middle;
    position: relative;
    white-space: nowrap;
    cursor: pointer;
}

.CssliSubClassClick:hover {
    color: #000 !important;
}

.breadcrumb .active,
.breadcrumb-item + .breadcrumb-item::before {
    color: var(--bs-light);
}

.mg-r {
    margin-left: 23rem;
}

.mg-l-1 {
    margin-left: 1rem !important;
}

.mg-r-cust {
    margin-right: 0.5em;
}

.button-cs1 {
    background-image: linear-gradient(to right, var(--bs-pink), var(--bs-orange));
    border: 1px solid rgba(27, 31, 35, 0.15);
    border-radius: 0.375rem;
    user-select: none;
    -webkit-user-select: none;
}

.button-cs2 {
    z-index: 100;
    background-image: linear-gradient(to right, #0e5016, #4e8c60);
    border: 1px solid rgba(27, 31, 35, 0.15);
    border-radius: 0.375rem;
    user-select: none;
    -webkit-user-select: none;
}

.breadcrumb .active {
    font-weight: 700;
}

.nav-container {
    position: relative;
}

.nav-container button {
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
}

.CssDataListSelectCompany:nth-child(2n) {
    background-color: var(--bs-primary-bg-subtle) !important;
    color: #fff;
}

.CssDataListSelectCompany:nth-child(odd) {
    background-color: var(--bs-primary) !important;
    color: #fff;
}

/*.AuthorisedGreen,
.CssItemAVAIL,
.CssItemActive,
.CssItemAuthorise,
.CssItemColorUpcoming,
.CssItemJournals,
.CssItemPositive,
.CssItemPosted,
.CssItemReadyForRelease,
.accepted {
    background-color: #1098f7 !important;
}*/

.CssDataGridHeaderStyle,
.CssDataListHeaderStyle,
.CssGridHeaderStyle {
    font-family: Arial;
    position: sticky;
    top: 0;
    z-index: 1;
    text-transform: uppercase;
}

.ui-dialog .ui-dialog-title {
    float: left;
    margin: 0.1em 0;
    white-space: nowrap;
    width: 90%;
    overflow: hidden;
    text-overflow: ellipsis;
    text-transform: uppercase;
}

.text-info {
    --bs-text-opacity: 1;
    color: rgba(var(--bs-info-rgb), var(--bs-text-opacity)) !important;
    text-transform: uppercase;
}

.CssMoneyTextBox {
    text-align: left;
    border: 0px !important;
    background: 0 0;
}

.ui-widget-content {
    border: 1px solid var(--bs-primary);
}

.ui-accordion .ui-accordion-content {
    border: 1px solid var(--bs-secondary);
}

.ui-accordion .ui-accordion-header {
    border: 1px solid var(--bs-secondary);
}

.ui-datepicker {
    width: 30em;
}

.ui-datepicker .ui-datepicker-title select {
    --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    padding: 0.375rem 2.25rem 0.375rem 0.75rem;
    -moz-padding-start: calc(0.75rem - 0.1875rem);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--bs-body-color);
    background-color: var(--bs-form-control-bg);
    background-image: var(--bs-form-select-bg-img), var(--bs-form-select-bg-icon, none);
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 1rem 0.75rem;
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: 0.375rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0.0625rem 0.5rem;
}

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
    top: 50%;
    transform: translateY(-50%);
}

.hasDatepicker {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23DADADA' d='M128 0c17.7 0 32 14.3 32 32v32h128V32c0-17.7 14.3-32 32-32s32 14.3 32 32v32h48c26.5 0 48 21.5 48 48v48H0v-48c0-26.5 21.5-48 48-48h48V32C96 14.3 110.3 0 128 0z M0 192h448v272c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V192z M64 272v32c0 8.8 7.2 16 16 16h32c8.8 0 16-7.2 16-16v-32c0-8.8-7.2-16-16-16H80C71.2 256 64 263.2 64 272z M192 272v32c0 8.8 7.2 16 16 16h32c8.8 0 16-7.2 16-16v-32c0-8.8-7.2-16-16-16h-32C199.2 256 192 263.2 192 272z M336 256c-8.8 0-16 7.2-16 16v32c0 8.8 7.2 16 16 16h32c8.8 0 16-7.2 16-16v-32c0-8.8-7.2-16-16-16H336z M64 400v32c0 8.8 7.2 16 16 16h32c8.8 0 16-7.2 16-16v-32c0-8.8-7.2-16-16-16H80C71.2 384 64 391.2 64 400z M208 384c-8.8 0-16 7.2-16 16v32c0 8.8 7.2 16 16 16h32c8.8 0 16-7.2 16-16v-32c0-8.8-7.2-16-16-16H208z M320 400v32c0 8.8 7.2 16 16 16h32c8.8 0 16-7.2 16-16v-32c0-8.8-7.2-16-16-16h-32C327.2 384 320 391.2 320 400z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 1.125rem 1.125rem;
    background-position: right 0.3125rem center;
}

.tree-view {
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    background-color: #ffffff;
    background-clip: padding-box;
    border: 1px solid #dee2e6;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0.375rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    height: 17.5rem;
}

.CssPanelHeader,
.CssTableHeader {
    background-color: var(--bs-secondary) !important;
    color: #fff !important;
    -webkit-border-top-left-radius: 0.3125rem;
    -webkit-border-top-right-radius: 0.3125rem;
    -moz-border-radius-topleft: 0.3125rem;
    -moz-border-radius-topright: 0.3125rem;
    border-top-left-radius: 0.3125rem;
    border-top-right-radius: 0.3125rem;
    /* overflow: hidden;*/
    text-transform: uppercase !important;
}

.row-count {
    border-radius: 5px;
}


.BorderPanel,
.CssBorderPanel,
.CssTextboxBorder,
.BorderDiv {
    border-color: var(--bs-secondary-border-subtle) !important;
}



.dl-faults {
    border-collapse: collapse;
    border: 1px solid var(--bs-secondary);
    width: 100%;
    border-collapse: inherit;
    -webkit-border-bottom-right-radius: 0.3125rem;
    -webkit-border-bottom-left-radius: 0.3125rem;
    -moz-border-radius-bottomright: 0.3125rem;
    -moz-border-radius-bottomleft: 0.3125rem;
    border-bottom-right-radius: 0.3125rem;
    border-bottom-left-radius: 0.3125rem;
}

.ui-dialog .ui-dialog-titlebar-close {
    background: transparent;
    background-color: transparent;
    background-image: url("../../jquery-ui-1.11.2.custom/images/ui-icons_FFE4E1_256x240.png");
    border-color: transparent;
    outline: 0;
    border: 0;
    right: 1em;
}

.ui-dialog .ui-dialog-titlebar-close .ui-icon {
    background-image: none;
}

.ui-dialog .ui-dialog-titlebar-close {
    background-position: -4.875rem -7.875rem;
}

.ui-dialog .ui-dialog-titlebar-close:hover {
    background-color: transparent;
}

input.CssMoneyTextBox {
    display: block;
    padding: 0.375rem 0.75rem;
    background-clip: padding-box;
    border: var(--bs-border-width) solid var(--bs-border-color) !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0.375rem;
}

.currency-grid {
    width: calc(100vw - 12.5rem);
    overflow-x: scroll;
}

.menu-btn-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.625rem;
}

.btn-img-card,
.tile-bt {
    gap: 0.375rem;
    padding-bottom: 0 !important;
    background-color: #fff !important;
    background-clip: border-box;
    color: var(--bs-primary);
    text-align: center;
    transition: 0.2s ease-in-out;
}

.menu-icon-height input[type="image"] {
    height: 6.53rem !important;
}

.tile-bt {
    cursor: pointer;
    width: 7.25% !important;
    height: 100% !important;
    flex-direction: column;
    align-items: center;
    display: none;
    border: 1px solid var(--bs-light) !important;
    border-radius: 0.625rem !important;
    /*border-radius: 5px;*/
    overflow: hidden;
}

.btn-img-card {
    display: flex;
    /*width: 128px;*/
    height: 100%;
    flex-direction: column;
    align-items: center;
    border: 1px solid var(--bs-light) !important;
    border-radius: 0.625rem !important;
    overflow: hidden;
}


.btn-img-card input[type="image"],
.tile-bt input[type="image"] {
    width: 100%;
    border-top-left-radius: 0.3125rem;
    border-top-right-radius: 0.3125rem;
    background-clip: border-box;
}

.asp-calendar,
.asp-calendar a {
    color: #fff !important;
}

.btn-img-card input[type="image"] {
    height: 8rem;
    display: block;
    transition: 0.2s ease-in-out;
}

.btn-img-card:hover,
.shadow-black:hover {
    -webkit-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.5) !important;
    -moz-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.5) !important;
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.5) !important;
}

.asp-calendar {
    background: var(--bs-primary);
    border-color: var(--bs-secondary) !important;
    border-collapse: separate !important;
}

.asp-calendar a {
    color: #ffffff !important;
}

.asp-calendar td {
    border: 1px solid #ffffff;
}

.asp-calendar-selected-day {
    background: var(--bs-primary-bg-subtle) !important;
    color: var(--bs-primary) !important;
}

.asp-calendar-selected-day a {
    color: var(--bs-primary) !important;
}

.asp-calendar-selected {
    background: var(--bs-primary-bg-subtle);
    color: var(--bs-secondary);
}

.asp-calendar-other-month {
    background: #fff;
}

.asp-calendar-other-month a {
    color: var(--bs-light) !important;
}

.asp-calendar-next-prev,
.asp-calendar-next-prev a {
    color: var(--bs-body-color) !important;
}

.asp-calendar-day-header {
    background: var(--bs-secondary);
    color: #fff;
}

.asp-calendar-title {
    background: #fff;
    font-weight: 700;
    color: var(--bs-body-color);
}

header-table-font-size {
    font-size: 0.75rem;
}

.CssLabelHeaderText,
.CssTableBoxed {
    border: 1px solid var(--bs-primary) !important;
    background: #fcfcfc !important;
    padding: 0.625rem 0.5rem;
    border-radius: 0.3125rem;
    display: inline-block;
}

.trans-matching .btn {
    --bs-btn-padding-y: 0.25rem;
    --bs-btn-padding-x: 0.25rem;
}

.CssTableBoxed.selected, .CssTableBoxed.CssItemColorMonthly, .CssTableBoxed.CssItemReadyForPosting, .CssTableBoxed.CssItemBadPremises, .CssTableBoxed.CssItemErrorMsg, .CssTableBoxed.CssItemNoStatus, .CssTableBoxed.CssItemReceipts, .CssTableBoxed.CssItemArchived,
.CssTableBoxed.CssItemRelease {
    background-color: lightskyblue !important;
}

.CssTableBoxed.accepted, .CssTableBoxed.CssItemColorUpcoming, .CssTableBoxed.CssItemReadyForRelease, .CssTableBoxed.CssItemAuthorise, .CssTableBoxed.AuthorisedGreen, .CssTableBoxed.CssItemAVAIL, .CssTableBoxed.CssItemPosted, .CssTableBoxed.CssItemPositive, .CssTableBoxed.CssItemJournals, .CssTableBoxed.CssItemActive {
    background-color: lightgreen !important;
}

.CssTableBoxed.declined, .CssTableBoxed.inactive, .CssTableBoxed.CssItemColorExpired, .CssTableBoxed.CssItemReadyForAuthorisation, .CssTableBoxed.CssItemReject, .CssTableBoxed.CssItemBadDebtor, .CssTableBoxed.CssItemBAL, .CssTableBoxed.CssItemBankNotOpen, .CssTableBoxed.CssItemNegative, .CssTableBoxed.CssItemRDs,
.CssTableBoxed.CssItemCancel, .CssTableBoxed.CssItemInconsistant, .CssTableBoxed.CssHasComment {
    background-color: lightcoral !important;
}

.CssTableBoxed {
    min-height: 42px;
}

.CssListBoxAllocated {
    background-color: var(--bs-primary-bg-subtle) !important;
    color: var(--bs-secondary) !important;
}

.legend-footer {
    border-top: 2px solid var(--bs-secondary) !important;
    position: fixed !important;
    background: #f2f2f2;
    margin-top: 1rem;
    bottom: 0 !important;
    z-index: 9;
}

.CssTable,
.CssDiv {
    background-color: White;
    border: 2px solid var(--bs-primary-bg-subtle) !important;
    border-radius: 0.3125rem;
    overflow: hidden;
    padding: 0.3125rem;
}


.headers {
    /*border: thin solid var(--bs-secondary) !important;*/
    background: var(--bs-secondary) !important;
}

.txtM {
    background-color: var(--bs-primary-bg-subtle) !important;
    border-color: var(--bs-primary-bg-subtle) !important;
    color: var(--bs-secondary) !important;
}

.tree-block {
    min-width: 18.75rem;
}

.tree-block > a {
    display: none;
}

.CssIMGBorder {
    border: var(--bs-secondary) solid 2px !important;
    border-radius: 0.3125rem;
}

.silverBorder {
    border: silver 2px solid;
    display: none;
    vertical-align: middle;
}

.primaryBorder {
    border: var(--bs-secondary) 2px solid;
    background-color: #CCCCCC;
    display: none;
    vertical-align: middle;
}

.pos-not-fixed {
    position: relative !important;
}

.scrollNav {
    overflow: auto !important;
    white-space: nowrap !important;
}

.divFrozenColumns {
    height: 100% !important;
    max-height: calc(100vh - 13vh);
    overflow-y: auto !important;
}

.CssRadGridSelectedItemStyle,
.CssDataGridSelectedItemStyle,
.CssDataListSelectedItemStyle,
.CssGridSelectedRowStyle {
    color: var(--bs-primary) !important;
}

.CssLabelNew {
    color: var(--bs-primary) !important;
    transition: all .2s ease-in-out;
}

.CssLabelNew:hover {
    color: var(--bs-secondary) !important;
}

.tab-container {
    width: 100%;
}

.tabs-section {
    border-bottom: 1px solid var(--bs-primary);
    display: flex;
    gap: 0.25rem;
}

.tabs-section .BrollOnlineSubPageHeaderEmpty {
    text-decoration: none;
    font-size: 0.9375rem !important;
    font-weight: bold;
    font-family: Arial, sans-serif;
    color: var(--bs-secondary);
    background-color: transparent;
    border: 1px solid;
    border-color: transparent;
    border-top-right-radius: 0.75rem;
    border-top-left-radius: 0.75rem;
    padding: 0.5rem 1rem;
    position: relative;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.5));
    display: inline-block;
    cursor: pointer;
}

.tabs-section .BrollOnlineSubPageHeader {
    text-decoration: none;
    font-size: 0.9375rem !important;
    font-weight: bold;
    font-family: Arial, sans-serif;
    color: White;
    background-color: var(--bs-secondary);
    background: -webkit-linear-gradient(bottom, rgba(var(--bs-primary-rgb), 0.5), rgba(var(--bs-secondary-rgb), 1));
    background: -o-linear-gradient(bottom, rgba(var(--bs-primary-rgb), 0.5), rgba(var(--bs-secondary-rgb), 1));
    background: -moz-linear-gradient(bottom, rgba(var(--bs-primary-rgb), 0.5), rgba(var(--bs-secondary-rgb), 1));
    background: linear-gradient(to bottom, rgba(var(--bs-primary-rgb), 0.5), rgba(var(--bs-secondary-rgb), 1));
    border-top: 1px solid var(--bs-primary);
    border-left: 1px solid var(--bs-primary);
    border-bottom: 1px solid var(--bs-primary);
    border-right: 13px solid var(--bs-primary);
    border-top-right-radius: 1rem;
    border-top-left-radius: 1rem;
    padding: 0.5rem 1rem;
    position: relative;
    display: inline-block;
    cursor: pointer;
}

.checkmark {
    margin-right: .5em;
    display: inline-block;
    transform: rotate(45deg);
    height: 1em;
    width: .5em;
    border-bottom: 2px solid var(--bs-secondary);
    border-right: 2px solid var(--bs-secondary);
}

.mg_top_2 {
    margin-top: 2em;
}

.mg_top_1 {
    margin-top: 1em;
}

.split {
    height: 100%;
    width: 50%;
    position: fixed;
    z-index: 1;
    top: 0;
    overflow-x: hidden;
    padding-top: 1.25rem;
}

.BrollOnlineButton {
    color: var(--bs-secondary) !important;
    transition: all .2s ease-in-out;
}

.BrollOnlineButton:hover {
    color: var(--bs-primary) !important;
}

.legend-label {
    font-size: 0.875rem;
    border-radius: 0.2em;
    padding: 0.125rem 0.5rem;
    border-color: var(--bs-light) !important;
}

.hover:hover {
    background-color: var(--bs-primary-bg-subtle) !important;
    color: var(--bs-secondary) !important;
}

.CssImportantLabel {
    font-weight: bold;
    color: var(--bs-primary) !important;
}

.CssBorderFill,
.CssPanelFill {
    background-color: var(--bs-secondary-bg-subtle) !important;
}

/*.ui-dialog {
    position: fixed !important;
}
*/

.txtH {
    background-color: var(--bs-secondary) !important;
    border: none !important;
    /*border-color: #920000;*/
    color: White !important;
    /*border-style: solid;*/
    font-size: small !important;
    font-weight: bold !important;
}

/* ui autocomplete */
.ui-autocomplete-category-blue {
    font-family: Courier New, Courier, monospace;
    background-color: aliceblue;
    color: #000092;
}
.archived-vendor {
    background-color: var(--bs-disabled-field) !important;
}

.ui-autocomplete-loading-blue {
    background: url("/broll-online/Images/loader.gif") no-repeat right center;
    background-size: 16px 16px;
}

.ui-menu-item {
    font-family: Courier New, Courier, monospace;
}

/*footer colors*/
.selected, .CssItemColorMonthly, .CssItemReadyForPosting, .CssItemBadPremises, .CssItemErrorMsg, .CssItemNoStatus, .CssItemReceipts, .CssItemArchived, .CssItemRelease {
    background-color: lightskyblue !important;
}

.accepted, .CssItemColorUpcoming, .CssItemReadyForRelease, .CssItemAuthorise, .AuthorisedGreen, .CssItemAVAIL, .CssItemPosted, .CssItemPositive, .CssItemJournals, .CssItemActive {
    background-color: lightgreen !important;
}

.CssItemNegative2, .CssItemHighlight, .CssItemColorCase2, .CssItemItems120, .CssItemCompleted {
    background-color: LightYellow !important;
}

.declined, .inactive, .CssItemColorExpired, .CssItemReadyForAuthorisation, .CssItemReject, .CssItemBadDebtor, .CssItemBAL, .CssItemBankNotOpen, .CssItemNegative, .CssItemRDs, .CssItemCancel, .CssItemInconsistant, .CssHasComment {
    background-color: lightcoral !important;
}

.legend-negative {
    background: lightcoral
}
.legend-linked-info {
    background: #66FFFF /*a light cyan blue*/
}
.legend-compliant {
    background: lightgreen
}
.legend-neutral {
    background: #DADADA /*very light gray*/
}

#Menu.smallMenu, #Menu.smallMenu ul {
    display: flex;
    flex-direction: column;
    width: 100%;
}

#Menu.smallMenu a.load-app-spinner {
    --bs-btn-padding-y: 0.5rem;
    --bs-btn-padding-x: 0.5rem;
    font-weight: 400;
    color: #fff;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    border: 1px solid var(--bs-primary);
    border-radius: 0.25rem;
    background: linear-gradient(180deg, var(--bs-primary) 0, var(--bs-secondary) 100%);
    width: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-indent: -100%;
    font-size: 0;
    padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
    margin: 0 6px;
    margin-bottom: 1.125rem;
    transition: all 0s ease-in-out;
}


#Menu.smallMenu a.load-app-spinner:hover {
    color: #ffffff !important;
    color: #ffffff !important;
    background: var(--bs-primary) !important;
    border-color: var(--bs-primary) !important;
    width: 44px;
}

#Menu.smallMenu a.load-app-spinner:before {
    content: attr(data-before-content);
    text-indent: 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.875rem;
}

#Menu.smallMenu li ul {
    margin-bottom: 0;
}

#Menu.smallMenu ul li {
    display: none;
}

#Menu.smallMenu ul > li:first-child {
    display: block;
}

#Menu.smallMenu .CssliClass {
    display: none;
}

#Menu.smallMenu li ul {
    left: 0;
}

#Menu.smallMenu ul a[title="Creditors"], #Menu.smallMenu ul a[title="System Admin"] {
    display: none;
}

#Menu.smallMenu a[title="Creditors"]::before {
    content: "CR";
}

#Menu.smallMenu a[title="Reporting"]::before {
    content: "RP";
}
.form-button {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555555;
    background-color: #ffffff;
    background-image: none;
    border: 1px solid #cccccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}