body[theme="zroomb"], .smart-ui-component[theme="zroomb"] {
  --smart-primary-rgb: 0, 103, 122;
  --smart-secondary-rgb: 229, 240, 241;
  --smart-primary: rgba(var(--smart-primary-rgb), 1);
  --smart-secondary: rgba(var(--smart-secondary-rgb), 1);
  --smart-disabled: #535353; /* The theme primary color in disabled state. */
  --smart-disabled-color: #fff; /* Text color on top of a theme background in disabled state */
  --smart-editor-selection: var(--smart-primary);
  --smart-editor-selection-color: var(--smart-primary-color);
  --smart-ui-state-active: var(--smart-primary);
  --smart-ui-state-color-active: var(--smart-primary-color);
  --smart-ui-state-border-active: var(--smart-primary);
  --smart-ui-state-selected: var(--smart-secondary);
  --smart-ui-state-color-selected: var(--smart-primary);
  --smart-ui-state-border-selected: rgba(var(--smart-primary-rgb), .1);
}

.required-label::after {
  content: " *";
  color: red;
}

.required-label-tooltip {
  position: relative;
}

.required-label-tooltip:hover::before {
  content: attr(data-tooltip);
  position: absolute;
  left: 100%;
  top: 50%;
  transform: translateY(-50%);
  margin-left: 5px;
  background-color: #333;
  color: white;
  padding: 5px;
  border-radius: 3px;
  font-size: 12px;
  white-space: nowrap;
  z-index: 1000;
}


/* Making tables even more narrow: */
/* - smaller font size */
/* - less padding */
/* - smaller row height */
th,td {
  font-size: 0.8rem !important;
  padding: 0.1rem !important;
  vertical-align: middle !important;
  overflow-y: hidden !important;
  white-space: nowrap !important;
}
td {
  /* same color as horizontal border */
  border-right: 1px solid #DEE2E6;
}
td label {
  margin-bottom: 0.25rem !important;
  margin-top:  1px !important;
}
tr {
  line-height: 25px !important;
}
thead tr input {
  max-height: 25px !important;
  font-size: 0.8rem !important;
}