/*******************************
   TABULATOR VS CODE THEME
*******************************/

/* Überschreibe Tabulator-Farben für VS Code Dark Theme */
html:not([data-theme]),
html[data-theme="dark"] {
  /* Tabulator Base */
  .tabulator {
    background-color: #1e1e1e;
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: var(--bulma-body-color);
  }

  /* Header */
  .tabulator .tabulator-header {
    background-color: #252526;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    color: var(--bulma-body-color);
    font-weight: normal;
  }

  .tabulator .tabulator-header .tabulator-col {
    background-color: #252526;
    border-right: 1px solid rgba(255, 255, 255, 0.08);
  }

  .tabulator .tabulator-header .tabulator-col.tabulator-sortable:hover {
    background-color: #2d2d2d;
  }

  .tabulator .tabulator-header .tabulator-col .tabulator-col-content {
    color: var(--bulma-body-color);
  }

  .tabulator
    .tabulator-header
    .tabulator-col
    .tabulator-col-sorter
    .tabulator-arrow {
    border-bottom-color: #808080;
  }

  .tabulator
    .tabulator-header
    .tabulator-col.tabulator-sortable[aria-sort="ascending"]
    .tabulator-arrow,
  .tabulator
    .tabulator-header
    .tabulator-col.tabulator-sortable[aria-sort="descending"]
    .tabulator-arrow {
    border-top-color: var(--bulma-primary) !important;
    border-bottom-color: var(--bulma-primary) !important;
  }

  .tabulator
    .tabulator-header
    .tabulator-col.tabulator-col-group
    .tabulator-col-group-cols {
    border-top: 1px solid rgba(255, 255, 255, 0.08);
  }

  /* Table Body */
  .tabulator .tabulator-tableholder {
    background-color: #1e1e1e;
  }

  .tabulator .tabulator-tableholder .tabulator-table {
    background-color: #1e1e1e;
    color: var(--bulma-body-color);
  }

  /* Rows */
  .tabulator-row {
    background-color: #1e1e1e;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    color: var(--bulma-body-color);
  }

  .tabulator-row.tabulator-row-even {
    background-color: #252526;
  }

  .tabulator-row.tabulator-selectable:hover {
    background-color: #2a2d2e !important;
    color: #ffffff !important;
  }

  .tabulator-row.tabulator-selected {
    background-color: #264f78 !important;
    color: #ffffff !important;
  }

  .tabulator-row.tabulator-selected:hover {
    background-color: #2d5a87 !important;
  }

  /* Cells */
  .tabulator-row .tabulator-cell {
    border-right: 1px solid rgba(255, 255, 255, 0.08);
    color: var(--bulma-body-color);
  }

  .tabulator-row .tabulator-cell.tabulator-editable {
    background-color: color-mix(in srgb, #858500 12%, #1e1e1e);
  }
    .tabulator-row .tabulator-cell.tabulator-editing {
    border: 1px solid var(--bulma-primary);
    background-color: color-mix(in srgb, var(--bulma-primary) 12%, #1e1e1e);
    background-color: color-mix(in srgb, #858500 12%, #1e1e1e);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--bulma-primary) 45%, transparent);
    color: var(--bulma-body-color);
  }

  .tabulator-row .tabulator-cell.tabulator-validation-fail {
    border: 1px solid #f48771;
  }

  .tabulator-row .tabulator-cell.tabulator-row-header {
    background-color: #252526;
    border-right: 1px solid rgba(255, 255, 255, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  }

  /* Footer */
  .tabulator .tabulator-footer {
    background-color: #252526;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    color: var(--bulma-body-color);
  }

  .tabulator .tabulator-footer .tabulator-calcs-holder {
    background-color: #2d2d2d !important;
  }

  .tabulator .tabulator-footer .tabulator-page {
    background-color: #2d2d2d;
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: var(--bulma-body-color);
  }

  .tabulator .tabulator-footer .tabulator-page:hover {
    background-color: #3e3e42;
    color: #ffffff;
  }

  .tabulator .tabulator-footer .tabulator-page.active {
    background-color: var(--bulma-primary);
    color: #1e1e1e;
  }

  /* Groups */
  .tabulator-row.tabulator-group {
    background-color: #2d2d2d;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
  }

  .tabulator-row.tabulator-group:hover {
    background-color: #3e3e42;
  }

  .tabulator-row.tabulator-group span {
    color: var(--bulma-primary);
  }

  /* Calcs */
  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row.tabulator-calcs {
    background-color: #2d2d2d !important;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  }

  /* Placeholder */
  .tabulator
    .tabulator-tableholder
    .tabulator-placeholder
    .tabulator-placeholder-contents {
    color: #808080;
  }

  /* Menu/Popup */
  .tabulator-menu,
  .tabulator-edit-list,
  .tabulator-edit-select-list,
  .tabulator-popup-container {
    background-color: #252526;
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: var(--bulma-body-color);
  }

  .tabulator-edit-list .tabulator-edit-list-item,
  .tabulator-edit-list .tabulator-edit-list-placeholder,
  .tabulator-edit-list .tabulator-edit-list-group,
  .tabulator-edit-select-list .tabulator-edit-select-list-item {
    color: var(--bulma-body-color);
  }

  .tabulator-menu .tabulator-menu-item:hover,
  .tabulator-edit-list .tabulator-edit-list-item:hover,
  .tabulator-edit-list .tabulator-edit-list-item.focused,
  .tabulator-edit-select-list .tabulator-edit-select-list-item:hover {
    background-color: var(--bulma-primary);
    color: var(--bulma-primary-invert);
  }

  .tabulator-edit-list .tabulator-edit-list-item.active,
  .tabulator-edit-select-list .tabulator-edit-select-list-item.active {
    background-color: var(--bulma-primary);
    color: var(--bulma-primary-invert);
  }

  .tabulator-edit-list .tabulator-edit-list-item.active.focused {
    outline: 1px solid color-mix(in srgb, var(--bulma-primary-invert) 55%, transparent);
  }

  /* Range Selection */
  .tabulator .tabulator-tableholder .tabulator-range-overlay .tabulator-range {
    border-color: var(--bulma-primary);
  }

  .tabulator
    .tabulator-tableholder
    .tabulator-range-overlay
    .tabulator-range.tabulator-range-active::after {
    background-color: var(--bulma-primary);
  }

  .tabulator-row
    .tabulator-cell.tabulator-range-selected:not(
      .tabulator-range-only-cell-selected
    ) {
    background-color: #264f78;
  }

  /* Header Range Selection */
  .tabulator .tabulator-header .tabulator-col.tabulator-range-selected {
    background-color: #264f78;
    color: #ffffff;
  }

  /* Status Colors (VS Code Theme) */
  .tabulator .tabulator-tableholder .tabulator-table .tabulator-row.positive,
  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row
    .tabulator-cell.positive {
    background-color: rgba(115, 201, 144, 0.15) !important;
    color: #73c990 !important;
  }

  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row.positive:hover,
  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row
    .tabulator-cell.positive:hover {
    background-color: rgba(115, 201, 144, 0.25) !important;
  }

  .tabulator .tabulator-tableholder .tabulator-table .tabulator-row.negative,
  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row
    .tabulator-cell.negative,
  .tabulator .tabulator-tableholder .tabulator-table .tabulator-row.error,
  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row
    .tabulator-cell.error {
    background-color: rgba(244, 135, 113, 0.15) !important;
    color: #f48771 !important;
  }

  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row.negative:hover,
  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row
    .tabulator-cell.negative:hover,
  .tabulator .tabulator-tableholder .tabulator-table .tabulator-row.error:hover,
  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row
    .tabulator-cell.error:hover {
    background-color: rgba(244, 135, 113, 0.25) !important;
  }

  .tabulator .tabulator-tableholder .tabulator-table .tabulator-row.warning,
  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row
    .tabulator-cell.warning {
    background-color: rgba(206, 145, 120, 0.15) !important;
    color: #ce9178 !important;
  }

  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row.warning:hover,
  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row
    .tabulator-cell.warning:hover {
    background-color: rgba(206, 145, 120, 0.25) !important;
  }

  /* Frozen Columns */
  .tabulator .tabulator-header .tabulator-frozen.tabulator-frozen-left,
  .tabulator-row .tabulator-cell.tabulator-frozen.tabulator-frozen-left {
    border-right: 2px solid rgba(255, 255, 255, 0.15);
  }

  .tabulator .tabulator-header .tabulator-frozen.tabulator-frozen-right,
  .tabulator-row .tabulator-cell.tabulator-frozen.tabulator-frozen-right {
    border-left: 2px solid rgba(255, 255, 255, 0.15);
  }

  /* Data Tree */
  .tabulator-row .tabulator-cell .tabulator-data-tree-branch {
    border-left-color: rgba(255, 255, 255, 0.15);
    border-bottom-color: rgba(255, 255, 255, 0.15);
  }

  .tabulator-row .tabulator-cell .tabulator-data-tree-control {
    border-color: #808080;
    background-color: rgba(255, 255, 255, 0.05);
  }

  .tabulator-row .tabulator-cell .tabulator-data-tree-control:hover {
    background-color: rgba(255, 255, 255, 0.1);
  }

  .tabulator-row
    .tabulator-cell
    .tabulator-data-tree-control
    .tabulator-data-tree-control-collapse:after,
  .tabulator-row
    .tabulator-cell
    .tabulator-data-tree-control
    .tabulator-data-tree-control-expand,
  .tabulator-row
    .tabulator-cell
    .tabulator-data-tree-control
    .tabulator-data-tree-control-expand:after {
    background-color: var(--bulma-body-color);
  }

  /* Resize Handles */
  .tabulator .tabulator-col-resize-guide,
  .tabulator .tabulator-row-resize-guide {
    background-color: var(--bulma-primary);
  }
}

/* VS Code Light Theme für Tabulator */
html[data-theme="light"] {
  /* Tabulator Base */
  .tabulator {
    background-color: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.1);
    color: #1e1e1e;
  }

  /* Header */
  .tabulator .tabulator-header {
    background-color: #f3f3f3;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    color: #1e1e1e;
  }

  .tabulator .tabulator-header .tabulator-col {
    background-color: #f3f3f3;
    border-right: 1px solid rgba(0, 0, 0, 0.08);
  }

  .tabulator
    .tabulator-header
    .tabulator-col.tabulator-col-group
    .tabulator-col-group-cols {
    border-top: 1px solid rgba(0, 0, 0, 0.08);
  }
  .tabulator .tabulator-header .tabulator-col.tabulator-sortable:hover {
    background-color: #e1e1e1;
  }

  .tabulator
    .tabulator-header
    .tabulator-col
    .tabulator-col-sorter
    .tabulator-arrow {
    border-bottom-color: #6f6f6f;
  }

  .tabulator
    .tabulator-header
    .tabulator-col.tabulator-sortable[aria-sort="ascending"]
    .tabulator-arrow,
  .tabulator
    .tabulator-header
    .tabulator-col.tabulator-sortable[aria-sort="descending"]
    .tabulator-arrow {
    border-color: #007acc;
  }

  /* Table Body */
  .tabulator .tabulator-tableholder {
    background-color: #ffffff;
  }

  .tabulator .tabulator-tableholder .tabulator-table {
    background-color: #ffffff;
    color: #1e1e1e;
  }

  /* Rows */
  .tabulator-row {
    background-color: #ffffff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    color: #1e1e1e;
  }

  .tabulator-row.tabulator-row-even {
    background-color: #f3f3f3;
  }

  .tabulator-row.tabulator-selectable:hover {
    background-color: #e1e1e1 !important;
    color: #1e1e1e !important;
  }

  .tabulator-row.tabulator-selected {
    background-color: #cce5ff !important;
    color: #1e1e1e !important;
  }

  .tabulator-row.tabulator-selected:hover {
    background-color: #b3d9ff !important;
  }

  /* Cells */
  .tabulator-row .tabulator-cell {
    border-right: 1px solid rgba(0, 0, 0, 0.08);
    color: #1e1e1e;
  }

  .tabulator-row .tabulator-cell.tabulator-editing {
    border: 1px solid var(--bulma-primary);
    background-color: color-mix(in srgb, var(--bulma-primary) 10%, #ffffff);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--bulma-primary) 35%, transparent);
    color: #1e1e1e;
  }

  .tabulator-row .tabulator-cell.tabulator-validation-fail {
    border: 1px solid #e51400;
  }

  .tabulator-row .tabulator-cell.tabulator-row-header {
    background-color: #f3f3f3;
    border-right: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  }

  /* Footer */
  .tabulator .tabulator-footer {
    background-color: #f3f3f3;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    color: #1e1e1e;
  }

  .tabulator .tabulator-footer .tabulator-calcs-holder {
    background-color: #eaeaea !important;
  }

  .tabulator .tabulator-footer .tabulator-page {
    background-color: #eaeaea;
    border: 1px solid rgba(0, 0, 0, 0.1);
    color: #1e1e1e;
  }

  .tabulator .tabulator-footer .tabulator-page:hover {
    background-color: var(--bulma-body-color);
    color: #1e1e1e;
  }

  .tabulator .tabulator-footer .tabulator-page.active {
    background-color: #007acc;
    color: #ffffff;
  }

  /* Groups */
  .tabulator-row.tabulator-group {
    background-color: #eaeaea;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    border-top: 1px solid rgba(0, 0, 0, 0.1);
  }

  .tabulator-row.tabulator-group:hover {
    background-color: var(--bulma-body-color);
  }

  .tabulator-row.tabulator-group span {
    color: #007acc;
  }

  /* Calcs */
  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row.tabulator-calcs {
    background-color: #eaeaea !important;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  }

  /* Placeholder */
  .tabulator
    .tabulator-tableholder
    .tabulator-placeholder
    .tabulator-placeholder-contents {
    color: #6f6f6f;
  }

  /* Menu/Popup */
  .tabulator-menu,
  .tabulator-edit-list,
  .tabulator-edit-select-list,
  .tabulator-popup-container {
    background-color: #f3f3f3;
    border: 1px solid rgba(0, 0, 0, 0.1);
    color: #1e1e1e;
  }

  .tabulator-edit-list .tabulator-edit-list-item,
  .tabulator-edit-list .tabulator-edit-list-placeholder,
  .tabulator-edit-list .tabulator-edit-list-group,
  .tabulator-edit-select-list .tabulator-edit-select-list-item {
    color: #1e1e1e;
  }

  .tabulator-menu .tabulator-menu-item:hover,
  .tabulator-edit-list .tabulator-edit-list-item:hover,
  .tabulator-edit-list .tabulator-edit-list-item.focused,
  .tabulator-edit-select-list .tabulator-edit-select-list-item:hover {
    background-color: var(--bulma-primary);
    color: var(--bulma-primary-invert);
  }

  .tabulator-edit-list .tabulator-edit-list-item.active,
  .tabulator-edit-select-list .tabulator-edit-select-list-item.active {
    background-color: var(--bulma-primary);
    color: var(--bulma-primary-invert);
  }

  .tabulator-edit-list .tabulator-edit-list-item.active.focused {
    outline: 1px solid color-mix(in srgb, var(--bulma-primary-invert) 55%, transparent);
  }

  /* Range Selection */
  .tabulator .tabulator-tableholder .tabulator-range-overlay .tabulator-range {
    border-color: #007acc;
  }

  .tabulator
    .tabulator-tableholder
    .tabulator-range-overlay
    .tabulator-range.tabulator-range-active::after {
    background-color: #007acc;
  }

  .tabulator-row
    .tabulator-cell.tabulator-range-selected:not(
      .tabulator-range-only-cell-selected
    ) {
    background-color: #cce5ff;
  }

  /* Header Range Selection */
  .tabulator .tabulator-header .tabulator-col.tabulator-range-selected {
    background-color: #cce5ff;
    color: #1e1e1e;
  }

  /* Status Colors (VS Code Light Theme) */
  .tabulator .tabulator-tableholder .tabulator-table .tabulator-row.positive,
  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row
    .tabulator-cell.positive {
    background-color: rgba(55, 140, 75, 0.15) !important;
    color: #2d7a3e !important;
  }

  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row.positive:hover,
  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row
    .tabulator-cell.positive:hover {
    background-color: rgba(55, 140, 75, 0.25) !important;
  }

  .tabulator .tabulator-tableholder .tabulator-table .tabulator-row.negative,
  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row
    .tabulator-cell.negative,
  .tabulator .tabulator-tableholder .tabulator-table .tabulator-row.error,
  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row
    .tabulator-cell.error {
    background-color: rgba(229, 20, 0, 0.15) !important;
    color: #cd3131 !important;
  }

  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row.negative:hover,
  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row
    .tabulator-cell.negative:hover,
  .tabulator .tabulator-tableholder .tabulator-table .tabulator-row.error:hover,
  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row
    .tabulator-cell.error:hover {
    background-color: rgba(229, 20, 0, 0.25) !important;
  }

  .tabulator .tabulator-tableholder .tabulator-table .tabulator-row.warning,
  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row
    .tabulator-cell.warning {
    background-color: rgba(218, 121, 0, 0.15) !important;
    color: #bf6e00 !important;
  }

  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row.warning:hover,
  .tabulator
    .tabulator-tableholder
    .tabulator-table
    .tabulator-row
    .tabulator-cell.warning:hover {
    background-color: rgba(218, 121, 0, 0.25) !important;
  }

  /* Frozen Columns */
  .tabulator .tabulator-header .tabulator-frozen.tabulator-frozen-left,
  .tabulator-row .tabulator-cell.tabulator-frozen.tabulator-frozen-left {
    border-right: 2px solid rgba(0, 0, 0, 0.15);
  }

  .tabulator .tabulator-header .tabulator-frozen.tabulator-frozen-right,
  .tabulator-row .tabulator-cell.tabulator-frozen.tabulator-frozen-right {
    border-left: 2px solid rgba(0, 0, 0, 0.15);
  }

  /* Data Tree */
  .tabulator-row .tabulator-cell .tabulator-data-tree-branch {
    border-left-color: rgba(0, 0, 0, 0.15);
    border-bottom-color: rgba(0, 0, 0, 0.15);
  }

  .tabulator-row .tabulator-cell .tabulator-data-tree-control {
    border-color: #6f6f6f;
    background-color: rgba(0, 0, 0, 0.05);
  }

  .tabulator-row .tabulator-cell .tabulator-data-tree-control:hover {
    background-color: rgba(0, 0, 0, 0.1);
  }

  .tabulator-row
    .tabulator-cell
    .tabulator-data-tree-control
    .tabulator-data-tree-control-collapse:after,
  .tabulator-row
    .tabulator-cell
    .tabulator-data-tree-control
    .tabulator-data-tree-control-expand,
  .tabulator-row
    .tabulator-cell
    .tabulator-data-tree-control
    .tabulator-data-tree-control-expand:after {
    background-color: #1e1e1e;
  }

  /* Resize Handles */
  .tabulator .tabulator-col-resize-guide,
  .tabulator .tabulator-row-resize-guide {
    background-color: #007acc;
  }
}

#table .tabulator-select-row.is-selected {
  background-color: color-mix(in srgb, var(--bulma-primary) 10%, transparent) !important;
}

#table .tabulator-select-row.is-selected:hover {
  background-color: color-mix(in srgb, var(--bulma-primary) 16%, transparent) !important;
}

#table .tabulator-select-row.tabulator-selectable:hover {
  background-color: color-mix(in srgb, var(--bulma-primary) 6%, transparent);
}

#table input[data-select-row],
#table input[data-select-all] {
  cursor: pointer;
  accent-color: var(--bulma-primary);
  display: block;
  margin: 0;
}

#table input[data-select-row]:disabled {
  cursor: not-allowed;
}

#table .tabulator-col[tabulator-field="row_select"],
#table .tabulator-cell[tabulator-field="row_select"] {
  box-sizing: border-box;
}

#table .tabulator-cell[tabulator-field="row_select"] {
  padding: 0 !important;
  text-align: center;
  vertical-align: middle;
}

#table .tabulator-select-control {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: center;
  min-height: 100%;
  width: 100%;
}

#table .tabulator-col[tabulator-field="row_select"] .tabulator-col-content {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: center;
  padding-bottom: 0;
  padding-left: 0;
  padding-right: 0;
  padding-top: 0;
}

#table .tabulator-col[tabulator-field="row_select"] .tabulator-col-title-holder {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: center;
  width: 100%;
}

#table .tabulator-col[tabulator-field="row_select"] .tabulator-col-title {
  align-items: center;
  display: flex;
  justify-content: center;
  width: 100%;
}

#supplier-price-raw-modal pre {
  white-space: pre-wrap;
  word-break: break-word;
  max-height: 65vh;
  overflow: auto;
}

#table.is-busy {
  opacity: .65;
  pointer-events: none;
}

#table .tabulator-select-row.is-saving {
  opacity: .72;
}

#table .tabulator-select-row.is-save-error {
  background-color: color-mix(in srgb, var(--bulma-danger) 12%, transparent) !important;
}