/* Table-level styles */
.tabulator {
  width: auto !important;
  overflow: hidden;
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
  user-select: none !important;
  margin-left: -1px !important;
  margin-right: -1px !important;
}

div .tabulator-table {
  background-color: transparent !important;
}
div div.tabulator-tableholder {
  background-color: transparent !important;
  color: var(--ACZ-color-input);
}

div .tabulator-holder,
div .tabulator-row,
div .tabulator-row-even,
div .tabulator {
  background: transparent !important;
  color: var(--ACZ-color-input);
}
div .tabulator-row-even .tabulator-cell {
  background: var(--ACZ-color-12);
}
div .tabulator-cell {
  border: none !important;
  color: var(--ACZ-color-11);
  font-size: var(--ACZ-font-size-3);
}
div .tabulator-selected {
  background-color: var(--ACZ-color-2) !important;
}

div .tabulator-selected .tabulator-cell {
  color: var(--ACZ-color-19) !important;
}

/* Tabulator Headers */
div.tabulator-header {
  height: 26px !important;
}
div .tabulator-header-contents {
  background: var(--ACZ-color-6);
  font-size: var(--ACZ-font-size-3);
}

/* Tabulator Groups */
.tabulator-row.tabulator-group {
  background: var(--ACZ-color-4) !important;
  border: var(--ACZ-border-1);
  padding: 2px 5px 2px 10px;
  display: flex;
  flex-direction: row;
  align-items: center;
  white-space: nowrap;
  width: 100%;
}
.tabulator-row.tabulator-group > div {
  font-weight: normal;
  display: flex !important;
  flex-direction: row;
  align-items: center;
  white-space: nowrap;
  gap: var(--ACZ-margin-2);
}
.tabulator-row.tabulator-group > div > div > svg {
  margin-top: -2px;
}
div .tabulator-row.tabulator-group.tabulator-group-visible .tabulator-arrow {
  margin-top: 0px;
  margin-right: 14px;
  margin-left: -4px;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid var(--ACZ-color-11);
/*  border-bottom: 0; */
  transition: var(--ACZ-transition-std);
}
div .tabulator-row.tabulator-group .tabulator-arrow {
  display: inline-block;
  width: 0;
  height: 0;
  margin-top: -2px;
  margin-right: 16px;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-right: 0;
  border-left: 6px solid var(--ACZ-color-11);
  vertical-align: middle;
  transition: var(--ACZ-transition-std);
}
.GroupHeader {
  display: flex;
  flex-direction: row;
}
.GroupHeader > img {
  width: var(--ACZ-iconimage-size);
  height: var(--ACZ-iconimage-size);
  filter: var(--ACZ-iconimage-filter);
 }
.GroupHeaderCount {
  padding-left: 10px;
  color: var(--ACZ-color-11);
  font-weight: normal;
}
.GroupHeaderColor {
  gap: 10px;
}

/* Tabulator Footers */
div.tabulator .tabulator-tableholder .tabulator-table .tabulator-row.tabulator-calcs,
div.tabulator .tabulator-footer .tabulator-calcs-holder .tabulator-row,
div.tabulator .tabulator-footer .tabulator-calcs-holder,
.tabulator-calcs,
.tabulator-calcs-holder,
.tabulator-calcs.tabulator-row {
  border: none !important;
  background: transparent !important;
}
.tabulator-footer .tabulator-calcs .tabulator-cell {
  background: var(--ACZ-color-6) !important;
  font-weight: normal !important;
  color: var(--ACZ-color-input) !important;
  margin-bottom: 0px !important;
}
.tabulator-calcs .tabulator-cell {
  background: var(--ACZ-color-4) !important;
  font-weight: normal !important;
  color: var(--ACZ-color-input) !important;
  border-top: none !important;
  border-bottom: none !important;
  border-left: none !important;
  border-right: var(--ACZ-border-1) !important;
}
div.tabulator-cell {
/*  margin-bottom: -1px !important; */
  margin-bottom: 0px !important;
}
div .tabulator-footer {
  border: var(--ACZ-border-1) !important;
  background: var(--ACZ-color-6) !important;
}

/* Tabulator Sort Icons */

/* Move them up just a touch */
.tabulator-col .tabulator-col-sorter {
  bottom: 1px !important;
}
/* Hide all sort icons by default */
.tabulator-col .tabulator-col-sorter div.icon {
  display: none;
}
/* Display the fa-sort icon when the column is not sorted */
.tabulator-col[aria-sort="none"] .tabulator-col-sorter div.icon.sort{
  display: inline-block;
  fill: var(--ACZ-color-1);
}
/* Hover styles are good */
.tabulator-col[aria-sort="none"] .tabulator-col-sorter div.icon:hover{
  opacity: 0.6;
}
/* Display the fa-sort-up icon when the column is sorted in asc order */
.tabulator-col[aria-sort="ascending"] .tabulator-col-sorter div.icon.sort-up{
  display: inline-block;
  fill: var(--ACZ-color-input);
}
/* Display the fa-sort-down icon when the column is sorted in desc order */
.tabulator-col[aria-sort="descending"] .tabulator-col-sorter div.icon.sort-down{
  display: inline-block;
  fill: var(--ACZ-color-input);
}


/* Adjustments for specific Tabulator columns */

.tabulator-cell.IconColumn {
  text-overflow: hidden;
  white-space: nowrap;
  overflow: hidden;
  color: var(--ACZ-color-input) !important;
}
.tabulator-cell.IconColumn2 {
  display: inline-flex;
  align-items: center;
  text-overflow: hidden;
  white-space: nowrap;
  overflow: hidden;
  color: var(--ACZ-color-input) !important;
}


.tabulator-cell.ImageColumn {
  text-overflow: hidden;
  white-space: nowrap;
  overflow: hidden;
  color: var(--ACZ-color-input) !important;
}
.ImageColumn > img {
  width:  var(--ACZ-iconimage-size);
  height: var(--ACZ-iconimage-size);
  filter: var(--ACZ-iconimage-filter);
  margin-top: -4px;
}

.tabulator-cell.WrapColumn {
  display: inline-flex;
  text-wrap: wrap;
  align-items: center;
}

/* Style the scrollbars */
div.tabulator .tabulator-tableholder::-webkit-scrollbar {
  width: var(--ACZ-scroll-width-4) !important;
  min-width: var(--ACZ-scroll-width-4) !important;
  min-height: var(--ACZ-scroll-width-4) !important;
  border: none !important;
}
div.tabulator .tabulator-tableholder::-webkit-scrollbar-track {
  background: var(--ACZ-scroll-color-track);
  border-left: none
/*  border-right: var(--ACZ-border-1); */
  border-right: none;
  border-top: none;
  border-bottom: none;
  border: none !important;
}
div.tabulator .tabulator-tableholder::-webkit-scrollbar-thumb {
/*  border: var(--ACZ-scroll-width-5) solid var(--ACZ-scroll-color-border);*/
  box-shadow: inset 0px 0px 0px 10px var(--ACZ-scroll-color-thumb);

  border-top: 4px solid var(--ACZ-scroll-color-border);
  border-right: 4px solid var(--ACZ-scroll-color-border);
  border-bottom: 4px solid var(--ACZ-scroll-color-border);
  border-left: 3px solid var(--ACZ-scroll-color-border);

  border-radius: var(--ACZ-scroll-radius-2);
  overflow: hidden;
/*  min-width: var(--ACZ-scroll-width-3);
  min-height: var(--ACZ-scroll-width-3); */
}
div.tabulator .tabulator-tableholder::-webkit-scrollbar-corner {
  background: var(--ACZ-color-6);
  border: var(--ACZ-border-1) !important;
}

/* Popups like the column chooser or header filters */
/* Aadd a bit of style to the popup menus, such as the column selectors */

/* Tabulator Header Menus */
.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-header-popup-button {
  padding: 0px 2px 0px 6px !important;
}
/* Hide the ellipsis */
.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-title {
    text-overflow: clip;
}
.tabulator-menu .tabulator-menu-separator {
 margin: 3px 5px 3px 5px;
}
.tabulator-icon-blank {
  visibility: hidden;
}
.tabulator-menu {
  background: var(--ACZ-color-6);
  color: var(--ACZ-color-input);
  border-radius: var(--ACZ-border-radius-2);
  margin-top: 10px;
  line-height: 1;
  padding: var(--ACZ-margin-1);
  filter: var(--ACZ-shadow-2);
  opacity: 0.95;
  font-size: var(--ACZ-font-size-2);
}
.tabulator-menu.tabulator-popup-container {
  border: var(--ACZ-border-1);
  opacity: 0;
  animation: showMenu var(--ACZ-animation-delay-1) var(--ACZ-animation-delay-2) linear forwards;
}
@keyframes showMenu {
  100% {
    opacity: 1;
  }
}
.tabulator-menu .tabulator-menu-item:not(.tabulator-menu-item-disabled):hover {
  background: var(--ACZ-color-10);
  color: var(--ACZ-color-16);
  border-radius: var(--ACZ-border-radius-3);
}
.tabulator-menu-item {
/*  max-height: 24px; */
/*  width: 175px; */
  padding: 2px 4px 3px 8px !important;
}
.tabulator-menu-icon {
  display: inline;
  padding-left: 0px;
  padding-right: 8px;
}
.tabulator-choose-icon {
  margin-left: -4px !important;
  margin-right: 8px !important;
}
.tabulator-group-icon {
  margin-left: 12px !important;
  margin-right: -4px !important;
}
.tabulator-choose-icon:hover,
.tabulator-group-icon:hover {
  color: var(--ACZ-color-11);
}

/* This is for the popoups like the header filter options */
.tabulator-popup-container {
  opacity: 0.95;
  filter: var(--ACZ-shadow-1);
  border: var(--ACZ-border-1);
  border-radius: var(--ACZ-border-radius-2);
}


/* Container holding the tabulator */
.TabHolder {
  min-width: 159px;
  flex-shrink: 0;
}

/* Tabulator */
div.tabulator {
  margin-top: 0px !important;
  margin-right: -1px !important;
  margin-bottom: 0px !important;
  margin-left: -1px !important;
  padding: 0px !important;
  border: none !important;
  border-top-left-radius: var(--ACZ-border-radius-3);
  border-top-right-radius: var(--ACZ-border-radius-3);
}

/* Header */
div > div.tabulator-header {
  background: transparent !important;
  z-index: 99;
/*  border-bottom: none !important; */
  border-bottom: var(--ACZ-border-1) !important;
}
div > div.tabulator-header > div > div.tabulator-headers {
  height: 28px !important;
  font-weight: normal !important;
}
div > div.tabulator-header > div > div.tabulator-headers > div {
  background: var(--ACZ-color-6) !important;
  border-right: var(--ACZ-border-1) !important;
  color: var(--ACZ-color-input);
}
div > div.tabulator-header > div > div.tabulator-headers > div:hover {
  background: var(--ACZ-color-7) !important;
}

/* Row - editing seems to want to change the height */
.tabulator-row,
.tabulator-row {
  min-height: 25px !important;
}

/* Row Selection chevron */
.RowSelectionIndicator {
  display: inline-flex !important;
  align-items: center;
/*  margin-top: -1px; */
/*  height: 26px; */
}
.RowSelectionIndicator > svg {
  display: none !important;
}
.ReadOnlyTable .tabulator-selected div.RowSelectionIndicator > svg:first-child {
  display: inline-block !important;
}
.EditableTable .tabulator-selected div.RowSelectionIndicator > svg:last-child {
  display: inline-block !important;
}

/* Cells */
div .tabulator-cell {
  padding: 4px !important;
  min-height: 25px !important;
  border-bottom: var(--ACZ-border-1) !important;
  color: var(--ACZ-color-11);
  padding-left: var(--ACZ-tb-padding-left) !important;
  padding-top: var(--ACZ-tb-padding-top) !important;
}

/* Editing Content */
div.tabulator-cell.tabulator-editing,
div.tabulator-cell.tabulator-editing:focus,
div.tabulator-cell.tabulator-editing > input,
div.tabulator-cell.tabulator-editing > input:focus {
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
  color: var(--ACZ-color-input) !important;
  padding-left: var(--ACZ-tb-padding-edit-left) !important;
  padding-top: var(--ACZ-tb-padding-edit-top) !important;
}
.EditableTable .tabulator-row.tabulator-selectable.tabulator-selected {
  outline: 2px solid var(--ACZ-color-8) !important;
  outline-offset: -2px;
}
.EditableTable .tabulator-row.tabulator-selectable.tabulator-selected > div {
  border: none !important;
}

/* Row/Cell hovering */
.EditableTable .EditableCell.tabulator-cell:hover {
  background: var(--ACZ-color-13);
  cursor: cell;
}
.ReadOnlyTable .tabulator-row:hover {
  background: var(--ACZ-color-13) !important;
}

.tabulator-row.tabulator-row-odd .tabulator-cell.tabulator-frozen {
  background-color: unset;
}
.tabulator-row.tabulator-row-even .tabulator-cell.tabulator-frozen {
  background-color: var(--ACZ-color-12);
}

/* if selected show as selected no matter what */
div .tabulator-selected .tabulator-row.tabulator-row-odd .tabulator-cell.tabulator-frozen,
div .tabulator-selected .tabulator-row.tabulator-row-even .tabulator-cell.tabulator-frozen,
.ReadOnlyTable .tabulator-selected.tabulator-row:hover {
  background-color: var(--ACZ-color-2) !important;
}


/* Navigation */
.NavBar {
  margin: 0px !important;
  padding: 0px; 1important;
  gap: var(--ACZ-margin-1) !important;
  background: var(--ACZ-color-4) !important;
  transition: var(--ACZ-transition-std);
}
.NavGroup {
  display: none;
}
.NavButtons {
  min-width: 26px !important;
  min-height: 25px !important;
  max-height: 25px !important;
  border-radius: var(--ACZ-border-radius-n);
  padding: 0px !important;
}
.NavButtons:disabled {
  border: var(--ACZ-border-1) !important;
  opacity: var(--ACZ-opacity-1) !important;
  background: var(--ACZ-color-11) !important;
  color: var(--ACZ-color-16) !important;
}
.NavButtons:disabled > svg {
  color: var(--ACZ-color-16) !important;
}
.NavOkButtons {
  color: var(--ACZ-color-8);
}
.NavCancelButtons {
  color: var(--ACZ-color-9);
}
.NavOkButtons > svg,
.NavCancelButtons > svg {
  filter: var(--ACZ-shadow-4);
}
.NavOkButtons:disabled > svg,
.NavCancelButtons:disabled > svg {
  filter: unset;
}
.NavBar > div > input {
  height: 25px;
}


.NavManage,
.NavNav,
.NavEdit {
  width: 150px;
}

/* Search section */
.NavSearch {
  min-width: 65px;
}
.NavSearch > button {
  min-width: 27px !important;
}
.NavSearch > input {
  border-left: none;
  border-right: none;
  border-top: 1px solid var(--ACZ-color-7);
  border-bottom: 1px solid var(--ACZ-color-7);
  border-radius: 0px;
  min-width: 65px;
}
.NavSearch > input:focus {
  outline: 0px !important;
  box-shadow: none !important;
}
.NavSearch > input > -webkit-input-placeholder {
  position: absolute;
  margin-top: 2px;
}


.IconLabel {
  display: flex;
  justify-content: start;
  gap: 8px;
  align-items: center;
}