*,
.normal, .normalFocused, .normalDisabled,
.windowHeaderText, .dialogHeaderText,
.canvasHover, .gridHover, .formHover,
.groupLabel,
.emptyMessage,
.tabSetContainer,
.tabButtonTop, .tabButtonTopSelected, .tabButtonTopSelectedDisabled, .tabButtonTopOver, .tabButtonTopSelectedOver, .tabButtonTopDisabled, .tabButtonTopDisabledOver, .tabButtonTopDown, .tabButtonTopSelectedDown.treeCell, .treeCellDark, .treeCellOver, .treeCellOverDark, .treeCellSelected, .treeCellSelectedDark, .treeCellSelectedOver, .treeCellSelectedOverDark, .treeCellDisabled, .treeCellDisabledDark, .treeTallCell, .treeTallCellDark, .treeTallCellOver, .treeTallCellOverDark, .treeTallCellSelected, .treeTallCellSelectedDark, .treeTallCellSelectedOver, .treeTallCellSelectedOverDark, .treeTallCellDisabled, .treeTallCellDisabledDark,
.treeCell, .treeCellDark, .treeCellOver, .treeCellOverDark, .treeCellSelected, .treeCellSelectedDark, .treeCellSelectedOver, .treeCellSelectedOverDark, .treeCellDisabled, .treeCellDisabledDark, .treeTallCell, .treeTallCellDark, .treeTallCellOver, .treeTallCellOverDark, .treeTallCellSelected, .treeTallCellSelectedDark, .treeTallCellSelectedOver, .treeTallCellSelectedOverDark, .treeTallCellDisabled, .treeTallCellDisabledDark,
.toolStripButton, .toolStripButtonOver, .toolStripButtonFocused, .toolStripButtonFocusedOver, .toolStripButtonDown, .toolStripButtonFocusedDown, .toolStripButtonSelected, .toolStripButtonSelectedFocused, .toolStripButtonSelectedDown, .toolStripButtonSelectedFocusedDown, .toolStripButtonSelectedOver, .toolStripButtonSelectedFocusedOver, .toolStripButtonDisabled, .toolStripButtonSelectedDisabled, .toolStripButtonOpened, .toolStripButtonOverOpened, .toolStripButtonDownOpened, .toolStripButtonFocusedOpened, .toolStripButtonFocusedDownOpened, .toolStripButtonFocusedOverOpened, .toolStripButtonSelectedOpened, .toolStripButtonSelectedDownOpened, .toolStripButtonSelectedOverOpened,
.textItemLite, .textItemLiteRTL, .textItemLiteFocused, .textItemLiteFocusedRTL, .textItemLiteDisabled, .textItemLiteDisabledRTL, .textItemLiteError, .textItemLiteErrorRTL, .textItemLitePending, .textItemLitePendingRTL, .textItemLitePendingFocused, .textItemLitePendingFocusedRTL, .textItemLitePendingDisabled, .textItemLitePendingDisabledRTL, .textItemLitePendingError, .textItemLitePendingErrorRTL, .textItemLiteHint, .textItemLiteHintRTL, .textItemLiteDisabledHint, .textItemLiteDisabledHintRTL, .selectItemLiteText, .selectItemLiteTextRTL, .selectItemLiteTextFocused, .selectItemLiteTextFocusedRTL, .selectItemLiteTextDisabled, .selectItemLiteTextDisabledRTL, .selectItemLiteTextError, .selectItemLiteTextErrorRTL, .selectItemLiteTextPending, .selectItemLiteTextPendingRTL, .selectItemLiteTextPendingFocused, .selectItemLiteTextPendingFocusedRTL, .selectItemLiteTextPendingDisabled, .selectItemLiteTextPendingDisabledRTL, .selectItemLiteTextPendingError, .selectItemLiteTextPendingErrorRTL, .selectItemLiteTextHint, .selectItemLiteTextHintRTL, .selectItemLiteTextDisabledHint, .selectItemLiteTextDisabledHintRTL, .spinnerItemLiteText, .spinnerItemLiteTextRTL, .spinnerItemLiteTextFocused, .spinnerItemLiteTextFocusedRTL, .spinnerItemLiteTextDisabled, .spinnerItemLiteTextDisabledRTL, .spinnerItemLiteTextError, .spinnerItemLiteTextErrorRTL, .spinnerItemLiteTextPending, .spinnerItemLiteTextPendingRTL, .spinnerItemLiteTextPendingFocused, .spinnerItemLiteTextPendingFocusedRTL, .spinnerItemLiteTextPendingDisabled, .spinnerItemLiteTextPendingDisabledRTL, .spinnerItemLiteTextPendingError, .spinnerItemLiteTextPendingErrorRTL, .spinnerItemLiteTextHint, .spinnerItemLiteTextHintRTL, .spinnerItemLiteTextDisabledHint, .spinnerItemLiteTextDisabledHintRTL, .textAreaItemLite, .textAreaItemLiteRTL, .textAreaItemLiteFocused, .textAreaItemLiteFocusedRTL, .textAreaItemLiteDisabled, .textAreaItemLiteDisabledRTL, .textAreaItemLiteError, .textAreaItemLiteErrorRTL, .textAreaItemLitePending, .textAreaItemLitePendingRTL, .textAreaItemLitePendingFocused, .textAreaItemLitePendingFocusedRTL, .textAreaItemLitePendingDisabled, .textAreaItemLitePendingDisabledRTL, .textAreaItemLitePendingError, .textAreaItemLitePendingErrorRTL, .textAreaItemLiteHint, .textAreaItemLiteHintRTL, .textAreaItemLiteDisabledHint, .textAreaItemLiteDisabledHintRTL,
.formTitle, .formTitleRTL, .formTitleFocused, .formTitleFocusedRTL, .formTitleDisabled, .formTitleDisabledRTL, .formTitleError, .formTitleErrorRTL, .formTitlePending, .formTitlePendingRTL, .formTitlePendingFocused, .formTitlePendingFocusedRTL, .formTitlePendingDisabled, .formTitlePendingDisabledRTL, .formTitlePendingError, .formTitlePendingErrorRTL, .formCell, .formCellRTL, .formCellFocused, .formCellFocusedRTL, .formCellDisabled, .formCellDisabledRTL, .formCellError, .formCellErrorRTL, .formCellPending, .formCellPendingRTL, .formCellPendingFocused, .formCellPendingFocusedRTL, .formCellPendingDisabled, .formCellPendingDisabledRTL, .formCellPendingError, .formCellPendingErrorRTL, .formHint, .formHintRTL, .formHintDisabled, .formHintDisabledRTL, .headerItem, .headerItemRTL, .headerItemDisabled, .headerItemDisabledRTL, .headerItemError, .headerItemErrorRTL, .nativeSelectItem, .nativeSelectItemRTL, .nativeSelectItemFocused, .nativeSelectItemFocusedRTL, .nativeSelectItemDisabled, .nativeSelectItemDisabledRTL, .nativeSelectItemError, .nativeSelectItemErrorRTL, .nativeSelectItemPending, .nativeSelectItemPendingRTL, .nativeSelectItemPendingFocused, .nativeSelectItemPendingFocusedRTL, .nativeSelectItemPendingDisabled, .nativeSelectItemPendingDisabledRTL, .nativeSelectItemPendingError, .nativeSelectItemPendingErrorRTL, .staticTextItem, .staticTextItemRTL, .staticTextItemFocused, .staticTextItemFocusedRTL, .staticTextItemDisabled, .staticTextItemDisabledRTL, .staticTextItemError, .staticTextItemErrorRTL, .staticTextItemPending, .staticTextItemPendingRTL, .staticTextItemPendingFocused, .staticTextItemPendingFocusedRTL, .staticTextItemPendingDisabled, .staticTextItemPendingDisabledRTL, .staticTextItemPendingError, .staticTextItemPendingErrorRTL, .textItem, .textItemRTL, .textItemFocused, .textItemFocusedRTL, .textItemDisabled, .textItemDisabledRTL, .textItemError, .textItemErrorRTL, .textItemPending, .textItemPendingRTL, .textItemPendingFocused, .textItemPendingFocusedRTL, .textItemPendingDisabled, .textItemPendingDisabledRTL, .textItemPendingError, .textItemPendingErrorRTL, .textItemHint, .textItemHintRTL, .textItemDisabledHint, .textItemDisabledHintRTL, .uploadItem, .uploadItemRTL, .uploadItemFocused, .uploadItemFocusedRTL, .uploadItemDisabled, .uploadItemDisabledRTL, .uploadItemError, .uploadItemErrorRTL, .uploadItemPending, .uploadItemPendingRTL, .uploadItemPendingFocused, .uploadItemPendingFocusedRTL, .uploadItemPendingDisabled, .uploadItemPendingDisabledRTL, .uploadItemPendingError, .uploadItemPendingErrorRTL, .uploadItemHint, .uploadItemHintRTL, .uploadItemDisabledHint, .uploadItemDisabledHintRTL, .selectItemControl, .selectItemControlRTL, .selectItemControlFocused, .selectItemControlFocusedRTL, .selectItemControlDisabled, .selectItemControlDisabledRTL, .selectItemControlError, .selectItemControlErrorRTL, .selectItemControlPending, .selectItemControlPendingRTL, .selectItemControlPendingFocused, .selectItemControlPendingFocusedRTL, .selectItemControlPendingDisabled, .selectItemControlPendingDisabledRTL, .selectItemControlPendingError, .selectItemControlPendingErrorRTL, .selectItemText, .selectItemTextRTL, .selectItemTextFocused, .selectItemTextFocusedRTL, .selectItemTextDisabled, .selectItemTextDisabledRTL, .selectItemTextError, .selectItemTextErrorRTL, .selectItemTextPending, .selectItemTextPendingRTL, .selectItemTextPendingFocused, .selectItemTextPendingFocusedRTL, .selectItemTextPendingDisabled, .selectItemTextPendingDisabledRTL, .selectItemTextPendingError, .selectItemTextPendingErrorRTL, .selectItemTextHint, .selectItemTextHintRTL, .selectItemTextDisabledHint, .selectItemTextDisabledHintRTL, .comboBoxItemPendingText, .comboBoxItemPendingTextRTL, .pickerSearchBox, .pickerSearchBoxRTL, .pickerSearchBoxFocused, .pickerSearchBoxFocusedRTL, .pickerSearchBoxDisabled, .pickerSearchBoxDisabledRTL, .pickerSearchBoxError, .pickerSearchBoxErrorRTL, .pickerSearchBoxPending, .pickerSearchBoxPendingRTL, .pickerSearchBoxPendingFocused, .pickerSearchBoxPendingFocusedRTL, .pickerSearchBoxPendingDisabled, .pickerSearchBoxPendingDisabledRTL, .pickerSearchBoxPendingError, .pickerSearchBoxPendingErrorRTL, .pickerSearchBoxHint, .pickerSearchBoxHintRTL, .pickerSearchBoxDisabledHint, .pickerSearchBoxDisabledHintRTL, .pickListCell, .pickListCellRTL, .pickListCellOver, .pickListCellOverRTL, .pickListCellSelected, .pickListCellSelectedRTL, .pickListCellSelectedOver, .pickListCellSelectedOverRTL, .pickListCellDisabled, .pickListCellDisabledRTL, .pickListCellDark, .pickListCellDarkRTL, .pickListCellOverDark, .pickListCellOverDarkRTL, .pickListCellSelectedDark, .pickListCellSelectedDarkRTL, .pickListCellSelectedOverDark, .pickListCellSelectedOverDarkRTL, .pickListCellDisabledDark, .pickListCellDisabledDarkRTL, .pickListCellPending, .pickListCellPendingRTL, .pickListCellPendingOver, .pickListCellPendingOverRTL, .pickListCellPendingSelected, .pickListCellPendingSelectedRTL, .pickListCellPendingSelectedOver, .pickListCellPendingSelectedOverRTL, .pickListCellPendingDisabled, .pickListCellPendingDisabledRTL, .pickListCellPendingDark, .pickListCellPendingDarkRTL, .pickListCellPendingOverDark, .pickListCellPendingOverDarkRTL, .pickListCellPendingSelectedDark, .pickListCellPendingSelectedDarkRTL, .pickListCellPendingSelectedOverDark, .pickListCellPendingSelectedOverDarkRTL, .pickListCellPendingDisabledDark, .pickListCellPendingDisabledDarkRTL, .pickListCellDeselected, .pickListCellDeselectedRTL, .pickListCellDeselectedOver, .pickListCellDeselectedOverRTL, .pickListCellDeselectedSelected, .pickListCellDeselectedSelectedRTL, .pickListCellDeselectedSelectedOver, .pickListCellDeselectedSelectedOverRTL, .pickListCellDeselectedDisabled, .pickListCellDeselectedDisabledRTL, .pickListCellDeselectedDark, .pickListCellDeselectedDarkRTL, .pickListCellDeselectedOverDark, .pickListCellDeselectedOverDarkRTL, .pickListCellDeselectedSelectedDark, .pickListCellDeselectedSelectedDarkRTL, .pickListCellDeselectedSelectedOverDark, .pickListCellDeselectedSelectedOverDarkRTL, .pickListCellDeselectedDisabledDark, .pickListCellDeselectedDisabledDarkRTL, .tallPickListCell, .tallPickListCellRTL, .tallPickListCellOver, .tallPickListCellOverRTL, .tallPickListCellSelected, .tallPickListCellSelectedRTL, .tallPickListCellSelectedOver, .tallPickListCellSelectedOverRTL, .tallPickListCellDisabled, .tallPickListCellDisabledRTL, .tallPickListCellDark, .tallPickListCellDarkRTL, .tallPickListCellOverDark, .tallPickListCellOverDarkRTL, .tallPickListCellSelectedDark, .tallPickListCellSelectedDarkRTL, .tallPickListCellSelectedOverDark, .tallPickListCellSelectedOverDarkRTL, .tallPickListCellDisabledDark, .tallPickListCellDisabledDarkRTL, .tallPickListCellPending, .tallPickListCellPendingRTL, .tallPickListCellPendingOver, .tallPickListCellPendingOverRTL, .tallPickListCellPendingSelected, .tallPickListCellPendingSelectedRTL, .tallPickListCellPendingSelectedOver, .tallPickListCellPendingSelectedOverRTL, .tallPickListCellPendingDisabled, .tallPickListCellPendingDisabledRTL, .tallPickListCellPendingDark, .tallPickListCellPendingDarkRTL, .tallPickListCellPendingOverDark, .tallPickListCellPendingOverDarkRTL, .tallPickListCellPendingSelectedDark, .tallPickListCellPendingSelectedDarkRTL, .tallPickListCellPendingSelectedOverDark, .tallPickListCellPendingSelectedOverDarkRTL, .tallPickListCellPendingDisabledDark, .tallPickListCellPendingDisabledDarkRTL, .tallPickListCellDeselected, .tallPickListCellDeselectedRTL, .tallPickListCellDeselectedOver, .tallPickListCellDeselectedOverRTL, .tallPickListCellDeselectedSelected, .tallPickListCellDeselectedSelectedRTL, .tallPickListCellDeselectedSelectedOver, .tallPickListCellDeselectedSelectedOverRTL, .tallPickListCellDeselectedDisabled, .tallPickListCellDeselectedDisabledRTL, .tallPickListCellDeselectedDark, .tallPickListCellDeselectedDarkRTL, .tallPickListCellDeselectedOverDark, .tallPickListCellDeselectedOverDarkRTL, .tallPickListCellDeselectedSelectedDark, .tallPickListCellDeselectedSelectedDarkRTL, .tallPickListCellDeselectedSelectedOverDark, .tallPickListCellDeselectedSelectedOverDarkRTL, .tallPickListCellDeselectedDisabledDark, .tallPickListCellDeselectedDisabledDarkRTL, .labelAnchor, .labelAnchorRTL, .labelAnchorDisabled, .labelAnchorDisabledRTL, .labelAnchorError, .labelAnchorErrorRTL, .labelAnchorFocused, .labelAnchorFocusedRTL,
.buttonRounded, .buttonRoundedOver, .buttonRoundedFocused, .buttonRoundedFocusedOver, .buttonRoundedDown, .buttonRoundedFocusedDown, .buttonRoundedSelected, .buttonRoundedSelectedFocused, .buttonRoundedSelectedDown, .buttonRoundedSelectedFocusedDown, .buttonRoundedSelectedOver, .buttonRoundedSelectedFocusedOver, .buttonRoundedDisabled, .buttonRoundedSelectedDisabled, .buttonRoundedPending, .buttonRoundedPendingOver, .buttonRoundedPendingFocused, .buttonRoundedPendingFocusedOver, .buttonRoundedPendingDown, .buttonRoundedPendingFocusedDown, .buttonRoundedPendingSelected, .buttonRoundedPendingSelectedFocused, .buttonRoundedPendingSelectedDown, .buttonRoundedPendingSelectedFocusedDown, .buttonRoundedPendingSelectedOver, .buttonRoundedPendingSelectedFocusedOver, .buttonRoundedPendingDisabled, .buttonRoundedPendingSelectedDisabled, .buttonRoundedDeselectedDisabled, .filterOperatorIcon, .filterOperatorIconOver, .filterOperatorIconFocused, .filterOperatorIconFocusedOver, .filterOperatorIconDown,
.sectionHeaderopened, .sectionHeaderclosed, .sectionHeaderDisabledopened, .sectionHeaderDisabledclosed
{
    font-family: "Lato", Helvetica, Arial, "Lucida Grande", sans-serif;
}

*:focus { outline: none; }

a:link { color:#000; text-decoration:underline; }
a:visited { color:#000; text-decoration:underline; }
a:hover { color:#000; text-decoration:none; }
a:active { color: #000; text-decoration:none; }

.normalDisabled {
    color: #b3b3b3;
}

.deprecated {
    color:#880000;
}

.oldRev {
    color:#888;
}

.bold {
    font-weight: 700;
    font-size: 11px;
}

.boldFocused {
    font-weight: 700;
    font-size: 11px;
}

.boldDisabled {
    font-weight: 700;
    font-size: 11px;
    color: #939393;
}

.rounderButton {
    border-radius: 6px;
}

.bordered-rich-text-editor, .bordered-rich-text-editorDisabled {
    border: 1px solid #a7abb4;
}
.startTestingButtonPickList {
    padding-left:14px;
    padding-right:14px;
    padding-bottom:14px;
}

.runWindowTestCaseName {
    font-size: 12px;
    font-weight: 700;
    line-height: 15px;
    padding-top: 4px;
}

.runWindowTestCaseNameDisabled {
    font-size: 12px;
    font-weight: 700;
    color: #777;
    line-height: 15px;
    padding-top: 4px;
}

.runWindowIssuesMenu, .runWindowIssuesMenuOver, .runWindowIssuesMenuDown {
    color: #F00;
    font-size: 11px;
}

.runWindowIssuesMenuDisabled {
    color: #FAA;
    font-size: 11px;
}

.runWindowNoIssuesMenu, .runWindowNoIssuesMenuOver, .runWindowNoIssuesMenuDown {
    color: #000;
    font-size: 11px;
}

.runWindowNoIssuesMenuDisabled {
    color: #aaa;
    font-size: 11px;
}

.homeSubTitle {
    font-size: 12px;
    font-weight: normal;
}

.noSidePadding {
    padding-left: 0;
    padding-right: 0;
}

.headerRemoveFieldSidePadding {
    padding-left: 3px;
}

/* change font color for disabled form items */

.staticTextItemDisabled {
    color: #777;
    font-size: 11px;
}

input:disabled {
    color: #777;
}

.formTitleDisabled, .disabledColor {
    color: #777;
}

/* force form titles black */
.formTitle, .formTitleFocused {
    color: #000;
}

.formTitle img {
    /*vertical-align: middle;*/
    margin-top: 3px;
}

.formTitleDisabled img {
    opacity: 50%;
}

/* tree search controls */

.fromTopSlidingToggleBar {
    border-bottom: 1px solid #A5B0C0;
}

.fromTopSlidingToggleBar.withBorder {
    border-top: 1px solid #c1c1e7;
}

.fromBottomSlidingToggleBar {
    border-top: 1px solid #A5B0C0;
}

.fromBottomSlidingToggleBar.withBorder {
    border-bottom: 1px solid #c1c1e7;
}

.checkboxTrueDisabled,
.checkboxTrue,
.checkboxTrueOver,
.checkboxTrueDown,
.checkboxFalseDisabled,
.checkboxFalse,
.checkboxFalseOver,
.checkboxFalseDown,
.checkboxPartialDisabled,
.checkboxPartial,
.checkboxPartialOver,
.checkboxPartialDown,
.checkboxUnsetDisabled,
.checkboxUnset,
.checkboxUnsetOver,
.checkboxUnsetDown {
    background-size: 64px;
    width: 16px !important;
    height: 16px !important;
}

.menuMain, .menuFill {
    /* background-size: 24px; */
    background-size: 28px;
}

.formCellFocused .checkboxTrueDisabled,
.formCellFocused .checkboxTrue,
.formCellFocused .checkboxTrueOver,
.formCellFocused .checkboxTrueDown,
.formCellFocused .checkboxFalseDisabled,
.formCellFocused .checkboxFalse,
.formCellFocused .checkboxFalseOver,
.formCellFocused .checkboxFalseDown,
.formCellFocused .checkboxPartialDisabled,
.formCellFocused .checkboxPartial,
.formCellFocused .checkboxPartialOver,
.formCellFocused .checkboxPartialDown,
.formCellFocused .checkboxUnsetDisabled,
.formCellFocused .checkboxUnset,
.formCellFocused .checkboxUnsetOver,
.formCellFocused .checkboxUnsetDown {
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px rgba(102, 175, 233);
}

.checkboxTrueDisabled {
    /*  background-position: 0px -32px;*/
    background-position: -16px -32px;
}

.checkboxTrue,
.checkboxTrueOver {
    /*  background-position: -16px -32px;*/
    background-position: -48px -32px;
}

.checkboxTrueDown {
    background-position: -48px -32px;
}

.checkboxFalseDisabled {
    background-position: 0px 0px;
}

.checkboxFalse,
.checkboxFalseOver {
    background-position: -16px 0px;
}

.checkboxFalseDown {
    background-position: -48px 0px;
}

.checkboxPartialDisabled {
    background-position: 0px -16px;
}

.checkboxPartial {
    background-position: -16px -16px;
}

.checkboxPartialOver {
    background-position: -32px -16px;
}

.checkboxPartialDown {
    background-position: -48px -16px;
}

.checkboxUnsetDisabled {
    background-position: 0px -48px;
}

.checkboxUnset {
    background-position: -16px -48px;
}

.checkboxUnsetOver {
    background-position: -32px -48px;
    background-position: -32px -48px;
}

.checkboxUnsetDown {
    background-position: -48px -48px;
}

/* fix checkbox item align */
.checkboxTrue + label, .checkboxTrueDisabled + label, .checkboxTrueDown + label, .checkboxFalse + label, .checkboxFalseDisabled + label, .checkboxFalseDown + label {
    padding-left: 2px;
}
.labelAnchor, .labelAnchorRTL, .labelAnchorDisabled, .labelAnchorDisabledRTL, .labelAnchorError, .labelAnchorErrorRTL, .labelAnchorFocused, .labelAnchorFocusedRTL {
    display: flex;
    align-items: center;
}

.selectItemText, .textItemLite, .textItemLiteRTL, .textItemLiteFocused, .textItemLiteFocuseldRTL, .textItemLiteDisabled, .textItemLiteDisabledRTL, .textItemLiteError, .textItemLiteErrorRTL, .textItemLitePending, .textItemLitePendingRTL, .textItemLitePendingFocused, .textItemLitePendingFocusedRTL, .textItemLitePendingDisabled, .textItemLitePendingDisabledRTL, .textItemLitePendingError, .textItemLitePendingErrorRTL, .textItemLiteHint, .textItemLiteHintRTL, .textItemLiteDisabledHint, .textItemLiteDisabledHintRTL, .selectItemLiteControl, .selectItemLiteControlRTL, .selectItemLiteControlFocused, .selectItemLiteControlFocusedRTL, .selectItemLiteControlOver, .selectItemLiteControlOverRTL, .selectItemLiteControlFocusedOver, .selectItemLiteControlFocusedOverRTL, .selectItemLiteControlDisabled, .selectItemLiteControlDisabledRTL, .selectItemLiteControlError, .selectItemLiteControlErrorRTL, .selectItemLiteControlErrorOver, .selectItemLiteControlErrorOverRTL, .selectItemLiteControlErrorFocused, .selectItemLiteControlErrorFocusedRTL, .selectItemLiteControlErrorFocusedOver, .selectItemLiteControlErrorFocusedOverRTL, .selectItemLiteControlPending, .selectItemLiteControlPendingRTL, .selectItemLiteControlPendingFocused, .selectItemLiteControlPendingFocusedRTL, .selectItemLiteControlPendingOver, .selectItemLiteControlPendingOverRTL, .selectItemLiteControlPendingFocusedOver, .selectItemLiteControlPendingFocusedOverRTL, .selectItemLiteControlPendingDisabled, .selectItemLiteControlPendingDisabledRTL, .selectItemLiteControlPendingError, .selectItemLiteControlPendingErrorRTL, .selectItemLiteControlHint, .selectItemLiteControlHintRTL, .selectItemLiteControlDisabledHint, .selectItemLiteControlDisabledHintRTL, .spinnerItemLiteControl, .spinnerItemLiteControlRTL, .spinnerItemLiteControlFocused, .spinnerItemLiteControlFocusedRTL, .spinnerItemLiteControlOver, .spinnerItemLiteControlOverRTL, .spinnerItemLiteControlFocusedOver, .spinnerItemLiteControlFocusedOverRTL, .spinnerItemLiteControlDisabled, .spinnerItemLiteControlDisabledRTL, .spinnerItemLiteControlError, .spinnerItemLiteControlErrorRTL, .spinnerItemLiteControlPending, .spinnerItemLiteControlPendingRTL, .spinnerItemLiteControlPendingFocused, .spinnerItemLiteControlPendingFocusedRTL, .spinnerItemLiteControlPendingOver, .spinnerItemLiteControlPendingOverRTL, .spinnerItemLiteControlPendingFocusedOver, .spinnerItemLiteControlPendingFocusedOverRTL, .spinnerItemLiteControlPendingDisabled, .spinnerItemLiteControlPendingDisabledRTL, .spinnerItemLiteControlPendingError, .spinnerItemLiteControlPendingErrorRTL, .spinnerItemLiteControlHint, .spinnerItemLiteControlHintRTL, .spinnerItemLiteControlDisabledHint, .spinnerItemLiteControlDisabledHintRTL, .textAreaItemLite, .textAreaItemLiteRTL, .textAreaItemLiteFocused, .textAreaItemLiteFocusedRTL, .textAreaItemLiteDisabled, .textAreaItemLiteDisabledRTL, .textAreaItemLiteError, .textAreaItemLiteErrorRTL, .textAreaItemLitePending, .textAreaItemLitePendingRTL, .textAreaItemLitePendingFocused, .textAreaItemLitePendingFocusedRTL, .textAreaItemLitePendingDisabled, .textAreaItemLitePendingDisabledRTL, .textAreaItemLitePendingError, .textAreaItemLitePendingErrorRTL, .textAreaItemLiteHint, .textAreaItemLiteHintRTL, .textAreaItemLiteDisabledHint, .textAreaItemLiteDisabledHintRTL,
.textItem, .textItemRTL, .textItemPending, .textItemPendingRTL, .textItemHint, .textItemHintRTL, .pickerSearchBox, .pickerSearchBoxRTL, .pickerSearchBoxPending, .pickerSearchBoxPendingRTL, .pickerSearchBoxHint, .pickerSearchBoxHintRTL {
    border: 1px solid #f0f0f0;
    box-shadow: none;
    -webkit-box-shadow: none;
}

/* all other items expect text areas */
.selectItemText, .textItemLite, .textItemLiteRTL, .textItemLiteFocused, .textItemLiteFocusedRTL, .textItemLiteDisabled, .textItemLiteDisabledRTL, .textItemLiteError, .textItemLiteErrorRTL, .textItemLitePending, .textItemLitePendingRTL, .textItemLitePendingFocused, .textItemLitePendingFocusedRTL, .textItemLitePendingDisabled, .textItemLitePendingDisabledRTL, .textItemLitePendingError, .textItemLitePendingErrorRTL, .textItemLiteHint, .textItemLiteHintRTL, .textItemLiteDisabledHint, .textItemLiteDisabledHintRTL, .selectItemLiteControl, .selectItemLiteControlRTL, .selectItemLiteControlFocused, .selectItemLiteControlFocusedRTL, .selectItemLiteControlOver, .selectItemLiteControlOverRTL, .selectItemLiteControlFocusedOver, .selectItemLiteControlFocusedOverRTL, .selectItemLiteControlDisabled, .selectItemLiteControlDisabledRTL, .selectItemLiteControlError, .selectItemLiteControlErrorRTL, .selectItemLiteControlErrorOver, .selectItemLiteControlErrorOverRTL, .selectItemLiteControlErrorFocused, .selectItemLiteControlErrorFocusedRTL, .selectItemLiteControlErrorFocusedOver, .selectItemLiteControlErrorFocusedOverRTL, .selectItemLiteControlPending, .selectItemLiteControlPendingRTL, .selectItemLiteControlPendingFocused, .selectItemLiteControlPendingFocusedRTL, .selectItemLiteControlPendingOver, .selectItemLiteControlPendingOverRTL, .selectItemLiteControlPendingFocusedOver, .selectItemLiteControlPendingFocusedOverRTL, .selectItemLiteControlPendingDisabled, .selectItemLiteControlPendingDisabledRTL, .selectItemLiteControlPendingError, .selectItemLiteControlPendingErrorRTL, .selectItemLiteControlHint, .selectItemLiteControlHintRTL, .selectItemLiteControlDisabledHint, .selectItemLiteControlDisabledHintRTL, .spinnerItemLiteControl, .spinnerItemLiteControlRTL, .spinnerItemLiteControlFocused, .spinnerItemLiteControlFocusedRTL, .spinnerItemLiteControlOver, .spinnerItemLiteControlOverRTL, .spinnerItemLiteControlFocusedOver, .spinnerItemLiteControlFocusedOverRTL, .spinnerItemLiteControlDisabled, .spinnerItemLiteControlDisabledRTL, .spinnerItemLiteControlError, .spinnerItemLiteControlErrorRTL, .spinnerItemLiteControlPending, .spinnerItemLiteControlPendingRTL, .spinnerItemLiteControlPendingFocused, .spinnerItemLiteControlPendingFocusedRTL, .spinnerItemLiteControlPendingOver, .spinnerItemLiteControlPendingOverRTL, .spinnerItemLiteControlPendingFocusedOver, .spinnerItemLiteControlPendingFocusedOverRTL, .spinnerItemLiteControlPendingDisabled, .spinnerItemLiteControlPendingDisabledRTL, .spinnerItemLiteControlPendingError, .spinnerItemLiteControlPendingErrorRTL, .spinnerItemLiteControlHint, .spinnerItemLiteControlHintRTL, .spinnerItemLiteControlDisabledHint, .spinnerItemLiteControlDisabledHintRTL,
.textItem, .textItemRTL, .textItemPending, .textItemPendingRTL, .textItemHint, .textItemHintRTL, .pickerSearchBox, .pickerSearchBoxRTL, .pickerSearchBoxPending, .pickerSearchBoxPendingRTL, .pickerSearchBoxHint, .pickerSearchBoxHintRTL {
    border-radius: 8px;
}

.textAreaItemLite, .textAreaItemLiteRTL, .textAreaItemLiteFocused, .textAreaItemLiteFocusedRTL, .textAreaItemLiteDisabled, .textAreaItemLiteDisabledRTL, .textAreaItemLiteError, .textAreaItemLiteErrorRTL, .textAreaItemLitePending, .textAreaItemLitePendingRTL, .textAreaItemLitePendingFocused, .textAreaItemLitePendingFocusedRTL, .textAreaItemLitePendingDisabled, .textAreaItemLitePendingDisabledRTL, .textAreaItemLitePendingError, .textAreaItemLitePendingErrorRTL, .textAreaItemLiteHint, .textAreaItemLiteHintRTL, .textAreaItemLiteDisabledHint, .textAreaItemLiteDisabledHintRTL
{
    -webkit-box-shadow: 0 4px 6px -6px black;
    -moz-box-shadow: 0 4px 6px -6px black;
    box-shadow: 0 4px 6px -6px black;
    border-radius: 8px;
}

/* this breaks text-overflow ellipsis currently but is better than without this, mostly affects multiselectitems */
.selectItemLiteText, .selectItemLiteTextRTL, .selectItemLiteTextFocused, .selectItemLiteTextFocusedRTL, .selectItemLiteTextDisabled, .selectItemLiteTextDisabledRTL, .selectItemLiteTextError, .selectItemLiteTextErrorRTL, .selectItemLiteTextPending, .selectItemLiteTextPendingRTL, .selectItemLiteTextPendingFocused, .selectItemLiteTextPendingFocusedRTL, .selectItemLiteTextPendingDisabled, .selectItemLiteTextPendingDisabledRTL, .selectItemLiteTextPendingError, .selectItemLiteTextPendingErrorRTL, .selectItemLiteTextHint, .selectItemLiteTextHintRTL, .selectItemLiteTextDisabledHint, .selectItemLiteTextDisabledHintRTL {
    display: flex;
    align-items: center;
}

.cornerHeaderTitle {
    border-top-width: 2px;
    /*    border-top-color: hsl(240 5.9% 70%);*/
    border-top-style: solid;
    border-image-source: linear-gradient(to right, #798596 30%, #FFF 50%);
    border-image-slice: 1;
}

.roundTopLeft {
    border-top-left-radius: 8px !important;
}

.roundTopRight {
    border-top-right-radius: 8px !important;
}

.roundBottomRight {
    border-bottom-right-radius: 8px !important;
}

.roundBottomLeft {
    border-bottom-left-radius: 8px !important;
}

.hardBottomLeft {
    border-bottom-left-radius: 0px !important;
}

.hardBottomRight {
    border-bottom-right-radius: 0px !important;
}

.rteCanvas {
    box-shadow: 0px 4px 3px -4px #000;
    border-radius: 0px;
}

.rteCanvas.noBottomShadow {
    box-shadow: none;
}

.rteCanvas.nonEditable {
    border-radius: 8px !important;
}
.rteCanvas.nonEditable .richtext-bg-background {
    background-color: white;
}

/* tiptap */

.tiptapCanvas {
    overflow: auto !important;
    scrollbar-width: thin;
}

.tiptapCanvas .simple-editor-content {
    margin-top: -12px;
}

/* reactjs-tiptap */

.tiptapReactjsCanvas {
    scrollbar-width: thin;
}

.reactjs-tiptap-editor-toolbar {
    background-color: white;
}

.richtext-bg-background {
    background-color: #f3f8fb;
}

.tippy-content .richtext-bg-background {
    background-color: white;
}

/* toolbar */
div.reactjs-tiptap-editor-toolbar {
    border-top-width: 1px !important;
}

div.reactjs-tiptap-editor-toolbar-hidden {
    height: unset !important;
    width: unset !important;
    top: unset !important;
    z-index: unset !important;
    position: unset !important;
}

.rteCanvas.withCornerTitle div.reactjs-tiptap-editor-toolbar-hidden {
    height: 26px !important;
    pointer-events: none !important;
}

div[data-tippy-root] {
    z-index: 3200020 !important;
}

/* parent of toolbar and relative container */
div.reactjs-tiptap-editor div:has(> div.reactjs-tiptap-editor-toolbar) {
}

/* parent of the contenteditable */
div.reactjs-tiptap-editor div:has(> div.tiptap.ProseMirror) {
    flex: 1;
}

.tiptapReactjsCanvas.withOverflowAuto > div,
.tiptapReactjsCanvas.withOverflowAuto div.reactjs-tiptap-editor,
.tiptapReactjsCanvas.withOverflowAuto div.reactjs-tiptap-editor > div {
    height: 100%;
    max-height: 100%;
}
.tiptapReactjsCanvas.withOverflowAuto div.reactjs-tiptap-editor div.richtext-max-h-full {
    height: 100%;
}
.tiptapReactjsCanvas.withOverflowAuto div.reactjs-tiptap-editor div:has(> div.tiptap.ProseMirror) {
    overflow: auto !important;
    max-height: 100%;
}

/* the actual contenteditable div */
div.reactjs-tiptap-editor div.tiptap.ProseMirror {
}

div.reactjs-tiptap-editor .richtext-outline {
    border-radius: 0px !important;
}

div.reactjs-tiptap-editor div.tiptap.ProseMirror {
    min-height: 50px !important;
}

.force22PxHeight {
    height: 22px;
}

.noRightRadius {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.noFlex {
    display:revert;
}

table[role="presentation"] > tbody > tr {
    height: 100%;
}

.buttonRounded:not(.splitButton),
.buttonRoundedOver:not(.splitButton),
.buttonRoundedFocused:not(.splitButton),
.buttonRoundedFocusedOver:not(.splitButton),
.buttonRoundedDown:not(.splitButton),
.buttonRoundedFocusedDown:not(.splitButton),
.buttonRoundedSelected:not(.splitButton),
.buttonRoundedSelectedFocused:not(.splitButton),
.buttonRoundedSelectedDown:not(.splitButton),
.buttonRoundedSelectedFocusedDown:not(.splitButton),
.buttonRoundedSelectedOver:not(.splitButton),
.buttonRoundedSelectedFocusedOver:not(.splitButton),
.buttonRoundedDisabled:not(.splitButton),
.buttonRoundedSelectedDisabled:not(.splitButton),
.buttonRoundedPending:not(.splitButton),
.buttonRoundedPendingOver:not(.splitButton),
.buttonRoundedPendingFocused:not(.splitButton),
.buttonRoundedPendingFocusedOver:not(.splitButton),
.buttonRoundedPendingDown:not(.splitButton),
.buttonRoundedPendingFocusedDown:not(.splitButton),
.buttonRoundedPendingSelected:not(.splitButton),
.buttonRoundedPendingSelectedFocused:not(.splitButton),
.buttonRoundedPendingSelectedDown:not(.splitButton),
.buttonRoundedPendingSelectedFocusedDown:not(.splitButton),
.buttonRoundedPendingSelectedOver:not(.splitButton),
.buttonRoundedPendingSelectedFocusedOver:not(.splitButton),
.buttonRoundedPendingDisabled:not(.splitButton),
.buttonRoundedPendingSelectedDisabled:not(.splitButton),
.buttonRoundedDeselectedDisabled:not(.splitButton) {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.buttonRounded > div, .buttonRoundedOver > div, .buttonRoundedFocused > div, .buttonRoundedFocusedOver > div, .buttonRoundedDown > div, .buttonRoundedFocusedDown > div, .buttonRoundedSelected > div, .buttonRoundedSelectedFocused > div, .buttonRoundedSelectedDown > div, .buttonRoundedSelectedFocusedDown > div, .buttonRoundedSelectedOver > div, .buttonRoundedSelectedFocusedOver > div, .buttonRoundedDisabled > div, .buttonRoundedSelectedDisabled > div, .buttonRoundedPending > div, .buttonRoundedPendingOver > div, .buttonRoundedPendingFocused > div, .buttonRoundedPendingFocusedOver > div, .buttonRoundedPendingDown > div, .buttonRoundedPendingFocusedDown > div, .buttonRoundedPendingSelected > div, .buttonRoundedPendingSelectedFocused > div, .buttonRoundedPendingSelectedDown > div, .buttonRoundedPendingSelectedFocusedDown > div, .buttonRoundedPendingSelectedOver > div, .buttonRoundedPendingSelectedFocusedOver > div, .buttonRoundedPendingDisabled > div, .buttonRoundedPendingSelectedDisabled > div, .buttonRoundedDeselectedDisabled {
    position: unset !important;
}

/*
-- breaks buttons with icon only

tr td.buttonRounded:first-of-type:has(img),
tr td.buttonRoundedOver:first-of-type:has(img),
tr td.buttonRoundedFocused:first-of-type:has(img),
tr td.buttonRoundedFocusedOver:first-of-type:has(img),
tr td.buttonRoundedDown:first-of-type:has(img),
tr td.buttonRoundedFocusedDown:first-of-type:has(img),
tr td.buttonRoundedSelected:first-of-type:has(img),
tr td.buttonRoundedSelectedFocused:first-of-type:has(img),
tr td.buttonRoundedSelectedDown:first-of-type:has(img),
tr td.buttonRoundedSelectedFocusedDown:first-of-type:has(img),
tr td.buttonRoundedSelectedOver:first-of-type:has(img),
tr td.buttonRoundedSelectedFocusedOver:first-of-type:has(img),
tr td.buttonRoundedDisabled:first-of-type:has(img),
tr td.buttonRoundedSelectedDisabled:first-of-type:has(img),
tr td.buttonRoundedPending:first-of-type:has(img),
tr td.buttonRoundedPendingOver:first-of-type:has(img),
tr td.buttonRoundedPendingFocused:first-of-type:has(img),
tr td.buttonRoundedPendingFocusedOver:first-of-type:has(img),
tr td.buttonRoundedPendingDown:first-of-type:has(img),
tr td.buttonRoundedPendingFocusedDown:first-of-type:has(img),
tr td.buttonRoundedPendingSelected:first-of-type:has(img),
tr td.buttonRoundedPendingSelectedFocused:first-of-type:has(img),
tr td.buttonRoundedPendingSelectedDown:first-of-type:has(img),
tr td.buttonRoundedPendingSelectedFocusedDown:first-of-type:has(img),
tr td.buttonRoundedPendingSelectedOver:first-of-type:has(img),
tr td.buttonRoundedPendingSelectedFocusedOver:first-of-type:has(img),
tr td.buttonRoundedPendingDisabled:first-of-type:has(img),
tr td.buttonRoundedPendingSelectedDisabled:first-of-type:has(img),
tr td.buttonRoundedDeselectedDisabled:first-of-type:has(img) {
    display: table-cell;
}
*/

/* focused state */
.textItemLiteFocused,
.textItemLiteFocusedRTL,
.textItemLitePendingFocused,
.textItemLitePendingFocusedRTL,
.selectItemLiteControlFocused,
.selectItemLiteControlFocusedRTL,
.selectItemLiteControlFocusedOver,
.selectItemLiteControlFocusedOverRTL,
.selectItemLiteControlErrorFocused,
.selectItemLiteControlErrorFocusedRTL,
.selectItemLiteControlErrorFocusedOver,
.selectItemLiteControlErrorFocusedOverRTL,
.selectItemLiteControlPendingFocused,
.selectItemLiteControlPendingFocusedRTL,
.selectItemLiteControlPendingFocusedOver,
.selectItemLiteControlPendingFocusedOverRTL,
.textAreaItemLiteFocused,
.textAreaItemLiteFocusedRTL,
.textAreaItemLitePendingFocused,
.textAreaItemLitePendingFocusedRTL,
.titleItem.focused {
    outline: none;
    border-color: #66afe9;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px rgba(102, 175, 233, 0.6);
}

/* over state */
.selectItemLiteControlOver,
.selectItemLiteControlOverRTL,
.selectItemLiteControlFocusedOver,
.selectItemLiteControlFocusedOverRTL,
.selectItemLiteControlErrorOver,
.selectItemLiteControlErrorOverRTL,
.selectItemLiteControlErrorFocusedOver,
.selectItemLiteControlErrorFocusedOverRTL,
.selectItemLiteControlPendingOver,
.selectItemLiteControlPendingOverRTL,
.selectItemLiteControlPendingFocusedOver,
.selectItemLiteControlPendingFocusedOverRTL {
    border-color: #ace;
}

.halfOpacity {
    opacity: 0.5;
}

.assetPickerText {
    line-height: 1.7;
}

.formItemIcon, .formItemIconOver {
    opacity: 0.8;
}

.textItemLiteDisabled, .textItemLiteDisabledRTL, .textItemLitePendingDisabled, .textItemLitePendingDisabledRTL, .textItemLiteDisabledHint, .textItemLiteDisabledHintRTL, .selectItemLiteTextDisabled, .selectItemLiteTextDisabledRTL, .selectItemLiteTextPendingDisabled, .selectItemLiteTextPendingDisabledRTL, .selectItemLiteTextDisabledHint, .selectItemLiteTextDisabledHintRTL, .textAreaItemLiteDisabled, .textAreaItemLiteDisabledRTL, .textAreaItemLitePendingDisabled, .textAreaItemLitePendingDisabledRTL, .textAreaItemLiteDisabledHint, .textAreaItemLiteDisabledHintRTL {
    color: #ababab;
}

.textItemLiteHint, .textItemLiteHintRTL, .selectItemLiteTextHint, .selectItemLiteTextHintRTL, .textAreaItemLiteHint, .textAreaItemLiteHintRTL {
    color: rgb(85, 85, 85, 0.85);
}

.aiFormCellHint {
}

.aiFormCellHint label {
    color: red;
}

/*
.aiFormCellHint .selectItemText, .aiFormCellHint .textItemLite, .aiFormCellHint .textItemLiteRTL, .aiFormCellHint .textItemLiteFocused, .aiFormCellHint .textItemLiteFocusedRTL, .aiFormCellHint .textItemLiteDisabled, .aiFormCellHint .textItemLiteDisabledRTL, .aiFormCellHint .textItemLiteError, .aiFormCellHint .textItemLiteErrorRTL, .aiFormCellHint .textItemLitePending, .aiFormCellHint .textItemLitePendingRTL, .aiFormCellHint .textItemLitePendingFocused, .aiFormCellHint .textItemLitePendingFocusedRTL, .aiFormCellHint .textItemLitePendingDisabled, .aiFormCellHint .textItemLitePendingDisabledRTL, .aiFormCellHint .textItemLitePendingError, .aiFormCellHint .textItemLitePendingErrorRTL, .aiFormCellHint .textItemLiteHint, .aiFormCellHint .textItemLiteHintRTL, .aiFormCellHint .textItemLiteDisabledHint, .aiFormCellHint .textItemLiteDisabledHintRTL, .aiFormCellHint .selectItemLiteControl, .aiFormCellHint .selectItemLiteControlRTL, .aiFormCellHint .selectItemLiteControlFocused, .aiFormCellHint .selectItemLiteControlFocusedRTL, .aiFormCellHint .selectItemLiteControlOver, .aiFormCellHint .selectItemLiteControlOverRTL, .aiFormCellHint .selectItemLiteControlFocusedOver, .aiFormCellHint .selectItemLiteControlFocusedOverRTL, .aiFormCellHint .selectItemLiteControlDisabled, .aiFormCellHint .selectItemLiteControlDisabledRTL, .aiFormCellHint .selectItemLiteControlError, .aiFormCellHint .selectItemLiteControlErrorRTL, .aiFormCellHint .selectItemLiteControlErrorOver, .aiFormCellHint .selectItemLiteControlErrorOverRTL, .aiFormCellHint .selectItemLiteControlErrorFocused, .aiFormCellHint .selectItemLiteControlErrorFocusedRTL, .aiFormCellHint .selectItemLiteControlErrorFocusedOver, .aiFormCellHint .selectItemLiteControlErrorFocusedOverRTL, .aiFormCellHint .selectItemLiteControlPending, .aiFormCellHint .selectItemLiteControlPendingRTL, .aiFormCellHint .selectItemLiteControlPendingFocused, .aiFormCellHint .selectItemLiteControlPendingFocusedRTL, .aiFormCellHint .selectItemLiteControlPendingOver, .aiFormCellHint .selectItemLiteControlPendingOverRTL, .aiFormCellHint .selectItemLiteControlPendingFocusedOver, .aiFormCellHint .selectItemLiteControlPendingFocusedOverRTL, .aiFormCellHint .selectItemLiteControlPendingDisabled, .aiFormCellHint .selectItemLiteControlPendingDisabledRTL, .aiFormCellHint .selectItemLiteControlPendingError, .aiFormCellHint .selectItemLiteControlPendingErrorRTL, .aiFormCellHint .selectItemLiteControlHint, .aiFormCellHint .selectItemLiteControlHintRTL, .aiFormCellHint .selectItemLiteControlDisabledHint, .aiFormCellHint .selectItemLiteControlDisabledHintRTL, .aiFormCellHint .spinnerItemLiteControl, .aiFormCellHint .spinnerItemLiteControlRTL, .aiFormCellHint .spinnerItemLiteControlFocused, .aiFormCellHint .spinnerItemLiteControlFocusedRTL, .aiFormCellHint .spinnerItemLiteControlOver, .aiFormCellHint .spinnerItemLiteControlOverRTL, .aiFormCellHint .spinnerItemLiteControlFocusedOver, .aiFormCellHint .spinnerItemLiteControlFocusedOverRTL, .aiFormCellHint .spinnerItemLiteControlDisabled, .aiFormCellHint .spinnerItemLiteControlDisabledRTL, .aiFormCellHint .spinnerItemLiteControlError, .aiFormCellHint .spinnerItemLiteControlErrorRTL, .aiFormCellHint .spinnerItemLiteControlPending, .aiFormCellHint .spinnerItemLiteControlPendingRTL, .aiFormCellHint .spinnerItemLiteControlPendingFocused, .aiFormCellHint .spinnerItemLiteControlPendingFocusedRTL, .aiFormCellHint .spinnerItemLiteControlPendingOver, .aiFormCellHint .spinnerItemLiteControlPendingOverRTL, .aiFormCellHint .spinnerItemLiteControlPendingFocusedOver, .aiFormCellHint .spinnerItemLiteControlPendingFocusedOverRTL, .aiFormCellHint .spinnerItemLiteControlPendingDisabled, .aiFormCellHint .spinnerItemLiteControlPendingDisabledRTL, .aiFormCellHint .spinnerItemLiteControlPendingError, .aiFormCellHint .spinnerItemLiteControlPendingErrorRTL, .aiFormCellHint .spinnerItemLiteControlHint, .aiFormCellHint .spinnerItemLiteControlHintRTL, .aiFormCellHint .spinnerItemLiteControlDisabledHint, .aiFormCellHint .spinnerItemLiteControlDisabledHintRTL,
 .aiFormCellHint .textItem, .aiFormCellHint .textItemRTL, .aiFormCellHint .textItemPending, .aiFormCellHint .textItemPendingRTL, .aiFormCellHint .textItemHint, .aiFormCellHint .textItemHintRTL, .aiFormCellHint .pickerSearchBox, .aiFormCellHint .pickerSearchBoxRTL, .aiFormCellHint .pickerSearchBoxPending, .aiFormCellHint .pickerSearchBoxPendingRTL, .aiFormCellHint .pickerSearchBoxHint, .aiFormCellHint .pickerSearchBoxHintRTL {
    border: 1px solid red;
}
.aiFormCellHint .textAreaItemLite, .aiFormCellHint .textAreaItemLiteRTL, .aiFormCellHint .textAreaItemLiteFocused, .aiFormCellHint .textAreaItemLiteFocusedRTL, .aiFormCellHint .textAreaItemLiteDisabled, .aiFormCellHint .textAreaItemLiteDisabledRTL, .aiFormCellHint .textAreaItemLiteError, .aiFormCellHint .textAreaItemLiteErrorRTL, .aiFormCellHint .textAreaItemLitePending, .aiFormCellHint .textAreaItemLitePendingRTL, .aiFormCellHint .textAreaItemLitePendingFocused, .aiFormCellHint .textAreaItemLitePendingFocusedRTL, .aiFormCellHint .textAreaItemLitePendingDisabled, .aiFormCellHint .textAreaItemLitePendingDisabledRTL, .aiFormCellHint .textAreaItemLitePendingError, .aiFormCellHint .textAreaItemLitePendingErrorRTL, .aiFormCellHint .textAreaItemLiteHint, .aiFormCellHint .textAreaItemLiteHintRTL, .aiFormCellHint .textAreaItemLiteDisabledHint, .aiFormCellHint .textAreaItemLiteDisabledHintRTL,
  .aiFormCellHint .tinyMCESmartgwtCanvas {
    border: 1px solid red;
}
*/

/* print styles */

#printElement input,
#printElement input[readonly='readonly'],
#printElement input[disabled='disabled'],
#printElement [disabled],
#printElement .formTitleDisabled,
#printElement .formCellDisabled,
#printElement .headerItemDisabled,
#printElement .staticTextItemDisabled,
#printElement .textItemDisabled,
#printElement .selectItemDisabled,
#printElement .selectItemTextDisabled,
#printElement .pickListCellDisabled,
#printElement .tallPickListCellDisabled,
#printElement .labelAnchorDisabled,
#printElement .cellDisabled,
#printElement .cellDisabledDark,
#printElement .tallCellDisabled,
#printElement .tallCellDisabledDark
{
    color: #000;
    border-color: #000;
    -webkit-text-fill-color:#000;
}

#printElement .printHeader img, #printElement .printHeader span.sortNumeral {
    display: none;
}


/* nicer disabled style for listgrid cell */
.pickListCellDisabled, .tallPickListCellDisabled, .pickListCellDisabledDark, .tallPickListCellDisabledDark {
    /* background-color: #bfbfbf; */
    background-color: white;
    color: #aaa;
}

.notVisible {
    display:none;
}

.textCenter {
    text-align: center;
}

.toolStripButton,
.toolStripButtonOver,
.toolStripButtonFocused,
.toolStripButtonFocusedOver,
.toolStripButtonDown,
.toolStripButtonFocusedDown,
.toolStripButtonSelected,
.toolStripButtonSelectedFocused,
.toolStripButtonSelectedDown,
.toolStripButtonSelectedFocusedDown,
.toolStripButtonSelectedOver,
.toolStripButtonSelectedFocusedOver,
.toolStripButtonDisabled,
.toolStripButtonSelectedDisabled,
.toolStripButtonOpened,
.toolStripButtonOverOpened,
.toolStripButtonDownOpened,
.toolStripButtonFocusedOpened,
.toolStripButtonFocusedDownOpened,
.toolStripButtonFocusedOverOpened,
.toolStripButtonSelectedOpened,
.toolStripButtonSelectedDownOpened,
.toolStripButtonSelectedOverOpened {
    border-radius: 3px !important;
}

.milestonePickerButton {
    text-align: center;
    width: 100% !important;
}

.milestoneSelectBottomToolStrip {
    border-top: 1px solid #A5B0C0;
}

.hidden {
    visibility:hidden;
}

/* T E X T L I K E T H I S */
.verttext {
    width:1em;
    text-transform:uppercase;
}

.helpPane {
    background-color: #f4f4f4;
    border: 1px solid #bbb;
}

/* jqplot */
.jqplot-data-label {
    color: #000;
}

.jqplot-highlighter-tooltip {
    padding: 5px;
    z-index: 1000000;
}

table.jqplot-table-legend {
    padding: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0 6px 6px -6px black;
    -moz-box-shadow: 0 6px 6px -6px black;
    box-shadow: 0 6px 6px -6px black;
}

.titleStrip, .bottomBordered {
    border-bottom: 1px solid #abb9ab;
}

.borderedFont {
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}

.timelineDate, .fancyTitle, .setupWizardPhaseTitle {
    background: linear-gradient(#565656, #000);
    color: #565656;
    text-shadow: 0px 0px 1px rgba(255,255,255,0.5);
    background-clip: content-box;
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    font-size: 14px;
    font-weight: 700;
    display: flex;
    align-items: center;
}

.fancyTitle.white {
    color: white;
    -webkit-text-fill-color: white;
}

.timelineDate {
    border-bottom: 1px solid #abb9ab;
    padding: 8px;
}

/* timeline load more style */
.timelineLoadMore {
    font-style: italic;
    color: #777;
    font-size: 12px;
}

/* remove row borders from timeline list grid */
.timelineGrid .tallCell {
    border-top: none;
    border-bottom: none;
}

.noChartDataOverlay {}

.graphNoDataStyle {
    color:#ddd;
    font-size: 14px;
}

.lightGrayRoundPanel .noChartDataOverlay {
    background: transparent !important;
}
.lightGrayRoundPanel .chartJsSmartgwtCanvas.noData canvas {
    display: none !important;
}
.lightGrayRoundPanel .graphNoDataStyle {
    color: #aaa;
}

.notificationNoDataStyle {
    color:#444;
    font-size: 14px;
}

.notificationNoDataStyleOver {
    color:#444;
    font-size: 14px;
    text-decoration: underline;
}

.notificationShowMore {
    font-style: italic;
    color: #777;
    font-size: 11px;
}

.notificationShowMore:hover {
    font-style: italic;
    color: #777;
    font-size: 11px;
    text-decoration: underline;
}

/* OUR WYSIWYG STYLES */

.heading1 {
    font-size: 24px;
    font-weight: 700;
}

.heading2 {
    font-size: 20px;
    font-weight: 700;
}

.heading3 {
    font-size: 16px;
    font-weight: 700;
}

.heading4 {
    font-size: 14px;
    font-weight: 700;
}

.bodytext, ol li, ul li, p {
    font-size: 11px;
    font-weight: 400;
}

b, strong {
    font-weight: 700;
}

/* our help styles to include in infolayers (see help.css) */
div .infolayer {
    padding: 16px;
}

.infolayer p, .infolayer li {
    font-size: 13px;
}
.infolayer h1, .infolayer h2, .infolayer h3 {
}
.infolayer h1 {
    font-size: 26px;
}
.infolayer h2 {
    font-size: 22px;
}
.infolayer h3 {
    font-size: 18px;
}
.infolayer ul {
    list-style-type: square;
}

/* avatar image */
.avatarImage img, .avatarImageOver img, .avatarImageDown img {
    border-radius: 32px;
}
.avatarImage img, .avatarImageOver img {
    border-top: 1px solid #cbd9cb;
    border-left: 1px solid #cbd9cb;
    border-right: 1px solid #9ba99b;
    border-bottom: 1px solid #9ba99b;
}
.avatarImageOver img {
    opacity: 0.8;
}
.avatarImageDown img {
    border-top: 1px solid #9ba99b;
    border-left: 1px solid #9ba99b;
    border-right: 1px solid #cbd9cb;
    border-bottom: 1px solid #cbd9cb;
    opacity: 0.7;
}

.loginWindowName {
    /* font: 100% Baskerville, Georgia, Times, Times New Roman, sans-serif; */
    font-size: 12px;
    font-weight: 700;
}

.loginForm {
    border-radius: 8px;
}

.forgotPasswordLink a {
    color: #666;
}

.configurePopupIcon .normal {
    font-size: 8px;
}

.configurePopupIcon .normalDisabled {
    font-size: 8px;
    color: #aaa;
}

/* add comment container layouts some margin to right to avoid horiz scrollbars */
.comments {
    margin-right: 4px;
}

.commentText {
    white-space: normal;
    overflow-wrap: break-word;
}

/* needed for correct height of treepickers */
.selectItemText {
    height: 12px;
}

/* notifications pane */
.notificationsSubPaneTitle {
    color: #5D6279;
    padding: 2px;
    font-size: 13px;
    font-weight: normal;
    border-bottom: 4px solid #5D6279;
}

.dismissedNotification {
    text-decoration: line-through;
}

.notificationLabel {
    font-size: 11px;
    -ms-word-break: break-all;
    word-break: break-all;
    /* Non standard for webkit */
    word-break: break-word;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}

/* history tabled values (such as execution steps) */
.historytable {
    font-size: 11px;
    border-collapse: collapse;
}

.historytable td:empty {
    border:none;
}
.historytable td, .historytable th {
    border: 1px solid #C9D6E9;
    padding: 4px;
}
.historylist, .historylist li {
    font-size: 11px;
    list-style: square;
}

.historyTableRowNumber {
    color: black;
    font-size: 11px;
    font-weight: 700;
    text-align: center;
    border-top: 1px solid #fafafa;
    border-bottom: 1px solid #f0f0f0;
}

.listTable tr:nth-child(even) td.historyTableRowNumber {
    background-color: #fafafa;
    border-top: 1px solid #fafafa;
}

/* remove graphite toolbar bottom pixel row */
.toolStrip {
    background-image: -moz-linear-gradient(center bottom , #CFDDF2 2%, #C1CCDC 100%);
    background-image: -webkit-linear-gradient(bottom, rgb(207, 221, 242) 2%, rgb(193, 204, 220) 100%);
    background-image: -o-linear-gradient(bottom, rgb(207, 221, 242) 2%, rgb(193, 204, 220) 100%);
    background-image: -ms-linear-gradient(bottom, rgb(207, 221, 242) 2%, rgb(193, 204, 220) 100%);
    background-image: linear-gradient(bottom, rgb(207, 221, 242) 2%, rgb(193, 204, 220) 100%);
}

/* remove black/white blinking from tabs */
.tabButtonTopDown, .tabButtonTopSelectedDown, .tabButtonTopSelectedOver {
    color: white;
    font-weight: normal;
    font-size: 12px;
}

.lightText, .lightTextDisabled, .lightTextFocused {
    color: white;
    font-weight: normal;
    font-size: 11px;
}

/* hints */

.hintcontainer {
}

.hintcontainer h1 {
    margin-top: 0;
    font-weight: 400;
}

.hintcontainer h2, .hintcontainer h3 {
    margin-top: 30px;
    font-weight: 400;
}

.wf-loading .hintcontainer h1, .wf-loading .hintcontainer h2, .wf-loading .hintcontainer h3, .wf-inactive .hintcontainer h1, .wf-inactive .hintcontainer h2, .wf-inactive .hintcontainer h3 {
}

.hintcontainer p {
    font-weight: 400;
}

.wf-loading .hintcontainer p, .wf-inactive .hintcontainer p {
}

.hintcontainer li {
    font-weight: 400;
}

.wf-loading .hintcontainer li, .wf-inactive .hintcontainer li {
}

.hint {
    vertical-align: middle;
}

.hint img {
    padding-right: 8px;
    padding-bottom: 8px;
}

.hintcols {
    margin-top: 16px;
    border-spacing:0;
    border-collapse:collapse;
}

.hintcol3 {
    width: 33%;
    vertical-align: top;
}

.hintcol1 {
    width: 100%;
    vertical-align: top;
}

.hintcol2 {
    width: 50%;
    vertical-align: top;
}

.hintcol {
}

.verticalAlignedListGrid td[class^="tallCell"], .verticalAlignedListGrid td[class^="cell"] {
    vertical-align: top;
    padding-top:2px;
}

.verticalAlignTop {
    vertical-align: top;
}

.hintcolpad {
    padding-right: 30px;
}

.hintcol img {
    border: 1px solid #C8D5E7;
    padding: 4px;
    box-shadow: 0px 2px 2px #485567;
    margin-left: 8px;
    margin-bottom: 8px;
}

/* Modernized hint layout (used on the Home dashboard hint).
   Scoped under .modernHint so it doesn't affect legacy hints. */

.infolayer .modernHint {
    max-width: 980px;
    margin: 0 auto;
    color: #2b3441;
}

.infolayer .modernHint .hintHero {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 4px 4px 24px;
    border-bottom: 1px solid #e3e7f0;
    margin-bottom: 26px;
}

.infolayer .modernHint .hintEyebrow {
    display: inline-block;
    margin: 0 0 10px;
    padding: 3px 10px;
    background: #eef3ff;
    color: #4a6cb3;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    border-radius: 999px;
    line-height: 1.4;
}

.infolayer .modernHint .hintHero h1 {
    margin: 0 0 6px;
    font-size: 26px;
    font-weight: 500;
    color: #1f2733;
}

.infolayer .modernHint .hintHero p {
    margin: 0;
    font-size: 14px;
    line-height: 1.55;
    color: #4a5568;
    max-width: 760px;
    font-weight: 400;
}

.infolayer .modernHint .hintHeroIcon {
    flex: 0 0 auto;
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: linear-gradient(135deg, #eef3ff 0%, #d6e3ff 100%);
    box-shadow: 0 2px 4px rgba(72, 85, 103, 0.08);
}

.infolayer .modernHint .hintHeroIcon img {
    padding: 0;
    margin: 0;
    border: none;
    box-shadow: none;
}

.infolayer .modernHint .hintCards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

.infolayer .modernHint .hintCards.twoCards {
    grid-template-columns: repeat(2, 1fr);
}

.infolayer .modernHint .hintCard {
    background: #ffffff;
    border: 1px solid #e3e7f0;
    border-radius: 10px;
    padding: 20px 18px 18px;
    box-shadow: 0 1px 2px rgba(72, 85, 103, 0.05);
    text-align: left;
}

.infolayer .modernHint .hintCardIcon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #eef3ff;
    margin-bottom: 12px;
}

.infolayer .modernHint .hintCardIcon img {
    padding: 0;
    margin: 0;
    border: none;
    box-shadow: none;
}

.infolayer .modernHint .hintCardIcon .fa {
    font-size: 20px;
    color: #4a6cb3;
    line-height: 1;
}

.infolayer .modernHint .hintCard h3 {
    margin: 0 0 8px;
    font-size: 15px;
    font-weight: 600;
    color: #1f2733;
}

.infolayer .modernHint .hintCard p {
    margin: 0;
    font-size: 13px;
    line-height: 1.55;
    color: #4a5568;
    font-weight: 400;
}

.infolayer .modernHint .hintFootnote {
    margin: 26px 0 0;
    padding: 12px 16px;
    background: #f5f8fc;
    border-left: 3px solid #b9c8e8;
    border-radius: 4px;
    font-size: 13px;
    line-height: 1.55;
    color: #4a5568;
    text-align: left;
}

.infolayer .modernHint .hintHeadsUp {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin: 26px 0 0;
    padding: 14px 16px;
    background: #fff8e6;
    border-left: 3px solid #e6b94d;
    border-radius: 4px;
    font-size: 13px;
    line-height: 1.55;
    color: #6b5527;
    text-align: left;
}

.infolayer .modernHint .hintHeadsUp .fa {
    flex: 0 0 auto;
    font-size: 18px;
    line-height: 1.4;
    color: #d99e3a;
}

.infolayer .modernHint .hintHeadsUp strong {
    color: #4a3713;
    font-weight: 600;
}

/*
we enforce minimum viewport width in UI so no responsiveness is needed here for hints

@media (max-width: 1074px) {
    .infolayer .modernHint .hintCards {
        grid-template-columns: 1fr;
    }
    .infolayer .modernHint .hintHero {
        flex-direction: column;
        text-align: center;
    }
}
*/

/* hack to get css background image to work with smartgwt nicely without overflows visible*/
.treeRootDescriptiveMask.forLibrary::before {
    background: url(images/icons/database.png);
    content: "";
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    opacity: 0.4;
    background-repeat: no-repeat;
    background-size: 500px 500px;
    background-position: bottom -120px left -120px;
}
.treeRootDescriptiveMask.forWorkspace::before {
    background: url(images/icons/drive.png);
    content: "";
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    opacity: 0.4;
    background-repeat: no-repeat;
    background-size: 500px 500px;
    background-position: bottom -120px left -120px;
}

.treeRootDescriptiveMaskImage {
    float: right;
    border: 1px solid #a7abb4;
    padding: 4px;
    border-radius: 4px;
    margin-left: 16px;
}

.treeRootDescriptiveMaskBgImage {
    position: absolute;
    bottom: -120px !important;
    left: -120px !important;
    width: 500px !important;
    height: 500px !important;
    opacity: 0.4 !important;
    top: auto !important;
    overflow: hidden;
}

/* maintenance mode */

.maintenanceLabel {
    color: #f00;
    font-weight: 700;
    font-size: 11px;
}

/* notice board */

.noticeBoardTitle {
}

.noticeBoardTitleText {
    background: -webkit-linear-gradient(#565656, #565656);
    color: #565656;
    text-shadow: 0px 3px 4px rgba(255,255,255,0.5);
    background-clip: content-box;
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    font-size: 14px;
    font-weight: 700;
}

.noBoxShadow {
    box-shadow: none;
}

.noticeBoardNoAttTitle {
    color: #777;
    font-size: 11px;
    padding: 8px;
}

/* add announcement container layouts some margin to right to avoid horiz scrollbars */
.announcements {
    margin-right: 6px;
}

.scrollbarfix {
    margin-right: 6px !important;
}

/* vertical line style */
.vertLine {
    border-left: 1px solid #BFBFBF;
}

/* quick link subscript */

.qlsub, .qlsub li, .qlsub p {
    font-style: italic;
    font-size: 11px;
    color: #aaa;
    /*	margin-top: 4px; */
}
.qlsub h1, .qlsub h2, .qlsub h3, .qlsub h4, .qlsub h5 {
    font-style: italic;
    font-size: 11px;
    color: #aaa;
    font-weight: 700;
}

/* fix for opaque divs in ie8/compatibility mode */
.ie8opaque {
    zoom: 1;
    filter: alpha(opacity=0);
}

.emailNoticeDesc, .namedUsersInUseLabel, .testSetEstimation, .schedulePeriodHelp, .commentNotifyUsers, .hintText {
    font-style: italic;
    color: #777;
    font-size: 11px;
}

.introjs-tooltiptext, .introjs-tooltiptext ol li, .introjs-tooltiptext ul li, .introjs-tooltiptext p {
    font-weight: 400;
    font-size: 12px;
}

.introjs-tooltip > div:not(.introjs-arrow) {
    min-width: 350px;
}

/* main view label in toolbar */
.viewLabel {
    font-size: 16px;
    color: #6E7B8C;
    text-shadow: 1px 1px #E0E0E0;
}

.stepTable {
    border: 0;
    width: 100%;
}

.stepTableNum {
    text-align: center;
    border-bottom: solid 1px #CCC;
}

.stepTableDescription, .stepTableExpected, .stepTableAttachments, .stepTableCustom1, .stepTableCustom2, .stepTableCustom3, .stepTableCustom4, .stepTableCustom5, .stepTableCustom6, .stepTableCustom7, .stepTableCustom8, .stepTableCustom9, .stepTableCustom10 {
    border-bottom: solid 1px #CCC;
}

.noBorderTextArea {
    border: 0;
    background: white;
    color: black;
    padding: 4px 2px 4px 2px;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    font-size: 11px;
}

.noBorderTextAreaDisabled {
    border: 0;
    background: white;
    color: #333;
    padding: 4px 2px 4px 2px;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    font-size: 11px;
}

.borderTextArea {
    border-bottom: 1px solid #dedede;
    border-left: 1px solid #dedede;
    border-right: 1px solid #dedede;
    border-top: 1px solid #ababab;
    background: white;
    color: black;
    padding: 4px 2px 4px 2px;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    font-size: 11px;
}

.topBottomBorderGrid {
    border-top: 1px solid #afbed5;
    border-bottom: 1px solid #afbed5;
    border-left: 0;
    border-right: 0;
}

.thnail {
    width:auto;
    height:300px;
}

/* html5 dropzone */

.dropzoneText {
    border: 2px dashed white;
    border-radius: 32px;
    font-weight: 300;
    font-size: 32px;
    color: white;
}

/* search */

.searchRC {
    border-left: 1px solid #ddd !important;
    background-color: #e8e8e8;
}

.searchRCOver {
    border-left: 1px solid #ddd !important;
    background-color: #fff;
}

/* fix draft badge float:right */
.searchRC > div {
    width: 100%;
}
.searchRCOver > div {
    width: 100%;
}

/* reports */

.selectAReportStyle, .lightLargerHint {
    color:#ddd;
    font-size: 16px;
}

.largerHint, .largerHintWithLinespacing {
    color:#777;
    font-size: 16px;
}

.largerHintWithLinespacing {
    line-height: 2.0;
}

/* main button */
.mainButtonText {
    font-size: 11px;
    line-height: 0.9;
    color: #5e6b7c;
    text-shadow: 1px 1px #e0e0ff;
}

.mainButton,
.mainButtonOver,
.mainButtonFocused,
.mainButtonFocusedOver,
.mainButtonDown,
.mainButtonFocusedDown,
.mainButtonSelected,
.mainButtonSelectedFocused,
.mainButtonSelectedDown,
.mainButtonSelectedFocusedDown,
.mainButtonSelectedOver,
.mainButtonSelectedFocusedOver,
.mainButtonDisabled,
.mainButtonSelectedDisabled {
    background-color: transparent;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
    padding: 4px;
    font-size: 11px;
    line-height: 0.9;
    color: #5e6b7c;
    text-shadow: 1px 1px #e0e0ff;
}

.mainButtonDown {
    background-color: #eed48b;
    border-top: 1px solid #8a919e;
    border-bottom: 1px solid #8a919e;
}

.mainButtonOver,
.mainButtonSelectedOver,
.mainButtonFocusedOver,
.mainButtonSelectedFocusedOver {
    background-color: #f5eab8;
    border-top: 1px solid #a6abb5;
    border-bottom: 1px solid #a6abb5;
}

.mainButtonSelected,
.mainButtonSelectedFocused,
.mainButtonSelectedDown,
.mainButtonSelectedFocusedDown,
.mainButtonSelectedOver,
.mainButtonSelectedFocusedOver {
    background-color: #eed48b;
    border-top: 1px solid #8a919e;
    border-bottom: 1px solid #8a919e;
}

.mainButtonDisabled {
    color: #ababab;
}

/* about dialog */

.aboutBuild {
    font-size: 10px;
    line-height: 0.9;
    color: #5e6b7c;
    text-shadow: 1px 1px #e0e0ff;
}

/* tags */

.tagcloud {
    display: flex;
    flex-wrap: wrap;
    place-items: flex-start;
    justify-content: space-around;
}

.tags {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    vertical-align: middle;
}

.tags.nowrap {
    flex-wrap: nowrap;
}

.tags.collapse {
    flex-wrap: inherit;
}

.tags span.label {
    margin-bottom: 2px;
}
.taskBottom .tags span.label {
    margin-bottom: 0px;
}

.tags.collapse .label, .taskWrapper.compact .tags .label, .label.collapse {
    border: 2px solid white;
    border-radius: 12px;
    font-size: 0.5rem;
    padding: 0 4px;
    height: 8px !important;
    margin-right: 0;
    display: inline-flex;
    width: 0;
    margin-left: 2px;
}
.tags.collapse .label > span, .taskWrapper.compact .tags .label > span, .label.collapse > span {
    display:none;
}

.tagcloud span.label {
    margin-bottom: 8px;
}

.tagcloud span.label {
    height: inherit !important;
}

.tagcloud.cantag span.label:hover {
    text-decoration: underline;
    cursor: pointer;
}

.tagcloud span.label img {
    cursor: pointer;
    margin-left: 4px;
}

.tagsDeleteable .tags .label:hover {
    border: 1px dashed red;
    opacity: 0.6;
    transition: opacity 0.3s ease-in-out;
    cursor: pointer;
}

.tag11 > span { font-size: 9pt; }
.tag12 > span { font-size: 10pt; }
.tag13 > span { font-size: 11pt; }
.tag14 > span { font-size: 12pt; }
.tag15 > span { font-size: 13pt; }
.tag16 > span { font-size: 14pt; }
.tag17 > span { font-size: 15pt; }
.tag18 > span { font-size: 16pt; }
.tag19 > span { font-size: 17pt; }

.label {
    background-color: #b5b5b5;
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0px 6px;
    text-align: center;
    vertical-align: baseline;
    white-space: nowrap;
    box-shadow: 0.7px 0px 1px #666;
    font-family: Helvetica, Verdana, Tahoma;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    /*  cursor: pointer; */
    text-decoration: none;
    height: 16px;
    text-overflow: clip;
    margin-left: 2px;
    /*  margin-right: 4px; */
}

.label[href]:hover, .label[href]:focus {
    color: #fff;
    /*  cursor: pointer; */
    text-decoration: none;
}

.label:empty {
    display: none;
}

.label.navy, .color.navy, .colordropper .navy div, .plainTask.navy:before, .backlogBody .taskCell.navy > div:before, .gridDragTracker .taskCell.navy > div:before {
    background-color: #001f3f !important;
}
.fgcolor.navy {
    color: #001f3f !important;
}
.label.blue, .color.blue, .colordropper .blue div, .plainTask.blue:before, .backlogBody .taskCell.blue > div:before, .gridDragTracker .taskCell.blue > div:before {
    background-color: #0074D9 !important;
}
.fgcolor.blue {
    color: #0074D9 !important;
}
.label.aqua, .color.aqua, .colordropper .aqua div, .plainTask.aqua:before, .backlogBody .taskCell.aqua > div:before, .gridDragTracker .taskCell.aqua > div:before {
    background-color: #7FDBFF !important;
}
.fgcolor.aqua {
    color: #7FDBFF !important;
}
.label.teal, .color.teal, .colordropper .teal div, .plainTask.teal:before, .backlogBody .taskCell.teal > div:before, .gridDragTracker .taskCell.teal > div:before {
    background-color: #39CCCC !important;
}
.fgcolor.teal {
    color: #39CCCC !important;
}
.label.olive, .color.olive, .colordropper .olive div, .plainTask.olive:before, .backlogBody .taskCell.olive > div:before, .gridDragTracker .taskCell.olive > div:before {
    background-color: #3D9970 !important;
}
.fgcolor.olive {
    color: #3D9970 !important;
}
.label.green, .color.green, .colordropper .green div, .plainTask.green:before, .backlogBody .taskCell.green > div:before, .gridDragTracker .taskCell.green > div:before {
    background-color: #2ECC40 !important;
}
.fgcolor.green {
    color: #2ECC40 !important;
}
.label.lime, .color.lime, .colordropper .lime div, .plainTask.lime:before, .backlogBody .taskCell.lime > div:before, .gridDragTracker .taskCell.lime > div:before {
    background-color: #01FF70 !important;
}
.fgcolor.lime {
    color: #01FF70 !important;
}
.label.yellow, .color.yellow, .colordropper .yellow div, .plainTask.yellow:before, .backlogBody .taskCell.yellow > div:before, .gridDragTracker .taskCell.yellow > div:before {
    background-color: #FFDC00 !important;
}
.fgcolor.yellow {
    color: #FFDC00 !important;
}
.label.orange, .color.orange, .colordropper .orange div, .plainTask.orange:before, .backlogBody .taskCell.orange > div:before, .gridDragTracker .taskCell.orange > div:before {
    background-color: #FF851B !important;
}
.fgcolor.orange {
    color: #FF851B !important;
}
.label.red, .color.red, .colordropper .red div, .plainTask.red:before, .backlogBody .taskCell.red > div:before, .gridDragTracker .taskCell.red > div:before {
    background-color: #FF4136 !important;
}
.fgcolor.red {
    color: #FF4136 !important;
}
.label.maroon, .color.maroon, .colordropper .maroon div, .plainTask.maroon:before, .backlogBody .taskCell.maroon div:before, .gridDragTracker .taskCell.maroon div:before {
    background-color: #85144b !important;
}
.fgcolor.maroon {
    color: #85144b !important;
}
.label.fuchsia, .color.fuchsia, .colordropper .fuchsia div, .plainTask.fuchsia:before, .backlogBody .taskCell.fuchsia > div:before, .gridDragTracker .taskCell.fuchsia > div:before {
    background-color: #F012BE !important;
}
.fgcolor.fuchsia {
    color: #F012BE !important;
}
.label.purple, .color.purple, .colordropper .purple div, .plainTask.purple:before, .backlogBody .taskCell.purple > div:before, .gridDragTracker .taskCell.purple > div:before {
    background-color: #B10DC9 !important;
}
.fgcolor.purple {
    color: #B10DC9 !important;
}
.label.black, .color.black, .colordropper .black div, .plainTask.black:before, .backlogBody .taskCell.black > div:before, .gridDragTracker .taskCell.black > div:before {
    background-color: #111111 !important;
}
.fgcolor.black {
    color: #111111 !important;
}
.label.gray, .color.gray, .colordropper .gray div, .plainTask.gray:before, .backlogBody .taskCell.gray > div:before, .gridDragTracker .taskCell.gray > div:before {
    background-color: #AAAAAA !important;
}
.fgcolor.gray {
    color: #AAAAAA !important;
}
.label.silver, .color.silver, .colordropper .silver div, .plainTask.silver:before, .backlogBody .taskCell.silver > div:before, .gridDragTracker .taskCell.silver > div:before {
    background-color: #DDDDDD !important;
}
.fgcolor.silver {
    color: #DDDDDD !important;
}
/* not real color in chooser */
.label.white, .color.white, .colordropper .white div, .plainTask.white:before, .backlogBody .taskCell.white > div:before, .gridDragTracker .taskCell.white > div:before {
    background-color: #FFFFFF !important;
}
.fgcolor.white {
    color: #FFFFFF !important;
}
.label.transparent, .color.transparent, .colordropper .transparent div, .plainTask.transparent:before, .backlogBody .taskCell.transparent > div:before, .gridDragTracker .taskCell.transparent > div:before {
    background-color: transparent !important;
}
.fgcolor.transparent {
    color: transparent !important;
}

.backlogBody .taskCell.navy > div:before,
.gridDragTracker .taskCell.navy > div:before,
.backlogBody .taskCell.blue > div:before,
.gridDragTracker .taskCell.blue > div:before,
.backlogBody .taskCell.aqua > div:before,
.gridDragTracker .taskCell.aqua > div:before,
.backlogBody .taskCell.teal > div:before,
.gridDragTracker .taskCell.teal > div:before,
.backlogBody .taskCell.olive > div:before,
.gridDragTracker .taskCell.olive > div:before,
.backlogBody .taskCell.green > div:before,
.gridDragTracker .taskCell.green > div:before,
.backlogBody .taskCell.lime > div:before,
.gridDragTracker .taskCell.lime > div:before,
.backlogBody .taskCell.yellow > div:before,
.gridDragTracker .taskCell.yellow > div:before,
.backlogBody .taskCell.orange > div:before,
.gridDragTracker .taskCell.orange > div:before,
.backlogBody .taskCell.red > div:before,
.gridDragTracker .taskCell.red > div:before,
.backlogBody .taskCell.maroon > div:before,
.gridDragTracker .taskCell.maroon > div:before,
.backlogBody .taskCell.fuchsia > div:before,
.gridDragTracker .taskCell.fuchsia > div:before,
.backlogBody .taskCell.purple > div:before,
.gridDragTracker .taskCell.purple > div:before,
.backlogBody .taskCell.black > div:before,
.gridDragTracker .taskCell.black > div:before,
.backlogBody .taskCell.gray > div:before,
.gridDragTracker .taskCell.gray > div:before,
.backlogBody .taskCell.silver > div:before,
.gridDragTracker .taskCell.silver > div:before {
    content: '';
    top: 0;
    bottom: 0;
    width: 5px;
    position: absolute;
}

.backlogBody .taskCell .taskWrapper, .gridDragTracker .taskCell .taskWrapper {
    padding-left: 6px;
}

.padded8FormCell {
    font-size: 11px;
    padding: 8px;
}

.noborder {
    border: 0px;
}

.colordropper form input, .colordropper form textarea, .colordropper form td.colordropperitem div {
    border: 1.4px solid gray;
    -webkit-box-shadow: 0 5px 8px -7px black;
    -moz-box-shadow: 0 5px 8px -7px black;
    box-shadow: 0 5px 8px -7px black;
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    font-family: Helvetica, Verdana, Tahoma;
    text-shadow: 0px 0px 2px #000;
    width: 80px;
    height: 80px;
    display: table-cell;
    vertical-align: middle;
    overflow-wrap: anywhere;
}

.colordropper .remove input, .colordropper .remove textarea, .colordropper form td.colordropperitem.remove div {
    background-color: #fff !important;
    border: 1.4px dashed gray;
    cursor: pointer;
    color: #000;
    text-shadow: none;
}

.colordropper.fortasks input, .colordropper.fortasks textarea, .colordropper.fortasks td.colordropperitem {
    cursor: pointer;
}
.colordropper.fortasks .nonactive input, .colordropper.fortasks .nonactive textarea, .colordropper.fortasks td.colordropperitem.nonactive div {
    background-image: linear-gradient(45deg, #fff 25%, transparent 25%),
    linear-gradient(135deg, #fff 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, #fff 75%),
    linear-gradient(135deg, transparent 75%, #fff 75%);
    background-size: 12px 12px;
    background-position: 0 0, 6px 0, 6px -6px, 0px 6px;
}

.colordropper.fortasks td.colordropperitem div {
    position: relative;
}

/* defaultFor icon indicators */
.colordropper.fortasks td.colordropperitem img {
    margin: 8px;
    position: absolute;
    right: 0;
    bottom: 0;
}

/* milestones */

.mb {
    background: radial-gradient( 5px -9px, circle, white 8%, #57AC3D 18px );
    background: -moz-radial-gradient( 5px -9px, circle, white 8%, #57AC3D 18px );
    background: -ms-radial-gradient( 5px -9px, circle, white 8%, #57AC3D 18px );
    background: -o-radial-gradient( 5px -9px, circle, white 8%, #57AC3D 18px );
    background: -webkit-radial-gradient( 5px -9px, circle, white 8%, #57AC3D 18px );
    background-color: #57AC3D;
    border-radius: 8px;
    /*box-shadow: 1px 0 2px black;*/
    color: white;
    -webkit-text-fill-color: white;
    font: bold 11px/11px Helvetica, Verdana, Tahoma;
    height: 15px;
    padding: 0 4px 0 4px;
    text-align: center;
    line-height: 1.2;
    text-shadow: none;
}

/* sprint fancy style */
.mb2 {
    background: radial-gradient( 5px -9px, circle, white 8%, #8048ab 18px );
    background: -moz-radial-gradient( 5px -9px, circle, white 8%, #8048ab 18px );
    background: -ms-radial-gradient( 5px -9px, circle, white 8%, #8048ab 18px );
    background: -o-radial-gradient( 5px -9px, circle, white 8%, #8048ab 18px );
    background: -webkit-radial-gradient( 5px -9px, circle, white 8%, #8048ab 18px );
    background-color: #8048ab;
    border-radius: 8px;
    /*box-shadow: 1px 0 2px black;*/
    color: white;
    -webkit-text-fill-color: white;
    font: bold 11px/11px Helvetica, Verdana, Tahoma;
    height: 15px;
    padding: 0 4px 0 4px;
    text-align: center;
    line-height: 1.2;
    text-shadow: none;
}

.mb.completed{
    background: radial-gradient( 5px -9px, circle, white 8%, #abc7a2 18px );
    background: -moz-radial-gradient( 5px -9px, circle, white 8%, #abc7a2 18px );
    background: -ms-radial-gradient( 5px -9px, circle, white 8%, #abc7a2 18px );
    background: -o-radial-gradient( 5px -9px, circle, white 8%, #abc7a2 18px );
    background: -webkit-radial-gradient( 5px -9px, circle, white 8%, #abc7a2 18px );
}

.mb2.completed {
    background: radial-gradient( 5px -9px, circle, white 8%, #cabada 18px );
    background: -moz-radial-gradient( 5px -9px, circle, white 8%, #cabada 18px );
    background: -ms-radial-gradient( 5px -9px, circle, white 8%, #cabada 18px );
    background: -o-radial-gradient( 5px -9px, circle, white 8%, #cabada 18px );
    background: -webkit-radial-gradient( 5px -9px, circle, white 8%, #cabada 18px );
}

.propertyTableTitle .mb, .propertyTableTitle .mb2, .propertyTableTitle .label, .propertyTableTitleSmall .mb, .propertyTableTitleSmall .mb2, .propertyTableTitleSmall .label {
    text-shadow: 0 0 white;
    vertical-align: middle;
}

.newRecordText {
    color: blue;
    font-weight: 700;
}

.milestoneText {
    color: #465769;
    font-weight: 700;
}

.milestoneTextLink {
    color: #777888;
    font-weight: 700;
}

.milestoneTextLinkOver {
    color: #777888;
    font-weight: 700;
    text-decoration: underline;
}

.parameterDescription {
    font-style: italic;
    color: #777;
}

.jqplot-data-label {
    font-size: 1.2em;
}

.publishUrl {
    font-weight: 700;
}

.noBorderPickListMenuBody {
    background-color: white;
}

/* tinymce */

/*
.mce-fullscreen {
    z-index: 10000001;
}
*/

/*:not(.mce-floatpanel) excludes floating mce menu, like table editor. Otherwise height:100% will break it*/
div.mce-tinymce:not(.mce-floatpanel) {
    width: calc(100% - 2px) !important;
    height: 100% !important;
}

div.mce-container-body:not(.mce-floatpanel) {
    width: 100% !important;
    height: 100% !important;
}

div.mce-edit-area {
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
}

.mce-txt, .mce-container, .mce-container *, .mce-widget, .mce-widget *, .mce-reset {
    font-size: 12px !important;
}

.mce-content-body {
    background-color: transparent;
    margin: -8px 4px 4px 4px;
}

.mce-tinymce {
    background-color: #cfddf2 !important;
}

.mce-menubar, .mce-toolbar {
    background-color: #cfddf2;
    background-image: url(images/ToolStrip/background.png);
    background-repeat: repeat-x;
    background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjEuMCIgeDI9IjAuNSIgeTI9IjAuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2UyZTVlOSIvPjxzdG9wIG9mZnNldD0iMiUiIHN0b3AtY29sb3I9IiNlMmU1ZTkiLz48c3RvcCBvZmZzZXQ9IjIlIiBzdG9wLWNvbG9yPSIjY2ZkZGYyIi8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjYzFjY2RjIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0idXJsKCNncmFkKSIgLz48L3N2Zz4g');
    background-size: 100%;
    background-image: -moz-linear-gradient(center bottom , #CFDDF2 2%, #C1CCDC 100%);
    background-image: -webkit-linear-gradient(bottom, rgb(207, 221, 242) 2%, rgb(193, 204, 220) 100%);
    background-image: -o-linear-gradient(bottom, rgb(207, 221, 242) 2%, rgb(193, 204, 220) 100%);
    background-image: -ms-linear-gradient(bottom, rgb(207, 221, 242) 2%, rgb(193, 204, 220) 100%);
    background-image: linear-gradient(bottom, rgb(207, 221, 242) 2%, rgb(193, 204, 220) 100%);
    padding-bottom: 1px;
}

.mce-btn {
    background-color: #cfddf2;
    background-image: url(images/ToolStrip/background.png);
    background-repeat: repeat-x;
    background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjEuMCIgeDI9IjAuNSIgeTI9IjAuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2UyZTVlOSIvPjxzdG9wIG9mZnNldD0iMiUiIHN0b3AtY29sb3I9IiNlMmU1ZTkiLz48c3RvcCBvZmZzZXQ9IjIlIiBzdG9wLWNvbG9yPSIjY2ZkZGYyIi8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjYzFjY2RjIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0idXJsKCNncmFkKSIgLz48L3N2Zz4g');
    background-size: 100%;
    background-image: -moz-linear-gradient(center bottom , #CFDDF2 2%, #C1CCDC 100%);
    background-image: -webkit-linear-gradient(bottom, rgb(207, 221, 242) 2%, rgb(193, 204, 220) 100%);
    background-image: -o-linear-gradient(bottom, rgb(207, 221, 242) 2%, rgb(193, 204, 220) 100%);
    background-image: -ms-linear-gradient(bottom, rgb(207, 221, 242) 2%, rgb(193, 204, 220) 100%);
    background-image: linear-gradient(bottom, rgb(207, 221, 242) 2%, rgb(193, 204, 220) 100%);
    border: 1px solid #a8b5c7;
    font-size: 12px !important;
}

.mce-btn button {
    padding: 2px 8px;
}

.mce-btn button, .mce-ico {
    font-size: 12px !important;
}

.mce-notification {
    opacity: 1 !important;
}

.mce-btn.mce-active, .mce-btn:hover, .mce-btn:focus {
    background-color: #afbdd2 !important:
border: 1px solid #a8b5c7 !important;
    border-color: #a8b5c7 !important;
    box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.75);
}

.mce-menubar .mce-menubtn:hover, .mce-menubar .mce-menubtn.mce-active, .mce-menubar .mce-menubtn:focus {
    background-color: #bfcde2 !important;
    border: 1px solid #a8b5c7 !important;
    filter: none;
    box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.75);
}

.mce-toolbar-grp {
    padding: 0;
}

.mce-btn-group:not(:first-child) {
    border-left: 1px solid #a8b5c7 !important;
}

.mce-tooltip {
    opacity: 1 !important;
}

.mce-splitbtn.mce-btn-small .mce-open {
    padding: 2px 3px 2px 3px;
}

.mce-splitbtn .mce-open.mce-active {
    background-color: #fff;
    outline: 1px solid #a8b5c7;
}

/* html in grids */

table.listTable td div p:first-child {
    margin-top: 0;
}

table.listTable td div p:last-child {
    margin-bottom: 0;
}

.editableCell {
    position: relative;
    cursor: pointer;
}
.editableCell:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    height: 0;
    display: block;
    border-left: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-top: 8px solid #d5e0f0;
    cursor: pointer;
}
/* hide checkbox without affecting alternating rowstyle*/
.hiddenCheckbox span {
    visibility: hidden;
}

.trialLeft {
    font-weight: 700;
    color: #DC1A24;
}

.billingTitle {
    font-weight: 700;
}
.billingAddress {
    list-style-type: none;
}
.phd {
    color: #5D6279;
    font-style: italic;
}
.statementDescriptor {
    font-family: "Courier New", Courier, monospace;
}

.middleVSplitbar {
    background-size: 40%;
    background-repeat-x: no-repeat;
    background-position-x: center;
    background-image: linear-gradient(to right, #c7c7c7 0%, #c7c7c7 20%, #e7eaef 20%, #e7eaef 40%, #dbe0e6 40%, #dbe0e6 60%, #cbd2dc 60%, #cbd2dc 80%, #b5b5b5 80%, #b5b5b5 100%);
}

.middleVSplitbarImage {
    background: radial-gradient(circle, white, rgba(0, 0, 0, 0));
}

.indexSharedWithLabel {
    border-top: 1px solid #A5B0C0;
}

.paramLimitText {
    font-size: 10px;
    font-style: italic;
}

.projectLogoImage {
}

.projectLogoImage img {
    max-height: 120px;
    border-radius: 6px;
    -webkit-box-shadow: 0 8px 6px -6px black;
    -moz-box-shadow: 0 8px 6px -6px black;
    box-shadow: 0 8px 6px -6px black;
}

.projectLogoImageNoLogo img {
    max-height: 120px;
}

.projectLogoImageMainButtons img {
    border-radius: 6px;
    -webkit-box-shadow: 0 8px 6px -6px black;
    -moz-box-shadow: 0 8px 6px -6px black;
    box-shadow: 0 8px 6px -6px black;
}

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

a.formItemLink:hover, a.formItemLink:active {
    text-decoration:underline;
}

span.formItemLink.finished {
    text-decoration: line-through;
    color: #666;
}

.leftPaddedTopOrientedTitle {
    width: 127px !important;
}

.rn {
    background: radial-gradient( 5px -9px, circle, white 8%, #EE0000 18px );
    background: -moz-radial-gradient( 5px -9px, circle, white 8%, #EE0000 18px );
    background: -ms-radial-gradient( 5px -9px, circle, white 8%, #EE0000 18px );
    background: -o-radial-gradient( 5px -9px, circle, white 8%, #EE0000 18px );
    background: -webkit-radial-gradient( 5px -9px, circle, white 8%, #EE0000 18px );
    background-color: #EE0000;
    border-radius: 8px;
    box-shadow: 1px 0 2px #660000;
    color: white;
    font: bold 11px/11px Helvetica, Verdana, Tahoma;
    height: 15px;
    min-width: 14px;
    padding: 0 4px 0 4px;
    text-align: center;
    line-height: 1.4;
}

@keyframes rnblink {
    from { border-radius: 1px; }
    to { border-radius: 8px; }
}

.rna {
    animation-name: rnblink;
    animation-duration: 1s;
}

.unmapped-result-color {
    color: #f190b5;
}

.reportStatus {
    font-size: 13px;
    font-weight: 700;
    color: #777;
}

.reportStatusToggleBar {
    border-top: 1px solid #A5B0C0;
}

.bottomShadowBorder {
    -webkit-box-shadow: 0 6px 6px -6px black;
    -moz-box-shadow: 0 6px 6px -6px black;
    box-shadow: 0 6px 6px -6px black;
}

.lightGrayRoundPanel, .lightGrayPanel {
    background-color: #EFF3FB;
    background-image: linear-gradient(315deg, #EFF3FB 0%, #D5DBE4 74%);
}

.lightGrayRoundPanel {
    border-radius: 6px;
}

.lightGrayRoundPanel.secondary {
    background-image: linear-gradient(315deg, #fff 0%, #efefef 74%);
}

.bottomShadowBorder.secondary {
    -webkit-box-shadow: 0 4px 6px -6px black;
    -moz-box-shadow: 0 4px 6px -6px black;
    box-shadow: 0 4px 6px -6px black;
}

.propertyTableTitle.secondary {
    color: #747474 !important;
}

.roundPanelBottomSnapper {
    background-color: #EFF3FB;
    background-image: linear-gradient(315deg, #EFF3FB 0%, #D5DBE4 74%);
    border-top: 1px solid #aaa;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}

.roundPanelBottomSnapper.warn {
    background-color: #FFF3FB;
    background-image: linear-gradient(315deg, #FFF3FB 0%, #E5DBE4 74%);
}

.lightGrayRoundPanelBRSNap {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    border-right-style: none !important;
    border-bottom-style: none !important;
}

.topLightBorder {
    border-top: 1px solid #ababab;
}

.lightGrayRoundHorizSep {
    height: 1px;
    background-color: #a5aBc4;
    background-image: radial-gradient(#a5aBc4 60%, #D5DBE4 80%);
}

.controlsForm {
    background-color: #EFF3FB;
    background-image: linear-gradient(315deg, rgba(239,243,251,1) 0%, rgba(254,254,255,1) 100%);
    border-radius: 2px;
    box-shadow: 0 6px 4px -7px black;
}

/* center form in controls form */
.controlsForm form:first-child > table {
    margin: auto;
}

.outsetBordered {
    border: 1px solid #ababab;
}

.bottomRoundBordered {
    border-left: 1px  solid #ababab;
    border-right: 1px  solid #ababab;
    border-bottom: 1px  solid #ababab;
    border-radius: 0px 0px 6px 6px;
}

.propertyTableTitle {
    background: -webkit-linear-gradient(#565656, #565656);
    color: #565656;
    text-shadow: 0px 3px 4px rgba(255,255,255,0.5);
    background-clip: content-box;
    /*    -webkit-text-fill-color: transparent; */
    -webkit-background-clip: text;
    -moz-background-clip: text;
    font-size: 20px;
    font-weight: 700;
}
.propertyTableTitleSmall {
    background: -webkit-linear-gradient(#565656, #565656);
    color: #565656;
    text-shadow: 0px 3px 4px rgba(255,255,255,0.5);
    background-clip: content-box;
    /*    -webkit-text-fill-color: transparent; */
    -webkit-background-clip: text;
    -moz-background-clip: text;
    font-size: 16px;
    font-weight: 700;
}
.propertyTableTopBorder {
    border-top: 1px solid #aaa;
}
.propertyTableBottomBorder {
    border-bottom: 1px solid #aaa;
}
.propertyTableTitleCell {
    font-weight: 700;
}
.propertyTableValueCell {
}
.propertyTableTitleRow, .propertyTableTitleRowOver {
    font-weight: 700;
}
.propertyTableHighlight {
    background: antiquewhite;
}

.propertyTableHighlight.diff {
    background: #b8067229;
}

.monospace {
    font-size: 10px;
    font-family: monospace;
    color: black;
    text-overflow: ellipsis;
}
.monospaceCell,
.monospaceCellAltCol,
.monospaceCellDark,
.monospaceCellDarkAltCol,
.monospaceCellOver,
.monospaceCellOverAltCol,
.monospaceCellOverDark,
.monospaceCellOverDarkAltCol,
.monospaceCellSelected,
.monospaceCellSelectedAltCol,
.monospaceCellSelectedDark,
.monospaceCellSelecDarkAltCol,
.monospaceCellSelectedOver,
.monospaceCellSelectedOverAltCol,
.monospaceCellSelectedOverDark,
.monospaceCellSelectedOverDarkAltCol,
.monospaceCellDisabled,
.monospaceCellDisabledDark {
    font-size: 10px;
    font-family: monospace;
    border-top: 1px solid #fafafa;
    border-bottom: 1px solid #f0f0f0;
    color: black;
    text-overflow: ellipsis;
}
.monospaceCellOver,
.monospaceCellOverAltCol,
.monospaceCellOverDark,
.monospaceCellOverDarkAltCol {
    border-top: 1px solid #e8e8e8;
    background-color: #ededed;
}
.monospaceCellSelected,
.monospaceCellSelectedAltCol,
.monospaceCellSelectedDark,
.monospaceCellSelectedDarkAltCol {
    background: #fff5d6;
    border-bottom: 1px dotted #e9e19f;
    border-top: 1px dotted #e9e19f;
    color: black;
}
.monospaceCellSelectedOver,
.monospaceCellSelectedOverAltCol,
.monospaceCellSelectedOverDark,
.monospaceCellSelectedOverDarkAltCol {
    background-color: #f6eed0;
    border-bottom: 1px dotted #e9e19f;
    border-top: 1px dotted #e9e19f;
}
.monospaceCellDisabled,
.monospaceCellDisabledDark {
    background-color: white;
    border-top: 1px solid #fafafa;
    border-bottom: 1px solid #f0f0f0;
    color: #ababab;
}

.sprintDetailsChartContainer {
}

.statsHint, .automationStatsHint {
    font-style: italic;
    color: #777;
    font-size: 11px;
}

.automationStatsHint {
    border-top: 1px solid #A5B0C0;
    text-align: justify;
}

.avatar {
    border-radius: 16px;
    opacity: 1 !important;
    display: inherit !important;
    overflow: hidden !important;
}

.avatarInline {
    border-radius: 16px;
    overflow: hidden !important;
}

.avatarInitials {
    background-color: #ccc;
    border-radius: 50%;
    height: 24px;
    width: 24px;
    text-align: center;
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
}

.avatarInitials span {
    font-size: calc(24px / 2);
    top: calc(24px / 4);
    line-height: 1;
    position: relative;
}

.avatarInitials.large {
    height: 48px;
    width: 48px;
}
.avatarInitials.large span {
    font-size: calc(48px / 2);
    top: calc(48px / 4);
}

.avatarInitials.runBy {
    display: inherit !important;
    height: 22px;
    width: 22px;
}
.avatarInitials.runBy span {
    font-size: calc(22px / 2);
    top: calc(20px / 4);
}

.avatarInline.tree, .avatarInitials.tree {
    width: 22px !important;
    height: 22px !important;
}
.avatarInitials.tree span {
    font-size: calc(22px / 2) !important;
    top: calc(22px / 4) !important;
}

.avatarInline.linkedAsset, .avatarInitials.linkedAsset {
    width: 14px !important;
    height: 14px !important;
}
.avatarInitials.linkedAsset span {
    font-size: calc(14px / 2) !important;
    top: -1px !important;
}

.noBorderWindowBody {}

/* task board */

.boardEditHelp {
    background: white;
    border: 1px solid black;
    border-radius: 6px;
    margin: 4px;
    font-size: 14px;
}

.tasksButton {
    border-radius: 16px;
}

/* grayish gradient */
.tasksGradient {
    background-image: linear-gradient(to left top, #d3deee, #d6e3f1, #d9e8f3, #ddecf6, #e2f1f8, #e7f3fa, #ebf6fc, #f0f8fe, #f5f9ff, #f9fbff, #fdfdff, #ffffff);
}

/* magenta gradient */
.sprintGradient {
    background-image: linear-gradient(to left top, #d3deee, #d4def2, #d7ddf5, #dbdcf8, #e1e0fa, #e5e2fb, #eae4fc, #eee8fd, #f1f0fe, #f5f4ff, #fafaff, #ffffff);
}

.nonSprintTask {
    background-image: linear-gradient(315deg, rgb(231, 239, 249) 0%, rgb(255, 255, 255) 39%);
}

.sprintTask {
    background-image: linear-gradient(315deg, rgb(231, 209, 249) 0%, rgb(255, 255, 255) 39%);
}

.plainTask {
    background-color: white;
    border: 1.4px solid gray;
    border-radius: 5px;
    -webkit-box-shadow: 0 8px 6px -6px black;
    -moz-box-shadow: 0 8px 6px -6px black;
    box-shadow: 0 8px 6px -6px black;
}

.plainTask.edit .formTitle, .plainTask.edit .formTitleFocused, .plainTask.edit .formTitleDisabled {
    margin-bottom: 4px;
}

.plainTask.dropOver {
    border-style: dashed !important;
}

.listTaskHover > div {
    border-style:dashed!important;
}

.plainTask:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 5px;
    height: 100%;
}

.plainTask.highlighted {
    border-color:red;
}

.taskColumnTitles {
    background: linear-gradient(90deg, rgb(233 233 234) 0%, rgb(255 255 255) 100%);
    /* task column title bottom border */
    box-shadow: inset 0px -6px 2px -5px black;
    border-left: 1px solid #777;
    border-right: 1px solid #777;
}

.taskCount, .commentCount {
    border-radius: 2px;
    box-shadow: 1px 0 2px #660000;
    font: bold 11px/11px Helvetica, Verdana, Tahoma;
    height: 16px;
    min-width: 14px;
    padding: 0 4px 0 4px;
    text-align: center;
    line-height: 1.4;
    text-shadow: 1px 1px #E0E0E0;
    vertical-align: text-bottom;
    color: #444;
    -webkit-text-fill-color:#444;
    display: inline-block;
}

.taskCount {
    background: radial-gradient( 5px -9px, circle, white 8%, #F4DA6B 18px );
    background: -moz-radial-gradient( 5px -9px, circle, white 8%, #F4DA6B 18px );
    background: -ms-radial-gradient( 5px -9px, circle, white 8%, #F4DA6B 18px );
    background: -o-radial-gradient( 5px -9px, circle, white 8%, #F4DA6B 18px );
    background: -webkit-radial-gradient( 5px -9px, circle, white 8%, #F4DA6B 18px );
    background-color: #F4DA6B;
}

.commentCount {
    background: radial-gradient( 5px -9px, circle, white 8%, #E0ECFE 18px );
    background: -moz-radial-gradient( 5px -9px, circle, white 8%, #E0ECFE 18px );
    background: -ms-radial-gradient( 5px -9px, circle, white 8%, #E0ECFE 18px );
    background: -o-radial-gradient( 5px -9px, circle, white 8%, #E0ECFE 18px );
    background: -webkit-radial-gradient( 5px -9px, circle, white 8%, #E0ECFE 18px );
    background-color: #E0ECFE;
}

.taskCount.red, .commentCount.red {
    color:#cccccc;
    background: radial-gradient(5px -9px, circle cover, white 8%, rgb(255 0 0) 18px) rgb(255 0 0);
    background: -webkit-radial-gradient(5px -9px, circle cover, white 8%, rgb(255 0 0) 18px) rgb(255 0 0);
    text-shadow: rgb(0 0 0) 1px 1px;
}

.collapseColumnMsg {
    font-weight: 700;
    border: 1px dashed #777;
    border-radius: 5px;
    background: repeating-linear-gradient(
            45deg,
            transparent,
            transparent 10px,
            #eee 10px,
            #fff 20px
    ),
    linear-gradient(
            to top,
            #EEE,
            #CCC
    );
    animation: fadeIn ease 0.5s;
}

@keyframes fadeIn { 0% {opacity:0;} 100% {opacity:1;}}

.hideBaseLine {
    visibility:hidden;
}

.swimlaneContainer:nth-child(even) {
    background: linear-gradient(90deg, rgb(233 233 234) 0%, rgb(255 255 255) 100%);
}

.swimlaneContainer:nth-child(odd) {
    background: white;
}

.swimlaneContainer ~ .swimlaneContainer {
    /* Hide border on subsequent containers*/
    border-width:0px;
}

.swimlaneContainer.withSwimlaneTitleForm {
    border-left: 1px solid #777;
}

.swimlaneColumn {
    border-left: 1px dashed #777;
    padding-left: 0.6px !important;
}
.swimlaneColumn.highlighted {
    background: repeating-linear-gradient(
            45deg,
            #00800010,
            #00800015 10px,
            #00800025 10px,
            #00800035 20px
    );
}
.taskBody {
    background-color: transparent;
    cursor: move;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    margin-left: 4px;
}

.swimlaneTitleLabel {
    font-size: 16px;
    color: #6E7B8C;
    text-shadow: 1px 1px #E0E0E0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: -2px;
}

/* wrapper for a task content in a 'taskform' or in a backlog grid's cell */
.taskWrapper {
    display: flex;
    flex-flow: row;
}

.taskWrapper .taskLeft {
    font-size: 14px;
    line-height: 1.2;
    display: flex;
    flex-flow: column;
    padding-left: 2px;
    padding-right: 2px;
    margin-right: 2px;
    border-right: 1px solid #aaa;
    background-image: linear-gradient(315deg, #eee 30%, #fff 74%);
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-width: 44px;
}
/* Collapse empty box */
.taskWrapper .taskLeft:empty {
    min-width:1px;
}

.taskWrapper .taskRight {
    display:flex;
    flex-flow:column;
    padding: 2px;
    width: 100%;
    overflow:hidden;
}

.taskItem {
    padding: 0px !important;
    width: 100% !important;
    height: 100% !important;
}
/*
.taskWrapper.compact {
    padding: 2px;
}
*/
.taskWrapper.finished .taskText, .taskWrapper.finished .taskId {
    color: #777;
}
.taskWrapper.finished .avatarInline, .taskWrapper.finished .avatarInitials, .taskWrapper.finished .tags {
    opacity: 0.5;
}

.taskLeft .taskId {
    font-size:14px;
    line-height: 1.2;
    font-weight: 700;
    margin-top: 2px;
}
.taskLeft .effortLeft {
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 2px;
    color: #333;
    white-space: nowrap;
}
.taskText {
    font-size:14px;
    line-height: 1.2;
    padding: 0px;
    overflow:hidden;
    text-overflow: ellipsis;
    flex-grow:1;
    width: 100%;
}

/* render task's name in smaller font in compact mode */
.taskWrapper.compact .taskId, .taskWrapper.compact .taskText {
    font-size:13px;
}

.nameEditor {
    font-weight: 700;
    font-size: 16px;
    padding: 4px;
    border: 1px dashed #ccc;
    border-radius: 6px !important;
}

.syncAssigneesItem {
    padding-top: 22px;
    height: 22px;
}

/* render tasks in backlog with pointer */
.backlogBody .listTable tr[role=listitem] {
    cursor: pointer;
}

/* float the icon indicating the task's type to the top right corner */
.taskText .typeIcon {
    float: right;
}
.backlogBody .taskText .typeIconLink span, .gridDragTracker .taskText .typeIconLink span  {
    /* hide coupled asset status text in backlogs ? */
    display: none;
}
.taskText a.typeIconLink {
    display: inline-flex;
    float: right;
    flex-direction: column;
}
.taskText a.typeIconLink {
    text-decoration: none;
}
.taskText a.typeIconLink img {
    align-self: flex-end;
}
.taskText a.typeIconLink span {
    font-size: 0.65em;
    color: #838e9e;
    font-weight: 700;
}

/* type icon when task is in 'wrong' column */
.wrongColumn .taskText a.typeIconLink span {
    color: #DC1A24;
}
.swimlaneLayout.highlightWrongColumnTasks .wrongColumn {
    background: repeating-linear-gradient(
            45deg,
            #DC1A2400,
            #DC1A2400 10px,
            #DC1A2423 10px,
            #DC1A2433 20px
    );
}

/* render type icon smaller in compact mode */
.taskWrapper.compact .typeIcon {
    width: 16px !important;
    height: 16px !important;
}

/* the bottom row of the task */
.taskBottom {
    flex-grow:0;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
}

/* divide task's bottom row to left and right hand side for easier align */
.taskBottom .left, .taskBottom .right {
    display: flex;
    align-items: center;
    margin-right: 4px;
}
.taskBottom .rightest {
    display: flex;
    align-items: center;
    margin-right: 0px;
}
/* clip tags with ellipsis if they wont fit */
.taskBottom .right {
    min-width: 0;
}
.taskBottom .tags {
    flex-wrap: nowrap;
    min-width: 0;
}
.taskBottom .tags .label {
    overflow: hidden;
}
.taskBottom .tags .label > span {
    text-overflow: ellipsis;
    overflow: hidden;
}

/* in compact mode, smaller assignee to collapsed tags */
.taskWrapper.compact .taskBottom {
    position: absolute;
    right: 0;
    bottom: 0;
}
.taskWrapper.compact .rightest > img {
    width: 16px;
    height: 16px;
}
.taskWrapper.compact .rightest > .avatarInitials {
    width: 16px;
    height: 16px;
}
.taskWrapper.compact .rightest > .avatarInitials span {
    font-size: calc(16px / 2);
    top: -1px;
}
.taskWrapper.compact .taskBottom .rightest {
    margin-right: 2px;
}

.taskWindowToolstrip {
    border:0px;
    background-color: unset;
    background:unset;
}

.onTaskControlDown {
    visibility: hidden;
    opacity: 0;
    transition: visibility 0s, opacity 0.15s ease-in-out;

    position: absolute;
    max-width: 98%;
    bottom: 0;
}

.hideOnTaskControlDown {
    visibility: visible;
    opacity: 1;
    transition: visibility 0s, opacity 0.15s ease-in-out;
}

.darkenOnTaskControlDown {
    filter: blur(0);
    transition: filter 0.15s ease-in-out;
}
.taskCoupledWithHovered {
    background: repeating-linear-gradient(
            45deg,
            #DC1A2400,
            #DC1A2400 10px,
            #DC1A2423 10px,
            #DC1A2433 20px
    ) !important;
    transition: background 0.4s ease-in-out;
}
.taskNotCoupledWithHovered {
    background: #eee !important;
    transition: background 0.4s ease-in-out;
}

/* feature overlay for backlog */
.backlogBody td.taskCell > div, div.taskBody, div.taskBody div.taskItem, .swimlaneColumn div.normal {
    overflow: visible !important;
}

.onTaskShiftDown {
    visibility: hidden;
    opacity: 0;
    transition: visibility 0s, opacity 0.15s ease-in-out;

    position: absolute;
    max-width: 98%;
    bottom: 0;
}
.epicWrapper {
    white-space: nowrap;
    overflow: visible;
    text-overflow: ellipsis;
    background-color: white;
    border: 1px solid #777;
    border-radius: 8px;
    color: white;
    font-weight: 700;
    background-image: linear-gradient(315deg, #b1bfd8 0%, #6782b4 74%);
    font-size: 11px;
    height: 16px;
}
.epicWrapper .epic {
    text-transform: uppercase;
    padding-left: 3px;
    padding-right: 3px;
}
.epicWrapper .epic .epicIcon {
    position: absolute;
    top: -11px;
    left: -1px;
    font-size: 16px;
    border: 0px solid #777;
    border-radius: 18px 18px 0px 8px;
    background-image: linear-gradient(315deg, #b1bfd8 0%, #000000 74%);
    background: black;
    line-height: 1.3;
    padding: 2px 3px 0px 3px;
}
.epicWrapper .epic .epicTitle {
    margin-left: 25px;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    /* margin-top: -17px; */
    margin-top: -19px;
    padding-right: 4px;
}
.eww.nowrap.swimlane.epicWrapper .epicTitle {
    margin-left: 0px;
    margin-top: -3px;
    font-size:11px;
}
body.taskShiftDown .onTaskShiftDown {
    visibility: visible;
    opacity: 1;
}
body.taskControlDown .onTaskControlDown {
    visibility: visible;
    opacity: 1;
}
body.taskControlDown .hideOnTaskControlDown {
    visibility: hidden;
    opacity: 0;
}
body.taskControlDown .darkenOnTaskControlDown {
    filter: blur(1.5px);
}
.eww {
    margin-top: 12px;
    display: inline-block;
    position: relative;
}
.eww.epicWrapper .epic .epicIcon {
    top: 0;
    margin-top: -11px;
}
.eww.epicWrapper {
    margin-left: 0px !important;
    white-space: normal;
    padding-left: 2px;
    vertical-align: bottom;
}
.eww.epicWrapper.nowrap {
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 98%;
}
.eww.epicWrapper .epic .epicTitle {
}
.epicSwimlane a {
    text-decoration: none !important;
    height: inherit !important;
    line-height: normal !important;
}
.epicSwimlane .eww.epicWrapper {
    height: auto;
    white-space: normal;
    word-break: break-word;
}
.backlogBody .epicWrapper {
    margin-left: 3px;
}

/* /feature overlay for backlog */

.backlog {
    /*    background-color:rgb(233 233 234);*/
}

.backlogTitle {
    background: -webkit-linear-gradient(#565656, #565656);
    color: #565656;
    text-shadow: 0px 3px 4px rgba(255,255,255,0.5);
    background-clip: content-box;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    font-size: 14px;
    font-weight: 700;
    display: flex;
    align-items: center;
    padding-top: 2px;
}

.backlogTitle .mb, .backlogTitle .mb2, .backlogTitle .label {
    text-shadow: 0 0 white;
}

a.takeThisLink, a.takeThisLink:hover, span.takeThisLink, span.takeThisLink:hover {
    text-align: center;
    color: #838e9e;
}
a.takeThisLink:hover, span.takeThisLink:hover {
    text-decoration: underline;
}
/*Take this as inline icon*/
span.takeThisLink.takeThisLinkInline {
    font-size:10px;
    vertical-align:top;
    line-height:16px;
    cursor:pointer;
}

.takeThisFormItem {
    text-align:right;
}

/* Row borders */

.backlogBody table {
    border-spacing:0px 0px;
    border-collapse:separate;
    width: 100% !important;
}

.backlogBody .taskCell > div, .gridDragTracker .taskCell > div {
    border-color:grey;
    border-style:solid;
    border-width:1.4px;
    border-radius: 5px;
    background-color:white;
    position:relative;
    z-index:1;

    font-size: 1.2em;

    -webkit-box-shadow: 0 6px 4px -7px black;
    -moz-box-shadow: 0 6px 4px -7px black;
    box-shadow: 0 6px 4px -7px black;

    margin: 2px;
    width: auto !important;
}

.backlogBody .taskCell.disabled > div {
    border-color: #ababab;
    color: #ababab;
}

.backlog .backlogGroup {
    border-width: 0px 0px 1.4px 0px!important;
    border-bottom: #878687;
    border-style: solid;
}

.backlogBody .taskCell.highlight > div, .plainTask.highlight {
    background: repeating-linear-gradient(
            45deg,
            #DC1A2400,
            #DC1A2400 10px,
            #DC1A2423 10px,
            #DC1A2433 20px
    ) !important;
    transition: background 2.0s ease-in-out;
}

.addTask {
    text-align:center;
    position:relative;
    border:8px solid #E8E8E8;
    font-size:18px;
    color: #777888;
    display:inline-block;
    cursor: pointer;
    background: #F0F0F0; /* Old browsers */
    background: -moz-linear-gradient(-45deg, #F0F0F0 81%, #F0F0F0 82%, #F0F0F0 82%, #FFFFFF 100%);
    background: -webkit-gradient(linear, left top, right bottom, color-stop(81%,#F0F0F0), color-stop(82%,#F0F0F0), color-stop(100%,#FFFFFF));
    background: -webkit-linear-gradient(-45deg, #F0F0F0 81%,#F0F0F0 82%,#F0F0F0 82%,#FFFFFF 100%);
    background: -o-linear-gradient(-45deg, #F0F0F0 81%,#F0F0F0 82%,#F0F0F0 82%,#FFFFFF 100%);
    background: -ms-linear-gradient(-45deg, #F0F0F0 81%,#F0F0F0 82%,#F0F0F0 82%,#FFFFFF 100%);
    background: linear-gradient(135deg, #F0F0F0 81%,#F0F0F0 82%,#F0F0F0 82%,#FFFFFF 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#F0F0F0', endColorstr='#FFFFFF',GradientType=1 );
}

.addTask:hover {
    text-align:center;
    position:relative;
    border:8px solid #F0F0F0;
    font-size:18px;
    color: #909090;
    display:inline-block;
    background: #FFFFFF;
}

.pointer {
    cursor: pointer;
}

.taskLinkColorSpan {
    margin-right: 4px;
    width: 5px;
    display: inline-block;
}
.taskLinkColorSpan:hover {
    text-decoration: none !important;
}

.editBoardButton {
    font-size: 0.9em;
}

.taskTypeSelectTextBox span {
    padding: 1px !important;
}

/* bold section header titles */

.sectionHeaderopened, .sectionHeaderclosed, .sectionHeaderDisabledopened, .sectionHeaderDisabledclosed {
    color: rgb(255, 255, 255);
    font-size: 12px;
    padding: 2px 2px 2px 3px;
    font-weight: 700;
}

.testlabSectionHeader > div {
    display: inline-flex !important;
    align-items: center;
    margin-top: -5px;
}

/* bold tabs */

.tabButtonTop, .tabButtonTopSelected, .tabButtonTopSelectedDisabled, .tabButtonTopOver, .tabButtonTopSelectedOver, .tabButtonTopDisabled, .tabButtonTopDisabledOver, .tabButtonTopDown, .tabButtonTopSelectedDown {
    font-weight: 400;
    font-size: 12px;
}
.tabButtonTop {
    color: #676767 !important;
}

.shake, .longshake {
    animation: shake 1.0s cubic-bezier(.36,.07,.19,.97) both;
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    perspective: 1000px;
}

@keyframes shake {
    10%, 90% {
        transform: translate3d(-2px, 0, 0);
    }

    20%, 80% {
        transform: translate3d(4px, 0, 0);
    }

    30%, 50%, 70% {
        transform: translate3d(-8px, 0, 0);
    }

    40%, 60% {
        transform: translate3d(8px, 0, 0);
    }
}

.longshake {
    animation: shake 2.0s cubic-bezier(.36,.07,.19,.97) both !important;
}

.LinksStrip {
    background-color: #d5e0f0;
    border: 1px solid #A5B0C0;
    /* padding-bottom: 4px !important; */
    background-image: -moz-linear-gradient(center bottom , #CFDDF2 2%, #C1CCDC 100%);
    background-image: -webkit-linear-gradient(bottom, rgb(207, 221, 242) 2%, rgb(193, 204, 220) 100%);
    background-image: -o-linear-gradient(bottom, rgb(207, 221, 242) 2%, rgb(193, 204, 220) 100%);
    background-image: -ms-linear-gradient(bottom, rgb(207, 221, 242) 2%, rgb(193, 204, 220) 100%);
    background-image: linear-gradient(bottom, rgb(207, 221, 242) 2%, rgb(193, 204, 220) 100%);
}

.TopBoundLinksStrip {
    background-color: #d5e0f0;
    border-bottom: 1px solid #A5B0C0;
    /* padding-bottom: 4px !important; */
    background-image: -moz-linear-gradient(center bottom , #CFDDF2 2%, #C1CCDC 100%);
    background-image: -webkit-linear-gradient(bottom, rgb(207, 221, 242) 2%, rgb(193, 204, 220) 100%);
    background-image: -o-linear-gradient(bottom, rgb(207, 221, 242) 2%, rgb(193, 204, 220) 100%);
    background-image: -ms-linear-gradient(bottom, rgb(207, 221, 242) 2%, rgb(193, 204, 220) 100%);
    background-image: linear-gradient(bottom, rgb(207, 221, 242) 2%, rgb(193, 204, 220) 100%);
    /* margin-bottom: 4px; */
}

.scrollIndicatorStyle {
    mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 75%, rgba(0, 0, 0, 0));
}

.maskLayerMask {}

.maskLayerLabel {
    color: #bbb;
    font-size: 20px;
    font-weight: bold;
}
.emptyMessage {
    color: #bbb;
    font-size: 16px;
    font-weight: bold;
}

.lightGrayRoundPanel .maskLayerMask {
    background-color: #EFF3FB !important;
    background-image: linear-gradient(315deg, #EFF3FB 0%, #D5DBE4 74%) !important;
    border-radius: 6px !important;
}

.lightGrayRoundPanel .maskLayerMask .maskLayerLabel {
    color: #aaa;
}

.maskLayerLabel.dark {
    color: #000;
}

/* css progress bar */
.progressbar {
    height: 8px;
    position: relative;
    background: #a5b0c0;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    padding: 4px;
    box-shadow: inset 0 -1px 1px rgba(255,255,255,0.3);
}
.progressbar > span {
    display: block;
    height: 100%;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
    background-color: #d5e0f0;
    position: relative;
    float: left;
    overflow: hidden;
}
/* /css progress bar */

.resultsbar {
    border-radius: 8px;
    color: #333;
    font-weight: 700;
}

.resultsbarText {
    font-size: 9px;
    color: #333;
    font-weight: 700;
}

.resultsbarTextLight {
    font-size: 9px;
    color: #fff;
    font-weight: 700;
}

.sbutl img:focus, .sbutl div:focus { outline: none; }

/* EnterResultListGridField */

.avatar {
    border-radius: 16px;
    opacity: 1 !important;
    display: inherit !important;
    overflow: hidden !important;
}

.result {
    display: inline-block;
    white-space: nowrap;
}
.result img {
    width: 18px;
    height: 18px;
    padding: 2px;
    vertical-align: middle;
}
.result.edit img.pass, .result.edit img.fail, .result.edit img.blocked, .result.edit img.skip {
    cursor: pointer;
}
.result.notrun {
}
.result.pass .fail, .result.pass .blocked, .result.pass .skip,
.result.fail .pass, .result.fail .blocked, .result.fail .skip,
.result.blocked .pass, .result.blocked .fail, .result.blocked .skip,
.result.skip .pass, .result.skip .fail, .result.skip .blocked {
    width: 0;
    padding: 0;
    transition: all 0.25s ease-in-out;
}
.result .runBy {
    margin-left: 4px;
    width: 22px;
    height: 22px;
    padding: 0;
    display: none;
}
.result .runBy.avatar.anim, .result .runBy.avatarInitials.anim {
    animation: avatar-in .25s ease-in-out 0s 1;
    display: inherit;
}
.result .runBy.animOut, .result .runBy.avatarInitials.animOut {
    animation: avatar-out .25s ease-in-out 0s 1;
}
@keyframes avatar-in {
    0% {
        opacity: 0;
        transform: scale(2.0);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}
@keyframes avatar-out {
    0% {
        opacity: 1;
        transform: scale(1);
    }
    100% {
        opacity: 0;
        transform: scale(0);
    }
}
/* /EnterResultListGridField */

.currentStepUnderTest {
    background-color:#d5e0f0;
    border-top:1px solid #a5b0c0;
    border-bottom:1px solid #a5b0c0;
    transition: background-color .3s ease-in-out;
}

.currentStepUnderTestSelected {
    background-color:#EAEBE3;
    border-top:1px solid #a5b0c0;
    border-bottom:1px solid #a5b0c0;
    transition: background-color .3s ease-in-out;
}

.currentStepUnderTest .result img, .currentStepUnderTestSelected .result img {
    width: 24px;
    height: 24px;
}

.padRecord {
    background-color: #eee;
    border-top: none;
    border-bottom: none;
}

.notsepcol {
    filter: contrast(90%);
}
.sepfirst {
    border-left: 1px solid #cacaca;
}

.darkBackgroundTextArea textarea, .darkBackgroundTextArea div.mce-container, .darkBackgroundTextArea div.content-wrapper,
.tiptapCanvas.darkBackgroundTextArea,
.tiptapReactjsCanvas.darkBackgroundTextArea, .tiptapReactjsCanvas.darkBackgroundTextArea div.reactjs-tiptap-editor, .tiptapReactjsCanvas.darkBackgroundTextArea div.richtext-bg-background {
    background-color: #f6f6f6 !important;
}

.tiptapCanvas.darkBackgroundTextArea, .tiptapReactjsCanvas.darkBackgroundTextArea {
    box-shadow: 0 4px 6px -6px black;
}

.darkBackgroundTextArea textarea, .darkBackgroundTextArea div.mce-container, .noControlTinyMCE div.mce-container, .fixBackgroundTextAreaBorder textarea, .fixBackgroundTextAreaBorder div.mce-container {
    border: 1px solid #f0f0f0 !important;
}

.darkBackgroundTextArea div.mce-top-part, .noControlTinyMCE div.mce-top-part, .fixBackgroundTextAreaBorder div.mce-top-part {
    display: none;
}

.resizeBarTab {
    -webkit-transform-origin: bottom left;
    -moz-transform-origin: bottom left;
    -ms-transform-origin: bottom left;
    -o-transform-origin: bottom left;
    -webkit-transform: rotate(90deg) translateX(-100%);
    -moz-transform: rotate(90deg) translateX(-100%);
    -ms-transform: rotate(90deg) translateX(-100%);
    -o-transform: rotate(90deg) translateX(-100%);
    left: -18px !important;
    font-size: 13px;
    color: #444;
    text-shadow: 1px 1px #E0E0E0;
    top: unset !important;
    bottom: 0;
    background: rgb(231,234,239);
    background: radial-gradient(circle, rgb(247, 249, 253) 0%, rgb(210, 210, 210) 100%);
    border-top: 2px solid #b5b5b5;
    box-shadow: 0px 2px 6px #485567;
    z-index: 900000 !important;
    padding-top: 0px !important;
    border-radius: 4px 0px 0px 0px;
    opacity: 0.8;
    cursor: col-resize !important;
}

.resizeBarTab:hover {
    opacity: 1;
    transition: all .3s ease-in-out;
}

.resizeBarTab > div {
    padding-top: 0px !important;
    padding-left: 4px !important;
    cursor: col-resize !important;
}

.foldablePaneTabRight {
    -webkit-transform-origin: bottom left;
    -moz-transform-origin: bottom left;
    -ms-transform-origin: bottom left;
    -o-transform-origin: bottom left;

    -webkit-transform: rotate(-90deg) translateX(-100%);
    -moz-transform: rotate(-90deg) translateX(-100%);
    -ms-transform: rotate(-90deg) translateX(-100%);
    -o-transform: rotate(-90deg) translateX(-100%);

    font-size: 13px;
    color: #444;
    text-shadow: 1px 1px #E0E0E0;
    top: unset !important;
    bottom: 0;

    background: rgb(231,234,239);
    background: radial-gradient(circle, rgb(249, 248, 255) 0%, rgb(213, 224, 240) 100%);
    box-shadow: rgb(72, 85, 103) 0px -4px 10px -5px;

    position: absolute;
    left: 2px !important;
    top: -8px !important;
    height: 20px;

    padding-left: 8px;
    padding-right: 8px;

    border-top: 1.5px solid #858585;
    border-radius: 6px 6px 0px 0px;

    z-index: 900000 !important;
    opacity: 1;
    cursor: w-resize !important;
}

.foldablePaneTabRight:hover {
    opacity: 1;
    transition: all .3s ease-in-out;
}

.foldablePaneTabRight > div {
    padding-top: 0px !important;
    padding-left: 4px !important;
    cursor: col-resize !important;
}

.modernVSplitbarOver .foldablePaneTabRight, .modernVSplitbarOverclosed .foldablePaneTabRight {
    background: rgb(197, 208, 224);
    background: radial-gradient(circle, rgb(249, 248, 255) 0%, rgb(197, 208, 224) 100%);
}

.blink {
    animation: blink 1.2s ease-in-out 0s 1;
}

@keyframes blink {
    0% {
        background-color: #abff6b;
        transform: scale(1.2);
        opacity: 0.7;
    }
    25% {
        transform: scale(1);
        opacity: 1;
    }
    100% {
        background-color: initial;
    }
}

/* common dragTracker optionally used with Util.setDragTracker(...) */
.dragTracker, .gridDragTracker {
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-radius: 3px;
    background-color: rgba(255, 255, 255, 0.9);
    padding: 4px !important;
}

/* TestlabSectionHeader.java */
.testlabSectionHeader, .windowHeaderText, .dialogHeaderText {
    font-size: 14px;
    font-weight: normal;
}

.windowHeaderText, .dialogHeaderText {
    display: flex;
    padding-top: 0px;
    align-items: center;
    height: 100%;
    margin-top: -2px;
}

/* DarkSectionHeader.java */
.darkSectionHeader {
    background: linear-gradient(to bottom, #596576 0%, #3d4b5e 100%) padding-box !important;
}

.team {
    font-family: 'Fredoka One', 'Arial Black', 'Arial';
    color: #fff;
    text-shadow: -1.5px 0 0px #333, 0 1.5px #333, 1.5px 0 #333, 0 -1.5px #333;
    text-transform: lowercase;
    display: inline-block;
    font-variant: small-caps;
    font-size: 14px;
    letter-spacing: 0.12em;
}
.team::first-letter {
    font-size: 17px;
}

.floatLeft {
    float: left;
}
.floatRight {
    float: right;
}
.inlineAttachmentControl, .inlineAttachmentControlDisabled {
    border: 1px solid transparent;
    padding: 2px 2px;
}
.inlineAttachmentControl {
    cursor: pointer;
}
.inlineAttachment, .inlineAttachmentDisabled {
    border: 1px solid transparent;
    padding: 2px 2px;
}
.inlineAttachment {
    cursor: pointer;
}
.inlineAttachment:hover {
    background-color: rgb(253, 236, 180);
    background-repeat: repeat-x;
    background-size: 100%;
    background-image: linear-gradient(rgb(253, 245, 227) 0%, rgb(252, 235, 197) 11%, rgb(250, 227, 173) 37%, rgb(246, 211, 136) 53%, rgb(245, 211, 138) 58%, rgb(245, 214, 143) 68%, rgb(251, 233, 193) 100%);
    border: 1px solid rgb(158, 158, 158);
    cursor:pointer;
}

.linkButton, .linkButtonDisabled {
    font-size:1.1em;
    cursor:pointer;
    white-space:nowrap;
    text-decoration:underline;
}
.linkButtonDisabled {
    cursor:unset;
    color:#b3b3b3;
}

.boldLinkButton {
    font-weight: bold;
}

.testRunPickerButtonHeaderStyle {
    color: white;
    font-weight: 700;
    font-size: 12px;
}

.fullWidthTitleHeaderButton > div, .fullWidthTitleHeaderButton > div > div, .fullWidthTitleHeaderButton > div > div > div {
    width: 100%;
}

.fullWidthTitleHeaderButton > div > div > div {
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: space-between;
}

.testUnderTesting {
    font-weight: 700;
    font-variant: small-caps;
    text-transform: capitalize;
    font-size: 16px;
}

@keyframes underlineHighlight {
    0% { width: 0%; }
    25% { width: 100%; }
    50% { width: 30%; }
    75% { width: 100%; }
}

td.testUnderTesting td:nth-of-type(2):before {
    content: "";
    position: absolute;
    bottom: 0px;
    height: 1px;
    width: 0%;
    left: 0%;
    display: block;
    overflow: hidden;
    background-image: linear-gradient(to right, #000, #000 2px, #e5e5f7 2px, #e5e5f7 );
    background-size: 3px 100%;
    animation: underlineHighlight 1s ease-in-out 0s 3;
}

/* renewed milestones view */

.numberCircleContainer {
    text-align: center;
}
.numberCircle {
    background: var(--color);
    background: radial-gradient(farthest-corner at 20% 20%, var(--color) 0%, var(--color2) 60%, var(--color3) 100%);
    color: #ffffff;
    display: inline-block;
    font-weight: 700;
    text-align: center;
    width: 100%;
    height: 100%;
    font-weight: 700;
}
.numberCircleXLARGE {
    border-radius: 48px;
    font-size: 24px;
    line-height: 90px;
    width: 90px;
}
.numberCircleLARGE {
    border-radius: 32px;
    line-height: 64px;
    font-size: 18px;
    width: 64px;
}
.numberCircleMEDIUM {
    border-radius: 24px;
    line-height: 48px;
    font-size: 15px;
    width: 48px;
}
.numberCircleSMALL {
    border-radius: 16px;
    line-height: 32px;
    font-size: 12px;
    width: 32px;
}
.numberCircleShadow {
    box-shadow: rgb(170 170 170) 2px 2px 4px;
}

.cornerHeader {
    padding-left: 7px !important;
    padding-right: 5px !important;
    border-radius: 0px 0px 0px 8px;
    font-size: 13px;

    background: #798596;
    border-top: none;
}

.cornerHeaderLeft {
    padding-left: 5px !important;
    padding-right: 7px !important;
    border-radius: 0px 0px 8px 0px;
    font-size: 13px;

    background: #798596;
    border-top: none;
}

.cornerHeader > *, .cornerHeaderLeft > * {
    vertical-align: middle;
}

.cornerHeader.opaque, .cornerHeaderLeft.opaque {
    opacity: 0.25;
}

.milestonesPanelCornerHeader {
    border-radius: 0px 4px 0px 8px;
}

.noBorderRadius {
    border-radius: 0px;
}

.pipelineStatusCornerHeader {
    background: none;
    display: inline;
    font-variant: small-caps;
    font-size: 13px;
    box-shadow: 0 0 0 2px white;
}
.pipelineStatusCornerHeader.color.white {
    color: #000;
    border-left: 1px solid #8fa2bc;
    border-right: 1px solid #8fa2bc;
    border-bottom: 1px solid #8fa2bc;
}
.pipelineStatusCornerHeader.num {
    padding-right: 7px !important;
    border-top-right-radius: 0px;
}
.pipelineStatusCornerHeader.title {
    padding-left: 5px !important;
    border-bottom-left-radius: 0px;
    border-top-right-radius: 0px;
}

.LegendColorBarLegend {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;   /* space-evenly */
}

.LegendColorBarItem {
    display: flex;
    align-items: center;
    font-size: 9px;
    color: #888;
    margin: 2px;
}

.colorBarPart {
    font-size: 9px;
    font-weight: 700;
    color: #444;
}

.barMouseOvers:hover, .colorBar .barPartMouseOvers:hover{
    border: 1px solid white!important;
}

.barMouseOvers .colorBarPart, .barPartMouseOvers.colorBarPart {
    cursor:pointer!important;
}

/* for tinymce fullscreen mode to work, apply high&same z-index on selected burnthrough components */

.threeHundredZ {
    z-index: 300000 !important;
}

.chartTitle {
    color: #666;
    font-weight: 700;
    font-size: 12px;
}

.darkenCell {
    border-left: 1px solid #f0f0f0;
    border-right: 1px solid #fafafa;
    background-color: #f0f0f0;
}

/* .cellDark and .tallCellDark are default css for alternative row style, so darken a bit more */
.cellDark.darkenCell, tallCellDark.darkenCell {
    background-color: #e6e6e6;
}

/* smartgwt 13.0 fix - fix "0px 4px" padding as default 2px table padding */
.cell, .cellAltCol, .cellDark, .cellDarkAltCol, .cellOver, .cellOverAltCol, .cellOverDark, .cellOverDarkAltCol, .cellSelected, .cellSelectedAltCol, .cellSelectedDark, .cellSelectedDarkAltCol, .cellSelectedOver, .cellSelectedOverAltCol, .cellSelectedOverDark, .cellSelectedOverDarkAltCol, .cellDisabled, .cellDisabledDark, .tallCell, .tallCellAltCol, .tallCellDark, .tallCellDarkAltCol, .tallCellOver, .tallCellOverAltCol, .tallCellOverDark, .tallCellOverDarkAltCol, .tallCellSelected, .tallCellSelectedAltCol, .tallCellSelectedDark, .tallCellSelecDarkAltCol, .tallCellSelectedOver, .tallCellSelectedOverAltCol, .tallCellSelectedOverDark, .tallCellSelectedOverDarkAltCol, .tallCellDisabled, .tallCellDisabledDark, .gridSummaryCell, .gridSummaryCellDisabled, .recordSummaryCell, .recordSummaryCellDark, .recordSummaryCellOver, .recordSummaryCellOverDark, .recordSummaryCellSelected, .recordSummaryCellSelectedDark, .recordSummaryCellSelectedOver, .recordSummaryCellSelectedOverDark, .recordSummaryCellDisabled, .recordSummaryCellDisabledDark, .expansionCellCell, .expansionCellCellDark, .expansionCellCellOver, .expansionCellCellOverDark, .expansionCellCellSelected, .expansionCellCellSelectedDark, .expansionCellCellSelectedOver, .expansionCellCellSelectedOverDark, .expansionCellCellDisabled, .expansionCellCellDisabledDark, .specialCol, .specialColOver, .specialColSelected, .specialColSelectedOver, .specialColDisabled, .groupNode {
    padding: 2px !important;
}

.editableCell {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

/* fix form title align to right even if we are clipping */
td.fixFormTitle > div {
    justify-content: flex-end;
}

.panelContainer.onOver .lightGrayRoundPanel {
    border: 1px dashed #2b2b2b !important;
}

.panelContainer.onOverDenied .lightGrayRoundPanel {
    border : 2px dashed red !important;
}

.panelContainer .maskLayerLabel {
    border: 8px dashed rgb(220, 220, 220);
    border-radius: 32px;
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}

.panelContainer .maskLayerLabel.noWidget {
    border: 0;
    text-shadow: none;
}

.projectPanelOverlay.default {
    background: repeating-linear-gradient(
            45deg,
            transparent,
            transparent 10px,
            rgba(230, 230, 230, 0.5) 10px,
            rgba(255, 255, 255, 0.5) 20px
    )
}

.projectPanelOverlay.fixed {
    background: repeating-linear-gradient(
            45deg,
            transparent,
            transparent 10px,
            rgba(230, 40, 40, 0.1) 10px,
            rgba(255, 40, 40, 0.3) 20px
    )
}

.emptyPanelMsg {
    font-size:24px;
    color:gray;
}

.homePanelHeader {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

/* on dashboard, move notifications a bit lower */
.testlab-gritter-HomePanel {
    top: 80px !important;
}

.folder_shrink {
    display: flex;
}

.folder_shrink div {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;

    border: 1px solid #888;
    box-shadow: 0.7px 0px 1px #666;
    border-radius: 4px;
    margin-right: 4px;
    padding: 2px;
    background-color: #FFE754;
}

.folder_shrink div:last-child {
    overflow: visible;
    text-overflow: ellipsis;
    background-color: white;
    font-weight: 700;
}

.folder_shrink div.shrink_keep {
    flex: 0 1 auto;
}
.folder_shrink div.shrink_sep {
    flex: 0 0 auto;
}
.folder_shrink div.shrink {
    flex: 0 8 auto;
}

/* Fix gray button text on automation panel caused by tabSetContainer style*/
.tabSetContainer .buttonRounded, .tabSetContainer .buttonRoundedOver {
    color:initial;
}

.devPipelineLegendItem {
    filter: drop-shadow(0px 2px 3px rgba(50, 50, 0, 0.5));
}

.devPipelineLegendItemLabel {
    clip-path: polygon(100% 0, 100% 80%, 50% 100%, 0 80%, 0 0, 50% 20%);

    color: #FFF;
    font-size: 16px;
    font-weight: 700;
    font-variant: small-caps;
}

.devPipelineLegendItemLabel.white {
    color: #000;
}

/* we need this style to fix overflow width of top label */
.headeredMenu {
    border: 1px solid #ababab;
}
.headeredMenu > div:first-child > div:first-child, .headeredMenu > div:first-child > div:first-child table {
    width: 100% !important;
}

.clipEllipsis, .clipEllipsisDisabled {
    text-overflow: ellipsis;
    max-width: 100%;
}

/* a single feature in FeaturePanel */
.featurePane {
    box-shadow: 0px 2px 6px 1px #888888;
}

.developmentPipelineHighlight {
    background:rgb(255,245,214);background:radial-gradient(circle, rgba(231,234,239,1) 0%, rgba(255,245,214,1) 100%);
}

.jqplot-xaxis-tick.jqplot-mekko-barLabel {
    overflow: hidden;
    text-overflow: ellipsis;
}

/* custom resizebar */
.modernHSplitbar {
    background: #d5e0f0;
}
.modernHSplitbarDisabled, .modernHSplitbarclosedDisabled {
    background: #f1f1f1;
}
.modernHSplitbarOver {
    background: rgb(197, 208, 224);
}
.modernHSplitbar img, .modernHSplitbarOver img, .modernHSplitbarclosed img, .modernHSplitbarOverclosed img, .modernHSplitbarDisabled img, .modernHSplitbarclosedDisabled img {
    position: fixed;
    margin-top: -2px;
    margin-left: -20.5px;
    height: 9px;
    width: 41px;
}

.modernVSplitbar, .modernVSplitbarclosed {
    background: #d5e0f0;
}
.modernVSplitbarDisabled, .modernVSplitbarclosedDisabled {
    background: #f1f1f1;
}
.modernVSplitbarOver, .modernVSplitbarOverclosed {
    background: rgb(197, 208, 224);
}
.modernVSplitbar img, .modernVSplitbarOver img, .modernVSplitbarclosed img, .modernVSplitbarOverclosed img, .modernVSplitbarDisabled img, .modernVSplitbarclosedDisabled img {
    position: fixed;
    margin-left: -2px;
    margin-top: -20.5px;
    width: 9px;
    height: 41px;
}

.foldablePaneVSplitBar {
    box-shadow: rgb(72, 85, 103) 1px 1px 2px 0px;
}

.foldablePaneVSplitBar.collapsed {
}

.moreActionsMenu {
    border-radius: 16px;
}
td.moreActionsMenu > div:first-child {
    width: 100%;
}
td.moreActionsMenu img, .multiActionButtonIcon {
    width: 100%;
    height: 100%;
    max-width: 16px;
    max-height: 16px;
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.multiActionButton {
    border-radius: 16px;
}
.multiActionButtonIcon {
    border-radius: 16px;
    display: inline-block;
    max-width: 12px;
    max-height: 12px;
}
.buttonRoundedDisabled .multiActionButtonIcon, .buttonDisabled .multiActionButtonIcon {
    background-color: transparent;
    opacity: 0.3;
}
.buttonRoundedOver .multiActionButtonIcon, .buttonOver .multiActionButtonIcon, .buttonRoundedDown .multiActionButtonIcon, .buttonDown .multiActionButtonIcon {
    background-color: rgb(253, 236, 180);
    background-image: none;
}

.moreActionsMenu.buttonDisabled img {
    opacity: 0.3;
}

.addEditableFieldsButton.moreActionsMenu {
    border-radius: 32px;
}
td.addEditableFieldsButton.moreActionsMenu img {
    max-width: 24px;
    max-height: 24px;
}

.dropArea, .dropAreaOver, .dropAreaDisabled {
    border: 2px dashed #a7abb4 !important;
    border-radius: 32px;
    box-shadow: 0 8px 6px -6px black;
}
.dropArea.testLibraryDropArea, .dropAreaOver.testLibraryDropArea {
    border-style: solid !important;
}
.dropArea.testLibraryDropArea {
    border-color: #878b94 !important;
}
.dropAreaTitleLabel, .dropAreaContents, .dropAreaContentsWithFooterLabel {
    color: rgb(86, 86, 86);
    text-shadow: rgba(255, 255, 255, 0.5) 0px 3px 4px;
}
.dropAreaTitleLabel {
    font-size: 17px;
    font-weight: 700;
}
.dropAreaContents {
    font-size: 14px;
    font-weight: normal;
    /* take the top label in account for a better centering */
    padding-bottom: 78px !important;
}
.dropAreaContentsWithFooterLabel {
    font-size: 14px;
    font-weight: normal;
    /* take the top label in account for a better centering */
    padding-bottom: 18px !important;
}

.dropAreaOver {
    border-color: #575b64 !important;
    background: linear-gradient(315deg, #EFF3FB 0%, #D5DBE4 74%);
    box-shadow: none;
    transition: box-shadow 0.3s ease-in-out, border-color 0.3s ease-in-out;
}
.dropAreaOver .dropAreaTitleLabel {
    color: #888;
    transition: color 0.3s ease-in-out;
}
/* fixes stuck hover labels sometimes showing */
.dropArea .dropAreaContents, .dropArea .dropAreaContentsWithFooterLabel {
    opacity: 0 !important;
}
.dropAreaOver .dropAreaContents, .dropAreaOver .dropAreaContentsWithFooterLabel {
    opacity: 1 !important;
}

.dropAreaDisabled {
    border-color: #ccc !important;
    box-shadow: 0 8px 6px -6px #ccc;
    background: repeating-linear-gradient( 45deg, transparent, transparent 10px, #f8f8f8 10px, #fff 20px ), linear-gradient( to top, #f8f8f8, #EEE );
}
.dropAreaDisabled .dropAreaTitleLabel, .dropAreaDisabled .dropAreaContents, .dropAreaDisabled .dropAreaContentsWithFooterLabel {
    color: #888 !important;
    text-shadow: -2px -2px 0 #fff, 2px -2px 0 #fff, -2px 2px 0 #fff, 2px 2px 0 #fff;
}
.dropAreaDisabled .dropAreaContents, .dropAreaDisabled .dropAreaContentsWithFooterLabel {
    /*    font-size: 15px; */
    font-weight: 700;
    display: flex;
    align-items: center;
}

.dropAreaDisabled .dropAreaContents > div, .dropAreaDisabled .dropAreaContentsWithFooterLabel > div {
    width: 100%;
}

.dropAreaFooterLabel {
    background: linear-gradient(315deg, #FFF 0%, #EEE 74%);
    border-top: 1px solid #a7abb4;
    font-size: 17px;
    font-weight: 700;
    color: #bbb;
}
.dropAreaOver .dropAreaFooterLabel {
    background: linear-gradient(315deg, #EFF3FB 0%, #D5DBE4 74%);
}

.dropAreaBackgroundImage, .dropAreaBackgroundImageDisabled {
    position: absolute !important;
    left: auto !important;
    top: auto !important;
    right: -60px !important;
    bottom: -60px !important;
}

.dropAreaBackgroundImage.withFooterLabel, .dropAreaBackgroundImageDisabled.withFooterLabel {
    bottom: 0px !important;
}

.dropAreaBackgroundImage img, .dropAreaBackgroundImageDisabled img {
    width: 250px !important;
    height: 250px !important;
    opacity: 0.35 !important;
    filter: grayscale(100%);
}

.dropAreaBackgroundImageDisabled img {
    opacity: 0.2 !important;
}

.dropAreaTopRightCount {
    font-size: 15px;
}

.dropAreaAreaLabel {
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    border-left: 2px solid #a7abb4;
    border-bottom: 2px solid #a7abb4;
    border-right: 2px solid #a7abb4;
    border-radius: 0px 0px 10px 10px;
    background: linear-gradient(to bottom, #798596 0%, #5d6b7e 100%) padding-box;
}

.rowNumberedList {
    text-align: left;
    overflow: hidden;
    max-width: 90%;
    font-size: 13px;
    font-weight: normal;
}

.rowNumberedListRow {
    margin: 2px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding-left: 12px;
    display: flex;
}

.rowNumberedListNumber {
    min-width: 30px;
    text-align: right;
    display: inline-block;
}

.radioButtonButtonsSubGroupLabel {
    font-size: 15px;
    font-weight: 700;
    color: #888;
    border-bottom: 2px solid #a7abb4;
}

.radioButtonButtonsButton {
    font-size: 13px;
    font-weight: 700;
    text-shadow: 1px 1px #e0e0e0;
    border-radius: 16px;
}

.radioButtonButtonsButton.aiFeatureButton:not(.buttonRoundedDown, .buttonRoundedSelected) {
    background-image: linear-gradient(rgb(246 246 246) 0%, rgb(205 205 205) 47%, rgb(188, 188, 188) 63%, rgb(218 218 218) 100%);
}

.radioButtonButtonsButton img {
    position: absolute;
    right: -30px;
    top: 8px;
    width: 100px;
    height: 100px;
    opacity: 0.35;
    filter: grayscale(100%);
}

.radioButtonButtonsButton img.wizard {
    position: absolute;
    right: -3px;
    top: auto;
    bottom: 6px;
    width: 24px;
    height: 24px;
    opacity: 0.50;
    filter: grayscale(100%);
}

.radioButtonButtonsButton div {
    /* moves the text on top of the "background" image */
    position: relative;
}

.resultTestCasesGridEmpty {
    text-align: left !important;
    padding: 0 !important;
    font-style: italic;
}

.inlineHelpBox {
    border: 1px solid #a7abb4;
    border-radius: 4px;
    color: #666;
    /* text-shadow: 1px 1px #e0e0e0; */
}

.testAssetsExistingCandidateHelpLabel {
    font-size: 10px;
    font-weight: normal;
    /*font-style: italic;*/
    padding-left: 1.5em;
    color: gray;
}

.treeNaviBlock {
    border-top: 1px solid #aaa;
    border-bottom: 1px solid #666;
    font-size: 9px;
    color: #000;
    font-weight: 700;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    height: 20px;
    background: #eee;
}

.treeNaviBlock .folder {
    /*
        height: 100%;
        display: flex;
        align-items: center;
    */
    padding-left: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

.folder.link:hover {
    text-decoration: underline;
    cursor: pointer;
}

.treeNaviBlock .sep {
    border-right: 1px solid #aaa;
    border-bottom: 1px solid #888;
    border-width: 0 1px 1px 0;
    display: inline-block;
    transform: rotate(-45deg);
    width: 14px;
    height: 14px;
    margin-right: 4px;
    margin-left: -6px;
    pointer-events: none;
    /*z-index: -1;*/
}

/* quicklink visible on hover, see QuickLink.java */
.tallCellOver .hoverquicklink, .tallCellSelectedOver .hoverquicklink, .tallCellOverDark .hoverquicklink, .tallCellSelectedOverDark .hoverquicklink, .treeCellOver .hoverquicklink,
.treeTallCellOver .hoverquicklink, .treeTallCellSelectedOver .hoverquicklink, .treeTallCellOverDark .hoverquicklink, .treeTallCellSelectedOverDark .hoverquicklink {
    visibility:visible;
}
.treeCell:hover .hoverquicklink, .treeTallCell:hover .hoverquicklink, .treeCellSelected:hover .hoverquicklink, .treeTallCellSelected:hover .hoverquicklink, .assetInTable tr:hover .hoverquicklink {
    visibility:visible;
}
.hoverquicklink {
    visibility:hidden;
    /*margin-left:-2em;*/
    background:white;
    border-radius:10px;
    border:2px solid white;
    opacity:85%;
    vertical-align: middle;
}
.hoverquicklink.visible {
    visibility:inherit;
}
.assetInTable td .hoverquicklink {
    margin-top: -2px;
}

@keyframes demoProjectIndicatorBlink {
    0% {
        opacity: 1;
        border-radius: 4px;
        border-color: red;
    }
    10% {
        opacity: 0.3;
        border-radius: 0px;
        border-color: black;
    }
    20% {
        opacity: 1;
        border-radius: 4px;
        border-color: red;
    }
}

.demoProjectIndicator {
    background-image: -moz-linear-gradient(center bottom , #FFFFFF 2%, #C1CCDC 100%);
    background-image: -webkit-linear-gradient(bottom, rgb(255, 255, 255) 2%, rgb(193, 204, 220) 100%);
    background-image: -o-linear-gradient(bottom, rgb(255, 255, 255) 2%, rgb(193, 204, 220) 100%);
    background-image: -ms-linear-gradient(bottom, rgb(255, 255, 255) 2%, rgb(193, 204, 220) 100%);
    background-image: linear-gradient(bottom, rgb(255, 255, 255) 2%, rgb(193, 204, 220) 100%);
    box-shadow: rgb(170 170 170) 0px 0px 4px;
    animation-name: demoProjectIndicatorBlink;
    animation-duration: 10s;
    animation-iteration-count: infinite;
}

.buttonLink, .buttonLink > div {
    text-decoration: underline;
}
.buttonLinkOver, .buttonLinkOver > div {
    text-decoration: none;
}
.buttonLinkDown, .buttonLinkDown > div {
    text-decoration: underline;
}
.buttonLinkDisabled, .buttonLinkDisabled > div {
    text-decoration: underline;
    color: #777;
}

.demoProjectWelcomeNote {
}
.demoProjectWelcomeNote img.toplogo {
    display:block;
    margin:auto;
    padding-bottom:10px;
}
.demoProjectWelcomeNote p {
    text-align: justify;
}
.demoProjectWelcomeNote p img {
    float: right;
    border: 1px solid #a7abb4;
    padding: 4px;
    border-radius: 4px;
    margin-left: 10px;
}

.authenticationCodeItem {
    font-weight: 700;
    font-size: 15px;
}

.authenticationCodeItem {
    font-weight: 700;
    font-size: 17px;
    color: #444;
    border-radius: 4px;
    border: 1px solid black;
    box-shadow: rgb(170 170 170) 0px 0px 4px;
    text-align: center;
}
.authenticationCodeItem.Error {
    border-color: red;
}

.taskColumnName {
    padding-left:6px;
    padding-right:6px;
    background:#5a5858;
    font-size: 1em;
    font-weight: 700;
    text-shadow: rgb(20 11 11) 1px 1px;
    border-radius:6px;
    color: #FFF;
}

.rightArrow {
    clip-path: polygon(0% 0%, calc(100% - 1em) 0%, 100% 50%, calc(100% - 1em) 100%, 0% 100%, 1em 50%);
    color: #FFF;
    font-size: 12px;
    font-weight: 700;
    transition: all 0.3s ease-in-out;
}

.rightArrow.disabled {
    color: #ebebeb;
}

.rightArrow.current {
    text-decoration: underline;
}

.buttonRightArrow,
.buttonRightArrowOver,
.buttonRightArrowFocused,
.buttonRightArrowFocusedOver,
.buttonRightArrowDown,
.buttonRightArrowFocusedDown,
.buttonRightArrowSelected,
.buttonRightArrowSelectedFocused,
.buttonRightArrowSelectedDown,
.buttonRightArrowSelectedFocusedDown,
.buttonRightArrowSelectedOver,
.buttonRightArrowSelectedFocusedOver,
.buttonRightArrowDisabled,
.buttonRightArrowSelectedDisabled,
.buttonRightArrowPending,
.buttonRightArrowPendingOver,
.buttonRightArrowPendingFocused,
.buttonRightArrowPendingFocusedOver,
.buttonRightArrowPendingDown,
.buttonRightArrowPendingFocusedDown,
.buttonRightArrowPendingSelected,
.buttonRightArrowPendingSelectedFocused,
.buttonRightArrowPendingSelectedDown,
.buttonRightArrowPendingSelectedFocusedDown,
.buttonRightArrowPendingSelectedOver,
.buttonRightArrowPendingSelectedFocusedOver,
.buttonRightArrowPendingDisabled,
.buttonRightArrowPendingSelectedDisabled,
.buttonRightArrowDeselectedDisabled
{
    clip-path: polygon(0% 0%, calc(100% - 1em) 0%, 100% 50%, calc(100% - 1em) 100%, 0% 100%);
    color: #FFF;
    font-weight: 700;
}
.buttonRightArrowDisabled,
.buttonRightArrowPendingDisabled,
.buttonRightArrowDeselectedDisabled,
.buttonRightArrowSelectedDisabled,
.buttonRightArrowPendingSelectedDisabled,
.buttonRightArrowDeselectedDisabled
{
    color: #d8d8d8;
}
.buttonRightArrowFocused,
.buttonRightArrowFocusedOver,
.buttonRightArrowSelectedFocused,
.buttonRightArrowSelectedFocusedOver,
.buttonRightArrowSelectedFocusedDown,
.buttonRightArrowPendingFocused,
.buttonRightArrowPendingFocusedOver,
.buttonRightArrowPendingSelectedFocused,
.buttonRightArrowPendingSelectedFocusedOver,
.buttonRightArrowPendingSelectedFocusedDown
{
    filter: brightness(1.05);
}
.buttonRightArrowOver,
.buttonRightArrowFocusedOver,
.buttonRightArrowSelectedFocused,
.buttonRightArrowSelectedFocusedOver,
.buttonRightArrowPendingOver,
.buttonRightArrowPendingFocusedOver,
.buttonRightArrowPendingSelectedFocused,
.buttonRightArrowPendingSelectedFocusedOver
{
    filter: brightness(1.05);
}
.buttonRightArrowDown,
.buttonRightArrowFocusedDown,
.buttonRightArrowSelectedDown,
.buttonRightArrowSelectedFocusedDown,
.buttonRightArrowPendingDown,
.buttonRightArrowPendingFocusedDown,
.buttonRightArrowPendingSelectedDown,
.buttonRightArrowPendingSelectedFocusedDown
{
    filter: brightness(1.02);
}

.buttonLeftArrow,
.buttonLeftArrowOver,
.buttonLeftArrowFocused,
.buttonLeftArrowFocusedOver,
.buttonLeftArrowDown,
.buttonLeftArrowFocusedDown,
.buttonLeftArrowSelected,
.buttonLeftArrowSelectedFocused,
.buttonLeftArrowSelectedDown,
.buttonLeftArrowSelectedFocusedDown,
.buttonLeftArrowSelectedOver,
.buttonLeftArrowSelectedFocusedOver,
.buttonLeftArrowDisabled,
.buttonLeftArrowSelectedDisabled,
.buttonLeftArrowPending,
.buttonLeftArrowPendingOver,
.buttonLeftArrowPendingFocused,
.buttonLeftArrowPendingFocusedOver,
.buttonLeftArrowPendingDown,
.buttonLeftArrowPendingFocusedDown,
.buttonLeftArrowPendingSelected,
.buttonLeftArrowPendingSelectedFocused,
.buttonLeftArrowPendingSelectedDown,
.buttonLeftArrowPendingSelectedFocusedDown,
.buttonLeftArrowPendingSelectedOver,
.buttonLeftArrowPendingSelectedFocusedOver,
.buttonLeftArrowPendingDisabled,
.buttonLeftArrowPendingSelectedDisabled,
.buttonLeftArrowDeselectedDisabled
{
    clip-path: polygon(0% 50%, 1em 0%, 100% 0%, 100% 100%, 1em 100%);
    color: #FFF;
    font-weight: 700;
}
.buttonLeftArrowDisabled,
.buttonLeftArrowPendingDisabled,
.buttonLeftArrowDeselectedDisabled,
.buttonLeftArrowSelectedDisabled,
.buttonLeftArrowPendingSelectedDisabled,
.buttonLeftArrowDeselectedDisabled
{
    color: #d8d8d8;
}
.buttonLeftArrowFocused,
.buttonLeftArrowFocusedOver,
.buttonLeftArrowSelectedFocused,
.buttonLeftArrowSelectedFocusedOver,
.buttonLeftArrowSelectedFocusedDown,
.buttonLeftArrowPendingFocused,
.buttonLeftArrowPendingFocusedOver,
.buttonLeftArrowPendingSelectedFocused,
.buttonLeftArrowPendingSelectedFocusedOver,
.buttonLeftArrowPendingSelectedFocusedDown
{
    filter: brightness(1.05);
}
.buttonLeftArrowOver,
.buttonLeftArrowFocusedOver,
.buttonLeftArrowSelectedFocused,
.buttonLeftArrowSelectedFocusedOver,
.buttonLeftArrowPendingOver,
.buttonLeftArrowPendingFocusedOver,
.buttonLeftArrowPendingSelectedFocused,
.buttonLeftArrowPendingSelectedFocusedOver
{
    filter: brightness(1.05);
}
.buttonLeftArrowDown,
.buttonLeftArrowFocusedDown,
.buttonLeftArrowSelectedDown,
.buttonLeftArrowSelectedFocusedDown,
.buttonLeftArrowPendingDown,
.buttonLeftArrowPendingFocusedDown,
.buttonLeftArrowPendingSelectedDown,
.buttonLeftArrowPendingSelectedFocusedDown
{
    filter: brightness(1.02);
}

.buttonSquare,
.buttonSquareOver,
.buttonSquareFocused,
.buttonSquareFocusedOver,
.buttonSquareDown,
.buttonSquareFocusedDown,
.buttonSquareSelected,
.buttonSquareSelectedFocused,
.buttonSquareSelectedDown,
.buttonSquareSelectedFocusedDown,
.buttonSquareSelectedOver,
.buttonSquareSelectedFocusedOver,
.buttonSquareDisabled,
.buttonSquareSelectedDisabled,
.buttonSquarePending,
.buttonSquarePendingOver,
.buttonSquarePendingFocused,
.buttonSquarePendingFocusedOver,
.buttonSquarePendingDown,
.buttonSquarePendingFocusedDown,
.buttonSquarePendingSelected,
.buttonSquarePendingSelectedFocused,
.buttonSquarePendingSelectedDown,
.buttonSquarePendingSelectedFocusedDown,
.buttonSquarePendingSelectedOver,
.buttonSquarePendingSelectedFocusedOver,
.buttonSquarePendingDisabled,
.buttonSquarePendingSelectedDisabled,
.buttonSquareDeselectedDisabled
{
    color: #FFF;
    font-weight: 700;
}
.buttonSquareDisabled,
.buttonSquarePendingDisabled,
.buttonSquareDeselectedDisabled,
.buttonSquareSelectedDisabled,
.buttonSquarePendingSelectedDisabled,
.buttonSquareDeselectedDisabled
{
    color: #d8d8d8;
}
.buttonSquareFocused,
.buttonSquareFocusedOver,
.buttonSquareSelectedFocused,
.buttonSquareSelectedFocusedOver,
.buttonSquareSelectedFocusedDown,
.buttonSquarePendingFocused,
.buttonSquarePendingFocusedOver,
.buttonSquarePendingSelectedFocused,
.buttonSquarePendingSelectedFocusedOver,
.buttonSquarePendingSelectedFocusedDown
{
    filter: brightness(1.05);
}
.buttonSquareOver,
.buttonSquareFocusedOver,
.buttonSquareSelectedFocused,
.buttonSquareSelectedFocusedOver,
.buttonSquarePendingOver,
.buttonSquarePendingFocusedOver,
.buttonSquarePendingSelectedFocused,
.buttonSquarePendingSelectedFocusedOver
{
    filter: brightness(1.05);
}
.buttonSquareDown,
.buttonSquareFocusedDown,
.buttonSquareSelectedDown,
.buttonSquareSelectedFocusedDown,
.buttonSquarePendingDown,
.buttonSquarePendingFocusedDown,
.buttonSquarePendingSelectedDown,
.buttonSquarePendingSelectedFocusedDown
{
    filter: brightness(1.02);
}

.SavedInstructionsGridView, .SavedInstructionsGridEdit {
}

.instructionsBoxSuggestion {
    height: 30px !important;
}

.SavedInstructionsGridEdit .instructionsBoxSuggestion.type0 {
    color: #888;
}
.SavedInstructionsGridEdit .instructionsBoxSuggestion.type0 > div {
    cursor: auto;
}

.instructionTypeCell {
    display:flex;
    font-size:10px;
    text-wrap-mode:wrap;
    text-align:center;
}
.instructionTypeCell.link {
    text-decoration:underline;
    cursor:pointer;
}
.instructionTypeCell.link:hover {
    text-decoration:none;
}
.instructionTypeCell.disabled {
    color: #888;
}

.instructionTextArea {
    border-radius: 12px !important;
}

.instructionsBoxSuggestion > div {
    border: 1px solid #a7abb4;
    border-radius: 12px;
    background-color: white;
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 8px;
    padding-right: 8px;
    cursor: pointer;

    width: auto !important;

    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.instructionEditor {
    border: 0;
    box-shadow: none;
    border-radius: 0;
    height: 16px !important;
    font-size: 11px;
    padding-left: 8px;
}

.instructionGridRemoveIcon {
    display: flex;
    justify-content: center;
    align-items: center;
}

.instructionGridGroupHeader {
    color: #666;
    text-shadow: 0px 1px 0px #ccc;
    height: 22px !important;
    vertical-align: bottom;
}

span.instructionAddNew, span.endInstructionsEdit, span.editSavedInstructions {
    cursor: pointer;
}
span.instructionAddNew:hover, span.endInstructionsEdit:hover, span.editSavedInstructions:hover {
    cursor: pointer;
    text-decoration: underline;
}

.instructionGridLastUsedHeader {
}
.instructionGridSavedItemsHeader {
}

.headeredHtmlTitle {
    background: -webkit-linear-gradient(#565656, #565656);
    color: #565656;
    text-shadow: rgba(80, 80, 80, 0.5) 0px 1px 3px;
    background-clip: content-box;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    font-size: 20px;
    font-weight: 700;
}

.rapidEditorCell {
    border-bottom: 1px solid #e0e0e0;
    border-right: 1px dotted #e0e0e0;
    padding: 4px;
    vertical-align: top;
}

/*.rapidEditorCell div:not(.rapidEditorRTECell) {*/
.rapidEditorCell div {
    padding-top: 4px;
}

.rapidEditorCell td > nobr {
    margin-top: -4px;
    display: block;
}

td.rapidEditorCell > div > span, td.rapidEditorCell > span {
    margin-top: -4px;
    display: block;
}

.rapidEditorCell.magicCell {
    border-left: none;
    border-right: none;
    overflow: visible !important;
    white-space: nowrap;
}
.rapidEditorCell.magicCell > div {
    overflow: visible !important;
    white-space: nowrap;
}

td.clipCellHeight60 > div {
    max-height: 60px;
    overflow-y: auto !important;
}

td.clipCellHeight100 > div {
    max-height: 100px;
    overflow-y: auto !important;
}

td.clipCellHeight250 > div {
    max-height: 250px;
    overflow-y: auto !important;
    /*
        -webkit-mask-image: linear-gradient(to bottom, black 230px, transparent 100%);
        mask-image: linear-gradient(to bottom, black 230px, transparent 100%);
    */
}

/* not in use - causes jumping in the editor */
.rapidEditorRTECell {
    background: white;
    padding: 4px;
    border: 1px solid #ccc;
    /*
        padding-left: 4px;
        padding-right: 4px;
        border-left: 1px solid #ccc;
        border-right: 1px solid #ccc;
    */
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

.shortcutText {
    background: -webkit-linear-gradient(#565656, #565656);
    color: #565656;
    text-shadow: 0px 3px 4px rgba(255,255,255,0.5);
    background-clip: content-box;
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    font-size: 12px;
    font-weight: 700;
}
.shortcutText table {
    border-spacing: 0;
    border: none;
    margin-top: 12px;
    margin-bottom: 12px;
}
.shortcutText table td,th {
    padding: 2px;
}
.shortcutText table td:first-child {
    text-align: center;
    padding-right: 6px;
}

kbd {
    border: 1px solid rgb(204, 204, 204);
    margin: 0px 0.1em;
    padding: 0.05em 0.4em;
    border-radius: 3px;
    color: rgb(51, 51, 51);
    -webkit-text-fill-color: rgb(51, 51, 51);
    line-height: 1.4;
    font-size: 11px;
    font-family: Verdana, sans-serif, monospace;
    display: inline-block;
    box-shadow: 0px 1px 0px rgba(0,0,0,0.2), inset 0px 0px 0px 2px #ffffff;
    background-color: rgb(247, 247, 247);
    -moz-box-shadow: 0 1px 0px rgba(0, 0, 0, 0.2), 0 0 0 2px #ffffff inset;
    -webkit-box-shadow: 0 1px 0px rgba(0, 0, 0, 0.2), 0 0 0 2px #ffffff inset;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    text-shadow: 0 1px 0 #fff;
}

.nameEditor.titleItemTitle, .nameEditor.titleItemIdentifierRight, .nameEditor.titleItemIdentifierLeft {
    border:none;
}

/* Specifically hide box-shadow so the default box-shadow is not visible, but the focused shadow is */
.nameEditor.textItemLite, .nameEditor.textItemLiteDisabled {
    box-shadow:none;
}

.prevNextNavigatorDot {
    background-color: #DDDDDD;
    border-radius: 12px;
}
.prevNextNavigatorDot.current {
    background-color: #AAAAAA;
}
.prevNextNavigatorDot.done {
    background-color: #2ECC40;
}
.prevNextNavigatorDot.current.done {
    background-color: #3D9970;
}

.titleItem {
    border: 1px dashed #ccc;
    border-radius:6px !important;
    overflow: hidden;
}
.titleItem.focused {
    border-style: solid;
}
.titleItem .titleItemTitle.withLeftIdentifier {
    border-top-left-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
}
.titleItem .titleItemTitle.withRightIdentifier {
    border-top-right-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
}
.titleItem .titleItemIdentifierRight {
    border-top-left-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
    border-left: 1px dashed #ccc;
}
.titleItem .titleItemIdentifierLeft {
    border-top-right-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
    border-right: 1px dashed #ccc;
}

.keybindtable span {
    display:inline-block;
    width:6.5em;
}

td.addNewStepDescription, td.addNewStep {
    height: 24px !important;
}

td.addNewStepDescription > div {
    position: absolute;
    left: 0;
    right: 0;
    width:100% !important;
    text-align: center;
    font-weight: bold;
    cursor: pointer;
    margin-top: -14px;
    padding-top: 6px;
    padding-bottom: 6px;
    opacity: 0.65;
    border-top: 1px solid #A5B0C0;
}

.addNewStep img {
    visibility: hidden;
    cursor: pointer;
}

td.addNewStepDescription div:hover {
    background-color: #EFF3FB;
    background-image: linear-gradient(315deg, rgba(239,243,251,1) 0%, rgba(251,251,252,1) 100%);
    opacity: 1;
    border-bottom: 1px solid #D5E0F0;
    transition: opacity,background 0.3s ease-in-out;
}

.sectionDeckHeaderItem {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    margin-right: 4px;
}

.sectionDeckHeaderItem.current {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
    padding-left: 4px !important;
    padding-right: 6px !important;
    border-radius: 3px !important;
    background: #97A5B5;
    background-image: linear-gradient(rgb(153, 168, 184) 0%, rgb(146, 160, 176) 35%, rgb(121, 129, 150) 100%);
    color: #fff !important;
}

.sectionDeckHeaderItem.inactive {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
    padding-left: 4px !important;
    padding-right: 6px !important;
    border-radius: 3px !important;
    background-color: #D1DBE4;
    background-image: linear-gradient(rgb(212, 222, 231) 0%, rgb(195, 204, 213) 100%);
    color: #676767 !important;
}

.sectionDeckHeaderItem.inactive.disabled {
    background-color: rgb(115, 132, 156);
    background-image: linear-gradient(rgb(230, 237, 249) 0%, rgb(205, 217, 234) 100%);
    /*background-image:linear-gradient(rgb(172 173 173) 0%, rgb(166 166 166) 100%);*/
    color: rgb(179, 179, 179) !important;

}

.splitButtonLeft:last-child { /* last-child so this won't add padding to icon */
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    border: none !important;
    padding-left: 4px !important;
    padding-right: 8px !important;
}

.splitButtonRight {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    border-top: none !important;
    border-right: none !important;
    border-bottom: none !important;
}

.buttonRoundedDisabled {
    cursor:default;
}

.gridBodyWithAddRecordButton:not(.addRecordButtonHidden) .listTable::after, .gridBodyWithAddRecordButton:not(.addRecordButtonHidden) .emptyMessage::before {
    font-weight: bold;
    cursor: pointer;
    border-top: 1px solid #A5B0C0;
    width: 100%;
    display: block;
    height: 24px !important;
    position: absolute;
    left: 0;
    right: 0;
    text-align: center;
    padding-top: 8px;
    border-bottom: 1px solid transparent;
}
.gridBodyWithAddRecordButton:not(.addRecordButtonHidden) .emptyMessage::before {
    top:0;
}

.gridBodyWithAddRecordButton:not(.addRecordButtonHidden).addRecordButtonHovered .listTable::after, .gridBodyWithAddRecordButton:not(.addRecordButtonHidden).addRecordButtonHovered .emptyMessage::before {
    background-color: #EFF3FB;
    background-image: linear-gradient(315deg, rgba(239,243,251,1) 0%, rgba(251,251,252,1) 100%);
    opacity: 1;
    border-bottom: 1px solid #D5E0F0;
    transition: opacity, background 0.3s ease-in-out;
}

.gridBodyWithAddRecordButton:not(.addRecordButtonHidden).addStepButton.en .listTable:after, .gridBodyWithAddRecordButton:not(.addRecordButtonHidden).addStepButton.en .emptyMessage::before {
    content: 'Add new step';
    /*prevent .emptyMessage - style from affecting this */
    color:black;
    font-size:12px;
}
.gridBodyWithAddRecordButton:not(.addRecordButtonHidden).addStepButton.fi .listTable:after, .gridBodyWithAddRecordButton:not(.addRecordButtonHidden).addStepButton.fi .emptyMessage::before {
    content: 'Lis\e4\e4\ uusi askel';
    /*prevent .emptyMessage - style from affecting this */
    color:black;
    font-size:12px;
}

.sectionHeaderclosed .noContent {
    color:#b1b1b1;
}

/* ModernScrollbar */
.vScrollTrack, .vScrollTrackDown, .vScrollTrackOver {
    background: radial-gradient(circle, rgba(239,243,251,1) 0%, rgba(239,239,239,1) 100%);
}
/*
.sorterButton img {
    margin-left: -2px;
}
*/

.chatItem, .chatForm textarea {
    -webkit-box-shadow: 0 6px 6px -6px black;
    -moz-box-shadow: 0 6px 6px -6px black;
    box-shadow: 0 6px 6px -6px black;
}

.chatItem {
    border-radius: 6px;
}

.chatItem:nth-child(odd) {
    background-image: linear-gradient(315deg, #f0f0f0 0%, #fff 50%);
}

.chatItem:nth-child(even) {
    background-image: linear-gradient(315deg, #fff 50%, #f0f0f0 100%);
}

.chatItem.failure {
    background-image: linear-gradient(315deg, #fff 0%, #FF8887 100%);
}

.chatThumb {
    font-size: 1.5em;
}

.chatItem.history {
    color: #888;
}

.chatNewDiscussionSeparator {
    color: #666;
    font-size: 16px;
    font-variant: small-caps;
    overflow:hidden;
    text-overflow:ellipsis;
}

@property --aidePaneBackground {
    syntax: '<color>';
    initial-value: #eed48b;
    inherits: false;
}

.aiModifiedField {
    filter: drop-shadow(0 0 20px #e8a317);
    background-color: #ffffff;
    color: rgb(0, 102, 204) !important;
}
.aiModifiedField div.reactjs-tiptap-editor {
    color: rgb(0, 102, 204) !important;
}
.aiModifiedField textarea, .aiModifiedField input {
    color: rgb(0, 102, 204) !important;
}

.aideBackground {
    --aidePaneBackground: #eed48b;
    background-color: var(--aidePaneBackground);
    background-image: linear-gradient(315deg, var(--aidePaneBackground) 0%, #fff 84%);
}

.aidePane {
    --aidePaneBackground: #eed48b;
    background-color: var(--aidePaneBackground);
    background-image: linear-gradient(315deg, var(--aidePaneBackground) 0%, #fff 84%);
    border-radius: 2px;
    box-shadow: 0 6px 4px -7px black;
    transition: --aidePaneBackground 0.3s ease-in-out;
}
.aidePane.batchEditMode {
    --aidePaneBackground: #ee8d4b;
}
.aidePane.over {
    background-color: #fdecb4;
    background-image: linear-gradient(to bottom, #fdf5e3 0%, #fcebc5 11%, #fae3ad 37%, #f6d388 53%, #f5d38a 58%, #f5d68f 68%, #fbe9c1 100%);
}
.aidePane .informative {
    color: #444;
    font-style: italic;
}
.aidePane .informative.disabled {
    color: #888;
}
.grayOverstrike {
    color: #888;
    text-decoration: line-through;
}

.aidePaneTitle {
    border-bottom: 1px solid #A6ABB4;
    --aidePaneBackground: #eed48b;
    background-color: var(--aidePaneBackground);
    background-image: linear-gradient(315deg, var(--aidePaneBackground) 0%, #fff 84%);
}
.aidePane.batchEditMode .aidePaneTitle {
    --aidePaneBackground: #ee8d4b;
}

.aideResultsPane .fancyTitle {
    font-size: 13px;
}
.aideInlineInstructionsPane {
    background-color: #fdf0d5;
    background-image: linear-gradient(315deg, #f0d98a 0%, #fdf6e3 74%);
    /* border-radius: 4px; */
    border: 1px solid #c9a24a;
    border-right: none;
    border-left: none;
    box-shadow: inset 0 1px 3px rgba(180, 140, 40, 0.12), 0 3px 5px -5px rgba(0, 0, 0, 0.45);
}
.aideInlineInstructionsSummary {
    background-color: rgba(180, 130, 20, 0.1);
    border: 1px dashed #c9a24a;
    border-radius: 4px;
    font-style: italic;
    color: #6b5010;
    cursor: pointer;
}
.aideInlineInstructionsSummary:hover {
    background-color: rgba(180, 130, 20, 0.22);
}
.aideResultsPane .buttonRoundedSelected,
.aideResultsPane .buttonRoundedSelectedFocused,
.aideResultsPane .buttonRoundedSelectedOver,
.aideResultsPane .buttonRoundedSelectedFocusedOver,
.aideResultsPane .buttonRoundedSelectedDown,
.aideResultsPane .buttonRoundedSelectedFocusedDown,
.aideResultsPane .buttonRoundedSelectedDisabled {
    background-color: #f5e098 !important;
    background-image: none !important;
    color: #6b5010 !important;
}

.aidePaneTitle .fancyTitle {
    font-size: 13px;
    font-variant: small-caps;
}
.aidePaneTitle .fancyTitle {
    font-size: 13px;
    font-variant: small-caps;
}

.assetInTable {
    width: 100%;
}
.assetInTable td, .assetInTableIcon {
    vertical-align: top;
    white-space: nowrap;
    min-height: 18px;
    padding-top: 2px;
}
.assetInTable td.stretch {
    width: 100%;
    white-space: normal;
}

.aideDefectRow .assetInTable tr td:nth-child(2) span.label span, .aideRequirementRow .assetInTable tr td:nth-child(2) span.label span {
    max-width: 70px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.aideRequirementRow .assetInTable tr td:nth-child(1) {
    max-width: 360px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.assetInTable.mostSimilar {
    font-weight: 700;
    text-decoration: underline;
}

/* note: suggestionRow == not selected rows */
/*.suggestionRow:not(.aideDisabled):not(.done):hover {*/
.aidePane:not(.aideDisabled) .suggestionRow:hover {
    background-color: rgb(255, 255, 255, 0.3);
    box-shadow: 0 6px 6px -6px black;
    transition: all 0.1s ease-in-out;
}
.suggestionRow .aideRequirementRow, .suggestionRowSelected .aideRequirementRow {
}
.suggestionRowSelected {
}
.suggestionRow.done .aideRequirementRow, .suggestionRowSelected.done .aideRequirementRow, .suggestionRow.done .informative, .suggestionRowSelected.done .informative {
    opacity: 0.7;
}

.acceptChangesButtonContainer {
    background-color: rgba(0,0,0,0.14);
    border-top-left-radius: 10px;
}
.acceptChangesButton {
    border-radius: 10px !important;
    font-weight: bold;
}

.highlightMask {
    background-color: #000;
    opacity : 0;
    transition: opacity 0.15s ease-in-out;
}
.highlightMask.maskShown {
    opacity : 0.5;
}

.timestampsItemBottomed {
    position: absolute;
    left: 0 !important;
    right: 0 !important;
    width: unset !important;
    height: 32px !important;
    font-size: 9.5px;
}

.timestampsItemBottomed > div {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    margin-top: -4px;
}
.timestampsItemBottomed > div.onlyItem {
    margin-top: -6px;
}

.timestampsItemBottomed span.timestampsItemField {
    display: block;
    font-weight: 600;
    color: #777;
    text-align: center;
}

.timestampsItemBottomed span.timestampsItemValue {
}

.timestampsItemBottomed span.timestampsItemSeparator {
    background: #999;
    width: 1px;
    display: inline-block;
    height: 60%;
    border: 1px solid #eee;
}

.timestampsItemBottomed > div > span.red span.timestampsItemValue, .timestampsItemBottomed > div > span.red span.timestampsItemField {
    color: #880000;
}

.dot-margin {
    margin-left: 20px;
}

.hideDisabledScrollbars .scrollbarDisabled {
    visibility:hidden;
}

.aiTitleSuggestion, .aiTitleSuggestionOver {
    font-size: 12px;
    font-weight: 700;
    color: #777888;
    padding-left:15px;
}
.aiTitleSuggestionOver {
    text-decoration: underline;
}


del, del.htmldiff {
    text-decoration-color:#B80672;
    text-decoration-thickness:2px;
}
ins, ins.htmldiff {
    color:#B80672;
    text-decoration:none;
}

.oldDescription {
    color:gray;
    text-decoration:none!important;
}


.tallCell.aiAssistedHistory {
    background:#d0d2ffb8;
}

.tallCellDark.aiAssistedHistory {
    background:#b2b5fab8;
}

input[type=file] {
    text-overflow:unset;
}

.orderEditorTile, .orderEditorTileDown, .orderEditorTileSelected, .orderEditorTileOver, .orderEditorTileSelectedOver, .orderEditorTileSelectedDown {
    font-size: 12px;
    font-weight: 700;
    text-overflow: ellipsis;
}

.noParametersHint {
    font-size: 0.95em;
}

.chatBoxMessageInformation {
    font-size:smaller;
    color:gray;
}
.toggleBarText {
    font-size:13px;
    font-variant: all-small-caps;
    color: #444;
    text-shadow: 0px 0px 1px #797979;
}
td.toggleBarText > span {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

span:has(> img.takeThisText), span:has(> img.takeThisTextOver) {
    line-height: 50%;
}
span:has(> img.takeThisText.en):before, span:has(> img.takeThisTextOver.en):before {
    content: 'Take\Athis';
    font-size:11px;
    text-align: center;
    color: #838e9e;
    line-height: 100%;
    display: flex;
    cursor: pointer;
    margin-top: -2px;
}
span:has(> img.takeThisText.fi):before, span:has(> img.takeThisTextOver.fi):before {
    content: 'Ota\Akoppi';
    font-size:11px;
    text-align: center;
    color: #838e9e;
    line-height: 100%;
    display: flex;
    cursor: pointer;
    margin-top: -2px;
}
span:has(> img.takeThisTextOver.en):before, span:has(> img.takeThisTextOver.fi):before {
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px rgba(102, 175, 233);
}

.inlineAvatarIcon {
    margin-top: -6px !important;
    overflow: visible !important;
}

.aiSearchTextInput {
    background-image: linear-gradient(to bottom, rgb(255 255 255) 0%, rgb(255 255 255) 100%), linear-gradient(to left, rgba(255, 255, 255, 0) 0%, rgb(202 201 214) 80%, rgba(255, 255, 255, 0) 100%);
    background-clip: content-box, padding-box;
    text-indent: 4px;
}

.customHover, .jqplot-highlighter-tooltip, .mce-tooltip-inner, .canvasHover {
    border-radius: 6px;
    background-color: rgb(235 242 248);
    border-color: transparent;
    background-image: linear-gradient(315deg, rgb(235 242 248) 0%, rgb(255 255 255) 74%);
    color: #3e3e3e;
    font-size: 11px;
    box-shadow: rgb(58, 74, 83) 0px 1px 6px;
}

.formHover img, .customHover img {
    max-width: 100%;
}

.htmlHover {
    padding:5px;
}

.imgHover {
    height: auto !important;
}

.fadeRight::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 50px;
    height: 100%;
    pointer-events: none;
    background: linear-gradient(to right, rgba(255, 255, 255, 0), rgb(250,252,253));
    z-index: 55555555;
}

.commentFadeBottom::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 25px;
    pointer-events: none;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0), white);
    z-index: 55555555;
}

.overflowVisible {
    overflow: visible !important;
}

td.highlightFormCell, form > table > tbody > tr:has(> td.highlightFormRow) {
    /*    box-shadow: inset -9px 3px 20px 0px rgb(208 227 239);*/
    border-radius: 6px;
    box-shadow: inset 0px 0px 0px 1px #fff;
    background-image: linear-gradient(315deg, #eef0f3 0%, #e3edfb 74%);
}

.quickLinksHintCell {
    border-top: 1px solid #A5B0C0;
    background: white;
}

.treeCount {
    /*    color:red;     */
    font-weight:bold;
    color: white;
    font-size: 10px;
    position: absolute;
    left: 14px;
    top: 6px;
    transform: translateX(-50%);
    border-radius: 5px;
    text-align: center;
    background: #2e9dff;
    padding-left: 3px;
    padding-right: 3px;
    line-height: 1.2;
}

.mb-popover {
}
.mb-popover-content {
    position: absolute;
    left: 20px;
    margin-left: -10px;
    top: 50%;
    transform: translateY(-50%);
    background: rgb(245, 234, 184);
    padding: 10px;
    border: 1px solid rgb(225, 214, 164);
    border-radius: 5px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    white-space: nowrap;
}
.mb-popover-content::before {
    content: "";
    position: absolute;
    top: 50%;
    left: -10px;
    transform: translateY(-50%);
    border-width: 5px;
    border-style: solid;
    border-color: transparent rgb(245, 234, 184) transparent transparent;
}
.mb-popover-content::after {
    content: "";
    position: absolute;
    top: 50%;
    left: -12px;
    transform: translateY(-50%);
    border-width: 6px;
    border-style: solid;
    border-color: transparent rgb(245, 234, 184) transparent transparent;
}

.gh-number {
    font-weight: bold;
    color: #888888;
}

.gh-hoverRepoCreated {
    font-size: 10px;
    color: #888888;
    margin-bottom: 8px;
}

.gh-hoverExcerpt {
    margin-top: 8px;
    margin-bottom: 8px;
    margin-left: 8px;
}

.hoverSep {
    margin-left: -6px;
    margin-right: -6px;
}

.hoverPrefix {
    font-size: 10px;
    font-weight: bold;
    color: #666;
    margin-bottom: 4px;
    text-align: center;
}

.fitImages img {
    max-width: 100%;
}

.setupWizard_GITHUB_SETUP {
    background-color: #EFF3FB;
    background: url(images/github-mark.svg) no-repeat left -30px bottom -30px, linear-gradient(315deg, #EFF3FC 0%, #D5DBE4 74%);
    background-size: 350px, auto;
    background-blend-mode: difference;
}

.setupWizardPhase {
    background: white;
    border-bottom-left-radius: 24px;
}

.setupWizardPhaseTitle {
    font-size: 18px;
}

.setupWizardShowHintsButton {
    border: 1px dashed black;
}

/* GalleryPanel */

.galleryPanel {}

.galleryPanelDisabled {
    opacity: 0.5;
}

.galleryTile {
    background: #f6f9fd;
}
:not(.galleryPanelDisabled) .galleryTile:hover, .galleryTile.focused {
    background: #fdfefe;
}

.galleryTile.addTile, .galleryPanelDisabled .galleryTile.addTile:hover {
    background: #fff;
}
.galleryTile.addTile:hover, .galleryTile.addTile.focused {
    background: #f6f9fd;
}

.galleryImage img {
    object-fit: scale-down;
}

/* DisplayTable */

.display-table {}
.display-table.disabled {}

.display-table-cell-text {
    display: flex;
}

/* the cell is a flex container, so its content div is a flex item and sizes to its CONTENT - it
   does not fill the cell. Anything pinned to the right inside it (the draft badge, float:right)
   therefore stopped at the end of the text rather than at the cell's edge. Growing the content div
   to fill the cell fixes that, and also gives text-overflow:ellipsis on it something to clip
   against. min-width:0 is required for the shrink half to work. */
.display-table-cell-text > div {
    flex: 1 1 auto;
    min-width: 0;
}

.display-table-cell-canvas {
}

.display-table-cell-clip, .display-table-cell-clip > div {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.display-table-cell-center {
    align-items: center;
}

.display-table-indent-cell {
    padding-left: 8px;
}

.display-table-header-cell {
    font-weight: bold;
    color: #565656;
    font-size: 12px;
}

.display-table-group-title-cell {
    font-weight: bold;
    color: #888;
    font-size: 12px;
}
.display-table-group-title-cell::after {
    content: "";
    flex: 1;
    height: 1px;
    background: hsl(240 5.9% 80%);
    margin-left: 16px;
    margin-right: 16px;
}

.display-table-row {}

.display-table-disabled .display-table-row, .display-table-disabled .display-table-empty-message {
    opacity: 0.5;
}

:not(.display-table-disabled) .display-table-row.rollover {
    background-color: #ededed;
}

.display-table-cell-text:hover .hoverquicklink {
    visibility:visible;
}

.notYetCoveredLabel {
    font-weight:bold;
    color: #000;
}

.isCoveredLabel {
    font-weight:bold;
    color: #3D9970;
}

.faded {
    opacity: 0.4;
}

.commentSlidingPane {
    background-image: linear-gradient(340deg, #ffffff 70%, #E5EBF4 85% 100%);
    box-shadow: -6px -5px 6px -8px black;
}

/* special styles for DynamicForms with cellPadding: 0 to remove outer paddings */

.removeTableOuterPadding > div > form:first-of-type table:first-of-type > tbody > tr > td {
    padding: 4px;
}
/* fix: make smartgwt 'take in account' the missing cellpadding when calculating input widths */
.removeTableOuterPadding > div > form:first-of-type table:first-of-type > tbody > tr td.formCell input {
    box-sizing: border-box;
    padding-right: 20px !important;
}
.removeTableOuterPadding > div > form:first-of-type table:first-of-type > tbody > tr:first-child > td { padding-top: 0; }
/* forms have hidden row on top */
.removeTableOuterPadding > div > form:first-of-type table:first-of-type > tbody > tr:nth-child(2) > td { padding-top: 0; }
.removeTableOuterPadding > div > form:first-of-type table:first-of-type > tbody > tr:last-child > td { padding-bottom: 0; }
.removeTableOuterPadding > div > form:first-of-type table:first-of-type > tbody > tr > td:first-child { padding-left: 0; }
.removeTableOuterPadding > div > form:first-of-type table:first-of-type > tbody > tr > td:last-child { padding-right: 0; }

.foldLayout {
    background: linear-gradient(315deg, hsl(220 60% 99% / 1) 0%, hsl(216 22% 97% / 1) 74%);
    box-shadow: 0 4px 6px -6px black;
    border-radius: 8px;
}

.foldLayout .cornerHeaderLeft {
    border-top-left-radius: 8px;
}

.rightFoldingLayout {
    border-left: 1px solid #e8e8e8;
}
.centeredFoldGrip {
    top: calc(50% - 20px) !important;
}

.richTextDisplayItem {
    overflow: auto !important;
    overscroll-behavior: contain;
    cursor: text;
}

.copyToClipboardImage {
    opacity:0.2;
}
.copyToClipboardImage:hover {
    opacity: 1;
}

.topPad26 {
    padding-top: 26px !important;
    scroll-padding-top: 26px !important;
}

/* flatten out some styles for better look */

.toolStrip {
    background: #cfddf2 !important;
    background-image: none !important;
}

.listHeaderButton, .listHeaderButtonOver, .headerButton, .headerButtonSorted {
    background: #f0f2f5 !important;
    background-image: none !important;
}

/* Draft (see branching-plan.md) */

.draftLabel {
    display: flex;
    font-family: Verdana, Arial, sans-serif;
    font-size: 7.8px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: white;
    background: rgb(70 132 187);
    padding: 2px 4px;
    border-radius: 4px;
    align-items: center;
    line-height: normal;
    width: fit-content;
    /* never grow past whatever contains it - a grid cell, most often. Without this a long draft
       name renders straight out under the next column and is chopped mid-glyph by the cell's own
       clipping, rather than ending in an ellipsis. See the .draftLabelText rule below */
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
}

/* A PUBLISHED draft's badge: greyed, because its changes are already in master and anything
   scoped to it now reports master instead. Only ever seen where an existing selection is being
   displayed - a published draft is never offered as a new choice. */
.draftLabelPublished {
    background: rgb(130 138 145);
}

/* A badge inside a DISABLED form item - the report windows pin their requirement picker to the
   draft chosen on the form and disable the picker's own selector. SmartGWT dims a disabled item by
   swapping styles, but the badge draws its own background and colour and so stayed at full
   strength, reading as live next to a greyed-out control. Faded rather than recoloured, so a
   published draft's grey badge still reads as grey.
   SmartGWT spreads a disabled item over a whole family of ...Disabled style names, and there is no
   way to match "anything ending in Disabled" without a fragile attribute selector, so the two
   carriers are named explicitly. Which one is present depends on the form: a plain DynamicForm
   marks the cell td formCellDisabled, while the picker's own toolstrip form leaves its cells
   unstyled and the ...TextDisabled lands on the text box div instead. Both listed - a badge sits
   under whichever is there. */
.formCellDisabled .draftLabel,
.formCellDisabledRTL .draftLabel,
.selectItemTextDisabled .draftLabel,
.selectItemTextDisabledRTL .draftLabel,
.selectItemLiteTextDisabled .draftLabel,
.selectItemLiteTextDisabledRTL .draftLabel,
.staticTextItemDisabled .draftLabel {
    opacity: 0.6;
}

/* the badge is a flex row of icon + text. The ICON must never be what collapses, so the text is
   the flex item that gives way and takes the ellipsis. min-width:0 is what actually permits a flex
   item to shrink below its content width - without it the text refuses to shrink and the badge
   overflows anyway. */
.draftLabel > .draftLabelText {
    flex: 0 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.draftLabel > img {
    flex: 0 0 auto;
}

.windowHeaderText .draftLabel {
    margin-top: 2px;
}

/* Draft badge used as a SUFFIX after a title rather than as a block of its own. The base
   .draftLabel is display:flex + width:fit-content, which makes it its own block and drops it onto
   the next line wherever it is appended to text; inline-flex keeps it on the title's line.

   Deliberately NOT floated: floating breaks it in a flex row (it wraps to a second line) and, when
   the surrounding container is itself floated or narrow, collapses the badge to a sliver of its
   text. Inside a display table cell a descendant rule floats it right - see below. */
.draftLabelInline {
    display: inline-flex !important;
    vertical-align: middle;
    margin-left: 6px;
    /* never give up its own width to a long title - the title ellipsises instead */
    flex-shrink: 0;
    max-width: 100%;
}

.draftLabelInline > .draftLabelText {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* wrapper for a badge that is the whole content of a grid cell (the drafts window's list). A
   ListGrid cell can size itself to its content, which makes the badge's own max-width:100% resolve
   to "as wide as I want" and lets it run under the next column. A block-level wrapper that is
   explicitly 100% wide and clips gives the badge a real box to shrink inside. */
.draftLabelCell {
    display: flex;
    width: 100%;
    min-width: 0;
    overflow: hidden;
}

/* Right-pinned inside a plain ListGrid cell - the run and test set editor grids.
   margin-left:auto rather than float: a float wraps onto a second line as soon as the cell is too
   narrow, which grew the rows. Paired with .testItemCell below, which keeps the row on one line. */
.draftLabelGridRight {
    margin-left: auto;
    max-width: 45%;
}

/* one grid row, clipped rather than wrapped */
.testItemCell {
    display: flex;
    align-items: center;
    white-space: nowrap;
    overflow: hidden;
    width: 100%;
    min-width: 0;
}

/* board tiles are dense - the badge sits in the same row as tags and assignee, so it is scaled
   down to sit beside them without dominating the tile */
.draftLabelSmall {
    font-size: 7px;
    padding: 0 3px;
    max-width: 120px;
    margin-top: 1px;
    margin-bottom: 1px;
}

.draftLabelSmall > img {
    width: 11px !important;
    height: 11px !important;
}

/* Pinned to the right edge, but ONLY inside a display table cell - the requirement and defect
   windows, where the badge would otherwise crowd the name.

   Scoped as a descendant rule rather than as a class the caller picks, because the same badge html
   is reused in places where pinning is actively wrong: in the test execution view's links strip it
   would drop the badge onto a second line and grow the button vertically. One class, and the
   context decides.

   :has() scopes the flex row to cells that actually carry a badge, so every other display table
   cell keeps its existing block layout untouched. Same margin-left:auto trick as the grids, and
   for the same reason - a float wraps onto a second line as soon as the cell is too narrow. */
.display-table-cell-text > div:has(> .draftLabelInline) {
    display: flex;
    align-items: center;
    white-space: nowrap;
    overflow: hidden;
}

.display-table-cell-text .draftLabelInline {
    margin-left: auto;
    max-width: 45%;
}

/* draft-indicator column (see branching-plan.md): a small colored dot, always visible, in
   its own narrow TreeGridField so it's always pinned to the far right of the tree - not
   floated after the node's text, and no icon */
.draftDot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 2px;
    border: 2px solid white;
    vertical-align: middle;
    box-shadow: 0px 0px 1px 0px black;
    margin-bottom: 2px;
}

/* legend trigger shown on the root row's draftIndicator cell whenever a draft is selected -
   hover it to see what the dots below mean, see RequirementTreeHoverCustomizer */
.draftLegendIcon {
    cursor: help;
    opacity: 0.6;
}

.draftLegendIcon:hover {
    opacity: 1;
}

.draftDotNew {
    background: #449d44;
}

.draftDotModified {
    background: #357ebd;
}

.draftDotDeleted {
    background: #a94442;
}

/* deleted-in-draft: strike through just the text, colorized - not the icon/lines */
.draftDeletedText {
    text-decoration: line-through;
    color: #a94442;
}

/* new/modified-in-draft: colorize just the text, same palette as the draftDot* legend, so the
   node's name reads at a glance without having to look over at the indicator column */
.draftNewText {
    color: #449d44;
}

.draftModifiedText {
    color: #357ebd;
}

/* note above master's history saying that drafts hold unpublished changes to the requirement -
   master's own history cannot show them, so without this it looks untouched
   (see branching-plan.md "History and drafts") */
.historyDraftNote {
    font-family: Verdana, Arial, sans-serif;
    font-size: 11px;
    color: #2b4a66;
    background: #e8f1fa;
    border: 1px solid #b5d0e8;
    border-radius: 4px;
    padding: 6px 8px;
    line-height: 1.4;
}

/* drafts window: what the selected draft holds, under the form */
.draftStatsPane {
    font-family: Verdana, Arial, sans-serif;
    font-size: 11px;
    color: #2b4a66;
    background: #f2f6fa;
    border-top: 1px solid #d8e2ec;
    line-height: 1.5;
}

/* "Drafts targeting this milestone" on the milestone summary (see branching-plan.md Phase 3) */
.milestoneDraftsList {
    font-family: Verdana, Arial, sans-serif;
    font-size: 11px;
    padding: 6px 8px;
    line-height: 1.5;
}

.milestoneDraftLink {
    color: rgb(70 132 187);
    text-decoration: underline;
}

/* history grid, updatedBy cell: the user name shares the cell with an optional AI icon and an
   optional draft badge, in a column of fixed width that does not wrap. Laid out so the NAME is what
   gives way - it shrinks and ellipsises - while the icon and badge keep their size and stay
   visible. Before this a long user name truncated the badge away entirely.
   (see branching-plan.md "History and drafts") */
.historyUpdatedByCell {
    display: flex;
    align-items: center;
    gap: 4px;
    width: 100%;
    min-width: 0;
}

.historyUpdatedByCell > .historyUpdatedByName {
    /* min-width:0 is what actually lets a flex item shrink below its content width */
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.historyUpdatedByCell > img {
    flex: 0 0 auto;
}

/* the badge keeps its size, but a very long draft name must not squeeze the name out entirely.
   .draftLabel is itself a flex row (icon + text), so the ellipsis goes on its text child - the icon
   must never be the thing that collapses */
.historyUpdatedByCell > .draftLabel {
    flex: 0 0 auto;
    max-width: 55%;
    overflow: hidden;
    cursor: help;
}

.historyUpdatedByCell > .draftLabel > .draftLabelText {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* marks a panel whose contents are shared with the master spec rather than drafted - edits there
   take effect in master immediately, even while a draft is shown (see branching-plan.md) */
.masterScopeBadge {
    display: inline-block;
    font-family: Verdana, Arial, sans-serif;
    font-size: 7.8px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #6b5900;
    background: #ffe9a8;
    border: 1px solid #e0c777;
    padding: 1px 4px;
    border-radius: 4px;
    margin-left: 6px;
    vertical-align: middle;
    cursor: help;
    text-shadow: none;
}

.cornerHeader > .masterScopeBadge, .cornerHeaderLeft > .masterScopeBadge {
    margin-bottom: 2px;
}