/* DataTable component styles — extracted from lcpglobal.css */

/* LCP Datatable Check Box Section. */
.row.lcp-datatable-background .form-check-input {
  box-shadow: none;
  background-color: #efefef;
  border: 1px solid rgba(0, 0, 0, 0.25);
}

.row.lcp-datatable-background .form-check-input:checked {
  background-color: black;
  border: 1px solid black;
  border-color: gray;
  background-position: center;
  background-repeat: no-repeat;
}

/* LCP Data Table Section */
.row.lcp-datatable-background {
  background-color: #f4f4f4;
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 20px;
  padding-bottom: 20px;
}

.row.lcp-datatable-background-mini {
  background-color: #f4f4f4;
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 20px;
  padding-bottom: 20px;
}

.lcp-datatable-label {
  margin-right: auto;
}

.lcp-datatable-search {
  border: none;
  border-radius: 5px;
  margin-left: 5px;
  padding: 5px 10px 5px 10px;
}

.lcp-datatable-search:focus {
  outline: none;
  border-color: #ccc;
  -webkit-box-shadow:
    inset 0 1px 1px rgb(0 0 0 / 8%),
    0 0 8px rgb(244 255 0 / 60%);
  box-shadow:
    inset 0 1px 1px rgb(0 0 0 / 8%),
    0 0 8px rgb(244 255 0 / 60%);
}

.lcp-datatable-search-label {
  font-weight: normal;
}

.lcp-datatable-expanded-row.row {
  margin-left: 75px;
}

.lcp-datatable-expanded-item > [class*="col"]:first-child {
  padding-right: 12px;
}

.lcp-custom-cell {
  padding-top: 5px;
  padding-bottom: 5px;
}

.lcp-data-table-row {
  display: inline;
}

.lcp-data-table-link {
  justify-content: left;
  align-items: center;
  display: inline;
  color: black;
  text-decoration-line: underline;
  text-decoration-style: solid;
  padding: 0;
  cursor: pointer;
}

.lcp-data-table-link-disabled {
  justify-content: left;
  align-items: center;
  display: inline;
  color: #8a8c8e;
  text-decoration-line: underline;
  text-decoration-style: solid;
  padding: 0;
  cursor: pointer;
}

.lcp-data-table-link:hover {
  color: #7a9900;
  cursor: pointer;
}

.lcp-datatable-switch-label-left {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  font-size: 12px;
}

.lcp-datatable-switch-label-right {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  font-size: 12px;
}

.lcp-span-bubble {
  background-color: #fff;
  padding: 10px 25px;
  border-radius: 5px;
  display: inline-block;
  vertical-align: middle;
}

.lcp-span-bubble-gray {
  padding: 10px 25px;
  border-radius: 5px;
  display: inline-block;
  vertical-align: middle;
}

.lcp-field-value {
  color: black;
  font-weight: 400;
  font-size: 22px;
  word-wrap: break-word;
}

/* Mobile */
@media (max-width: 767px) {
  .row.lcp-datatable-background {
    padding: 10px;
  }

  .row.lcp-datatable-background-mini {
    padding: 10px;
  }

  .lcp-span-bubble {
    background-color: #fff;
    padding: 10px 15px;
    border-radius: 5px;
    margin-bottom: 5px;
    display: inline-block;
    vertical-align: middle;
  }

  .lcp-field-value {
    font-size: 16px;
  }
}

/* React Datatable Overrides */
.rdt_TableCol div {
  white-space: normal;
  padding-bottom: 5px;
}

/* Disabled expanded rows opacity to 0. */
.lcp-audit-datatable .rdt_Table button:disabled {
  opacity: 0;
  cursor: auto;
}

/* Add background color to every even row in datatable. */
.rdt_TableRow:nth-of-type(even) {
  background-color: #f4f4f4;
}

/* Remove divider borders between rows. */
.rdt_row:not(:last-of-type) .rdt_cellBase,
.rdt_row:not(:last-of-type) .rdt_rightPinSpacer {
  border-bottom: none;
  border-bottom-width: 0px;
}

/* Custom highlight on hover style. */
.rdt_TableRow.rdt_rowHighlight:hover {
  background-color: #ddd !important;
  border-bottom-color: white;
  outline-style: solid !important;
  outline-width: 0px !important;
  outline-color: #ddd !important;
}

/* Responsive font size for head cells and body cells. */
@media (max-width: 767px) {
  .rdt_TableCol div {
    padding-bottom: 0px;
  }

  .rdt_cellBaseHead,
  .rdt_cellBase {
    font-size: 12px !important;
  }

  .rdt_SubHeader {
    justify-content: flex-start;
    padding-left: 10px;
  }
}