/*! CSS: XAPP: Default: xapp-default.css [AXSRC: $Rev: 37752 $] */

/* --------------------------------
 Brand
 ------------------------------- */
/*
   Universal Palette
   #1d252d - Black Pearl
   #333f48 - Midnight
   #5b6770 - Shuttle Gray
   #f6f6f6 - Silver

   #777777 - Dark Gray
   #9ea2a2 - Mid Gray
   #dddddd - Mid Gray
   #e5e5e5 - Light
*/

body {
   font-family: "cal-ws-regular";
   color: #1d252d;
}

button {
   border: 1px solid #9ea2a2;
}

input,
optgroup,
select,
textarea {
   border: 1px solid #9ea2a2;
}

input,
select {
   min-height: 22px;
}

input[type="checkbox"],
input[type="radio"],
input.xbText {
   height: auto;
}

select[multiple] {
   /*height: auto;*/
}

table {
   font-family: "cal-ws-regular";
   font-style: normal;
   font-size: 12px;
}

thead th,
thead td {
   background-color: #333f48;
   color: #ffffff;
}

/* details and summary elements */
details > summary {
   list-style-type: none;
}

details > summary::-webkit-details-marker {
   display: none;
}

details > summary::before {
   font: normal normal normal 14px/1 AxFontIco;
   text-align: center;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   content: "\f0d7";
}

details[open] > summary::before {
   content: "\f0d8";
}

/* --------------------------------
 XS: Flex Panel
 ------------------------------- */
.xsPanel {
   display: flex;
   flex-direction: column;
   height: 100%;
}

.xsPanelHeader > .xsHeader {
   display: flex;
   flex-shrink: 0;
   align-items: center;
   grid-gap: 6px;
   padding: 6px;
   background-color: #f6f6f6;
   border-bottom: 1px solid #9ea2a2;
   height: 36px;
}

.xsPanelHeader .xsHeaderLabel {
   font-size: 15px;
   font-family: cal-ws-bold;
   white-space: nowrap;
}

.xsPanelBody {
   display: flex;
   flex-direction: column;
   height: 100%;
   position: relative;
}

.xsPanelFooter {
   border-top: 1px solid #9ea2a2;
}

/* --------------------------------
 XL: Layout Control / Components
 ------------------------------- */
.xlFill {
   height: 100%;
}

.xlFillWidth {
   width: 100%;
}

.xlScroller {
   overflow-y: scroll;
   overflow-x: auto;
}

.xlAutoScroller {
   overflow: auto;
}

.xlForcedScroller {
   overflow: scroll;
}

.xlAlignRight {
   display: flex;
   align-items: center;
   gap: 6px;
   margin-left: auto;
}

.xlInlineGroup {
   display: flex;
   align-items: center;
   gap: 6px;
}

.xlInlineGroup input {
   width: auto;
}

.xlGap {
   padding: 6px;
}

/* transitions */
.xi-collapse-panel {
   transition: width 1s;
   width: 0;
}

/* --------------------------------
 XS: Helpers
 ------------------------------- */
.xsFrameBorder {
   border: 1px solid #9ea2a2;
}

hr,
.xsDivH {
   border: 0;
   border-top: 1px solid #9ea2a2;
}

.xsWrapAuto {
   white-space: normal;
}

/* --------------------------------
 XS: DataTable
 ------------------------------- */
.xsDataTable > table {
   border-collapse: separate;
   border-spacing: 6px;
}

.xsDataTable > table td {
   white-space: nowrap;
}

.xsDataTable input[type="text"],
.xsDataTable input[type="password"],
.xsDataTable input[type="file"],
.xsDataTable input[type="number"],
.xsDataTable select {
   width: 100%;
}

.xsDataTable .xlInlineGroup input {
   width: auto;
}

.xsDataTable .xlInlineGroup .xlFillWidth {
   width: 100%;
}

.xsDataTable.xlFill > table:last-child,
.xsDataTable.xlFill > table:last-child tr:last-child {
   height: 100%;
}

.xsDataTable.xlFill > table:last-child tr:last-child {
   vertical-align: top;
}

.xsDataTable + .xsDataTable {
   margin-top: -6px;
}


/* ---------------------------------------
------------------------------------------
 FocusArea: Ui Element Focus State Decoration
------------------------------------------
--------------------------------------- */
/*
   The followin Classes are the main html element root
   outer element classes on either the <body> tag, or the main <div> wrap.
   They fit the main basic admin and power-ui page profiles. This allows us
   to sub-class any style from the root pages ... with conficence it won't affect any
   of the other ui pages if necessary to roll out a quick patch or fix a very specific issue.

   App Main Power Uis: Doc Viewers, Bundling, etc
   .xpAppUiPgx:  First root class usually on the main body or outer wrapp div.

   Admin Pages: All get the initial .xpAdmBase class, then the class closest to its page model.
   .xpAdmBase:    First root class for all admin pages (editors, search grids, config settings, etc).
   .xpAdmUtil:    Admin Utils, Test Utils, and Misc
   .xpAdmCfgSet:  Admin Settings / Option Bag Set Editors
   .xpAdmObjGrid: Admin Object Search Grids.
   .xpAdmObjEdit: Admin Object Data editors. Launched from the search grids.

*/

/* TXDO: CXJH: REVIEW: START */
/* TXDO: CXJH: REVIEW: START */

/* FOCUS: INPUTS */
/* NOTE: all inputs should show focus style, even if read-only. */
.xsDataActions input:focus,
.xsDataActions select:focus,
.xsDataActions textarea:focus,
.xsFocusArea input:not(.xsDataDisplay):focus,
.xsFocusArea select:focus,
.xsFocusArea textarea:focus,
.xsHeader.xsToolbar input:not(.xsDataDisplay):focus,
.xsHeader.xsToolbar select:focus,
.xsHeader.xsToolbar textarea:focus {
   border: solid 1px #ff9900;
   box-shadow: 0 0 4px 1px #969696;
}

.xsDataActions input[type="checkbox"]:focus,
.xsDataActions input[type="radio"]:focus,
.xsFocusArea input[type="checkbox"]:focus,
.xsFocusArea input[type="radio"]:focus,
.xsHeader.xsToolbar input[type="checkbox"]:focus,
.xsHeader.xsToolbar input[type="radio"]:focus {
   border: solid 1px #ff9900;
   box-shadow: 0 0 4px 1px #ff9900;
}

/* FOCUS: BUTTON ICONS */
/* general action button icons */
.xsFocusArea button.xbIcon:not(.xq-dropdown):focus,
.xsHeader.xsToolbar button.xbIcon:not(.xq-dropdown):focus {
   border: dotted 1px #ff9900;
   box-shadow: 0 0 1px 1px #969696;
}

/* Small group action icons not in toolbars. See FaxAgent Settings - JsTree */
.xsDataActions button.xbIcon:not(.xq-dropdown):focus {
   border: solid 1px #ff9900;
   box-shadow: 0 0 3px 1px #969696;
}

/* droplist, swapPanel, menu section toggle, etc */
.xq-dropdown:focus
.xbIcon.xq-dropdown:focus {
   color: #ff9900;
}

/* FOCUS: BUTTON TEXT */
button.xbText:focus {
   border: solid 1px #ff9900;
   box-shadow: 0 0 4px 1px #ff9900;
}

/* main app nav menu or dashboard */
button.xbText.xsNav:focus {
   border: dotted 1px #ff9900;
   box-shadow: none;
}

/* drop list outer div wrapper */
.xsDropList {
   border: solid 1px transparent;
   box-shadow: none;
}
.xsDropList:focus {
   border: solid 1px #ff9900;
   box-shadow: none;
}

/* TXDO: CXJH: REVIEW: END */
/* TXDO: CXJH: REVIEW: END */


/* ------------------------------------
 FocusArea: JS-Tree Specific Focus
 ----------------------------------- */
/* JsTree: Outer Menu Wrap Panel */
.xsFocusArea .xsMenuTree:focus-within {
   border: solid 1px #ff9900;
   box-shadow: 0 0 4px 1px #969696;
}

/* JsTree: root fixed node */
.xsFocusArea .xsMenuTree .xsRootLabelContainer {
   border-bottom: dotted 1px #9ea2a2;
}

.xsFocusArea .xsMenuTree .xsRootLabelContainer:focus-within {
   border: dashed 1px #ff9900;
   box-shadow: 0 0 2px 1px #969696;
}

/* Cancel focus cue for icons in root node since it is decorated */
.xsFocusArea .xsMenuTree .xsRootLabelContainer button.xbIcon:focus {
   border: initial;
   box-shadow: initial;
}

/* JsTree: Child Lead Nodes */
.xsFocusArea .xsMenuTree .jstree-leaf:focus {
   border: dashed 1px #333f48;
   box-shadow: 0 0 2px 1px #969696;
}

/* --------------------------------
TXDO: CXJH: Deprecate
 ------------------------------- */
.xs-push-right {
   margin-left: auto;
}

.xs-inline-group {
   display: flex;
}

/* --------------------------------
 XL: Layout Control / Components
 ------------------------------- */
.xlTableFixed {
   table-layout: fixed;
}

.xlFillBoth {
   width: 100%;
   height: 100%;
}

td > .xlFillBoth {
   position: relative;
}

td > .xlFillBoth > * {
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
}

.xlWrapRelFill {
   position: relative;
   height: 100%;
   min-height: 100%;
}

.xlWrapRelFill > table {
   height: 100%;
}

.xlFillBoth > .xlWrapRelFill > .xsDataTable > table > tbody {
   height: 100%;
}

.xlContainer {
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
}

.xlFitWidthScroller {
   overflow-y: scroll;
   overflow-x: auto;
}

.xlXScroller,
.xlBestFitScroller {
   overflow-y: auto;
   overflow-x: scroll;
   white-space: nowrap;
}

.xlFitWidthScroller > * {
   width: 100%;
   display: block;
}

.xlBestFitScroller > * {
   height: 100%;
}

/* --------------------------------
-----------------------------------
-- AXCM WIDGETS:
-----------------------------------
 ------------------------------- */

/* --------------------------------
 XC: Component regions
 ------------------------------- */
.xcrBody {
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
}

/* --------------------------------
 XWP: Panel parent containers
 ------------------------------- */
.xwpContainer {
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
}

.xwpPanel.xwp-hidden {
   display: none;
}

/* --------------------------------
 XWPD: Panel directional containers
 ------------------------------- */
.xwpdTop {
   position: absolute;
   top: 0;
   right: 0;
   left: 0;
}

.xwpdRight {
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: auto;
}

.xwpdRight,
.xwpdRight > .xwpDock {
   border-left: 1px solid #9ea2a2;
}

.xwpdBottom {
   position: absolute;
   right: 0;
   bottom: 0;
   left: 0;
}

.xwpdBottom,
.xwpdBottom .xwpDock {
   border-top: 1px solid #9ea2a2;
}

.xwpdLeft {
   position: absolute;
   top: 0;
   bottom: 0;
   left: 0;
}

.xwpdLeft,
.xwpdLeft > .xwpDock {
   border-right: 1px solid #9ea2a2;
}

.xwpdCenter {
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   overflow: hidden;
}

/* --------------------------------
 XWPR: Panel region containers
 ------------------------------- */
.xwprBody {
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
}

.xwprFooter {
   position: absolute;
   right: 0;
   bottom: 0;
   left: 0;
   border-top: 1px solid #9ea2a2;
}

/* --------------------------------
 XWP: Panel dock
 ------------------------------- */
.xwpDock {
   display: none;
   position: absolute;
   margin: 0;
   z-index: 2;
}

.xwpdTop > .xwpDock {
   width: 100%;
   height: auto;
   top: 0;
   right: 0;
   left: 0;
   text-align: left;
}

.xwpdRight > .xwpDock {
   height: 100%;
   top: 0;
   bottom: 0;
   left: 0;
} /* left: 0 fix for docking in IE */

.xwpdBottom > .xwpDock {
   width: 100%;
   height: auto;
   top: 0;
   right: 0;
   left: 0;
   text-align: left;
}

.xwpdLeft > .xwpDock {
   height: 100%;
   top: 0;
   right: 0;
   bottom: 0;
}

.xwpdLeft > .xwpDock .xsLabel,
.xwpdRight > .xwpDock .xsLabel {
   position: absolute;
   top: 12px;
   right: 0;
   left: 0;
   display: inline-block;
   white-space: nowrap;
   font-weight: bold;
   letter-spacing: 1px;
   transform: rotate(90deg);
   -webkit-transform: rotate(90deg);
   -moz-transform: rotate(90deg);
   -ms-transform: rotate(90deg);
   -o-transform: rotate(90deg);
}

.xwpdRight .xwpDock .xfi {
   transform: rotate(180deg);
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   -ms-transform: rotate(180deg);
   -o-transform: rotate(180deg);
}

/* NOTEX: figure out how to vertically center this in the button, but keep to the left */
.xwpdTop > .xwpDock .xsLabel,
.xwpdBottom > .xwpDock .xsLabel {
   white-space: nowrap;
}

.xwpdTop > .xwpDock .xfi-dock,
.xwpdBottom > .xwpDock .xfi-dock {
   position: relative;
   left: 50%;
}

.xwpAction.xi-toggle {
   cursor: pointer;
}

/* --------------------------------
 XS: Non panel regions
 ------------------------------- */
.xsRegionBody {
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
}

.xsRegionFooter {
   position: absolute;
   right: 0;
   bottom: 0;
   left: 0;
}

/* --------------------------------
 XS: Nav
 ------------------------------- */
.xsNavPanel {
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
}

.xsNavFrame {
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
}

/* --------------------------------
 XS: Header
 ------------------------------- */
.xsHeader {
   background-color: #f6f6f6;
   border-bottom: 1px solid #9ea2a2;
   vertical-align: middle;
   white-space: nowrap;
   padding-left: 6px;
   padding-right: 6px;
}

.xsHeaderLabel {
   font-family: "cal-ws-bold";
   white-space: nowrap;
}

.xsHeader .xsHeaderLabel,
.xsHeaderLabel {
   font-size: 15px;
}

.xsHeader input[type="text"],
.xsHeader input[type="password"],
.xsHeader select {
   width: auto;
}

.xsHeader > button,
.xsHeader > input,
.xsHeader > select,
.xsHeader > span,
.xsHeader > div,
.xsHeader > div > button,
.xsHeader > div > input,
.xsHeader > div > select,
.xsHeader > div > span {
   vertical-align: middle;
}

.xsHeader .xsObjIdLabel {
   padding-right: 6px;
   white-space: nowrap;
}

.xsDataLabelPanel .xsObjIdLabel.xsLabel,
.xsHeader .xsObjIdLabel.xsLabel {
   font-size: smaller;
}

.xsSectionHeader {
   background: #333f48;
   color: #ffffff;
}

.xsSectionHeader .xsInputCheckPanel {
   float: left;
}

.xsDataCellHeader {
   background: #5b6770;
   color: #ffffff;
}

/* --------------------------------
 XS: Item
 ------------------------------- */
.xsItemHeader {
   padding: 0;
}

.xsItemDetail.xu-drag {
   background-color: #bc8f8f;
}

.xsItemHeader .xsBadge {
   border: 1px solid transparent;
   font-size: 11px;
}

.xsItemHeader .xbIcon {
   padding: 2px 4px;
}

.xsItemBody .xsSectionHeader {
   color: #ffffff;
}

.xsItemDetail {
   background: #ffffff;
   border-bottom: 1px solid #9ea2a2;
}

.xsItemDetail.xu-dropactive.xu-drophover,
.xsItemDetail .xu-dropactive {
   border-left: 4px solid #d8af00;
}

.xsItemDetail.ui-sortable-helper {
   background-color: #f5e4e4;
}

.xsItemDetail .xsRadioHolder {
   background: #ffffff;
   margin-top: 4px;
}

.xsItemDetailGroup .xsMenuItem {
   border-bottom: 1px solid #9ea2a2;
}

/* --------------------------------
 XS: ObjList
 ------------------------------- */
.xsObjList {
   -webkit-touch-callout: none;
   -webkit-user-select: none;
   -khtml-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   -o-user-select: none;
   user-select: none;
}

.xsObjList.xsListBox .xsItemDetail {
   padding-top: 3px;
   padding-bottom: 3px;
}

.xsObjList.xsVersionDrag {
   white-space: nowrap;
}

.xsObjList .xsItemHeader {
   border-top: 1px solid #777777;
}

.xsObjList .xsItemDetail {
   position: relative;
   border-left: 4px solid transparent;
   padding: 6px;
   cursor: pointer;
}

.xsObjList .xsItemDetail:hover {
   background-color: #e6f2f6;
   border-left-color: #4298b5;
}

.xsObjList .xsItemDetail.xi-selected {
   background: rgba(240, 193, 191, 0.3);
   border-left-color: rgba(183, 49, 44, 0.5);
}

.xsObjList .xsItemDetail.xi-active {
   background-color: #f0c1bf;
   border-left-color: #b7312c;
}

.xsObjList .xsItemDetail.xi-changed {
   background: #fff8d8;
   border-left: 4px solid #d8af00;
}

.xsObjList .xsBucket .xsItemDetail {
   padding-left: 0;
}

.xsObjList .xsBucket:first-child .xsItemHeader {
   margin-top: 0px;
}

.xsObjList .xsItemDetail .xsIndicators {
   width: 18px;
   /*text-align: center;*/
   vertical-align: top;
   padding: 0 7px 0 4px;
}

.xsObjList .xsItemDetail .xsIndicators .xfi {
   font-size: 10px;
}

.xsObjList .xsItemDetail .xsInfo1 .xsLabel {
   font-family: "cal-ws-bold";
   font-size: 12px;
}

.xsObjList .xsDetails .xsDataTable > table {
   border-collapse: collapse;
   border-spacing: 0;
}

.xsObjList .xsItemDetail .xsInfo2 .xsLabel,
.xsObjList .xsItemDetail .xsInfo3 .xsLabel,
.xsObjList .xsItemDetail .xsInfo4 .xsLabel {
   font-size: 10px;
}

.xsObjList .xsItemDetail .xsInfo3 .xsDataLabelPanel {
   padding: 0;
}

.xsObjList .xsItemDetail .xsInfo4 .xq-radio .xfi {
   font-size: 12px;
}

.xsObjList .xsItemDetail .xsInfo4 .xsXmitType .xfi {
   font-size: 10px;
}

.xsObjList .xsItemDetail .xsDetails {
   vertical-align: top;
}

.xsObjList .xsItemDetail .xsDetails .xsMenu {
   position: absolute;
   right: 6px;
}

.xsObjList .xsItemDetail .xsDetails .xsInfo1 {
   padding-right: 42px;
}

.xsObjList .xsItemDetail .xsDetails .xsVersionList .xsMenu {
   position: absolute;
   right: 12px;
}

.xsObjList .xsVersionItem {
   border-left: 4px solid transparent;
}

.xsObjList .xsVersionItem:hover {
   border-left-color: #1d252d;
}

.xsObjList .xsVersionItem.xi-selected {
   background-color: #e6f2f6;
   border-left-color: #4298b5;
}

.xsObjList .xsVersionItem.xi-active {
   background-color: #da7b75;
   border-left-color: #b7312c;
}

.xsObjList .xsVersionItem.xi-changed {
   background: #fff8d8;
   border-left: 4px solid #d8af00;
}

.xsObjList .xsVersionItem .xsMenu .xq-radio .xfi {
   font-size: 12px;
}

.xsObjList .xsVersionItem .xsIndicators .xfi {
   font-size: 10px;
}

.xsObjList .xsVersionItem .xsLabel {
   font-size: 10px;
}

.xsObjList .xsVersionItem .xsInfo1 .xsLabel {
   font-family: "cal-ws-bold";
}

.xsObjList .xsVersionItem .xsXmitType .xfi {
   font-size: 10px;
}

.xsObjDataLabel {
   font-family: "cal-ws-bold";
}

.xsObjList .xsMenuItem {
   border-left: 4px solid transparent;
   padding: 4px 6px;
}

.xsObjList .xsMenuItem.xi-selected,
.xsObjList .xsMenuItem:hover {
   background-color: #e6f2f6;
   border-left-color: #4298b5;
}

.xsObjList .xsMenuItem.xi-active {
   background-color: #f0c1bf;
   border-left-color: #b7312c;
}

.xsObjList .xsGroupCtlHeader .xsSectionHeader > td:nth-child(2) {
   padding-left: 0;
}

.xsObjList .xsGroupCtlItems .xbText.xsGroupCtlHeader .xsLabel {
   text-transform: capitalize;
   margin-right: 3px;
}

.xsObjList .xsGroupCtlItems > a {
   font-family: "cal-ws-regular";
   display: block;
   color: #1d252d;
}

.xsObjList .xbText.xsGroupCtlHeader > .xfi {
   margin-right: 4px;
}

.xsObjList .xbText.xsGroupCtlHeader .xsLabel {
   text-transform: capitalize;
}

.xsGroupCtlHeader .xsSectionHeader td {
   padding: 6px 6px;
}

.xsItemDetailGroup .xsGroupCtlHeader .xsSectionHeader td {
   background: #5b6770;
   padding: 2px 6px;
}

.xsObjList .xsInfo5.xsTags {
   display: none;
}

.xsObjList .xsBadge {
   background: #ffffff;
   color: #1d252d;
   -webkit-border-radius: 30px;
   -moz-border-radius: 30px;
   border-radius: 30px;
   margin-right: 3px;
}

/* --------------------------------
 XS: DataTable
 ------------------------------- */
.xsDataTable p {
   padding-left: 0;
}

.xsDataTable > table tr.xsGroupCtlHeader > td,
.xsDataTable > table tr.xsGroupCtlHeader.xsSectionHeader > td,
.xsDataTable > table .xsDataIndAtt,
.xsDataTable > table .xsDataLabelPanel,
.xsDataTable > table .xsDataFieldPanel,
.xsDataTable > table .xsDataLabel,
.xsDataActions .xbText {
   white-space: nowrap;
}

.xsDataTable > table tr.xsSectionHeader td {
   white-space: normal;
}

.xsDataTable > table .xsWrapAuto {
   white-space: normal;
   line-height: normal;
}

.xsDataTable > table .xsDataLabel {
   position: relative;
}

.xi-emphasis,
.xsHelpPanel .xsDataLabel.xi-emphasis,
.xsDataTable > table .xsDataLabel.xi-emphasis,
.xi-emphasis td {
   font-family: "cal-ws-bold";
}

input[type="text"].xsDataDisplay {
   background: none;
   border: 1px solid transparent;
   text-overflow: ellipsis;
}

.xsDataTable.xi-lmodelthin > table {
   border-spacing: 0;
}

.xsDataTable.xi-lmodelthin > table td.xsDataLabelPanel {
   padding: 6px 6px 3px;
}

.xsDataTable.xi-lmodelthin > table td.xsDataFieldPanel {
   padding: 0px 6px 12px;
   padding: 0px 6px 6px;
}

.xsDataTable.xi-lmodelthin > table .xsDataActions {
   padding: 0px 6px 6px;
}

.xsHeader .xsDataTable input[type="text"],
.xsHeader .xsDataTable select {
   width: 100%;
}

tr.xsSpacer td {
   background: none;
   border: 0;
   font-size: 0;
}

.xsDataLog .xsDivH,
.xsDataLog .xsSpacer {
   margin-top: 4px;
   margin-bottom: 4px;
}

.xsCenterCell {
   text-align: center;
}

.xsCenterCell select {
   width: auto;
}

select.xsAuto {
   width: auto;
   min-width: 50px;
}

table .xsVertCell {
   vertical-align: top;
}

table .xsVertRow > td.xsCenterCell {
   vertical-align: middle;
}

.xsVertRow > td,
table .xsVertRow > td input[type="checkbox"],
table .xsVertRow > td input[type="radio"] {
   vertical-align: top;
}

.xsVertRow > td span,
.xsVertRow > td input {
   vertical-align: middle;
}

table .xsVertRow td > * {
   vertical-align: top;
}

.xsVertRow .xsDataLabelPanel {
   padding-top: 4px;
}

.xsSplitRow > td {
   padding-right: 6px;
}

.xsSplitRow > td:last-child {
   padding-right: 0;
}

/* Data Header */
.xsDataTable > table thead .xsDataHeader td {
   background: none;
   color: #1d252d;
}

.xsDataTable > table .xsDataHeader td {
   padding: 3px 0;
}

.xsDataTable > table tbody > .xsDataHeader:first-child td {
}

.xsDataTable > table .xsDataHeader .xsHeaderLabel {
   font-family: "cal-ws-bold";
   font-size: 13px;
   border-bottom: 1px solid #9ea2a2;
   padding: 2px 0 2px;
}

.xsDataTable.xi-lmodelthin > table .xsDataHeader td {
   padding: 3px 6px;
}

/* --------------------------------
 XS: DataTable ReportTable
 ------------------------------- */
.xsDataTable.xsReportTable > table {
   border-collapse: collapse;
   border-spacing: 0;
}

.xsDataTable.xsReportTable > table .xsDataCellHeader .xsDataLabel {
   font-family: "cal-ws-bold";
}

.xsDataTable.xsReportTable > table thead .xbIcon {
   padding: 2px 4px;
}

.xsDataTable.xsReportTable > table thead th,
.xsDataTable.xsReportTable > table thead td {
   border-right: 1px solid #777777;
   font-size: 12px;
}

.xsDataTable.xsReportTable > table th:last-child,
.xsDataTable.xsReportTable > table td:last-child {
   border-right: 0;
}

.xsDataTable.xsReportTable > table tbody .xsSectionHeader td:not(:last-child) {
   border-right: 1px solid #777777;
}

.xsDataTable.xsReportTable > table tr.xsDataCellHeader td:not(:last-child) {
   border-right: 1px solid #f6f6f6;
}

.xsDataTable.xsReportTable > table tr.xsDataCellHeader td {
   border-top: 1px solid #f6f6f6;
   background: #5b6770;
   color: #ffffff;
}

.xsDataTable.xsReportTable > table tr:not(.xsDataCellHeader):nth-child(even) td {
   background: #f6f6f6;
   background-color: #fafafa;
   color: #1d252d;
}

.xsDataTable.xsReportTable > table tr.xsSectionHeader:nth-child(even) td {
   background: #333f48;
   color: #ffffff;
}

.xsDataTable.xsReportTable > table tr.xsSpacer td {
   background: none;
   border: 0;
   font-size: 0;
}

.xsDataTable.xsReportTable > table .xsDataHeader .xsHeaderLabel {
   font-size: 12px;
   border: 0;
   padding: 0;
   display: inline-block;
   text-decoration: underline;
}

/* --------------------------------
 XS: DataTable EditTable
 ------------------------------- */
.xsDataTable.xsEditTable > table {
   border-collapse: collapse;
   border-spacing: 0;
}

.xsDataTable.xsEditTable > table thead th,
.xsDataTable.xsEditTable > table thead td,
.xsDataTable.xsEditTable > table tbody .xsSectionHeader td,
.xsDataTable.xsEditTable > table tbody .xsDataCellHeader td {
   border-right: 1px solid #777777;
}

.xsDataTable.xsEditTable > table th:last-child,
.xsDataTable.xsEditTable > table td:last-child {
   border-right: 0;
}

.xsDataTable.xsEditTable > table .xsSectionHeader td {
   padding: 6px;
}

.xsDataTable.xsEditTable > table .xsSectionHeader .xsHeaderLabel,
.xsDataTable.xsEditTable > table .xsDataCellHeader .xsDataLabel {
   font-family: "cal-ws-bold";
}

.xsDataTable.xsEditTable > table .xsDataHeader th,
.xsDataTable.xsEditTable > table .xsDataHeader td {
   background: #f6f6f6;
   border-right: 1px solid #ffffff;
   color: #1d252d;
   padding: 6px;
}

.xsDataTable.xsEditTable > table .xsDataHeader th:last-child,
.xsDataTable.xsEditTable > table .xsDataHeader td:last-child {
   border-right: 0;
}

.xsDataTable.xsEditTable > table .xsDataHeader .xsHeaderLabel {
   font-size: 12px;
   border: 0;
   padding: 0;
   display: inline-block;
   text-decoration: underline;
}

.xsDataTable.xsEditTable > table thead + tbody > tr:first-child > td,
.xsDataTable.xsEditTable > table .xsSectionHeader + tr > td,
.xsDataTable.xsEditTable > table .xsDataHeader + tr > td {
   padding-top: 6px;
}

.xsDataTable.xsEditTable > table tbody > tr > td {
   padding: 0 6px 6px;
}

.xsDataTable.xsEditTable > table .xsSpacer td {
   padding: 0 6px 6px;
}

/* --------------------------------
 XS: DataTable OpenEditTable
 ------------------------------- */


/* TXDO: CXJH: Review */
/* --------------------------------
 XS: Admin Settings: OptionPanel
 ------------------------------- */
.xsOptionEditData .xsTabPanel {
   margin: 6px;
}

.xsOptionEditData .xsHeaderLabel,
.xsOptionEditData .xsDataLabel {
   text-transform: capitalize;
}

.xsDataTable.xsOptionPanel > table {
   border-collapse: collapse;
   border-spacing: 0;
}

.xsOptionPanel .xsOptionSetHead {
   display: none;
}

.xsOptionPanel .xsOptionSetHead,
.xsOptionPanel .xsOptionGroupHead {
   cursor: pointer;
}

.xsOptionSetBody tr.xsOptionGroupHead {
   border-collapse: separate;
   border-spacing: 1px;
}

.xsOptionPanel td {
   padding: 6px;
}

.xsOptionPanel .xsSectionHeader td {
   border-top: 1px solid #777777;
   border-left: 1px solid #777777;
}

.xsOptionPanel .xsSectionHeader td:first-child,
.xsOptionPanel .xsSectionHeader td:last-child {
   border-left: 0;
}

.xsOptionPanel .xsSectionHeader .xsHeaderLabel {
   font-size: 12px;
}

.xsDataTable.xsOptionPanel textarea {
   min-height: 60px;
   overflow-y: scroll;
   overflow-x: auto;
}

/* NOTE: .xsOptionHintData .xfi hidden until decision to use */
.xsOptionHintData .xfi {
   margin-right: 4px;
   display: none;
}

.xsOptionHintData td {
   background: #ffffdf;
   white-space: normal;
}

/* --------------------------------
 XS: HelpPanel
 ------------------------------- */
.xsHelpPanel,
.xsDataTable td.xsHelpPanel {
   white-space: normal;
   padding-top: 0;
}

.xsHelpPanel .xsDataTable {
   padding-left: 20px;
}

.xsHelpPanel ol {
   padding-left: 40px;
}

.xsHelpPanel ul {
   padding-left: 25px;
}

.xsHelpPanel .xsDataTable thead th,
.xsHelpPanel .xsDataTable thead td {
   background: none;
   color: #1d252d;
}

.xsHelpPanel table thead th,
.xsHelpPanel table thead td {
   text-decoration: underline;
}

.xsHelpPanel pre {
   padding: 6px 6px 6px 40px;
}

.xsHelpPanel .xsHelpTerm {
   font-family: cal-ws-italic;
   margin-left: 12px;
   margin-right: 12px;
}

/* --------------------------------
 XS: Grid
 ------------------------------- */
.xsGrid {
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
}

.xsGrid tr {
   cursor: pointer;
}

/* grid data: count, bool, indicator */
.xsGrid .xsGridCell.xd-cnt,
.xsGrid .xsGridCell.xd-bool,
.xsGrid .xsGridCell.xd-ind,
.xsGrid .xsGridCell.xd-action {
   text-align: center;
}

/* grid data: action */
.xsGrid .xsGridCell.xd-action,
.xsGridCellActions [class*="xq-"] {
   cursor: pointer;
}

/* TXDO: HAIZEL: Temp fix for grid header row height expanding when sort clicked */
/* NOTE: similar fix in xapp-ui.css. Not sure where these should go */
.ui-iggrid-headercell-featureenabled .ui-iggrid-headertext {
   width: -webkit-calc(100%) !important;
   width: -moz-calc(100%) !important;
   width: calc(100%) !important;
}

.ui-iggrid th .ui-iggrid-indicatorcontainer, .ui-iggrid th .ui-iggrid-indicatorcontainer .ui-icon {
   display: none;
}


#xcSearchGrid_hiding_modalDialog_reset_button_lbl {
   color: #fff;
   font-size: 13px;
}

#xcSearchGrid_hiding_modalDialog .ui-iggrid-columnchooser-listitems .ui-iggrid-columnchooser-hidebutton {
   top: 0;
   margin-top: 0;
}

#xcSearchGrid_hiding_modalDialog .ui-dialog .ui-dialog-title {
   width: auto !important;
   font-size: 13px;
   line-height: 17px;
}

/* XTextEditor */

.xsUiXTextEditor {
   background: rgba(0,0,0,0.7);
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   z-index: 100;
}

.xsUiXTextEditorContainer {
   width: 80%;
   height: 90%;
   border: 1px solid black;
   margin: auto;
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
}

/* --------------------------------
 XS: Tab
 ------------------------------- */
.xsTabbar {
   vertical-align: bottom;
}

.xsTabNav {
   display: inline-block;
   list-style: none;
   white-space: nowrap;
   margin-bottom: -1px;
   padding: 0;
   font-size: 0;
}

.xsTabNavItem {
   -webkit-touch-callout: none;
   -webkit-user-select: none;
   -khtml-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   -o-user-select: none;
   user-select: none;
   cursor: pointer;
   margin: 0;
   display: inline-block;
   text-align: center;
   border: 1px solid transparent;
   border-bottom: 0;
}

.xsTabPanel {
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   /*overflow: hidden; /*TXDO: CXJH: overflow*/
}

/* --------------------------------
 XS: Page
 ------------------------------- */
.xsPage {
   position: relative;
   line-height: 0;
   display: inline-block;
   background: #ffffff;
   vertical-align: top;
}

.xsPage {
   -moz-box-shadow: 0px 1px 2px 0px #5b6770;
   -webkit-box-shadow: 0px 1px 2px 0px #5b6770;
   box-shadow: 0px 1px 2px 0px #5b6770;
}

.xsPage:before {
   content: "";
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   border: 2px solid transparent;
}

.xsPage:hover:before {
   border-color: #4298b5;
}

.xsPage.xi-selected:before {
   border-color: rgba(183, 49, 44, 0.5);
}

.xsPage.xi-active:before {
   border-color: #b7312c;
}

/* --------------------------------
 Logon
 ------------------------------- */
.xsAppLogon {
   width: 960px;
}
#xpAppLogonBody {
   background: #f5f5f5;
}

.xsAppLogonBody {
   color: #666666;
}

.xsAppLogonBox {
   background: #ffffff;
   padding: 24px;
}

.xsAppLogonForm {
   background: #f5f5f5;
   display: table-cell;
   margin: 0 40px 25px 0;
   min-width: 254px;
   padding: 25px;
   width: 300px;
}

.xsAppLogonForm button {
   background: #b7312c;
   border: 1px solid #b7312c;
   color: #ffffff;
   vertical-align: top;
}

.xsAppLogonForm label {
   font-size: 1.1em;
}

.xsAppLogonTerms label {
   display: block;
   padding-left: 16px;
   margin-top: -18px;
   line-height: 1.3;
}

.xsAppLogonTermsLink {
   font-family: "cal-ws-bold";
   color: #e74c3c;
   cursor: pointer;
}

.xsLogonAccordTermsLinkContainer .xsHeaderLabel {
   font-family: "cal-ws-bold";
   font-size: 15px;
   margin-bottom: 15px;
}

.xsAppLogonBox input {
   margin: 0 0 16px;
   width: 100%;
}

.xsAppLogonBox input.xi-dataerror {
   border: 1px solid #e74c3c;
}

.xsAppLogonPwd {
   position: relative;
}

.xsAppLogonPwd .xq-pwd {
   position: absolute;
   top: 5px;
   right: 5px;
   cursor: pointer;
}

.xsAppLogonPwd .xq-pwd + input {
   padding-right: 22px;
}

.xsAppLogonBox input[type="checkbox"] {
   margin: 0;
   padding: 0;
   width: auto;
}

.xsAppLogonCaptchaLabel {
   margin-bottom: 2px;
}

.xsAppLogonCaptcha span {
   display: inline-block;
   text-align: center;
   padding: 0 4px;
   vertical-align: top;
   margin-top: 5px;
}

.xsAppLogonCaptcha input,
.xsDataTable .xsAppLogonCaptcha input {
   width: 45px;
   display: inline-block;
   text-align: center;
}

.xsAppLogonSubmitPanel {
   vertical-align: top;
   padding-top: 15px;
}

.xsCheckbox {
   margin-bottom: 8px;
}

.xsCheckbox label {
   font-family: "cal-ws-regular";
   vertical-align: middle;
   text-transform: none;
   margin-left: 2px;
}

.xsPasswordRecovery {
   margin-left: 2px;
}

.xsPasswordRecovery .xfi {
   vertical-align: middle;
}

.xsPasswordRecovery .xsLabel {
   font-family: "cal-ws-bold";
   color: #e74c3c;
   margin-left: 5px;
   position: relative;
   white-space: nowrap;
   cursor: pointer;
   vertical-align: middle;
}

.xsAppLogonErrorMessage {
   color: #e74c3c;
}

.xsAppLogonErrorMessage:before {
   color: #e74c3c;
}

.xsClearLogin {
   margin-top: 5px;
}

.xsClearLogin .xfi {
   font-size: 13px;
   margin-left: 1px;
}

.xsClearLogin .xsLabel {
   font-size: 1.1em;
   margin-left: 4px;
   cursor: pointer;
}

.xsAppLogonNotice {
   display: table-cell;
   min-width: 150px;
   padding-left: 24px;
   vertical-align: top;
}

.xsAppLogonContact {
   font-family: "cal-ws-bold";
   margin-top: 10px;
   white-space: nowrap;
   line-height: 2;
}

.xsAppLogonContact span {
   font-family: "cal-ws-bold";
   line-height: 2;
}

.xsAppLogonContact a {
   color: #e74c3c;
}

.xsAppLogonInfoPanel {
   font-size: x-small;
   border-top: 1px solid #9ea2a2;
   margin-top: 10px;
   margin-bottom: 0;
   padding-bottom: 0;
}

.xsAppLogonInfoPanel span {
   font-family: "cal-ws-bold";
   line-height: 2;
}

.xsAppLogonInfoPanel a {
   color: #e74c3c;
   margin-left: 4px;
}

.xsAppLogonInfoPanel .xsMeta {
   vertical-align: middle;
}

.xsAppLogonInfoPanel .xsAppProductInfo {
   display: table-cell;
   float: left;
}

.xsAppLogonInfoPanel .xsAppPageTime {
   display: table-cell;
   float: right;
}

.xsAppLogonPolicy {
   padding: 24px 0 0;
}

.xsAppLogonNotice p,
.xsAppLogonPolicy p {
   font-family: "cal-ws-bold";
   font-size: 13px;
   text-align: justify;
   color: #999999;
   margin-bottom: 16px;
   line-height: normal;
}

.xsAppLogon .xsTracePanel tr.xsCtlPanel {
   vertical-align: top;
}

.xsAppLogon .xsTracePanel textarea {
   overflow: auto;
   width: 100%;
   height: 50px;
   min-height: 300px;
}

/* --------------------------------
 XB: Buttons
 ------------------------------- */
.xbIcon {
   -webkit-touch-callout: none;
   -webkit-user-select: none;
   -khtml-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   -o-user-select: none;
   user-select: none;
   cursor: pointer;
   border: 1px solid transparent;
   background: none;
   font-style: normal;
   text-align: center;
}

.xbIcon:disabled {
   background: none;
   border: 0;
}

.xbIcon:hover:not([disabled]) {
   -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
   filter: alpha(opacity=60);
   -moz-opacity: 0.6;
   -khtml-opacity: 0.6;
   opacity: 0.6;
}

.xbIcon[class*="-disabled"],
.xbIcon[class*="-disabled"]:hover {
   background: none;
   border: 0;
   cursor: default;
   -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
   filter: alpha(opacity=20);
   -moz-opacity: 0.2;
   -khtml-opacity: 0.2;
   opacity: 0.2;
}

.xwpDock:hover {
   -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
   filter: alpha(opacity=90);
   -moz-opacity: 0.9;
   -khtml-opacity: 0.9;
   opacity: 0.9;
}

.xbText {
   cursor: pointer;
}

input.xbText,
button.xbText {
   -webkit-border-radius: 2px;
   -moz-border-radius: 2px;
   border-radius: 2px;
   font-family: "cal-ws-bold";
   font-size: 12px;
   background: transparent;
   padding: 4px 8px;
   color: #1d252d;
}

.xbText.xsPrimary,
.xbText.xsBrowse,
.xbText.xsSubmit {
   background: #b7312c;
   border: 1px solid #b7312c;
   color: #ffffff;
}

.xbText:disabled,
.xbText:disabled:hover,
.xsPrimaryMenu .xsPrimary:disabled,
.xsPrimaryMenu .xsPrimary:disabled:hover {
   background: none;
   border: 1px solid #dddddd;
   color: #dddddd;
}

.xsToolbar .xbText,
.xbText.xbSmall {
   padding: 4px 6px;
}

input[type="button"].xbText {
   font-family: "cal-ws-bold";
   font-size: 12px;
   cursor: pointer;
   width: auto;
}

a.xbText {
   -webkit-border-radius: 0;
   -moz-border-radius: 0;
   border-radius: 0;
   border: 0;
   cursor: pointer;
   width: auto;
}

.xbText .xfi {
   margin-right: 3px;
}

.xsPrimaryMenu .xbText .xfi {
   margin-right: 0;
}

.xsBtnGrpVert {
   display: inline-block;
}

.xsBtnGrpVert > div,
.xsBtnGrpVert > div [type="button"].xbText {
   width: 100%;
}

.xsBtnGrpVert > div [type="button"].xbText {
   margin-bottom: 6px;
}

.xsBtnGrpVert .xsDivH.xsSpacer {
   margin-top: 8px;
   margin-bottom: 8px;
}

thead td .xsDivV.xsSpacer,
.xsHeader.xsToolbar .xsDivV.xsSpacer {
   margin-left:8px;
   margin-right:8px;
}

.xsMenu > .xbText {
   margin-left: 2px;
}

/* --------------------------------
 XS: SwapPanel
 ------------------------------- */
.xsSwapPanel {
   display: inline-block;
}

.xsSwapMenuGroup {
   display: flex;
   justify-content: space-between;
   padding-top: 3px;
}

.xsSwapMenuGroupSub {
   display: flex;
   justify-content: right;
   align-items: center;
   padding-left: 5px;
}

/* --------------------------------
 XAPP: Admin
 ------------------------------- */
.xpAdmObjEdit .xsObjEditPanel .xsDataLabel {
   text-transform: capitalize;
}

.xsAdminMenuDataPanel .xsMenuItem .xsLabel {
   text-transform: capitalize;
}

.xsDataSearch .xsDataLabel {
   text-transform: capitalize;
}

.xsProcExe .xsDataLabel {
   text-transform: capitalize;
}

.xsProcExe .xsSectionHeader .xsProcTask span.xsLabel {
   text-transform: uppercase;
}

.xsPickListPanel input {
   vertical-align: top;
}

.xsPickListPanel .xbIcon {
   vertical-align: top;
}

.xsObjGridHeader .xsObjGridTitle {
   border-left: 1px solid #9ea2a2;
}

.xsOptionImagePanel {
   display: flex;
   gap: 6px;
   height: 60px;
}

.xsOptionImagePanel .xsImageView {
   flex: 1;
   background: #1d252d;
   border: 1px solid #9ea2a2;
   min-width: 30%;
   max-width: 300px;
   padding: 6px;
   overflow-y: scroll;
   overflow-x: auto;
}

.xsOptionImagePanel .xsActionGroup {
   display: flex;
   flex-direction: column;
}

/* --------------------------------
 XS: Helpers
 ------------------------------- */
.xsTextAlignRight {
   text-align: right;
}

.xsMenu {
   white-space: nowrap;
   text-align: right;
}

.xsDivH {
   width: 100%;
}

.xsDivV {
   display: inline-block;
   border: 0;
   border-left: 1px solid #9ea2a2;
   height: 14px;
}

.xsHeaderDash .xsDivV {
   margin: 0 4px;
   background: #ffffff;
}

.xsLink, .xsLinkText {
   cursor: pointer;
}

.xsLinkText {
   text-decoration: underline;
   white-space: nowrap;
}

.xsMeta {
   font-family: cal-ws-italic;
   text-overflow: ellipsis;
   vertical-align: text-bottom;
   overflow: hidden;
   display: inline-block;
   line-height: normal;
}

.xsMetaHint {
   font-size: smaller;
   text-transform: none;
}

.xsWrapOff {
   white-space: nowrap;
}

.xsWrapForce {
   word-wrap: break-word;
}

/* Uppercase first letter */
.xsCapFirst {
   text-transform: capitalize;
}

/* --------------------------------
 XI: xi-selected, xi-active, xi-required,
     xi-invalid, xi-valid, xi-readonly
 ------------------------------- */
input:-moz-read-only {
   color: #777777;
}

input[readonly="readonly"] {
   background: #f5f5f5;
   border: 1px solid #e5e5e5;
   color: #222222;
   cursor: default;
}

input[readonly="readonly"].xsReadOnlyVisible {
   background: #ffffff;
   border: 1px solid #9ea2a2;
   cursor: default;
}

textarea[readonly="readonly"] {
   background: #f5f5f5;
   border: 1px solid #e5e5e5;
   color: #222222;
   cursor: default;
}

:disabled,
button:disabled,
button[disabled],
input[disabled],
select[disabled],
.xi-disabled {
   background: #f5f5f5;
   border: 1px solid #e5e5e5;
   color: #222222;
   cursor: default;
}

.xsDataValue.xi-readonly {
   background: #f5f5f5;
   border: 1px solid #e5e5e5;
   color: #222222;
   cursor: default;
}

.xi-valid,
.xi-success,
.xsLabel.xi-valid,
.xsHeaderLabel.xi-valid,
.xsDataLabel.xi-valid,
.xsDataValue.xi-valid,
.xsDataMsg.xi-valid,
.xsLabel.xi-success,
.xsHeaderLabel.xi-success,
.xsDataLabel.xi-success,
.xsDataValue.xi-success,
.xsDataMsg.xi-success {
   color: #658d1b;
}

.xi-invalid,
input[readonly="readonly"].xi-invalid {
   border: 1px solid #b7312c;
}

.xi-alert,
.xi-error,
.xsLabel.xi-invalid,
.xsHeaderLabel.xi-invalid,
.xsDataLabel.xi-invalid,
.xsDataMsg.xi-invalid,
.xsLabel.xi-error,
.xsHeaderLabel.xi-error,
.xsDataLabel.xi-error {
   color: #b7312c;
   border: 0;
}

.xsDataValue.xi-error,
.xsDataMsg.xi-error,
.xsDataField.xi-error,
.xsReportTable .xi-required,
.xsDataTable.xsReportTable > table tr.xi-error:nth-child(even) td {
   color: #b7312c;
}

.xi-warn,
.xsDataMsg.xi-warn {
   color: #9f6000;
}

.xsDataIndAtt {
   position: relative;
}

.xsDataIndAtt.xi-required:before,
.xsDataTable:not(.xsReportTable) .xsDataFieldPanel .xi-required:before,
.xsDataTable .xsDataFieldPanel .xi-required:before {
   content: '';
   border-top: 6px solid #b7312c;
   border-right: 6px solid transparent;
   position: absolute;
   top: 0;
   left: 0;
   z-index: 1;
}

/* NOTE: alternate xi-requiredgroup stlye (upper left triangle) */
.xsDataIndAtt.xi-requiredgroup:before,
.xsDataTable:not(.xsReportTable) .xsDataFieldPanel .xi-requiredgroup:before,
.xsDataTable .xsDataFieldPanel .xi-requiredgroup:before {
   content: '';
   border-top: 6px solid #4298b5;
   border-right: 6px solid transparent;
   position: absolute;
   top: 0;
   left: 0;
   z-index: 1;
}

/* --------------------------------
 Filtering
 ------------------------------- */
.xsFilterHide {
   display: none;
}

.xsFilterSearch {
   position: relative;
}

.xsFilterSearch input[type=text] {
   padding-right: 20px;
}

.xsFilterSearch:before {
   position: absolute;
   right: 6px;
   top: 5px;
   font: normal normal normal 12px/1 AxFontIco;
   color: gray;
   content: "\f002";
}

.xsFilterSearch.xi-on:before {
   position: absolute;
   right: 6px;
   top: 5px;
   font: normal normal normal 12px/1 AxFontIco;
   color: gray;
   content: "\f00d";
}

/* --------------------------------
 Visibility
 ------------------------------- */
.xsVisibleOff {
   visibility: hidden;
}

.xsDisplayOff {
   display: none;
}

/* --------------------------------
 Firefox Overrides
 ------------------------------- */
@-moz-document url-prefix() {
   select {
      padding: 0 4px;
   }

   .xbIcon {
      margin-left: 0px;
   }

   .xsDropdown.xbIcon {
      margin-left: -4px;
   }

   .xsSwapBtn {
      margin-right: 0px;
   }
}

/* --------------------------------
 Clearfix
 ------------------------------- */
.clearfix:after {
   visibility: hidden;
   display: block;
   font-size: 0;
   content: " ";
   clear: both;
   height: 0;
}

/* --------------------------------
-----------------------------------
-- States:
-----------------------------------
 ------------------------------- */

/* no mouse highlight */
/*
{
   -webkit-touch-callout: none;
   -webkit-user-select: none;
   -khtml-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
}
*/
/*! CSS: XAPP: UI Base: xapp-ui.css [AXSRC: $Rev: 37607 $] */

/* --------------------------------
 App Brand: Panels and Logos
 ------------------------------- */
/* Brand Containers have one or more child Brand Panels, which will show app-branded
   logos, icons, lables, titles, etc .. usually from DB config options. The Brand Container
   and child Brand Panels are almost always block level elements (div, td, etc).
   Brand Panels need typing using xbp<Type> qualifier css classes, (identical to xwpPanel xwpLeft, etc in LS Mgr).
   Valid Qualifiers: xbpHead = std header / title bar.  xbpDock = docked LsMgr panel icon / labels.
   Eg with brand container being in side a LsMgr dockable header region (xsprHeader)

      <tr class="xwprHeader">
         <td class="xsBrandCont">
            <!-- brand undocked header logo and title panel -->
            <div class="xsBrandPanel xbpHead"><img class="xsBrandImg" .... /><span class="xsBrandLabel">...</span></div>

            <!-- brand docked icon panel -->
            <div class="xsBrandPanel xbpDock"><img class="xsBrandImg" .../><div>
         </td>
      </tr>
*/

/* Cont and Panel Base Cfg */
.xsBrandCont {
   padding-left: 0;
}

.xsBrandCont .xsBrandPanel {
   margin-right: 0;
}

.xsBrandCont .xsBrandPanel,
.xsBrandCont .xsBrandLabel,
.xsBrandCont .xsLabel {
   vertical-align: middle;
}


/* Win Title Bar Speciic */
.xsWinTitleHeader.xi-xtop .xsBrandPanel {
   max-width: 16px;
   max-height: 16px;
}

.xsWinTitleHeader .xsBrandPanel {
   padding: 0;
   margin-left: 3px;
}

/* --------------------------------
 WinTitleComp: Additions
 ------------------------------- */
.xsWinTitleComp.xi-xtra {
   visibility: hidden;
}
.xsWinTitleComp.xi-xtra.xi-xtop {
   visibility: visible;
}

.xsWinTitleComp.xi-spacer {
   margin:0; padding:0; border:0;
}
.xsWinTitleComp.xi-spacer.xi-xtop {
   border-bottom: 6px solid #f6f6f6;
}

/* --------------------------------
 XUI Component: AX.XHintip
 ------------------------------- */
/* std tooltip theme matching our yellow */
.hint--xnav:after {
   color: #000000;
   background-color: #f1c400;
   text-shadow: none;
   opacity: 1.0;
   font-weight: bold;
   font-size: 11px;
   line-height: 11px;
}

/* xtip theme: includes focus aware tooltips */
.hint--xtip:not(.xsIcon):after {
   color: #010101;
   background-color: #fcf3cc;
   text-shadow: initial;
   font-size: 11px;
   line-height: 11px;
}

/* Admin Editors: Data Action Auto-Focus ToolTips */
.xsAppDashPad button.xsIcon.hint--xtip:focus:before,
.xsAppDashPad button.xsIcon.hint--xtip:focus:after,
.xpAdmBase .xsDataActions button.xbIcon.hint--xtip:focus:before,
.xpAdmBase .xsDataActions button.xbIcon.hint--xtip:focus:after {
   visibility: visible;
   opacity: 1;
}

.xsAppDashPad button.xsIcon.hint--xtip:focus:before,
.xsAppDashPad button.xsIcon.hint--xtip:focus:after,
.xpAdmBase .xsDataActions button.xbIcon.hint--xtip:focus:before,
.xpAdmBase .xsDataActions button.xbIcon.hint--xtip:focus:after {
   -webkit-transition-delay: 20ms;
   -moz-transition-delay: 20ms;
   transition-delay: 20ms;
}

button.xsIcon.hint--bottom-left:focus:before,
button.xsIcon.hint--bottom-right:focus:before,
button.xbIcon.hint--bottom-left:focus:before,
button.xbIcon.hint--bottom-right:focus:before {
   margin-top: -11px;
}

button.xsIcon.hint--bottom-left:focus:before,
button.xbIcon.hint--bottom-left:focus:before {
   -webkit-transform: translateY(8px);
   -moz-transform: translateY(8px);
   transform: translateY(8px);
}

button.xsIcon.hint--bottom-left:focus:after,
button.xbIcon.hint--bottom-left:focus:after {
   -webkit-transform: translateX(-100%) translateY(8px);
   -moz-transform: translateX(-100%) translateY(8px);
   transform: translateX(-100%) translateY(8px);
}

button.xsIcon.hint--bottom-right:focus:before,
button.xbIcon.hint--bottom-right:focus:before {
   -webkit-transform: translateY(8px);
   -moz-transform: translateY(8px);
   transform: translateY(8px);
}

button.xsIcon.hint--bottom-right:focus:after,
button.xbIcon.hint--bottom-right:focus:after {
   -webkit-transform: translateY(8px);
   -moz-transform: translateY(8px);
   transform: translateY(8px);
}

/* --------------------------------
 XUI Component: xwMsgPanel (Object not found, etc)
 ------------------------------- */
.xwMsgPanel .xsDivH {
   border-style: dotted;
}

/* --------------------------------
 XUI Component: AX.MultiSelect
 ------------------------------- */
div.xsSelectListPanel {
   width: 100%;
}
div.xsSelectListPanel .selection {
   width: 100%;
}
div.xsSelectListPanel .select2-selection {
   height: 50px;
   min-height: 50px;
   max-height: 50px;
   overflow-y: scroll;
}

div.xsSelectListPanel .select2-container--default .select2-selection--multiple {
   border-radius: inherit;
   border: 1px solid #9ea2a2;
}

div.xsSelectListPanel .select2-container--default.select2-container--focus .select2-selection--multiple {
   border: solid 1px #ff9900;
   box-shadow: 0 0 4px 1px #ff9900;
}

/* --------------------------------
 XUI Component: AX.DocListSelect
 ------------------------------- */
.xsDocListSelectPanel {
   position: relative;
}

.select2-container {
   width: 100% !important;
}

.xsDocListSelect + .select2-container--default .select2-selection--single .select2-selection__arrow {
   height: 22px;
}

.xsDocListSelect + .select2-container--default .select2-selection--single .select2-selection__rendered {
   line-height: 22px;
}

.xsDocListSelect + .select2-container .select2-selection--single {
   height: 22px;
}

/* --------------------------------
 XUI Component: AX.XListBox
 ------------------------------- */
input[type="text"].xsListRowLabel,
input:not([type="checkbox"]):not([type="radio"]):not(.xbText).xsListRowLabel {
   padding: 0;
   height: 18px;
}
.xsListBox .xsListRowPanel.xsListRowLabel {
   padding: 3px 0 3px 0;
}

/* --------------------------------
 XUTIL: Test Utilties in /xapp/
 ------------------------------- */
.xsPageError {
   padding: 30px 6px;
}

.xsPageError .xsLabel {
   font-size: 14px;
   color: #b7312c;
   margin-left: 3px;
}

.xsUtilResultField {
   width: 100%;
}

.xsUtilResultLabel {
   white-space: nowrap;
}

/* NOTE: xq- or xi- */
.xsUtilResultLabel.xq-statuserror {
   color: #b7312c;
}

.xsUtil tr.xsUtilExeResultsPanel {
   vertical-align: top;
}
.xsUtilExeResultsPanel iframe {
   width: 100%;
   height: 400px;
}

/* --------------------------------
 XUI Component: Loading Panels
 ------------------------------- */
.xwMainBodyLoadPanel {
   position: absolute;
   top: 50px;
   left: 0;
   bottom: 0;
   right: 0;
   z-index: 9999;
   padding: 0px 10px 10px 10px;
   font-size: larger;
   text-transform:capitalize;
   font-family: "cal-ws-bold";
}

.xwMainBodyLoadPanel.xi-xpagefull {
   top: 10px;
}

.xwMainBodyLoadPanel.xi-xpanelembed {
   top: 70px;
}

.xwMainBodyLoadPanel .xsLoadingIcon {
   -webkit-animation: spin 1s infinite linear;
   animation: spin 1s infinite linear;
}
.xwMainBodyLoadPanel .xsLoadingIcon .xfi:before {
   content: "\f110";
}
.xwMainBodyLoadPanel .xsLoadingLabel {
   margin-left: 4px;
}

/* --------------------------------
 XUI Component: Toolbar User Menu
 ------------------------------- */
td.xsDataFieldPanel.xsAppProductInfoPanel {
   padding-left: 2px;
   margin-left: 0;
}
td.xsAppProductInfoPanel .xsAppProductInfo {
   margin-top: 4px;
   margin-bottom: 0;
}

td.xsAppProductInfoPanel .xsAppProductInfo .xsMeta {
   padding-left: 4px;
}

.xwuUserQuickMenuBody input[type=text].xsDataDisplay {
   height: auto;
   line-height: 1;
}

/* --------------------------------
 XUI Component: AX.Notify
 ------------------------------- */
.xsNotifyPanel {
   position: absolute;
   z-index: 99999;
   color: #ffffff;
}

.xsNotifyBlock {
   background: rgba(0, 0, 0, 0.5);
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   z-index: 99998;
}

.xsNotifyPanel.xsRightSide {
   max-width: 300px;
   top: 0px;
   right: -300px;
}

/*.xsNotifyPanel.xsTopSide {
   max-width: 400px;
   top: -300px;
   left: 0;
   right: 0;
   margin: auto;
}*/

.xsNotifyPanel .xsNotify {
   border: 0;
   margin: 0 0 10px;
   line-height: normal;
   position: relative;
}

.xsNotifyPanel .xsNotify,
.xsNotifyPanel td {
   padding: 6px;
}

.xsNotifyPanel .xbIcon {
   padding: 0;
   color: #ffffff;
}

.xsNotifyPanel .xsNotifyTitle,
.xsNotifyPanel .xsNotifyMessage {
   text-transform: capitalize;
}

.xsVertRow .xsNotifyMessagePanel {
   vertical-align: middle;
}

.xsDropdownMenu.xsNotifyInfoPanel {
   border: 1px solid #ffffff;
   margin: 0;
}

.xsNotify .xsVertRow + tr > td {
   padding-top: 0;
}

.xsStatusPanel {
  border-top: 1px dashed #778899;
  padding-top: 5px;
  display: none;
}

.xsStatusPanel .xsStatusInfo {
   cursor: pointer;
   white-space: initial;
}

.xsStatusPanel td {
   vertical-align: top;
}

.xsStatusPanel .xbIcon {
   margin: 0;
}

.xsStatusPanel .xfin {
   font-size: 12px;
}

.xsStatusPanel .xsDropdownMenu,
.xsStatusPanel .xsStatusTrace  {
   margin: 0;
}

.xsStatusPanel textarea {
   width: 100%;
   resize: vertical;
}

.xsNotifyPanel .xsNotify.xin-loading,
.xsNotifyPanel .xsNotify.xin-processing,
.xsNotifyPanel .xsNotify.xin-processing-confirm {
   background-color: #2980b9;
}

.xsNotifyPanel .xsNotify.xin-alert {
   background-color: #e67e22;
}

.xsNotifyPanel .xsNotify.xin-info {
   background-color: #e67e22;
}

.xsNotifyPanel .xsNotify.xin-loaded,
.xsNotifyPanel .xsNotify.xin-success {
   background-color: #27ae60;
}

.xsNotifyPanel .xsNotify.xin-error {
   background-color: #e74c3c;
}

.xsNotifyPanel .xsNotify.xin-warning {
   background-color: #f39c12;
}

.xsStatusPanel .xsStatus > div,
.xsNotifyPanel .xsNotify > div {
   display: table-cell;
}

.xsStatusPanel .xsStatus > div:first-child,
.xsNotifyPanel .xsNotify > div:first-child {
   padding-right: 10px;
}

.xsStatusPanel .xsStatus > div:last-child,
.xsNotifyPanel .xsNotify > div:last-child {
   padding-left: 10px;
   vertical-align: top;
}

.xsStatusPanel .xsStatus.xin-style1 > div:first-child,
.xsNotifyPanel .xsNotify.xin-style1 > div:first-child {
   vertical-align: top;
}

.xsStatusPanel .xsStatus.xin-style2 > div:first-child,
.xsNotifyPanel .xsNotify.xin-style2 > div:first-child {
   vertical-align: middle;
}

.xsStatusPanel .xsDropdownMenu,
.xsStatusPanel .xsStatusTrace,
.xsNotify .xsDropdownMenu {
   position: relative;
   background: none;
}

.xsStatusPanel .xsMoreInfo,
.xsNotify:not(.xin-error) .xsMoreInfo {
   display: none;
}

.xsStatusPanel .xsStatus .xsStatusActions,
.xsNotifyPanel .xsNotify .xsNotifyActions {
   display: none;
}

.xsStatusPanel .xsStatus.xis-processing-confirm .xsStatusActions,
.xsNotifyPanel .xsNotify.xin-processing-confirm .xsNotifyActions {
   display: block;
}

.xsStatusPanel .xsStatus.xis-style1 .xsActionGroup,
.xsNotifyPanel .xsNotify.xin-style1 .xsActionGroup {
   text-align: right;
}

.xsStatusPanel button.xsCancel,
.xsNotifyPanel button.xsCancel {
  background: none;
  border: 1px solid #ffffff;
  color: #ffffff;
  margin: 10px auto 0;
}

.xsStatusPanel button.xsClose,
.xsNotifyPanel button.xsClose {
   margin: 0;
   visibility: hidden;
}

.xsNotify.xin-error button.xsClose,
.xis-error button.xsClose {
   visibility: visible;
}


/* Progress Bar Loader */
.xsProgress {
   width: 300px;
   height: 10px;
   overflow: hidden;
   background-color: #f5f5f5;
   border-radius: 4px;
   box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
   display: inline-block;
   vertical-align: top;
   border: 1px solid #9ea2a2;
}

.xsProgressBar {
   float: left;
   width: 0;
   height: 100%;
   font-size: 12px;
   line-height: 20px;
   color: #ffffff;
   text-align: center;
   background-color: #337ab7;
   -webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
   box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
   -webkit-transition: width .6s ease;
   -o-transition: width .6s ease;
   transition: width .6s ease;
}

.xis-processing .xsProgressBar {
   background-color: #3498db;
}

.xis-error .xsProgressBar {
   background-color: #e74c3c;
   width: 50%;
}

.xis-success .xsProgressBar {
   background-color: #27ae60;
}

/* Text Ellipsis Loader */
.xa-ellipsis:after {
  overflow: hidden;
  display: inline-block;
  vertical-align: bottom;
  -webkit-animation: ellipsis steps(4,end) 900ms infinite;
  animation: ellipsis steps(4,end) 900ms infinite;
  content: "\2026";
  width: 0px;
} /* 2026 ascii code for the ellipsis character */

@keyframes ellipsis {
  to {
    width: 1.25em;
  }
}

@-webkit-keyframes ellipsis {
  to {
    width: 1.25em;
  }
}


/* --------------------------------
 XUI Component: AX.XPageDialog
 ------------------------------- */
.xsDialog {
   background: #ffffff;
}

.xsDialog .ui-igdialog-headerimage {
   font-size: 14px;
}

.xsDialog .xsDataTable > table {
   border-collapse: separate;
   border-spacing: 6px;
}

.xsDialog .xsDataTable.xi-lmodelthin > table {
   border-spacing: 0;
}

.xsDialog .xsDataTable thead th {
   padding: 6px;
}

.xsDialog .xsDataTable .xsHeaderLabel {
   font-size: 12px;
   font-family: "cal-ws-bold";
}

.xsDialog .xsDataTable td {

}

.xsDialog textarea {
   width: 100%;
   min-height: 100px;
}

.xsDialog form td {
   white-space: nowrap;
   position: relative;
}

.xsDialog form thead td {
   font-family: "cal-ws-bold";
   font-weight: normal;
   text-transform: uppercase;
   vertical-align: middle;
}

.xsDialog form thead .xbIcon {
   margin: 0;
}

.xsDialog tfoot td {
   text-align: right;
}

.xsDialogContent .xsHeader {
   border: 0;
   border-bottom: 1px solid #9ea2a2;
   border-radius: 0;
}

.xsDialogContent tr.xsSpacer td {
   padding: 3px 0;
}

.xsDialogContent p {
   padding: 6px;
}

.xsDialog .xsGrid {
   padding: 6px;
}

.ax-dialog-input-panel > form {
   margin: 0;
   padding: 0;
}

.ax-dialog-input-field-panel {
   padding-top: 4px;
   padding-bottom: 4px;
}

.ax-dialog-input-hint {
   margin-top: 4px;
   padding: 4px;
   font-size: smaller;
}

/* --------------------------------
/* xsDialogIframe: iframe resides in the body region
 ------------------------------- */
/* TXDO: HACK: Fixes issue with cal-ws custom fonts not displaying in header refion */
.xsDialogIframe .xsRegionHeader {
   /*font-family: Calibri;*/
}
.xsDialogIframe .xsRegionHeader button.xbText {
   /*font-family: Calibri !important;*/
   /*font-weight: bold;*/
}

div.ui-dialog .ui-dialog-titlebar {
   background: #1d252d;
   border: 0;
   border-bottom: 1px solid #9ea2a2;
   border-radius: 0;
   color: #ffffff;
   padding-left: 6px;
   padding-right: 6px;
   font-weight: normal;
   font-size: 11px;
}

div.ui-dialog .ui-dialog-titlebar.ui-state-focus {
   background: #1d252d;
   border: 0;
   border-bottom: 1px solid #9ea2a2;
}

.ui-igdialog .ui-igdialog-headertext {
   line-height: 1.7em;
}

a.ui-igdialog-headerbutton {
   position: static;
   top: initial;
   margin: 0;
}

/* ax-dialog-widget */
div.ui-dialog.ui-widget.ui-widget-content {
   border-radius: 0;
   padding: 0;
   z-index: 2000;
} /* ignite ui dialog is preset to 1000 */

button.ui-button.ui-widget {
   -webkit-appearance: button;
   -webkit-border-radius: 2px;
   -moz-border-radius: 2px;
   border-radius: 2px;
   vertical-align: middle;
   background: none;
   border: 1px solid #9ea2a2;
   color: #333333;
   text-transform: none;
   cursor: pointer;
   padding: 3px 6px;
   line-height: normal;
   font-family: "cal-ws-bold";
   font-size: 1em;
}

button.ui-button.ui-widget:hover {
   background: #b7312c;
   border-color: #b7312c;
   color: #fff;
}

/* TXDO: CXJH: verify ignite buttons not affected by removing default margins */
.ui-dialog .ui-dialog-buttonpane button {
   margin: 0 3px;
}

.ui-button-text-only .ui-button-text {
   padding: 0;
}

button.ui-button.ui-widget.ui-dialog-titlebar-close {
   font: normal normal normal 14px/1 AxFontIco;
   text-align: center;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   padding: 0;
   background: none;
   border: 0;
   color: #ffffff;
}

button.ui-button.ui-widget.ui-dialog-titlebar-close:before {
   content: "\f00d";
}

/* TXDO: CXJH: fix padding for ignite splitter */
.ui-button-text-only.ui-button .ui-button-text {
}
/*padding: .2em .4em; /* ignite css to make jquery-ui splitter button even height */

.ax-dialog-widget-prompt.ui-dialog .ui-dialog-titlebar-close,
.ax-dialog-widget-auth.ui-dialog .ui-dialog-titlebar-close,
button.ui-button.ui-widget.ui-dialog-titlebar-close .ui-icon,
button.ui-button.ui-widget.ui-dialog-titlebar-close .ui-button-text {
   display: none;
}

/* --------------------------------
 Base jquery ui styles
 TXDO: REVIEW: correct location?
 ------------------------------- */
.ui-dialog-content *,
.ui-dialog-content *:before,
.ui-dialog-content *:after {
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
} /* fix for ui- using content-box which overrides border-box in base.css */

.ui-igdialog.ui-dialog .ui-igdialog-content,
.ui-igdialog-content {
   overflow: hidden;
   padding: 0;
}

.ui-widget-overlay {
   background: #000000;
}

.ui-dialog .ui-dialog-content {
   padding: 6px;
}

.ui-dialog .ui-dialog-buttonpane {
   padding: 6px 3px;
}

.ui-dialog .ui-icon {
   margin: 0;
}

.ui-widget,
.ui-widget input,
.ui-widget select,
.ui-widget textarea {
   font-family: "cal-ws-regular";
   font-style: normal;
   font-size: 12px;
}

.ui-accordion .ui-accordion-header {
   font-family: "cal-ws-regular";
   font-style: normal;
}

.ui-widget button {
   font-family: "cal-ws-bold";
   font-style: normal;
   font-size: 12px;
}


/* --------------------------------
 XUI Component: IGDIALOG:
 ------------------------------- */
.xsDialog.xsObjEditor .ui-dialog-content {
   overflow: hidden;
}


/* --------------------------------
 XUI Component: IGGRID:
 ------------------------------- */
.ui-iggrid {
   /*TXDO: CXJH: width: 100% !important;*/
}

/* grid header */
.ui-iggrid th {
   height: 22px;
}

.ui-iggrid th,
.ui-iggrid th.ui-state-default,
.ui-iggrid .ui-iggrid-header,
.ui-iggrid table th {
   height: auto;
   padding: 6px 6px;
   /* padding: 6px 6px; TXDO: CXJH: FAX-SYNC: verify change above*/
}

.ui-iggrid table th.xsGridHeadIcons {
   padding: 5px 6px;
}

.ui-widget-header:not(.ui-iggrid-footer),
.ui-iggrid table th,
.ui-widget-header.ui-state-default {
   background-color: #333f48;
}

span.ui-iggrid-headertext {
   display: inline-block;
}

.ui-iggrid-sortableheader > a,
span.ui-iggrid-headertext {
   min-height: 0;
}

.ui-iggrid-indicatorcontainer {
   margin-top: 0;
   height: 10px;
   min-width: 6px!important
}

/* TXDO: HAIZEL: Proposed non-flex-box header text and sort icon handling
/* NOTE: this is also duplicated in xapp-default.css. Not sure the correct place it should be */
/* NOTE: ig default css for headertext sets these when -featureenabled:
     display:block;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;float:left;line-height:1.6em
*/
/*
.ui-iggrid-header .ui-iggrid-headertext {
   width: -webkit-calc(100%) !important;
   width: -moz-calc(100%) !important;
   width: calc(100%) !important;
   padding-right: 2px;
}

.ui-iggrid-headercell-featureenabled .ui-iggrid-headertext{
   padding-right: 6px;
}
*/

/* TXDO: HAIZEL: Andy's kindergarden css hack */
/* Needs more work ... like the propsed above if not using flex-box */
.ui-iggrid-colheaderasc .ui-iggrid-headertext,
.ui-iggrid-colheaderdesc .ui-iggrid-headertext,
.ui-iggrid-headercell-featureenabled .ui-iggrid-headertext{
   width: -webkit-calc(100% - 6px)!important;
   width: -moz-calc(100% - 6px)!important;
   width: calc(100% - 6px)!important;
}

.ui-iggrid-colheaderasc .ui-iggrid-headertext,
.ui-iggrid-colheaderdesc .ui-iggrid-headertext,
.ui-iggrid-headercell-featureenabled .ui-iggrid-headertext {
   line-height: 12px;
   font-size: 12px;
}

.ui-iggrid .ui-iggrid-header,
.ui-iggrid table th {

}

.xsDataTable.xsReportTable .xwtTable thead td,
.xsDataTable.xsReportTable td.xwtSortCell,
.xsDataTable.xsReportTable .xsLevelGroup > td,
.ui-iggrid th,
.ui-iggrid th.ui-state-default {
   border-right: 1px solid #777777;
}

.ui-iggrid th:last-child,
.ui-iggrid th.ui-state-default:last-child,
.ui-iggrid .ui-iggrid-tablebody td:last-child,
.ui-iggrid .ui-iggrid-tablebody > tr > td:last-child,
.ui-iggrid .ui-iggrid-table > tbody > tr > td:last-child,
.ui-iggrid thead .ui-iggrid-editingcell:last-child {
   border-right: 0;
}

.ui-iggrid th,
.ui-iggrid th.ui-state-default {
   border-left: none;
   border-top: none;
   border-bottom: 0;
}

.ui-iggrid tr.ui-state-focus th,
.ui-iggrid tr.ui-ig-altrecord.ui-state-focus th {
   border-left: none;
   border-top: none !important;
   border-bottom: none !important;
}

.ui-iggrid th.ui-state-hover {
   background: none;
}

.ui-iggrid th.ui-state-active,
.ui-widget-header .ui-state-active {
   background: none;
}

.ui-iggrid th[id*="XAction"] .ui-iggrid-indicatorcontainer,
.ui-iggrid th[id*="XAction"] .ui-iggrid-indicatorcontainer .ui-icon {
   display: none;
}

.ui-iggrid th:first-child,
.ui-iggrid th.ui-state-default:first-child {
   border-left: 4px solid transparent !important;
}

/* grid body */
.ui-iggrid table tbody td,
.ui-iggrid tr.ui-state-focus td,
.ui-iggrid tr.ui-ig-altrecord.ui-state-focus td,
.ui-iggrid td.ui-state-active.ui-state-focus,
.ui-iggrid td.ui-state-focus {
   padding: 6px 6px;
}

.ui-iggrid-record > tr > td {
   white-space: nowrap;
}

.ui-iggrid .ui-iggrid-tablebody td {
   border-right: 1px solid #f6f6f6;
}

.ui-iggrid td.ui-state-hover,
.ui-iggrid .ui-ig-altrecord td.ui-state-hover,
.ui-iggrid td.ui-state-active,
.ui-iggrid .ui-ig-altrecord td.ui-state-active {
   border-left: none;
   border-top: none;
   border-bottom: 0;
}

.ui-iggrid-record > tr > td,
.ui-iggrid tr.ui-state-focus,
.ui-iggrid tr.ui-state-focus td,
.ui-iggrid tr.ui-ig-altrecord.ui-state-focus td {
   border-left: none;
   border-top: none !important;
   border-bottom: none !important;
}

.ui-iggrid .ui-iggrid-tablebody td.ui-state-hover,
.ui-iggrid td.ui-state-highlight {
   background: none;
}

.ui-state-active,
.ui-widget-content .ui-state-active {
   background: none;
}

.ui-iggrid .ui-iggrid-tablebody td.ui-state-active {
   background-color: hsl(2, 61%, 85%);
   border-color: transparent;
}

.ui-iggrid tr.ui-ig-altrecord {
   background-color: #f6f6f6;
}

.ui-iggrid .ui-iggrid-table > tbody > tr > td:first-child,
.ui-iggrid .ui-iggrid-tablebody > tr > td:first-child {
   border-left: 4px solid transparent;
}

.ui-iggrid .ui-iggrid-tablebody > tr > td.ui-state-active:first-child,
.ui-iggrid .ui-iggrid-tablebody > tr > td.ui-state-hover:first-child {
   border-left: 4px solid hsl(2, 61%, 45%) !important;
}

/* grid footer */
.ui-iggrid .ui-iggrid-footer {
   padding: 6px;
   border: 0;
   background: #f5f5f5;
   border: 1px solid #dadada;
}

.ui-iggrid .ui-iggrid-footer .ui-state-hover {
   background: none;
}

/* results */
.ui-iggrid .ui-iggrid-results {
   display: flex;
   align-items: center;
   gap: 3px;
}

.ui-iggrid .ui-iggrid-results span {
   display: flex;
   align-items: center;
   gap: 3px;
}

.ui-iggrid .ui-iggrid-results .xsDivV {
   padding: 0;
}

/* multiselect selected */
.ui-iggrid .xsMultiSelect td.ui-state-active,
.ui-iggrid .xsMultiSelect .ui-ig-altrecord td.ui-state-active {
   background: rgba(183, 49, 44, 0.1);
}

/* multiselect active */
.ui-iggrid .xsMultiSelect .xi-active td.ui-state-active,
.ui-iggrid .xsMultiSelect .xi-active .ui-ig-altrecord td.ui-state-active {
   background-color: hsl(2, 61%, 85%);
}

.ui-iggrid.xq-gridscroll div.ui-widget-header {
   padding-right: 18px;
}

/* TXDO: HACK: temp css update to fix paging size taken from latest iggrid update v2017.1 */
.ui-iggrid .ui-iggrid-paging .ui-iggrid-pagedropdowncontainer .ui-igedit-container,
.ui-iggrid .ui-iggrid-results .ui-igedit-container,
.ui-iggrid .ui-iggrid-paging .ui-iggrid-pagedropdowncontainer {
   float: left;
   height: 1.8em;
   line-height: 1.4em;
}

.ui-iggrid .ui-iggrid-toolbar {
   border: 0;
}

.ui-iggrid-scrolldiv {
   background-color: #ffffff;
   border-bottom: 1px solid #dddddd !important;
   border-bottom: 0 !important;
}

/* --------------------------------
 Ignite Date Picker
 ------------------------------- */
.ui-datepicker th {
   background-color: #333f48;
   color: #ffffff;
}

/* --------------------------------
 Ignite Color Picker
 ------------------------------- */
.ui-igbutton .ui-igbutton-forecolor, .button-split {
   background-image: url("/xapp/component/ignite/images/ui-icons_888888_256x240.png");
   background-size: 384px 370px;
}

.xsColorPicker .ui-igbutton .ui-igbutton-forecolor, .button-square.ui-icon {
   background-image: url("/xapp/component/ignite/images/ui-icons_888888_256x240.png");
   background-position: -148px -254px;
}

.ui-splitbutton .ui-igtoolbarbutton.ui-button {
   margin: 0;
   border: none!important;
} /* Needed to prevent various jquery ui interaction state scenarios */


/* --------------------------------
 FORMS
 ------------------------------- */
form.xsAdminSettingsConfigForm {
   position: relative;
   height: 100%;
}

/* --------------------------------
 XAPP: Accordion
 ------------------------------- */
.xsItemHeader,
.ui-accordion .ui-accordion-header {
   width: 100%;
   padding: 0;
}

.ui-accordion .ui-accordion-content {
   padding: 0;
}

.xsItemDetail.ui-draggable-dragging {
   border: 1px solid hsl(0, 0%, 34.5%);
}

/* --------------------------------
 XAPP: Work Task Monitor
 ------------------------------- */
.xsWorkItemExe .xsDataFieldPanel.xi-proctrc {
   height: 60px;
}

.xsWorkItemExe .xi-proctrc textarea {
   height:100%;
   border: 1px solid hsl(0, 0%, 95%);
}


/* --------------------------------
 XUI Component: AX.HelpPanel
 ------------------------------- */
.xsHelpToggle {
   cursor: pointer;
}


/* --------------------------------
 XWUI: XColorPicker
 ------------------------------- */
.xwuColorPicker.xsDropList {
   background: #ffffff;
   border: 1px solid #cccccc !important;
   padding: 4px !important;
}

.xwuColorPicker.xsDropList .xi-selected {
   background-color: hsl(2.2, 61.2%, 84.5%);
}

.xwuColorPicker.xsDropList .xsDropListItem:hover {
   background-color: hsl(195.1, 46.6%, 93.4%);
}


/* --------------------------------
 XWUI: XTable
 ------------------------------- */
.xwtActionCell {
   width: 0;
   text-align: center;
}

.xwtActionCell input[type="checkbox"] {
   vertical-align: middle;
}

.xwtTable input.xi-xdataerr {
   border: 1px solid #e74c3c;
}

.xwtTable tr.xi-xdataerr td {
   color: #d8000c;
   background-color: #ffbaba;
}

.xwtTable tr.xi-xdatawarn td {
   color: #9f6000;
   background-color: #feefb3;
}

.xwtTable thead td {
   -webkit-touch-callout: none;
   -webkit-user-select: none;
   -khtml-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   -o-user-select: none;
   user-select: none;
}

.xwtTable tbody td.xwtDragCell {
   text-align: center;
   vertical-align: middle;
   padding: 4px;
   cursor: move;
}

.xwtDragCell .xq-dragbar {
   font-size: 6px;
}

.ui-iggrid-sortableheader,
.xwtSortCell .xwtSortPanel {
   position: relative;
   width: 100%;
   padding-right: 6px;
   cursor: pointer;
}

.ui-iggrid-sortableheader:after,
.xwtSortCell .xwtSortPanel:not(.xi-sortasc):not(.xi-sortdesc):after {
   content: '';
   border-top: 6px solid #ffffff;
   border-left: 6px solid transparent;
   position: absolute;
   opacity: 0.4;
}

.ui-iggrid-sortableheader:after {
   top: 6px;
   right: 6px;
}

.xsDataTable thead td.xwtActionCell,
.xsDataTable thead td.xwtSortCell {
   padding: 3px 6px;
}

.xwtSortCell .xwtSortPanel:after {
   top: 0;
   right: 0;
}

.ui-iggrid-sortableheader.ui-iggrid-sortableheaderactive:after,
.ui-iggrid-indicatorcontainer .ui-iggrid-colindicator {
   display: none;
}

.ui-iggrid-indicatorcontainer {
   position: absolute!important;
   right:4px!important;
}

.xwtSortCell .xi-sortasc:after,
.xwtSortCell .xi-sortdesc:after,
.ui-iggrid-colheaderdesc .ui-iggrid-indicatorcontainer:after,
.ui-iggrid-colheaderasc .ui-iggrid-indicatorcontainer:after {
   position: absolute;
   top: 0;
   right: 0;
}

.xwtSortCell .xi-sortasc:after,
.ui-iggrid-colheaderasc .ui-iggrid-indicatorcontainer:after {
   content: '';
   border-top: 6px solid #ffffff;
   border-left: 6px solid transparent;
   top: 0;
   right: 0;
}

.xwtSortCell .xi-sortdesc:after,
.ui-iggrid-colheaderdesc .ui-iggrid-indicatorcontainer:after {
   content: '';
   border-bottom: 6px solid #ffffff;
   border-left: 6px solid transparent;
   bottom: 0;
   right: 0;
}

/* --------------------------------
 XAPP: Process Cfg: BEGIN
 ------------------------------- */
.xsProcCfg div.xsItemHeader {
   display: table;
   width: 100%;
}
.xsProcCfg div.xsItemHeader > div {
   display: table-row;
   white-space: nowrap;
}
.xsProcCfg div.xsItemHeader > div > div {
   display: table-cell;
}

.xsProcCfg div.xsItemHeader div.xsItemIdLabel {
   padding-right: 2px;
   text-align: right;
   white-space: nowrap;
   font-size: smaller;
}

/* --------------------------------
 XAPP: Process Execute: BEGIN
 ------------------------------- */
.xsProcExeBody {
   width: 100%;
   height: 100%;
   overflow: scroll;
}

.xsProcExeBody > div.xsDataLog {
   padding: 2px 4px;
}

.xsProcExeBody .xsDataLogResult {
   display: flex;
   align-items: center;
   gap: 6px;
   padding: 0 6px;
}

.xsProcExeBody div.xsDataTable.xsProcExe > div.xsDataLabelPanel {
   padding: 4px;
}

/* structure */
.xsProcExe div.xsHeader,
.xsProcExe div.xsItemHeader,
.xsProcExe div.xsSectionHeader {
   display: table;
   width: 100%;
}

.xsProcExe div.xsHeader > div,
.xsProcExe div.xsItemHeader > div,
.xsProcExe div.xsSectionHeader > div {
   display: table-row;
   white-space: nowrap;
}

.xsProcExe div.xsHeader > div > div,
.xsProcExe div.xsItemHeader > div > div,
.xsProcExe div.xsSectionHeader > div > div {
   display: table-cell;
}

/* DOC: Trace data value panels usually using textareas.
   XIQ known qualifiers:
       xiq-dbg: debug trace data
       xiq-err: error trace data
       xiq-log: log trace data
       xiq-msg: messages (error, warning, etc)

*/

.xsProcExe .xsDataFieldPanel textarea {
   font-size: 12px;
}

.xsProcExe .xsDataFieldPanel.xi-proctrc {
   height: 60px;
   padding: 0; /* TXDO: CXJH: overrides padding if element is a td */
}

.xsProcExe .xsDataFieldPanel.xi-proctrc.xiq-dbg {
   height: 140px;
}

.xsProcExe .xsDataFieldPanel.xi-proctrc.xiq-err {
   height: 100px;
}

.xsProcExe .xsDataFieldPanel.xi-proctrc.xiq-msg {
   height: 30px;
}

.xsProcExe .xi-proctrc textarea {
   width: 100%;
   height: 100%;
   padding: 4px;
}

/* margins and padding */
.xsProcExe .xsProcTimer {
   padding-right: 4px;
   text-align: right;
   white-space: nowrap;
}

.xsProcExe .xsSectionHeader .xsIcon {
   padding-right: 4px;
}

.xsProcExeBody div.xsSectionHeader {
   padding: 6px;
}

.xsProcExeBody .xsSectionHeader.xsHeader {
   padding: 10px;
   padding-left: 4px;
}

/* typography */
.xsProcExe .xsSectionHeader.xsHeader *,
.xsProcExe .xsSectionHeader.xsFooter *,
.xsProcExe .xsItemGroup .xsSectionHeader.xsItemHeader * {
   text-transform: uppercase;
}

/* colors: background and foreground */
.xsProcExeBody > .xsSectionHeader:first-child > td {

}

.xsProcExeBody .xsSectionHeader > td {
   background: #5b6770;
   color: #ffffff;
}

.xsProcExeBody .xsSectionHeader.xi-results > td {
   background: #1d252d;
   color: #ffffff;
}

.xsProcExeBody .xsItem .xsSectionHeader.xsItemHeader,
.xsProcExeBody .xsItem .xsSectionHeader.xsItemStep {
   background-color: #e6f2f6;
   color: #1d252d;
}

.xsProcExeBody .xsSectionHeader.xi-error {
   background: #b7312c;
   color: #ffffff;
}

.xsProcExeBody .xsSectionHeader.xi-info,
.xsProcExeBody .xsSectionHeader.xi-proctrc.xiq-dbg {
   background-color: #eef1f4;
   color: #1d252d;
}

/* Between item separator Spacer HR for between task item layouts*/
.xsProcExeBody .xsDivH.xsProcItem {
   border-top: 4px solid #27323c;
   margin-bottom: 25px;
}

/* border handle case: */
.xsProcExeBody .xsItem .xsSectionHeader.xsItemHeader {
   border-color: #4298b5;
   border-left: 8px solid;
   padding: 8px;
   padding-left: 10px;
}

.xsProcExeDownloadPanel a {
   display: inline-block;
   text-decoration: underline;
   padding: 6px 6px 6px 0;
}

.xsProcExeDownloadPanel a:link,
.xsProcExeDownloadPanel a:visited,
.xsProcExeDownloadPanel a:hover,
.xsProcExeDownloadPanel a:active {
   color: #1d252d;
}

.xsProcExeDownloadPanel .xbText {
   display: inline-block;
}

.xsDataTable.xsProcExeBody .xsDataLabel.xi-normal {
   font-family: "cal-ws-regular";
}

.xsDataTable.xsProcExeDownloadPanel .xsSectionHeader {
   background-color: #658d1b;
}

.xsDataTable.xsEditTable .xsProcExeBody .xsProcExe {
   background: #333f48;
}


/* --------------------------------
 XAPP: Simple Result Grid multi-row layout
 ------------------------------- */
.xsResultGrid {
   border-collapse: collapse;
   border-spacing: 0;
}

.xsResultGrid tbody.xsResultGridBody tr:nth-child(even) td {
   border-right: 1px solid #ffffff;
}

.xsResultGrid tbody.xsResultGridBody tr:nth-child(even) td:last-child {
   border-right: 0;
}


/* --------------------------------
 XAPP: Admin Search Grid Comps
 ------------------------------- */
.xsQfQualPanel {
   padding-left: 0;
   padding-right: 0;
}
.xsQfQualPanel .xsLabel {
   padding-left: 8px;
   padding-right: 4px;
}

/* quick find flag multi-state button */
.xsQfFlagPanel{
   padding: 0;
   margin: 0;
}

/* quick find flag default states */
.xq-qfFlag .xfi:before,
.xq-qfFlag.xi-state1 .xfi:before {
   content: "\f022";
   vertical-align: middle;
}

.xq-qfFlag.xi-state2 .xfi:before {
   content: "\f21b";
}

.xq-qfFlag.xi-state3 .xfi:before {
   content: "\f0c0";
}

.xq-qfFlag.xi-state4 .xfi:before {
   content: "\f009";
}

/* quick find usage count: any, used, not used */
.xsQfFlagPanel.xi-usage .xq-qfFlag .xfi:before,
.xsQfFlagPanel.xi-usage .xq-qfFlag.xi-state1 .xfi:before {
   content: "\f096";
}
.xsQfFlagPanel.xi-usage .xq-qfFlag.xi-state2 .xfi:before {
   content: "\f0fe";
}
.xsQfFlagPanel.xi-usage .xq-qfFlag.xi-state3 .xfi:before {
   content: "\f146";
}

/* quick find object ownership: any, user owned, tenant owned */
.xsQfFlagPanel.xi-fobjown .xq-qfFlag .xfi:before,
.xsQfFlagPanel.xi-fobjown .xq-qfFlag.xi-state1 .xfi:before {
   content: "\f247";
}
.xsQfFlagPanel.xi-fobjown .xq-qfFlag.xi-state2 .xfi:before {
   content: "\f2c0";
}
.xsQfFlagPanel.xi-fobjown .xq-qfFlag.xi-state3 .xfi:before {
   content: "\f19c";
}

/* quick find api processed filter: processed, not processed, all */
.xsQfFlagPanel.xi-fapiproc .xq-qfFlag .xfi:before,
.xsQfFlagPanel.xi-fapiproc .xq-qfFlag.xi-state1 .xfi:before {
   content: "\f00c";
}
.xsQfFlagPanel.xi-fapiproc .xq-qfFlag.xi-state2 .xfi:before {
   content: "\f05e";
}
.xsQfFlagPanel.xi-fapiproc .xq-qfFlag.xi-state3 .xfi:before {
   content: "\f0ae";
}

/* quick find user delete filter: undeleted, deleted, all */
.xsQfFlagPanel.xi-fusrdel .xq-qfFlag .xfi:before,
.xsQfFlagPanel.xi-fusrdel .xq-qfFlag.xi-state1 .xfi:before {
   content: "\f007";
}
.xsQfFlagPanel.xi-fusrdel .xq-qfFlag.xi-state2 .xfi:before {
   content: "\f21b";
}
.xsQfFlagPanel.xi-fusrdel .xq-qfFlag.xi-state3 .xfi:before {
   content: "\f0c0";
}

/* quick find local indicator filter: global, local, all */
.xsQfFlagPanel.xi-flocalind .xq-qfFlag .xfi:before,
.xsQfFlagPanel.xi-flocalind .xq-qfFlag.xi-state1 .xfi:before {
   content: "\f0ac";
}
.xsQfFlagPanel.xi-flocalind .xq-qfFlag.xi-state2 .xfi:before {
   content: "\f015";
}
.xsQfFlagPanel.xi-flocalind .xq-qfFlag.xi-state3 .xfi:before {
   content: "\f29a";
}
/*! CSS: XTheme: AX-Ui: xtheme-ax-ui.css [AXSRC: $Rev: 36830 $] */
