/***** ตาราง *******/
.table-fix2col-ctn{
  overflow-x: auto;
  overflow-y: auto;
  max-height: 90vh;
}
.table-fix2col-ctn table {
  width: 100%; 
  border-spacing: 1px; 
  border-collapse: separate;
  font-size: 0.95rem;
}

.table-fix2col-ctn table th,
.table-fix2col-ctn table td {
  border: 1px solid gray;
  padding: 1px;
  white-space: nowrap; 
  outline: 1px solid gray;
}

/* Scroll fix - thead */
.table-fix2col-ctn thead th {
  position: sticky;
  top: 0;
  font-weight: 400;
  z-index: 11;
  /* background-color: inherit; */
  line-height: 2rem;
}
.table-fix2col-ctn thead tr:first-child th:first-child , 
.table-fix2col-ctn thead tr:first-child th:nth-child(2) {
  background-color: var(--main-dark)
}


/* Scroll fix - 1st and 2nd columns */
.table-fix2col-ctn thead th:first-child,
.table-fix2col-ctn tbody td:first-child,
.table-fix2col-ctn thead th:nth-child(2),
.table-fix2col-ctn tbody td:nth-child(2) {
  position: sticky;
  z-index: 10; 
  background-color: inherit;
  overflow: hidden;
  white-space: nowrap;
}

.table-fix2col-ctn thead th:first-child,
.table-fix2col-ctn tbody td:first-child {
  left: 0;
}

.table-fix2col-ctn thead th:nth-child(2),
.table-fix2col-ctn tbody td:nth-child(2) {
  left: 20px; /* Adjust this value based on the width of the first column */
}

/* Scroll fix - 1st row 1st cell 1st column */
/*  Highest z-index to be on top of all other sticky elements */
.table-fix2col-ctn thead th:first-child ,
.table-fix2col-ctn thead th:nth-child(2) {
  z-index: 12; 
}
.table-fix2col-ctn tr:hover {
  background-color: black!important;
}