/* ---------------------------------------
 * Datatable
 */

/* fixes margins so data isn't cut off at table edges */
.dbc .dash-table-container .row {
  display: block !important;
  margin: 0;
}

/* fixes  when the table dropdown doesn't drop down */
.dbc .Select-menu-outer {
  display: block !important;
}

.dash-table-container .dropdown {
  position: static;
}

/*
 *  sort arrow and delete icons in the DataTable header - changes pink color
 *  these icons appear when the table is sortable and/or columns are deletable
 */
.dbc .dash-table-container .dash-spreadsheet-container .dash-spreadsheet-inner table {
  --accent: inherit;
  --hover: inherit;
  font-family: inherit;
}

.dbc input.dash-filter--case--sensitive {
  border-color: var(--bs-primary) !important;
  border-radius: 3px;
  border-style: solid;
  border-width: 2px;
  color: var(--bs-primary) !important;
}

/* pagination buttons - this removes the default pink hover */
.dbc .last-page:hover,
.previous-page:hover,
.first-page:hover,
.next-page:hover {
  color: var(--bs-primary) !important;
}


/* table details */
/* body .dbc .dash-table-container .dash-spreadsheet-container .dash-spreadsheet-inner td {
  background-color: var(--bs-body-bg);
  color: var(--bs-body-color);
  border-color: rgba(100, 100, 100, 0.4) !important;
}
*/
body .dbc .dash-table-container .dash-spreadsheet-container .dash-spreadsheet-inner td {
  background-color: inherit;
  color:  inherit;
  border-color:  inherit;
}


/* on hover highlight entire row
.dash-spreadsheet tr:hover td.dash-cell {
            border-color: rgba(100, 100, 100, 0.4) !important;
            border-width: 0.5px !important;
            background-color: rgba(var(--bs-primary-rgb), 0.2) !important;

         }
*/

/* table header */
body .dbc .dash-table-container .dash-spreadsheet-container .dash-spreadsheet-inner th {
  background-color: inherit;
  color: inherit;
  border-color: inherit;
}


/* filter row in the header */
.dbc .dash-spreadsheet .dash-filter {
  font-family: inherit;
  background-color: inherit;
  color: inherit;
  --border: inherit;
}

/* tooltips  */
.dbc .dash-table-tooltip {
  background-color: var(--bs-gray-500) !important;
  color: var(--bs-body-color);
  width: fit-content;
  /* max and min width are both set to 300px in the dash stylesheet. Override them with your own definitions. */
  max-width: 300px;
  min-width: unset;
}

/* pagination */
.dbc .dash-table-container .previous-next-container .page-number .current-page-container .current-page-shadow {
  background-color: transparent;
  color: inherit;
}

.dbc .dash-table-container .previous-next-container .page-number .current-page-container input.current-page {
  background-color: transparent;
}

.dbc .dash-table-container .dash-spreadsheet-container .dash-spreadsheet-inner table {
  border-collapse: inherit;
  border-spacing: unset;
}

/* active cell */
.dbc .dash-table-container .dash-spreadsheet-container .dash-spreadsheet-inner td.focused {
  background-color: rgba(var(--bs-primary-rgb), 0.2) !important;
  outline: 1px solid var(--bs-primary);
}

/* active cell when cell is  editable */
.dbc .dash-table-container .dash-spreadsheet-container .dash-spreadsheet-inner input:not([type=radio]):not([type=checkbox]) {
  background-color: transparent !important;
}

/* selected cells */
.dbc .dash-table-container .dash-spreadsheet-container .dash-spreadsheet-inner td.cell--selected {
  background-color: rgba(var(--bs-primary-rgb), 0.2) !important;
}

/*  dropdown inside datatable */
.dbc .dash-table-container .dash-spreadsheet .Select-menu-outer {
  background-color: var(--bs-gray-500);
  border-color: rgba(100, 100, 100, 0.4)
}

.dbc .dash-table-container .dash-spreadsheet .Select-option:hover {
  background-color: rgba(var(--bs-gray-500), .4);
}

.dbc .dash-table-container .dash-spreadsheet .Select-option {
  background-color: rgba(var(--bs-gray-500), .4);
}

.dbc .dash-table-container .dash-spreadsheet-container .dash-spreadsheet-inner table {
  background-color: rgba(var(--bs-primary-rgb), 0.2) !important;
  --bs-table-bg: transparent !important;
  --bs-table-accent-bg: transparent !important;
  --bs-table-striped-color: #374151 !important;
  --bs-table-striped-bg: rgba(17, 24, 39, 0.05) !important;
  --bs-table-active-color: #374151 !important;
  --bs-table-active-bg: rgba(17, 24, 39, 0.1) !important;
  --bs-table-hover-color: #374151 !important;
  --bs-table-hover-bg: rgba(17, 24, 39, 0.075) !important;
  width: 100% !important;
  margin-bottom: 1rem !important;
  color: #374151 !important;
  vertical-align: top !important;
  border-color: #E5E7EB !important;
}