/* ---------------------------------------------------------------------------- */
/* Global  CSS Styles  */
/* ---------------------------------------------------------------------------- */

@import "Defs.css?version=8.1.8.2";

.notVisible {
    position: absolute;
    visibility: collapse;
    width: 0rem;
    height: 0rem;
    max-width: 0rem;
    max-height: 0rem;
    min-height: initial;
    min-width: initial;
}

/*-----------------------------------*/

@media print {
    .screenOnly {
        display: none;
    }
}

body {
    background-color: White;
    padding-left: 1rem;
    padding-right: 1.35rem;
    margin: 0rem;
}

html, body, input, button, textarea, select, span, td, div, table {
    font-family: -apple-system, "Segoe UI", "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
    font-size: 0.866rem;
}

body, input, button, textarea, select, table, td, div {
    font-style: normal;
    font-weight: normal;
}

    body.bodyBottomMargin {
        padding-bottom: 1.81rem;
    }

    input[type="text"],
    input[type="password"],
    input[type="number"],
    input[type=file],
    textarea,
    .textAreaContainer {
        box-sizing: border-box;
    }

    select,
    input[type="text"],
    input[type="password"],
    input[type="number"],
    input[type="submit"],
    input[type="button"],
    button,
    textarea,
    .textAreaContainer,
    .textbox,
    .listbox,
    .btnAction,
    .btnFileUpload,
    .ui-button.ui-widget {
        border-radius: var(--b2-input-border-radius);
    }

textarea {
    padding-left: 0.3rem;
    padding-right: 0.3rem;
}

select,
input[type="text"],
input[type="password"],
input[type="number"],
textarea,
.textAreaContainer,
.textbox,
.listbox,
.btnFileUpload {
    border: 1px solid var(--b2-input-border-color-normal);
}

    select[disabled],
    input[type="text"][disabled],
    input[type="number"][disabled],
    textarea[disabled],
    .textAreaContainer.disabled,
    *[disabled].textbox,
    *[disabled].listbox,
    *[disabled].btnFileUpload {
        border: 1px solid var(--b2-input-border-color-disabled);
    }

select,
input[type="text"],
input[type="password"],
input[type="number"] {
    min-height: 1.7rem;
}

input[type="text"],
input[type="password"],
input[type="number"] {
    padding-left: 0.25rem;
}

.textAreaContainer {
    display: inline-flex;
    align-items: stretch;
    justify-content: center;
    resize: both;
    overflow: hidden;
    background-color: white;
}

    .textAreaContainer > textarea.textAreaChild {
        flex: 0 1 100%;
        border: none !important;
        background-color: transparent;
        font: inherit;
        resize: none;
    }

h1 {
    font-weight: bold;
    font-size: 12pt;
}

h2 {
    font-weight: bold;
    font-size: 10pt;
}

h3 {
    font-weight: bold;
    font-size: 9pt;
}

hr {
    margin-top: 0.6rem;
    margin-bottom: 0.6rem;
    padding: 0rem;
    height: 0px;
    border: none;
    border-top: 1px solid var(--b2-dark-border-color);
}

    hr.hrLight {
        border-color: #c0c4c8;
    }

    hr.hrExtraLight {
        border-color: #e0e4e8;
    }

a {
    font-weight: bold;
    color: var(--b2-hyperlink-text-normal-color);
}

    a:link, a:visited {
        text-decoration: none;
    }

    a:hover {
        text-decoration: underline;
    }

.wait {
    cursor: wait !important;
}

.nowait {
    cursor: default;
}

.invisible {
    display: none !important;
}

.highlighted {
    background-color: #ffd020 !important;
}

    .highlighted.checkbox {
        padding: 0.2rem;
    }

    .highlighted.radiobuttonlist tr td {
        padding-top: 0.15rem;
        padding-bottom: 0.15rem;
    }

        .highlighted.radiobuttonlist tr td:last-child {
            padding-right: 0.75rem !important;
        }

/* Remove focus rectangle on buttons in Firefox */
:focus {
    outline: none;
}

::-moz-focus-inner {
    border: 0rem;
    padding: 0rem;
}

select:focus,
textarea:not(textarea.textAreaChild):focus,
.textAreaContainer:focus-within,
input:focus:not(input[type="image"]) {
    box-shadow: 0 0 0 0.14rem var(--b2-input-focus-boxshadow-color);
}

.datagrid input[type="checkbox"]:focus,
.datagrid input[type="radio"]:focus {
    box-shadow: none;
}

input[type="number"]::-webkit-inner-spin-button {
    cursor: pointer;
    min-height: 1.3rem;
    margin: 0px;
}

/* ---------------------------------------------------------------------------- */

/* Disabled controls (except for Internet Explorer) */

input[type="submit"][disabled],
input[type="button"][disabled] {
    color: var(--b2-button-color-disabled);
    border: 1px solid var(--b2-button-border-color-disabled);
}

div.tab li a[disabled],
div.tab li a.tab[disabled] {
    color: #C8C8C8 !important;
}

li a[disabled],
select[disabled],
span[disabled],
label[disabled],
a[disabled],
a.aspNetDisabled,
table tr td[disabled],
input[disabled]:not([type="submit"]):not([type="button"]),
textarea[disabled] {
    color: #7c8084 !important;
}

.aspNetDisabled > label,
label.aspNetDisabled,
span:not(.checkbox).aspNetDisabled,
span.checkbox[disabled],
td.aspNetDisabled {
    color: #7c8084 !important;
}

input[type="image"][disabled] {
    opacity: 0.4;
}

.frameTitle .aspNetDisabled > label {
    color: #d0d4d8 !important;
}

li a.alwaysReadable[disabled],
select.alwaysReadable[disabled],
span.alwaysReadable[disabled],
label.alwaysReadable[disabled],
a.alwaysReadable[disabled],
table tr td.alwaysReadable[disabled],
input.alwaysReadable[disabled]:not([type="submit"]):not([type="button"]),
textarea.alwaysReadable[disabled],
.alwaysReadable[disabled],
.alwaysReadable *[disabled] {
    color: #24282c !important;
}

a[disabled] {
    pointer-events: none;
}

select > option:disabled.separator {
    background-color: rgba(255, 255, 255, 0); /* Cancels default background color for disabled select options in Firefox */
}

/* ---------------------------------------------------------------------------- */

.nowrap {
    white-space: nowrap;
}

.textbox {
    padding-left: 0.15rem;
}

.listbox {
    padding: 0.15rem;
}

.fontBold {
    font-weight: bold;
}

.fontItalic {
    font-style: italic;
}

.centeredtext {
    text-align: center;
}

.danger {
    color: red;
}

.calculationWarning,
.contractWarning,
.editingReminder,
.contractReminder {
    color: #b000b0;
}

img.attachment {
    height: 1.1rem;
}

.imgContractState {
    height: 1.35rem;
}

/* ---------------------------------------------------------------------------- */

.radiobutton, .radiobutton label, .radiobutton input {
    vertical-align: middle;
}

.radiobuttonlist {
    margin-left: -0.3rem;
    margin-bottom: 0rem;
    border-collapse: collapse;
}

    .radiobuttonlist tr > td {
        margin-bottom: 0rem;
        padding: 0rem;
    }

        .radiobuttonlist tr > td, .radiobuttonlist tr > td input, .radiobuttonlist tr > td label {
            white-space: nowrap;
        }

    .radiobuttonlist tr td label {
        position: relative;
        top: -0.15rem;
    }

    .radiobuttonlist tr td input {
        margin-left: 0.25rem;
    }

    .radiobuttonlist tr td input, .radiobuttonlist tr td label {
        margin-top: 0rem;
        margin-bottom: 0rem;
        padding-top: 0rem;
        padding-bottom: 0rem;
    }

    .radiobuttonlist tr > td:not(:last-child) {
        padding-right: 0.9rem;
    }

    .radiobuttonlist tr > td:last-child {
        padding-right: 0rem !important;
    }

.checkMark {
    height: 1.05rem;
}

    .checkMark.noBorderWidth {
        border-width: 0px;
    }

    .checkMark + br + .checkMark {
        margin-top: 0.25rem;
    }

.checkbox {
    display: inline-flex;
    align-items: center;
}

    .checkbox input {
        margin: 0rem 0rem -1px 0rem;
        padding: 0rem;
    }

    .checkbox label {
        margin-left: 0.3rem;
        margin-bottom: 0.05rem;
    }

    .checkbox.leftLabel label {
        margin-left: 0rem;
        margin-right: 0.5rem;
    }

.checkboxlist {
    border-collapse: separate !important;
    border-spacing: 0rem;
}

    .checkboxlist input {
        margin-left: -1px;
        padding-left: 0rem;
        width: 1.13rem; /* Needed to fix the display problem in IE */
    }

    .checkboxlist td + td {
        padding-left: 1.21rem;
    }

    .checkboxlist tr td,
    .checkboxlist:not(.wrap) tr td input,
    .checkboxlist:not(.wrap) tr td label {
        white-space: nowrap;
    }

    .checkboxlist.wrap tr td label {
        display: inline-block;
        white-space: normal;
        vertical-align: top;
    }

    .checkboxlist tr td label {
        position: relative;
    }

    .checkboxlist input, .checkbox label {
        margin-top: 0rem;
        margin-bottom: 0rem;
        padding-top: 0rem;
        padding-bottom: 0rem;
    }

    .checkboxlist input,
    .checkboxlist label {
        vertical-align: middle;
    }

    .checkboxlist.horizontalNarrow td + td {
        padding-left: 0.85rem !important;
    }

    .checkboxlist.horizontalNarrow td label {
        margin-left: 0rem;
    }

    .checkboxlist.vertical td {
        padding-right: 0rem !important;
    }

    .checkboxlist.verticalNarrow td {
        padding-top: 0px;
        padding-bottom: 0px;
    }

/* ---------------------------------------------------------------------------- */

div.tabLegacy {
    padding-top: 1.1rem !important; /* Use padding instead of margin to avoid vertical scrollbar in IE10 */
    margin-bottom: 0.75rem;
    margin-left: 0.75rem;
    width: 100%;
}

div.tab {
    clear: right;
    border: none 0rem;
    padding: 0rem;
    border-bottom: solid 1px #304050;
}

    div.tab ul {
        margin: 0;
        padding: 0;
        list-style: none;
        overflow: hidden; /* Allows to see the tab bottom border */
    }

    div.tab li {
        float: left;
        margin: 0;
        padding: 0;
    }

        div.tab li a.tab, div.tab li a.tab:visited {
            line-height: 1.85rem;
            display: block;
            padding-left: 1.2rem;
            padding-right: 1.2rem;
            padding-top: 0.1rem;
            font-weight: bold;
            text-decoration: none;
            color: #f0f0f0;
            border: solid 1px black;
            border-bottom: none;
            border-top-left-radius: 0.43rem;
            border-top-right-radius: 0.43rem;
            background-color: var(--b2-tab-bg-color-normal);
            margin-bottom: -0.5px; /* To avoid spacing between the tab and the border line at the bottom */
            margin-right: -1px;
        }

        div.tab li.current a.tab, div.tab li.current a.tab:visited, div.tab li.current a.tab:hover, div.tab li.current a.tab:active {
            font-weight: bold;
            text-decoration: none;
            color: #FFFFFF;
            background-color: var(--b2-tab-bg-color-selected);
        }

a.tab {
    text-align: left;
    margin: 0rem;
    text-decoration: none;
}

    a.tab:hover {
        text-decoration: none;
    }

div.tab li a.tab:hover,
div.tab li a.tab:active {
    background-color: var(--b2-dark-bg-color);
}

/* ---------------------------------------------------------------------------- */

.displayNone {
    display: none !important;
}

.printOnly {
    display: none;
}

.nopagebreak * {
    page-break-inside: avoid;
}

/* ---------------------------------------------------------------------------- */

.datagrid {
    table-layout: fixed;
    border: 1px solid var(--b2-dark-bg-color);
    background-color: var(--b2-datagrid-bg-color-normal-rows);
    border-radius: var(--b2-frame-border-radius);
    border-collapse: separate !important;
    border-spacing: 0;
}

    .datagrid.transparent {
        background-color: transparent;
    }

    .datagrid.noBorder {
        border: none;
    }

    .datagrid.editable {
        width: 100%;
    }

    .datagrid.topAligned td {
        vertical-align: top;
    }

    .datagrid.centeredItems td {
        text-align: center;
    }

    .datagrid td input.centeredEdit {
        text-align: center;
    }

    .datagrid tr:first-child.header > th:first-child,
    .datagrid tr:first-child.header > td:first-child {
        border-top-left-radius: var(--b2-frame-border-inner-radius);
    }

    .datagrid tr:first-child.header > th:last-child,
    .datagrid tr:first-child.header > td:last-child {
        border-top-right-radius: var(--b2-frame-border-inner-radius);
    }

    .datagrid tr:last-child > th:first-child:not(.firstSubHeader),
    .datagrid tr:last-child > td:first-child:not(.firstSubHeader),
    .datagrid tr:nth-last-child(2) > th[rowspan]:first-child:not(.firstSubHeader),
    .datagrid tr:nth-last-child(2) > td[rowspan]:first-child:not(.firstSubHeader) {
        border-bottom-left-radius: var(--b2-frame-border-inner-radius);
    }

    .datagrid tr:last-child > th:last-child:not(.lastSubHeader),
    .datagrid tr:last-child > td:last-child:not(.lastSubHeader) {
        border-bottom-right-radius: var(--b2-frame-border-inner-radius);
    }

.datagridalternate,
.datagridAlternateRows tr:nth-child(even) {
    background-color: var(--b2-datagrid-bg-color-alternate-rows);
}

.datagridScrollable {
    border-left: none;
    border-top: none;
    border-bottom: none;
}

.datagridLeftPadding > tbody > tr > td:first-child, .datagridLeftPadding > tbody > tr > th:first-child {
    padding-left: 0.6rem !important;
}

.datagridRightPadding > tbody > tr > td:last-child, .datagridRightPadding > tbody > tr > th:last-child {
    padding-right: 0.6rem !important;
}

.datagridLargeLeftPadding > tbody > tr > td:first-child, .datagridLargeLeftPadding > tbody > tr > th:first-child {
    padding-left: 0.9rem !important;
}

.datagridSelectedRow td {
    border-top: solid 1px var(--b2-dark-bg-color) !important;
}

.datagridSelectedRow:not(:last-child) td {
    border-bottom: solid 1px var(--b2-dark-bg-color) !important;
}

.datagridSelectedRow, .datagridSelectedRow td, .datagridSelectedRow span {
    background-color: var(--b2-datagrid-bg-color-selected-row);
    font-weight: bold;
}

.datagridSelectedRowColor, .datagridSelectedRowColor td, .datagridSelectedRowColor span {
    background-color: var(--b2-datagrid-bg-color-selected-row);
}

.datagrid tr.header {
    position: sticky; /* Keep header visible when scrolling down */
    top: 0rem;
    z-index: 1;
}

    .datagrid tr.header.secondRow {
        top: 1.66rem; /* If changed, make sure that the behavior is correct when scrolling down (see position: sticky) */
    }

.datagrid tr > td.header,
.datagrid tr > th.header,
.datagrid tr > th.header > span,
.datagrid tr > th > span.header {
    background: var(--b2-dark-bg-color);
    font-weight: bold;
    color: white;
    height: 1.8rem;
}

    .datagrid tr > td.header.subHeader,
    .datagrid tr > th.header.subHeader,
    .datagrid tr > th.header.subHeader > span,
    .datagrid tr > th > span.header.subHeader {
        height: auto;
    }

.datagrid tr.headerpadding td, .datagrid tr.headerpadding th {
    padding-top: 0.15rem;
    padding-bottom: 0.15rem;
}

.datagrid tr td.header, .datagrid tr th.header {
    border-left: none;
    border-right: none;
}

    .datagrid tr th.header span, .datagrid tr th span.header {
        border: none;
    }

    .datagrid tr td.header a, .datagrid tr th.header a {
        border-left: none;
        border-right: none;
        text-decoration: none;
        font-weight: bold;
        color: white;
        display: inline-block;
        line-height: 0.95rem;
        padding-top: 0.15rem;
        padding-bottom: 0.05rem;
    }

        .datagrid tr td.header a:hover, .datagrid th.header a:hover, .datagrid tr th.header a:hover {
            border-left: none;
            border-right: none;
            text-decoration: underline;
            font-weight: bold;
            color: white;
        }

        .datagrid tr td.header a[disabled]:hover, .datagrid th.header a[disabled]:hover, .datagrid tr th.header a[disabled]:hover {
            text-decoration: underline;
        }

.datagrid > thead > tr > th.header, .datagrid > tbody > tr > th.header, .datagrid > tbody > tr > td.header {
    border-bottom: 1px solid var(--b2-dark-bg-color);
}

.datagrid.gridViewFilter tr.header th {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
}

.datagridheader, .datagridheader th, .datagridheader td, .datagridheader span {
    border-left-style: none;
    border-right-style: none;
    background: var(--b2-dark-bg-color);
    font-weight: bold !important;
    color: #FFFFFF !important;
}

    .datagridheader a {
        border-left: none;
        border-right: none;
        text-decoration: none;
        font-weight: bold;
        color: #FFFFFF;
    }

        .datagridheader a:hover {
            border-left: none;
            border-right: none;
            text-decoration: underline;
            font-weight: bold;
            color: #FFFFFF;
        }

        .datagridheader a[disabled]:hover {
            text-decoration: none;
        }

.datagrid > thead > tr > th, .datagrid > tbody > tr > th, .datagrid > tbody > tr > td {
    border: none 0rem #000000;
    padding-left: 0.45rem;
    padding-right: 0.45rem;
}

.datagrid > tbody > tr td a {
    text-decoration: none;
    font-weight: bold;
}

    .datagrid > tbody > tr td a:visited {
        text-decoration: none;
        font-weight: bold;
    }

    .datagrid > tbody > tr td a:hover {
        text-decoration: underline;
        font-weight: bold;
    }

    .datagrid > tbody > tr td a[disabled]:hover {
        text-decoration: none;
    }

.datagrid > tbody > tr.rowSeparator {
    border-top: 1px solid var(--b2-dark-bg-color);
}

.datagrid > tbody > tr.footerAll td, .datagrid > tbody > tr td.footer, .datagrid > tbody > tr th.footer, .datagrid > thead > tr th.footer {
    border-top: 1px solid var(--b2-dark-bg-color);
    border-left: none;
    border-right: none;
    background: var(--b2-datagrid-bg-color-footer-row);
}

.datagrid > tbody > tr td.headerFilter, .datagrid > tbody > tr th.headerFilter, .datagrid > thead > tr th.headerFilter {
    padding-top: 0.15rem !important;
    padding-bottom: 0.15rem !important;
}

.datagrid tr > *.extraLeftSpacing {
    padding-left: 0.7rem;
}

/* Huge column spacing */
.datagridHugeColumnSpacing > tbody > tr > td, .datagridHugeColumnSpacing > tbody > tr > th, .datagridHugeColumnSpacing > thead > tr > th {
    padding-left: 0.6rem;
    padding-right: 0.6rem;
}

/* Large column spacing */
.datagridLargeColumnSpacing > tbody > tr > td, .datagridLargeColumnSpacing > tbody > tr > th, .datagridLargeColumnSpacing > thead > tr > th {
    padding-left: 0.45rem;
    padding-right: 0.45rem;
}

/* Medium column spacing */
.datagridMediumColumnSpacing > tbody > tr > td, .datagridMediumColumnSpacing > tbody > tr > th, .datagridMediumColumnSpacing > thead > tr > th {
    padding-left: 0.3rem;
    padding-right: 0.3rem;
}

/* Compact column spacing */
.datagridCompactColumnSpacing > tbody > tr > td, .datagridCompactColumnSpacing > tbody > tr > th, .datagridCompactColumnSpacing > thead > tr > th {
    padding-left: 0.21rem;
    padding-right: 0.21rem;
}

/* Small column spacing */
.datagridSmallColumnSpacing > tbody > tr > td, .datagridSmallColumnSpacing > tbody > tr > th, .datagridSmallColumnSpacing > thead > tr > th {
    padding-left: 0.15rem;
    padding-right: 0.15rem;
}

/* Tiny column spacing */
.datagridTinyColumnSpacing > tbody > tr > td, .datagridTinyColumnSpacing > tbody > tr > th, .datagridTinyColumnSpacing > thead > tr > th {
    padding-left: 1px;
    padding-right: 1px;
}

/* No column spacing */
.datagridNoColumnSpacing > tbody > tr > td, .datagridNoColumnSpacing > tbody > tr > th, .datagridNoColumnSpacing > thead > tr > th {
    padding-left: 0rem;
    padding-right: 0rem;
}

/* Large row spacing */
.datagridLargeRowSpacing > tbody > tr > td {
    padding-top: 0.45rem;
    padding-bottom: 0.45rem;
}

/* Medium row spacing */
.datagridMediumRowSpacing > tbody > tr > td {
    padding-top: 0.3rem;
    padding-bottom: 0.3rem;
}

/* Compact row spacing */
.datagridCompactRowSpacing > tbody > tr > td {
    padding-top: 0.23rem;
    padding-bottom: 0.23rem;
}

/* Small row spacing */
.datagridSmallRowSpacing > tbody > tr > td {
    padding-top: 0.15rem;
    padding-bottom: 0.15rem;
}

/* Tiny row spacing */
.datagridTinyRowSpacing > tbody > tr > td {
    padding-top: 1px;
    padding-bottom: 1px;
}

/* No row spacing */
.datagridNoRowSpacing > tbody > tr > td {
    padding-top: 0rem;
    padding-bottom: 0rem;
}

.subdatagrid {
    border-style: none !important;
    background-color: transparent !important;
}

    .subdatagrid tr > th.header,
    .subdatagrid tr > td.header {
        border-bottom: none !important;
    }

    .subdatagrid > tbody > tr > td:first-child, .subdatagrid > tbody > tr > th:first-child {
        padding-left: 0rem !important;
    }

    .subdatagrid > tbody > tr > td:last-child, .subdatagrid > tbody > tr > th:last-child {
        padding-left: 0.85rem !important;
        padding-right: 0rem !important;
    }

/* ---------------------------------------------------------------------------- */

.border {
    border: solid var(--b2-dark-border-color) 1px;
}

.sortasc a:after {
    content: url(../Images/sortasc.png);
}

.sortdesc a:after {
    content: url(../Images/sortdesc.png);
}

.phoneExtField {
    display: inline-block;
    width: 3.92rem;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow-x: hidden !important;
    overflow-y: hidden !important;
}

.phoneExtFieldWrap {
    display: inline-block;
    width: 6rem;
    max-width: 6rem;
    word-wrap: break-word;
}

.applyButton {
    width: 1.45rem;
    height: 1.45rem;
    font-weight: bold;
    padding: 0rem;
}

.expandButton {
    cursor: pointer;
}

    .expandButton[disabled] {
        opacity: 0.5;
        filter: alpha(opacity=50);
    }

.proofPreviewContainer {
    position: relative;
}

.playButton {
    position: absolute;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 0rem;
    height: 0rem;
    left: 50%;
    top: 50%;
    overflow: visible;
}

    .playButton > input[type="image"] {
        width: 3.62rem;
        height: 3.62rem;
        opacity: 0.85;
        border-style: none;
    }

        .playButton > input[type="image"]:hover {
            opacity: 1.0;
        }

.checkbox.isEcoplus {
    margin-left: 2.41rem;
}

    .checkbox.isEcoplus > label > .info-icon {
        display: inline-flex;
        transform: translateY(-0.38rem);
        border: solid 1px #404040;
        border-radius: 50%;
        width: 0.8rem;
        height: 0.8rem;
        justify-content: center;
        align-items: center;
        font-weight: bold;
        font-size: 0.6rem;
    }

/* ---------------------------------------------------------------------------- */

/* jQueryUI styling */

.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br {
    border-radius: var(--b2-input-border-radius);
}

/* Date text in date picker */
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    color: #202020;
}

/* Selected date text in date picker */
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {
    color: black;
    font-weight: bold;
}

/* ui-button */

.btnAction.autoWidth {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}

td.btnAction,
td.btnAction input,
.btnAction,
.ui-button,
.u-button.ui-state-default,
.ui-widget-content .ui-button.ui-state-default,
.ui-widget-header .ui-button.ui-state-default {
    color: black;
    font-weight: normal;
}

    td.btnAction,
    td.btnAction input,
    .btnAction {
        height: 1.7rem;
        flex-shrink: 0;
    }

.datagrid td.btnAction,
.datagrid td.btnAction input,
.datagrid .btnAction {
    height: 1.7rem;
}

td.btnAction {
    background: none;
    padding-left: 0rem;
    padding-right: 0rem;
}

    td.btnAction input,
    .btnAction,
    .ui-button,
    .u-button.ui-state-default,
    .ui-widget-content .ui-button.ui-state-default,
    .ui-widget-header .ui-button.ui-state-default {
        background: var(--b2-button-bg-color);
        border: 1px solid var(--b2-dark-bg-color);
        cursor: pointer;
    }

    td .btnAction.autoWidth,
    td.btnAction.autoWidth input {
        padding-left: 1rem;
        padding-right: 1rem;
    }

.btnAction:hover,
.ui-button:hover,
.u-button.ui-state-default:hover,
.ui-widget-content .ui-button.ui-state-default:hover,
.ui-widget-header .ui-button.ui-state-default:hover {
    border: 1px solid var(--b2-button-border-color-hover);
    background: var(--b2-button-bg-color-hover);
}

.btnAction:active,
.ui-button:active,
.u-button.ui-state-default:active,
.ui-widget-content .ui-button.ui-state-default:active,
.ui-widget-header .ui-button.ui-state-default:active {
    border: 1px solid #2080B0;
    background: var(--b2-button-bg-color-active);
}

/* Date picker */
.ui-datepicker {
    width: auto;
    min-width: 17em; /* Width taken from datepicker.css */
}

    .ui-datepicker td {
        width: 2.3rem;
        min-width: 2.3rem;
        max-width: 2.3rem;
    }

        .ui-datepicker td * {
            font-weight: normal;
        }

        .ui-datepicker td.is-blocked * {
            background: #ffc8c8;
            border-color: #d3d3d3;
        }

.ui-datepicker-calendar:not(.week-select-mode) tr td:hover:not(.ui-state-disabled) *,
.ui-datepicker-calendar.week-select-mode tr:hover:has(td:hover:not(.ui-state-disabled)) td:not(.is-blocked):not(.ui-state-disabled) * {
    border-color: #999999;
    background: #d0e0ff !important;
}

.ui-datepicker-calendar:not(.week-select-mode) tr td:active:focus-within:not(.ui-state-disabled) *,
.ui-datepicker-calendar.week-select-mode tr:has(td:active:focus-within:not(.ui-state-disabled)) td:not(.is-blocked):not(.ui-state-disabled) * {
    border-color: black;
    background: #dcecff !important;
    color: black;
}

.ui-datepicker-calendar.week-selected td.is-blocked *,
.ui-datepicker-calendar.week-selected td.ui-state-disabled * {
    font-weight: normal;
}

.ui-datepicker-calendar:not(.week-selected) tr td .ui-state-active,
.ui-datepicker-calendar.week-selected tr td:not(.is-blocked):not(.ui-state-disabled) .ui-state-active {
    border-color: #606060;
    font-weight: bold;
    color: black;
}

.ui-datepicker-calendar tr td:not(.is-blocked):not(.ui-state-disabled) .ui-state-active {
    background: white !important;
}

.ui-datepicker-calendar:not(.week-selected) tr td.is-blocked:not(.ui-state-disabled) .ui-state-active {
    background: #ffd8d8;
}

.ui-datepicker.ui-widget > .datepicker-week-select-option {
    margin-top: 0.6rem;
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    font-size: 0.866rem;
}

.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {
    font-family: unset;
    font-size: unset;
}

.ui-dialog .ui-dialog-buttonpane button {
    min-width: 4.5rem;
    line-height: 1.5rem;
}

.ui-button-icon-only {
    text-indent: -9999px;
}

/* Message Attachments */

.attachmentMainContainer .btnAttachmentFileUpload {
    flex: 1 1 auto;
}

.attachmentMainContainer > .attachmentListContainer {
    margin-top: 0.3rem;
    width: 100%;
    z-index: 2;
}

    .attachmentMainContainer > .attachmentListContainer > .attachmentLabelColumn {
        margin-right: 0.75rem;
    }

        .attachmentMainContainer > .attachmentListContainer > .attachmentLabelColumn > .btnAction {
            margin-top: 0.5rem;
            padding-left: 0.8rem;
            padding-right: 0.8rem;
        }

    .attachmentMainContainer > .attachmentListContainer > .attachmentList {
        max-height: 10rem;
        overflow-y: auto;
        width: 100%;
        text-align: left;
    }

        .attachmentMainContainer > .attachmentListContainer > .attachmentList .attachmentIndex {
            display: inline-block;
            min-width: 1.75rem;
            text-align: right;
            margin-right: 0.75rem;
        }

        .attachmentMainContainer > .attachmentListContainer > .attachmentList .attachmentName {
            flex-shrink: 1;
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow-x: hidden !important;
            overflow-y: hidden !important;
        }

        .attachmentMainContainer > .attachmentListContainer > .attachmentList .attachmentCommand {
            height: 1.25rem;
            padding: 0.07rem 0rem 0.07rem 0.4rem;
            margin: 0rem;
        }


/* Material File Upload */

.materialFileContainer {
    border: 1px solid var(--b2-input-border-color-normal);
    border-radius: var(--b2-input-border-radius);
    box-sizing: border-box;
    padding: 0.3rem 0.75rem;
    width: 100%;
}

    .materialFileContainer.disabled {
        border-color: var(--b2-input-border-color-disabled);
    }

    .materialFileContainer .radiobuttonlist tr > td input[type=radio] { /* input is not a direct child of td when RadioButtonList is disabled */
        margin-left: 0.2rem;
    }

    .materialFileContainer > .layoutRow > .layoutRow {
        flex-shrink: 1;
        margin-left: 0.25rem;
        overflow: hidden;
    }

        .materialFileContainer > .layoutRow > .layoutRow > .btnAction.materialFileSelect {
            margin-right: 1.1rem;
        }

    .materialFileContainer .materialFileList {
        max-height: 14rem;
        overflow-y: auto;
        width: 100%;
        text-align: left;
        min-width: 0rem;
    }

    .materialFileContainer .materialFileList > .materialFileItem {
        justify-content: space-between;
    }

    .materialFileContainer .materialFileList > .materialFileItem > .layoutRow {
        min-width: 0rem;
    }

        .materialFileContainer .materialFileList > .materialFileItem .materialFileIndex {
            display: inline-block;
            min-width: 1rem;
            text-align: right;
            margin-right: 0.5rem;
        }

        .materialFileContainer .materialFileList > .materialFileItem .materialFileName {
            flex-shrink: 1;
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow-x: hidden !important;
            overflow-y: hidden !important;
        }

    .materialFileContainer .commandButton {
        vertical-align: bottom;
        margin: 0rem;
        padding: 0rem;
    }

        .materialFileContainer .commandButton.delete {
            height: 1.3rem;
            margin-left: 0.75rem;
        }

        .materialFileContainer .commandButton.undo {
            height: 1.6rem;
            margin-left: 0.8rem;
        }


/* DropDown Menu */

.dropdown {
    display: inline-flex;
    position: relative;
}

.dropdownToggle {
    background-color: transparent;
    border-color: transparent;
    white-space: nowrap;
    color: #fff;
    line-height: inherit;
    padding-left: inherit;
    padding-left: .14rem;
    padding-right: .14rem;
    cursor: pointer;
}

    .dropdownToggle[disabled] {
        color: #d0d0d0;
    }

    .dropdownToggle:focus,
    .dropdownMenuItem:focus {
        box-shadow: none !important;
        -webkit-box-shadow: none !important;
    }

    .dropdownToggle:after {
        vertical-align: middle;
    }

    .dropdownToggle:after {
        display: inline-block;
        margin-left: .35rem;
        margin-bottom: -0.125rem;
        vertical-align: .255em;
        content: "";
        border-top: .3em solid;
        border-right: .3em solid transparent;
        border-bottom: 0;
        border-left: .3em solid transparent;
    }

    .dropdownToggle:before,
    .dropdownToggle:after {
        box-sizing: border-box;
    }


.dropdownMenu {
    display: none;
    position: absolute !important;
    top: 100%;
    margin-top: 0.35rem;
    z-index: 13000;
    background-color: var(--b2-semi-dark-bg-color);
    border-radius: var(--b2-frame-border-radius);
    padding: 0.35rem 0rem;
}

    .dropdownMenu.show {
        display: block;
    }

    .dropdownMenu.left {
        left: 0rem;
    }

    .dropdownMenu.right {
        right: 0rem;
    }

.dropdownMenuItem {
    width: 100%;
    padding: 0.35rem 1rem;
    clear: both;
    font-weight: normal;
    color: white;
    text-align: inherit;
    text-decoration: none;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
    cursor: pointer;
}

.dropdownMenuItem > input,
.dropdownMenuItem > label {
    cursor: pointer;
}

input.dropdownMenuItem[disabled] {
    color: #d0d0d0;
    border: 0;
    pointer-events: none;
}

.dropdownMenuItem:active {
    text-shadow: 0px 0px 0.75px white;
}

.dropdownDivider {
    height: 0rem;
    margin: 0.3rem 0rem;
    overflow: hidden;
    border-top: 1px solid #c0c0c0;
    opacity: 1;
}