.base-table {
  width: 100%;
  color: var(--blackColor);
}

.base-table > thead {
  background-color: var(--headerColor);
}

.base-table > thead > tr > th {
  padding: 12px;
  width: 120px;
  text-align: center;
  white-space: nowrap;
}
.base-table > thead > tr > th:last-child {
  padding: 12px;
  width: 60px;
  text-align: center;
}

.base-table > tbody > tr > td {
  /* width: 1%; */
  padding: 8px 12px;
  text-align: center;
  white-space: nowrap;
}

.base-table > tbody > tr:not(:last-child) {
  border-bottom: 1px solid var(--borderColor);
}

.text-left {
  text-align: left;
}
.base-table > tbody > tr > td > div > form > .base-button {
  border-color: transparent;
}

.base-table > tfoot {
  background-color: var(--primaryColorLight);
  color: var(--blackColor);
  font-weight: var(--semibold);
}

.base-table > tfoot > tr > td {
  padding: 8px 12px;
  white-space: nowrap;
}

.table-buttons {
  display: flex;
  gap: 0.5rem;
  justify-content: flex-end;
}
.table-button {
  width: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0.5rem;
  background-color: transparent;
  outline: none;
  border: none;
  cursor: pointer;
  color: var(--blackColor);
  border-radius: 50%;
}
.table-button:hover {
  background-color: var(--headerColor);
}

.table-button > svg > path {
  fill: var(--blackColor);
}

.border-b-border {
  border-bottom: 1px solid var(--borderColor);
}