/*
  The root elements wrapping the body of the grid.
  Has a height: 0; by default which makes everything
  disapear in browsers that don't support flex correctly.
  height: 100%; appears to fix this problem. However we also need space for
  pagination and the status bar if they are enabled.
*/

/* Wrap text is used for auto row height to wrap words in the cell */
.wrap-text {
  white-space: normal !important;
}

.ag-cell-wrap-text {
  /* white-space: nowrap !important; */
  white-space: normal;
  word-break: keep-all;
}

#grid.flexbox-fixes .ag-root-wrapper-body {
  /* @todo: when pagination is enabled we need to subtract space for it */
  /* height: calc(100% - 32px) !important; */
}
#grid.flexbox-fixes .ag-root {
  /* height: calc(100% - 32px) !important; */
}

/*
  The body element contains everything below the toolbar.
  Like the wrapper this has a height: 0; by default.
  height: 100%; makes the bottom of the scrollbar overflow.
  So we subtract some space for the status bar and the scroll bar.
*/
#grid.flexbox-fixes .ag-body {
  /* height: calc(100% - 64px) !important; */
}

/*
  The body container element contains the actual data rows of the grid.
  If there are not enough columns to overflow-x there is an ugly white space
  on the right of the columns, min-width: 100%; fixes this.
*/
#grid.flexbox-fixes .ag-body-container {
  /* min-width: 100%; */
}

/*
  Fixes the floating filter icon button being too low
*/
.ag-floating-filter-button button {
  line-height: normal;
}

/*
  Styling for compact mode
*/
.compact .ag-cell {
  line-height: 16px;
  padding-left: 4px;
  padding-right: 4px;
}

.compact .ag-group-child-count,
.compact .ag-group-expanded,
.compact .ag-selection-checkbox,
.compact .ag-group-contracted {
  /* height: inherit !important; */
  height: 18px !important;
}

/* .ag-theme-tableau .ag-cell-wrapper>:not(.ag-cell-value):not(.ag-group-value) {

} */

.compact .ag-header-cell,
.compact .ag-header-group-cell {
  padding-left: 4px;
  padding-right: 4px;
}

.compact .ag-selection-checkbox .ag-icon {
  font-size: 12px;
  line-height: 12px;
}

.div-outer-div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: 100%;
  width: 100%;
}

.div-percent-bar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  border-radius: 2px 2px 2px 2px;
}

.div-percent-value {
  position: absolute;
  padding-left: 4px;
  left: 2px;
}

.ag-cell-value {
  height: 100%;
  width: 100%;
}

.is-barchart {
  padding-top: 2px;
  padding-bottom: 2px;
  padding-right: 0;
}

.is-barchart .div-outer-div {
  position: relative;
}

.is-barchart .ag-cell-wrapper {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
}

.div-percent-bar-wrapper {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  height: 100%;
}

.ag-invisible {
  display: none !important;
}

/* Change the color of the drop zone to white  */
/* .ag-theme-tableau .ag-column-drop {
  background-color: white;
} */

/* Showing scrollbar in the grouping bar */
.ag-column-drop.ag-column-drop-horizontal {
  height: auto !important;
}

.ag-column-drop-horizontal-list {
  overflow: none;
  padding: 5px;
}

.ag-column-drop-horizontal-list:hover {
  overflow-x: auto !important;
}

/* Removes the margin from sub-group totals (eg. Sub total Furniture) */
/* .ag-theme-tableau .ag-ltr .ag-row-group-leaf-indent {
  margin-left: 0;
}
.ag-theme-tableau .ag-rtl .ag-row-group-leaf-indent {
  margin-right: 0;
} */

.ag-input-field-input {
  background-color: var(--ag-input-background-color, inherit) !important;
  color: var(--ag-input-foreground-color, inherit) !important;
}

.ag-center-aligned-header .ag-header-cell-text {
  width: 100%;
  text-align: center;
}

.ag-header-cell-text {
  white-space: normal !important;
}

/* Totals and Subtotals Styling */
.ag-row-footer {
  font-weight: bold;
}

/* Styling expand */
.ag-row-group.no-expand .ag-group-expanded,
.ag-row-group.no-expand .ag-group-contracted {
  display: none !important;
}
/* Totals Styling */
.total-group-row,
.total-group-row:hover,
.total-group-row.ag-row-hover,
.total-group-row.ag-row-hover::before {
  background-color: var(--ag-totals-background-color, inherit);
  color: var(--ag-totals-text-color, var(--ag-foreground-color, inherit));
}

/* Subtotals Styling */
.subtotal-group-row,
.subtotal-group-row:hover,
.subtotal-group-row.ag-row-hover,
.subtotal-group-row.ag-row-hover::before {
  background-color: var(--ag-subtotal-background-color, inherit);
  color: var(--ag-subtotal-text-color, var(--ag-foreground-color, inherit));
}

.ag-row-footer .hidden-total {
  display: none !important;
}
/* Column Font Color Styling (for expand/contract arrow) */
.ag-row-drag,
.ag-selection-checkbox,
.ag-group-expanded,
.ag-group-contracted {
  color: inherit;
}

/* Fix group column having double top border */

.ag-header-span-total {
  border-top-width: 0px !important;
}

.subtotal-group-row-cell .ag-group-value {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.ag-status-bar {
  overflow: auto;
}

/* some ag-grid.css fixes that break borders */
.ag-header-row:not(:first-child) .ag-header-cell,
.ag-header-row:not(:first-child) .ag-header-group-cell.ag-header-group-cell-with-group {
  border-top: var(--ag-borders-critical) var(--ag-border-color);
}

.ag-header-cell::before,
.ag-header-group-cell:not(.ag-header-group-cell-no-group)::before {
  content: '';
  position: absolute;
  z-index: 1;
  display: var(--ag-header-column-separator-display);
  width: var(--ag-header-column-separator-width);
  height: var(--ag-header-column-separator-height);
  top: calc(50% - var(--ag-header-column-separator-height) * 0.5);
  background-color: var(--ag-header-column-separator-color);
}

.ag-ltr .ag-header-cell::before,
.ag-ltr .ag-header-group-cell::before {
  right: 0;
}

.ag-rtl .ag-header-cell::before,
.ag-rtl .ag-header-group-cell::before {
  left: 0;
}

.ag-cell.ag-column-first .ag-cell-wrapper {
  min-width: 100%;
}

.ag-cell-wrapper {
  width: 100%;
  overflow: hidden;
}

.ag-header-bold .ag-header-cell-text {
  font-weight: bold;
}

.ag-header-italic .ag-header-cell-text {
  font-style: italic
}

.ag-header-underline .ag-header-cell-text {
  text-decoration: underline;
}

.ag-header-strikethrough .ag-header-cell-text {
  text-decoration: line-through;
}

.ag-header-strikethrough.ag-header-underline .ag-header-cell-text {
  text-decoration: underline line-through;
}