/* vim: set filetype=css: */
body {
  /* zk default is "0 5px" */
  padding: 0;

  font-size: 16px;
}

.factorybg {
  background-color: #FFFFFF;
  background-image: url("../img/factory-lincdoc.png");
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.z-window.logo {
  background-position: center;
  background-repeat: no-repeat;
}

/* make sure the window-content background color is transparent, so we can see the logo in the window class */
.z-window.logo > .z-window-content {
  background-color: transparent;
}

.z-window-content {
  padding: 0;
}

canvas.sig-canvas {
  border: 1px solid #333333;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
}

:root {
  --grid-width: 800px;
  /** default size of the grid row cells */
  --grid-columns: 5px min-content 5px 1fr min-content;
}

.DataEntryGrid {
  max-width: var(--grid-width);
  margin-inline: auto;

  display: grid;
  grid-template-columns: var(--grid-columns);
}

.DataEntryDiv .z-groupbox-3d {
  box-shadow: inset 0 25px 6px -25px #00050a;
}

.DataEntryDiv .z-groupbox-3d .z-groupbox-content {
  border: none;
}

.DataEntryDiv .z-groupbox-3d + .z-groupbox-3d {
  margin-top: 0.5em;
}

.DataEntryDiv .z-label {
  color: black;
  font-size: 16px;
}

.DataEntryDiv .z-grid {
  border-style: solid;
  border-color: #cfcfcf;
  border-width: 1px 1px 1px 1px;
  border-collapse: collapse;
  background-image: none;
}

.DataEntryDiv div.z-grid-body > table {
  border-collapse: collapse;
  table-layout: fixed;
}

.DataEntryDiv tr.z-row td.z-row-inner, .DataEntryDiv tr.z-row .z-cell {
  border-style: solid;
  border-color: #cfcfcf;
  border-width: 1px 0 1px 0;
  border-collapse: collapse;
}

.DataEntryDiv tr.z-row:first-child td.z-row-inner, .DataEntryDiv tr.z-row:first-child .z-cell {
  border-top: none;
}

.DataEntryDiv button {
  height: 34px;
  min-width: 34px;
}

.DataEntryDiv .z-checkbox:focus-within > input[type=checkbox] {
  outline: auto;
}

.DataEntryDiv .z-combobox-input,
.DataEntryDiv .z-bandbox-input,
.DataEntryDiv input.z-textbox,
.DataEntryDiv .z-select {
  height: 34px;
  padding: 4px;

  font-size: 16px;
}

.DataEntryDiv .z-checkbox > .z-checkbox-content {
  min-height: 34px;
  padding: 5px;

  font-size: 16px;
}

.DataEntryDiv .z-select {
  border-radius: 4px;
}

.DataEntryDiv textarea.z-textbox {
  font-size: 16px;
  padding: 8px 4px;
}

.DataEntryDiv .z-combobox-button,
.DataEntryDiv .z-bandbox-button {
  height: 34px;
  min-width: 34px;
  line-height: 24px;
  padding: 4px;
  text-align: center;
}

.DataEntryDiv .z-timebox {
  display: inline-flex;
}

.DataEntryDiv .z-timebox-input {
  flex: 1 0 auto;

  /* the --var-cols is set in zk, when the timebox widget is created */
  min-width: calc(var(--var-cols) * 1ch);
}

.DataEntryDiv .z-timebox-button {
  flex: 0 0 18px;
}

/* First reset the opacity */
.DataEntryDiv .z-datebox-disabled,
.DataEntryDiv .z-timebox-disabled,
.DataEntryDiv .z-combobox-disabled {
  opacity: 1;

  background-color: white;
}

/* Lower the opacity for content if the input widgets */
.DataEntryDiv .z-datebox-disabled *,
.DataEntryDiv .z-timebox-disabled *,
.DataEntryDiv .z-combobox-disabled *,
.DataEntryDiv .z-textbox-readonly,
.DataEntryDiv .z-decimalbox-readonly,
.DataEntryDiv .z-intbox-readonly {
  opacity: .7;
}

/* Change colors */
.DataEntryDiv .z-datebox-text-disabled,
.DataEntryDiv .z-timebox-text-disabled,
.DataEntryDiv .z-combobox-text-disabled,
.DataEntryDiv .z-textbox-readonly,
.DataEntryDiv .z-decimalbox-readonly,
.DataEntryDiv .z-intbox-readonly {
  color: #222 !important;
  background-color: #fcfcfc;

  border: 1px solid #f5f5f5; /* change border for disabled/readonly fields */

  /*background: #f4f4f4 url('../img/readonly.gif') 4px center no-repeat; -- readonly icon support
  padding-left: 22px;
  padding-right: 0;*/
}

.DataEntryDiv .z-datebox-text-disabled,
.DataEntryDiv .z-timebox-text-disabled,
.DataEntryDiv .z-combobox-text-disabled {
  border-right: none; /* remove right border to keep size equal to not disabled/readonly fields, for widgets with button */
}

.DataEntryDiv .z-textbox-readonly,
.DataEntryDiv .z-decimalbox-readonly,
.DataEntryDiv .z-intbox-readonly {
  /*width: calc(100% - 19px); -- readonly icon support*/
}

/* Move the button to the left */
.DataEntryDiv .z-datebox-disabled i.z-datebox-button,
.DataEntryDiv .z-combobox-disabled i.z-combobox-button,
.DataEntryDiv .z-timebox-disabled i.z-timebox-button {
  border: 1px solid #f5f5f5; /* change border for disabled/readonly fields */
  border-left: none; /* remove right border to keep size equal to not disabled/readonly fields */
  /*border-top: transparent 1px solid; -- readonly icon support
  margin-left: -18px;*/
}

/* disabled states for checkbox element */
.DataEntryDiv .z-checkbox input[type=checkbox]:disabled,
.DataEntryDiv .z-checkbox input[type=checkbox]:disabled + label.z-checkbox-content {
  opacity: .7;
  color: #222 !important;
  background: none;
}

.DataEntryDiv .z-datebox-focus .z-datebox-button,
.DataEntryDiv .z-combobox-focus .z-combobox-button,
.DataEntryDiv .z-timebox-focus .z-timebox-button {
  /*background-position-y: -1px; -- readonly icon support*/
}

.DataEntryDiv .statusMarker {
  height: 100%;
}

.DataEntryDiv .statusMarker .statusMarkerContent {
  padding: 3px 2px;
  height: 100%;
}

.DataEntryDiv .statusMarker .statusMarkerRect {
  width: 2px;
  height: 100%;
}

.DataEntryDiv .statusMarker .statusMarkerBullet {
  border-radius: 4px;
  width: 8px;
  height: 8px;
}

.DataEntryDiv .statusMarker .statusMarkerValid {
  background-color: #00FF00;
}

.DataEntryDiv .statusMarker .statusMarkerInvalid {
  background-color: #FF0000;
}

.DataEntryRow > td:first-child {
  padding: 0 0 0 3px !important;
}

.DataEntryDiv .z-hbox-separator {
  min-width: 1px;
}

.CheckboxGroupGrid {
  border: none;
  background: transparent !important;
}

.CheckboxGroupGrid .z-grid-body {
  background: transparent;
  overflow: hidden !important;
}

.CheckboxGroupGrid tr.z-row td.z-row-inner, .GridLayoutNoBorder tr.z-row .z-cell, .GridLayoutNoBorder .z-grid, .z-grid[class~="CheckboxGroupGrid"] {
  border: none;
}

.CheckboxGroupGrid .z-groupbox-3d-cnt {
  border: none;
}

.CheckboxGroupGrid tr.z-grid-odd td.z-row-inner, .CheckboxGroupGrid tr.z-grid-odd .z-cell, .CheckboxGroupGrid tr.z-grid-odd {
  background: transparent;
}

.CheckboxGroupGrid tr.z-row td.z-row-inner {
  background: transparent;
  flex: 1 1 auto;
}

.CheckboxGroupGrid.Flex.z-row td.z-row-inner {
  background: transparent;
  flex: 1 1 auto;
}

/* custom checkbox style */
.DataEntryDiv .z-checkbox {
  --checkbox-color: #003367;
  --checkbox-color-disabled: #484848;

  display: flex;
  align-items: center;

  position: relative;
}

.DataEntryRow input[type=checkbox] {
  position: relative;
  flex: 0 0 22px;

  appearance: none;
  background-color: #fff;
  margin: 0;
  font: inherit;
  color: inherit;
  height: 22px;
  width: 22px;
  border: 2px solid currentColor;
  border-radius: 2px;
  align-self: flex-start;

  top: 5px;
  line-height: 22px;

  overflow: hidden;
}

.DataEntryRow input[type="checkbox"]::before {
  content: "";
  position: absolute;
  inset: 1px;
  transform: scale(0);
  transition: 120ms transform ease-in-out;
  background-color: var(--checkbox-color);
}

.DataEntryRow input[type="checkbox"]:focus {
  border: 2px solid currentColor;
}

.DataEntryRow input[type="checkbox"]:disabled {
  color: var(--checkbox-color-disabled);
  cursor: not-allowed;
}

.DataEntryRow input[type="checkbox"]:checked::before {
  transform: scale(1);
}

.CheckboxGroupGrid .z-checkbox-content {
  white-space: normal;
}

.CheckboxGroupGrid.z-row {
  /*display: flex;
  flex-wrap: wrap;*/
  display: grid;

  grid-template-columns: repeat(auto-fit, minmax(calc(var(--label-size) + 1.5em + 16px), calc(100% / var(--grid-cols))));
}

.CheckboxGroupGrid.Flex.z-row {
  display: inline-flex;
}

.CheckboxGroupGrid.z-row .z-row-inner {
  /*flex: 1 0 auto;*/
}

.CheckboxGroupGrid.z-row .z-row-content {
  padding: 0;
}

.CheckboxGroupGrid .z-checkbox {
  display: flex;
}

/* in case of narrow device make the grid for checkboxes to be displayed in a column */
@media screen and (max-width: 768px) {
  .CheckboxGroupGrid.z-row {
    /*display: flex;
    flex-direction: column;
    flex-wrap: nowrap;*/

    /*grid-template-columns: 1fr;*/
  }
}

.execWin-no-grid-lines .z-grid {
  border: 0;
}

.execWin-no-grid-lines tr.z-row td.z-row-inner {
  border: 0;
}

.hbox-vertical-center tr {
  vertical-align: middle;
}

/*
Colors and images for signature user/field prompt.
These images are copies of the one from the default ZK theme.
That way the defined positions and repeats work correctly.
*/
.signUserPanel .z-panelchildren {
  border-width: 0;
  background-color: #c3e5ff;
}

.signUserPanel .z-panel-cl {
  background-image: url('../img/zk/wnd/panel-clr-blue.png');
}

.signUserPanel .z-panel-cr {
  background-image: url('../img/zk/wnd/panel-clr-blue.png');
}

.signUserPanel .z-panel-tl {
  background-image: url('../img/zk/wnd/panel-corner-blue.png');
}

.signUserPanel .z-panel-tr {
  background-image: url('../img/zk/wnd/panel-corner-blue.png');
}

.signUserPanel .z-panel-bl {
  background-image: url('../img/zk/wnd/panel-corner-blue.png');
}

.signUserPanel .z-panel-br {
  background-image: url('../img/zk/wnd/panel-corner-blue.png');
}

.signUserPanel > .z-panel-body {
  background-color: #c3e5ff;
}

.signUserPanel .z-panel-body {
  font-family: arial, sans-serif;
  font-size: 12px;
  font-weight: normal;
}

.signFieldPanel .z-panelchildren {
  border-width: 0;
  background-color: #F1F9FF;
}

.ios .signWindow {
  max-height: 65vh;
  overflow-y: auto;
}

.signWindow button {
  white-space: nowrap;
}

.signFieldPanel .z-panel-cl {
  background-image: url('../img/zk/wnd/panel-clr.png');
}

.signFieldPanel .z-panel-cr {
  background-image: url('../img/zk/wnd/panel-clr.png');
}

.signFieldPanel .z-panel-tl {
  background-image: url('../img/zk/wnd/panel-corner.png');
}

.signFieldPanel .z-panel-tr {
  background-image: url('../img/zk/wnd/panel-corner.png');
}

.signFieldPanel .z-panel-bl {
  background-image: url('../img/zk/wnd/panel-corner.png');
}

.signFieldPanel .z-panel-br {
  background-image: url('../img/zk/wnd/panel-corner.png');
}

.GridLayoutNoBorder tr.z-row td.z-row-inner, .GridLayoutNoBorder tr.z-row .z-cell, .GridLayoutNoBorder .z-grid, .z-grid[class~="GridLayoutNoBorder"] {
  border: none;
}

.GroupBoxNoBorder.z-groupbox-3d {
  border: none;
  box-shadow: none;
}

.GroupBoxNoBorder .z-groupbox-content {
  padding: 0;
  border: none;
}

.PlusMinusButton {
  padding: 0;
  width: 1.2em;
}

/* Window title: white shadowed text instead of blue */
.z-window-embedded-header, .z-window-modal-header, .z-window-popup-header, .z-window-highlighted-header, .z-window-overlapped-header {
  padding-left: 0.5em;
  color: #00547A;
}

.BlueToolbar {
  background: url('../img/blue_gradient_background.png') repeat-x;
  display: block;
  padding: 6px 0.5em 0 0.5em;
  height: 64px;
}

.BlueToolbar .LogoListCell > table {
  margin-top: -3px;
}

.RepoBrowserTree .z-tree-body table {
  table-layout: fixed;
}

/* Hide the open/close toggle control on the root. */
/*
.RepoBrowserTree .RootRow span.z-tree-ico {
  display:none;
}
*/
/* Shift the non-root nodes to the left because the root toggle is hidden. */
/*
.RepoBrowserTree span.z-tree-spacer:first-child {
  display:none;
}
*/
.RepoBrowserTree .z-treecell-cnt {
  white-space: nowrap;
}

.RepoBrowserFolderList .z-listitem {
  white-space: nowrap;
}

.RepoBrowserFolderList .z-listitem .z-image {
  margin-right: 4px;
}

.RepoBrowserFolderList .z-listitem-img-disabled {
  visibility: hidden;
}

.RepoBrowserFolderList .z-listcell-content > span[class*='z-icon-'] {
  font-size: 14px;
  margin: 0 3px;
}

/* Make the node label item look more like a header than an item */
.RepoBrowserActionMenu .NodeLabelItem {
  background-color: rgba(0, 0, 0, .05);
  border: 1px solid #CFCFCF;
  z-index: 11; /* place above menu separator */
}

.RepoBrowserActionMenu .NodeLabelItem .z-menuitem-content .z-menuitem-text {
  font-weight: bold;
  color: black !important;
}

/* 3D groupbox caption label, match color in listbox header */
.z-groupbox-3d .z-caption .z-label {
  color: #636363;
  font-weight: bold;
  white-space: nowrap;
}

.CheckboxNoWrap label {
  white-space: nowrap;
}

.z-listheader-cnt .z-label {
  font-weight: bold;
}

/*.JdbcRepoConfig .z-groupbox-3d .z-caption-l {
  font-size: 0;
}

.JdbcRepoConfig .z-groupbox-3d .z-caption-r {
  text-align: left;
}*/

.JdbcRepoConfig .FieldsTree .z-label {
  font-size: x-small;
}

.JdbcRepoConfig .FieldsTree .z-checkbox-cnt {
  font-size: x-small;
}

.JdbcRepoConfig .FieldsTree .z-icon {
  font-size: 14px; /* make icons larger */
}

.JdbcRepoConfig .FieldsTree .NameCell .z-treecell-cnt {
  margin-left: -20px;
}

.JdbcRepoConfig .TablesGroupbox .z-groupbox-3d-cnt {
  overflow-y: auto;
}

.JdbcRepoConfig .TableGroupbox {
  margin-bottom: 0.5em;
}

.JdbcRepoConfig .TableGroupbox .z-groupbox-3d-cnt {
  background-color: #e0f3fa;
}

.JdbcRepoConfig .TablesGroupbox .z-caption,
.JdbcRepoConfig .TableGroupbox .z-caption {
  display: flex;
  align-items: center;
}

.JdbcRepoConfig .TablesGroupbox .z-caption-content .z-icon,
.JdbcRepoConfig .TableGroupbox .z-caption-content .z-icon {
  font-size: 14px; /* make icons larger */
}

.JdbcRepoConfig .TableGrid .z-listcell-cnt {
  white-space: nowrap;
}

.JdbcRepoConfig .z-tree .Section {
  background-color: #e0f3fa;
}

.JdbcRepoConfig .FieldIgnored .z-label {
  color: #aaa;
}

.JdbcRepoConfig .TableGrid .z-listbox-body .z-label {
  font-size: x-small;
}

.JdbcRepoConfig .TableGrid .z-listcell-content .z-icon {
  font-size: 14px; /* make icons larger */
}

.JdbcRepoConfig .FieldIgnored .NameCell .z-label {
  text-decoration: line-through;
}

/*
::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 12px;
    height: 12px;
}

::-webkit-scrollbar-thumb {
    border-radius: 8px;
    border: 2px solid white;
    background-color: rgba(0, 0, 0, .3);
}
*/

/*
 * iOS/Safari: buttons containing larger icons and/or vertical orientation
 * get cut off unless we have -webkit-appearance:none
 */
.ios .z-button-os {
  -webkit-appearance: none;
  border-radius: 3px;
  padding: 2px 4px;
}

/* Signature styles */
.SignatureVboxConfig {
  background-color: #cfcfcf;
}

/* Signature info Window */
.SignatureInfoWindow .z-window-overlapped-cnt {
  background-color: #cfcfcf;
}

.BatchSignFieldsFilterWindow .z-window-modal-cnt {
  padding: 0;
}

.BatchSignDocumentsFilterWindow .z-window-modal-cnt {
  padding: 0;
}

.ComboboxMobile .z-hlayout-inner {
  width: 100%;
}

.ComboboxMobile .ComboboxMobileInput {
  display: block;

  position: relative;

  height: 34px;
}

.ComboboxMobile .ComboboxMobileInput .z-textbox {
  position: relative;

  z-index: 1;

  width: calc(100% - 34px); /* full size - 34px (button width) */
}

.ComboboxMobile .ComboboxMobileListbox {
  position: absolute;
  width: 100%;
  inset: 0;
  z-index: 0; /* move back under textbox */

  padding: .3em 1em;

  appearance: none;

  color: transparent;

  border: 1px solid #CFCFCF;

  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3AoJDgkBMsuHCgAAAgBJREFUOMvFk0FrE0EUx/+z2U1oIKGxGmMR7KFYMKKfQGx7FT3mKgqCYAXRg948iAf9CPUivai1OQSUtptIKoLnmja0xqgUGk1mgsuq2bjzdnY8mJZSk6M4MPDevN/7HWbeAP97Ma21AWBUcM54W0DwNoTgEEIwzgXagoMLAS4EBOdo/4lZr7/BAEBrffjGzeuVoaFYqtv1mZTESEpISaCAsBMrpcAYY1LSB3u5eBZACz1BpFS2Lz14eD/wpa+JpCaivvv8hXOUyWTOAIgAgAEAjDF1Knu60PE623ZxSRMR6p838aW1DfeHAyKJ7q8OXi6+UEoF75vN5joAtSvoXYczPTl9uVJZVaZpwrJigNYwmAHTsuB1PDyanQ0r76oXATg7XbuCdDqtDx46sppIJhcX8s/VaOYodK+mQ41iqUQBBW9839/Y+wrG3uRkNvttYvzEnbX1NVJBAMu0oLVGo7GNfH5B1j7WrwghvIECAIhGY1vHJ8bvzs09VsPJFMIwRLn8SnrdbiEei2/t5/8STE1NdhLx1NNaveZ4nqeJAr1k2z+/Npq3q9Wq2s+b/aYrDMPW2Nixq8/mn8wzFtGu+/3WyMiBRj/W6HeYy+X8aCT+VgixvLFZLSNEYWXlte7HmoOnXLdVwO65juvatu0MooxBhWszM2RGjHoyMfzpn/7G38BWKS4RAxxjAAAAAElFTkSuQmCC);
  background-position-x: calc(100% - 9px);
  background-position-y: center;
  background-repeat: no-repeat;
  background-color: inherit;
}

.ComboboxMobile .ComboboxMobileListbox option {
  color: #000;
}

.SignatureReceiptWindow .z-label {
  font-family: Helvetica;
  font-size: 11pt;
  font-weight: normal;
}

.ios .SignatureReceiptWindow {
  max-height: 65vh;
  overflow-y: auto;
}

.CheckboxSignatureWindow.z-window {
  max-width: 800px;
  width: 80vw;

  top: 50% !important;
  transform: translateY(-50%);
}

@media screen and (max-width: 480px){
  .CheckboxSignatureWindow.z-window {
    width: 100vw;
    left: 0 !important;
  }
}

/*
 * #7760
 * iOS strategy: pre-size the page to the full height/width of the device; note
 * that ".ios" is a class that ZK attaches to the page automatically
 */
.ios > .z-page {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow-y: scroll;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}

.addRemoveRows {
  width: 50px;
}

div.filename {
  position: absolute; /* set the position to absolute, so the div is over the textfield */
  top: 0;
  left: 0;

  height: 24px;
  padding: 4px;
  background-color: rgb(240, 240, 240);
  border: 1px solid rgb(207, 207, 207);
  border-radius: 4px;
  color: #c7cccf;

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

.iconButton {
  cursor: pointer;
  width: 24px;
  height: 24px;
  padding: 5px 5px; /* add padding to place the icon to the right */
}

.iconButton.z-icon-lg {
  padding: 5px 6px; /* add padding to place the icon to the right */
}

.ld-browser-toolbar {
  display: flex;
  align-items: center;
}

.ld-browser-toolbar .z-hlayout-inner {
  display: block;
}

.z-toolbarbutton {
  min-width: 40px;
}

.z-toolbarbutton-content > *[class*='z-icon-'],
.z-treecell-content > *[class*='z-icon-'],
.z-listcell-content > *[class*='z-icon-'],
.z-hlayout-inner > *[class*='z-icon-'],
.z-row-content *[class*='z-icon-'],
.z-cell *[class*='z-icon-'] {
  font-size: 14px;
  margin: 0;
}

.z-toolbarbutton-content > *[class*='z-icon-'],
.z-listcell-content > *[class*='z-icon-'],
.z-button > *[class*='z-icon-'] {
  margin: 0;
}

/* zk9.0.x updates */
.z-tabbox.z-tabbox-accordion .z-tab {
  width: 100%;
}

.z-groupbox .z-groupbox-content.z-flex {
  display: flex !important;
}

.z-listitem-checkable.z-listitem-checkbox ~ span.z-label {
  margin-left: 5px;
}

.docPkgFieldSectionTree {
  overflow-y: auto;
}

.z-separator.z-separator-horizontal-bar {
  background-color: #CFCFCF;
  background-image: none;
  height: 1px;
  margin: 3px 0;
}

.z-separator.z-separator-vertical-bar {
  background-color: #CFCFCF;
  background-image: none;
  width: 1px;
  margin: 0 3px;
}

/*
 * "zkbs" CSS class: ZK bootstrap mods to work with new skin: basically make
 * the font size a bit bigger (#7751)
 */
.zkbs div.z-row-cnt,
.zkbs div.z-column-cnt,
.zkbs .z-label,
.zkbs .z-paging input.z-paging-inp,
.zkbs .z-paging span,
.zkbs .z-paging div.z-paging-info,
.zkbs .z-menuitem-text,
.zkbs .z-checkbox-content,
.zkbs .z-textbox,
.zkbs .z-decimalbox,
.zkbs .z-intbox,
.zkbs .z-loading,
.zkbs .z-button-os,
.zkbs .z-messagebox .z-label,
.zkbs .z-window-modal-header,
.zkbs div.z-listheader-cnt,
.zkbs .z-comboitem .z-comboitem-text,
.zkbs .z-button tr td,
.zkbs .z-row-content,
.zkbs .z-html {
  font-size: 16px;
  font-weight: normal;
  border-radius: 4px 4px 4px 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  transition: ease-in-out, .15s;
}

.zkbs .z-timebox {
  display: inline-flex;
  justify-content: space-between;
}

.zkbs .z-datebox-input,
.zkbs .z-timebox-input,
.zkbs .z-combobox-input {
  font-size: 16px;
  font-weight: normal;
  border-radius: 4px 0 0 4px;
  -webkit-border-radius: 4px 0 0 4px;
  -moz-border-radius: 4px 0 0 4px;
  transition: ease-in-out, .15s;

  height: 34px;
}

.zkbs .z-datebox-disabled .z-datebox-input,
.zkbs .z-timebox-disabled .z-timebox-input,
.zkbs .z-combobox-disabled .z-combobox-input {
  color: #333 !important;
}

.zkbs .z-timebox-inp {
  flex-grow: 1;
  flex-shrink: 0;
}

.zkbs .z-datebox-button,
.zkbs .z-timebox-button,
.zkbs .z-combobox-button {
  border-radius: 0 4px 4px 0;
  -moz-border-radius: 0 4px 4px 0;
  -webkit-border-radius: 0 4px 4px 0;
  transition: ease-in-out, .15s;
  height: 34px;
  min-width: 34px;
  line-height: 24px;
  padding: 4px;
  text-align: center;
}

/* timebox updates */
.zkbs .z-timebox-button {
  padding: 0;
}

.zkbs .z-timebox-button:hover > i {
  width: 32px;
  top: auto;
}

.zkbs .z-timebox-button > a {
  display: block;
  position: static;
  height: 16px; /* (full button height - border) / 2 */
  min-width: 32px;
  line-height: 18px;
}

.zkbs .z-timebox-button > a:first-child {
  top: auto;
}

.zkbs .z-timebox-button > a ~ a {
  bottom: auto;
}

/* end timebox updates */

.zkbs .z-checkbox-content-focus,
.zkbs .z-textbox-focus,
.zkbs .z-decimalbox-focus,
.zkbs .z-intbox-focus,
.zkbs .z-datebox-focus > .z-datebox-input,
.zkbs .z-timebox-focus > .z-timebox-input,
.zkbs .z-combobox-focus > .z-combobox-input {
  border-color: #005db4;
  box-shadow: 0 1px 1px rgba(0, 0, 0, .075) inset, 0 0 1px #005db4 inset;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .075) inset, 0 0 1px #005db4 inset;
  -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, .075) inset, 0 0 1px #005db4 inset;
}

.zkbs .z-datebox-focus > .z-datebox-button,
.zkbs .z-timebox-focus > .z-timebox-button,
.zkbs .z-combobox-focus > .z-combobox-button {
  border-color: #005db4;
  box-shadow: 0 1px 1px rgba(0, 0, 0, .075), 0 0 1px #005db4;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .075) inset, 0 0 1px #005db4 inset;
  -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, .075) inset, 0 0 1px #005db4 inset;
}

/* checkboxes */
input[type="checkbox" i]:focus {
  border-color: #005db4;
  box-shadow: 0 1px 1px rgba(0, 0, 0, .075) inset, 0 0 1px #005db4 inset;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .075) inset, 0 0 1px #005db4 inset;
  -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, .075) inset, 0 0 1px #005db4 inset;
}

::-webkit-input-placeholder,
::-moz-placeholder,
:-ms-input-placeholder {
  opacity: 0.75;
}

/* date picker - leave slightly smaller */
.zkbs .z-calendar-calctrl .z-calendar-ctrler,
.zkbs .z-calendar-caldayrow td,
.zkbs .z-calendar-caldow .z-calendar-wkend,
.zkbs .z-calendar-caldow .z-calendar-wkday,
  /* also toolbar button */
.zkbs .z-toolbarbutton-content {
  font-size: 14px;
}

/* grid paging buttons */
.zkbs .z-paging-btn {
  /*transform:scale(1.4);*/
  /* on ipad, zoom looks better than transform */
  zoom: 1.4;
}

/* TimeZoneCombobox adjustment */
.zkbs .ld-tz-combobox .z-combobox-input {
  height: 19px;
}

/* checkboxes */
input[type="checkbox" i] {
  font-size: 16px;
}

/* section headers */
/* used when section border is turned off for the section */
.zkbs .GroupBoxNoBorder.z-groupbox-3d {
  box-shadow: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;

  border: none;
}

/* used when section border is turned on for the section */
.zkbs .z-groupbox-3d-notitle {
  /*box-shadow: inset 0 25px 6px -25px #00050a;
  -webkit-box-shadow: inset 0 25px 6px -25px #00050a;
  -moz-box-shadow: inset 0 25px 6px -25px #00050a;*/
  padding: 15px;
  border: none;
}

/* used to standardize section headings use class in section header html */
.zkbs .sectionHeader {
  line-height: 2;
  font-size: 20px;
  font-family: arial, helvetica, sans-serif;
  color: #00050a
}

.zkbs .CheckboxGroupGrid > .z-grid-body > table {
  //width: initial;
}

.zkbs .portal-include {
  height: 100%;
}

.zkbs .ld-filter-menu .z-menupopup-cnt {
  max-height: 50vh;
  overflow-y: auto;
}

/* processing animation */

.z-modal-mask, .z-apply-mask {
  opacity: 1;
  filter: alpha(opacity=1);
  background-color: rgba(248, 248, 248, .9);
}

.ld-processing {
  position: fixed;

  top: 0;
  left: 0;
  width: 100%;
  height: 100%;

  z-index: 31000;

  display: flex;
  flex: 1 0;
  justify-content: center;
  align-items: center;
}

.z-apply-mask .ld-processing {
  z-index: 89500;
}

.ld-processing .ld-processing-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  background-color: rgba(248, 248, 248, .9);
  border-radius: 1px;
  padding: 12px 48px;
}

.ld-processing .ld-processing-box .ld-processing-label {
  font-family: arial, helvetica, sans-serif;

  font-size: 8pt;
  text-transform: capitalize;
  text-align: center;
}

.ld-processing .ld-processing-box .ld-processing-label.ld-no-transform {
  text-transform: none;
}

.ld-processing .ld-processing-box .ld-processing-animation {
  position: relative;
  height: 70px;
  width: 64px;
}

.ld-processing .ld-processing-box .ld-processing-animation div {
  position: absolute;
  width: 12px;
  background: #4A89DC; /* @pdf-loader-color */;
  border: #75A5E4; /* lighten(@pdf-loader-color, 10%); */
  box-shadow: 0 0 4px #9FC1ED; /* lighten(@pdf-loader-color, 20%); */
  animation: ld-processing-animation 1.2s cubic-bezier(0, 0.5, 0.5, 1) infinite;
}

.ld-processing .ld-processing-box .ld-processing-animation div:nth-child(1) {
  left: 2px;
  animation-delay: -0.32s;
}

.ld-processing .ld-processing-box .ld-processing-animation div:nth-child(2) {
  left: 18px;
  animation-delay: -0.24s;
}

.ld-processing .ld-processing-box .ld-processing-animation div:nth-child(3) {
  left: 34px;
  animation-delay: -0.12s;
}

.ld-processing .ld-processing-box .ld-processing-animation div:nth-child(4) {
  left: 50px;
}

@keyframes ld-processing-animation {
  0% {
    top: 8px;
    height: 64px;
  }
  50%, 100% {
    top: 24px;
    height: 32px;
  }
}

/* loading animation end */

.default-color {
  color: #636363;
}

.primary-color {
  color: #004c97;
}

.danger-color {
  color: #c41313;
}

.success-color {
  color: #0e9749;
}

.warning-color {
  color: #eedf00;
}

/* rating updates - dialog */
.custom-icon-size .z-comboitem-icon {
  font-size: 16px;
  width: 24px;
  text-align: center;
}

.custom-icon-size .z-comboitem-text {
  margin-left: 3px;
}

.colorPickerRow {
  display: flex;
  align-items: center;
  height: 28px;
}

.colorPickerWrapper {
  overflow: hidden;
  width: 24px;
  height: 24px;
  border-radius: 12px;
}

input[type='color'].colorPickerButton {
  padding: 0;
  margin: -12px;
  width: 48px;
  height: 48px;

  cursor: pointer;
}

/* rating updates - rating2 component */
.rating2 .z-rating {
  line-height: 24px;
  pointer-events: none;
}

.rating2 .z-rating > .z-rating-icon {
  font-size: 22px;
  pointer-events: all;
}

.rating2 .z-label {
  /*font-size: small;*/
}

.connectionDown {
  box-sizing: border-box;

  position: fixed;
  top: 5px;
  width: calc(100vw - 10px);

  padding: 5px;
  margin-inline: 5px;

  background: #ffffb9;
  border: 1px solid #7c7416;
  border-radius: 5px;
  color: black;
  font-size: 16px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;

  display: flex;
  align-items: center;
  justify-content: center;

  z-index: 31500;

  opacity: 1;
  cursor: pointer;

  transition: opacity 200ms ease-in 0ms;
}

.connectionDown span:before {
  content: '\00a0';
}

.connectionDownOverlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;

  z-index: 31499;
  background-color: rgba(0 0 0 / 10%);

  pointer-events: all;
}

.connectionDown.out {
  background: #d3fdc6;
  border: 1px solid #608E38;
  color: #2b500a;
  opacity: 0;

  transition: all 200ms ease-in 0ms, opacity 200ms ease-in 500ms;
}