.dataTable td,
.table td,
.dataTable td a,
.table td a {
  font-size: 12px !important;
  padding: 3px 6px !important;
}

.dataTables_processing {
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;

  background: color-mix(
    in srgb,
    var(--theme-deafult) 85%,
    transparent
  ) !important;
  color: #fff !important;
  padding: 20px 35px !important;
  font-size: 18px !important;
  font-weight: bold !important;

  border-radius: 10px !important;
  box-shadow: color-mix(
    in srgb,
    var(--theme-deafult) 50%,
    transparent
  ) !important;

  z-index: 99999 !important;
  text-align: center !important;
  height: 85px !important;
}

/* Spinner without flexbox */
.dataTables_processing:before {
  content: "";
  display: inline-block;
  margin-right: 10px;

  width: 18px;
  height: 18px;
  border: 3px solid #fff;
  border-top-color: transparent;
  border-radius: 50%;
  animation: dt-spin 0.8s linear infinite;
  vertical-align: middle;
}

/* Keep the text aligned correctly */
.dataTables_processing span {
  vertical-align: middle;
}

@keyframes dt-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.dataTables_wrapper button {
  background: var(--theme-deafult);
}

table.dataTable > tbody > tr.selected > * {
  box-shadow: inset 0 0 0 9999px var(--theme-deafult) !important;
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.9);
  color: rgb(255, 255, 255);
  color: rgb(var(--dt-row-selected-text));
}

div.dtsp-searchPane div.dt-container,
div.dtsp-searchPane div.dataTables_wrapper {
  border-radius: 0 !important;
}

.dataTable td,
.table td {
  font-size: 13px !important;
  font-weight: 500;
}
table.dataTable > thead > tr > th,
table.dataTable > thead > tr > td {
  padding: 3px 5px;
}