das/public/css/table.scss

.rdt_TableCol {
  padding: 8px 11px;
  color: var(--primary) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

.rdt_TableRow {
  border-bottom: 1px solid var(--primary-light) !important;
  border-radius: 25px;
}

.rdt_TableRow:hover {
  background-color: var(--primary-light) !important;
}

.rdt_TableHeadRow {
  background: var(--primary-light) !important;
  border: none !important;
  margin-bottom: 10px;
}

.rdt_TableHeadRow:nth-child(1) {
  border-radius: 25px !important;
}

.rdt_Pagination {
  border-top: none !important;
  /* border-top: 1px solid #EFF2F5 !important; */
}


//ANTD TABLE
.ant-table-cell{
  font-size: 13px;
}

.ant-pagination .ant-pagination-item-active a {
  color: #fff !important;
}

.ant-pagination .ant-pagination-item-active {
  border-color: var(--primary) !important;
  background: var(--primary) !important;
}

.ant-table-wrapper .ant-table-thead > tr > th, .ant-table-wrapper .ant-table-thead > tr > td {
  position: relative;
  color: var(--primary-light);
  font-weight: 600;
  text-align: start;
  background: var(--primary);
  border-bottom: 1px solid #ffffff;
  padding: 11px 16px;
}


.ant-table-tbody tr td {
  font-weight: 500;
  padding: 3px 13px !important;
}

.ant-table-wrapper .ant-table-thead th.ant-table-column-has-sorters:hover {
  background: var(--primary-light);
  color: var(--primary);
}

.ant-table-wrapper .ant-table-column-sorter-up.active, .ant-table-wrapper .ant-table-column-sorter-down.active {
  color: #fff;
}

.ant-table-wrapper .ant-table-thead th.ant-table-column-sort {
  background: var(--primary);
  color: #fff;
}

.ant-table-wrapper .ant-table-container table > thead > tr:first-child > *:last-child{
  border-radius: 0 20px 20px 0;
}

.ant-table-wrapper .ant-table-container table > thead > tr:first-child > *:first-child {
  border-radius: 20px 0 0 20px;
}

.ant-table-cell:hover .ant-table-wrapper .ant-table-container table > thead > tr:first-child > *:last-child{
  border-radius: 0 20px 20px 0;
}

.ant-table-cell-row-hover {
  background: var(--primary-light) !important;
}

.ant-pagination .ant-pagination-total-text {
  position: absolute;
  left: 22px;
  font-size: 13px;
  color: var(--text-muted);
  font-weight: 400;
}

//zn table
.znTable {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  background: #fff;


  tr td {
    padding: 10px 30px;
    border-top: 1px solid #ededed;
  }
}

.ant-table-wrapper .ant-table-thead >tr>th:not(:last-child):not(.ant-table-selection-column):not(.ant-table-row-expand-icon-cell):not([colspan])::before,
.ant-table-wrapper .ant-table-thead >tr>td:not(:last-child):not(.ant-table-selection-column):not(.ant-table-row-expand-icon-cell):not([colspan])::before {
  background-color: #00353129;
}


.ant-table-kol .ant-table-wrapper .ant-table-thead > tr > th,
.ant-table-kol .ant-table-wrapper .ant-table-thead > tr > td{
  background: #f7f7f7;
  padding:8px 15px;
}

.ant-table-early-warning .ant-table-wrapper .ant-table-thead > tr > th,
.ant-table-early-warning .ant-table-wrapper .ant-table-thead > tr > td{
  background: #242424;
  padding: 10px 15px;
  color: #fff;
}

.ant-table-kol-npl .ant-table-wrapper .ant-table-thead > tr > th,
.ant-table-kol-npl .ant-table-wrapper .ant-table-thead > tr > td{
  color: rgb(248, 230, 248);
  background: rgb(109, 0, 175);
  padding:8px 15px;
  height: 65px;
}

.ant-table-kol-dist .ant-table-wrapper .ant-table-thead > tr > th,
.ant-table-kol-dist .ant-table-wrapper .ant-table-thead > tr > td{
  color: rgb(230, 238, 248);
  background: rgb(0, 73, 175);
  padding:8px 15px;
  height: 65px;
}

.ant-table-kol-kjt .ant-table-wrapper .ant-table-thead > tr > th,
.ant-table-kol-kjt .ant-table-wrapper .ant-table-thead > tr > td{
  color: rgb(255, 245, 248);
  background: rgb(241, 65, 108);
  padding:8px 15px;
  height: 65px;
}

.ant-table-pergerakan .ant-table-wrapper .ant-table-thead > tr > th,
.ant-table-pergerakan .ant-table-wrapper .ant-table-thead > tr > td{
  background: #f7f7f7;
  padding:8px 15px;
  height: 65px;
}

.ant-table-pemburukan .ant-table-wrapper .ant-table-thead > tr > th,
.ant-table-pemburukan .ant-table-wrapper .ant-table-thead > tr > td{
  background: var(--color-kol1);
  color: #fff;
  padding:8px 15px;
  height: 65px;
}

.ant-table-perbaikan .ant-table-wrapper .ant-table-thead > tr > th,
.ant-table-perbaikan .ant-table-wrapper .ant-table-thead > tr > td{
  background: var(--color-kol2);
  color: #fff;
  padding:8px 15px;
  height: 65px;
}

.ant-table-tetap .ant-table-wrapper .ant-table-thead > tr > th,
.ant-table-tetap .ant-table-wrapper .ant-table-thead > tr > td{
  background: var(--color-kol3);
  color: #fff;
  padding:8px 15px;
  height: 65px;
}