#rfq-supplier-table {
    width: 100%;
    border-collapse: collapse;
}
#editable-rfq-table th:nth-child(5),
#editable-rfq-table td:nth-child(5) {      /* Qty is the 7th column */
  width: 200px;
}
#editable-rfq-table th:nth-child(7),
#editable-rfq-table td:nth-child(7) {      /* Qty is the 7th column */
  width: 80px;
}

#editable-rfq-table th:nth-child(8),
#editable-rfq-table td:nth-child(8) {      /* Price is the 8th column */
  width: 80px;
}

/* And make their inputs fill that space nicely */
.quantity-input, .price-input {
  width: 100%;
  box-sizing: border-box;
}

#editable-rfq-table thead th {
  position: sticky;
  top: 0;
  background: #f2f2f2;   /* or whatever your header bg is */
  cursor: pointer;       /* indicate it’s clickable */
  z-index: 2;            /* sit above the body rows */
}

#rfq-supplier-table th, #rfq-supplier-table td {
    border: 1px solid #ccc;
    padding: 8px;
    text-align: left;
}

#rfq-supplier-table th {
    background-color: #f4f4f4;
}

#rfq-supplier-table td[contenteditable] {
    background-color: #fffbea;
    outline: none;
}

.delete-row {
    background-color: #e74c3c;
    color: #fff;
    border: none;
    padding: 5px 10px;
    cursor: pointer;
    border-radius: 3px;
}

.delete-row:hover {
    background-color: #c0392b;
}
#editable-rfq-table thead th.sorted {
  background: #d9edf7;
}

#editable-rfq-table {
  border-collapse: collapse; /* only on the table itself */
  width: 100%;
}
.table-wrapper {
 
  overflow-y: auto;
  max-height: 600px;
}
#editable-rfq-table thead th {
  position: sticky;
  top: 0;
  background: #f2f2f2;   /* match your header bg */
  z-index: 2;            /* stay above body rows */
  cursor: pointer;       /* indicates you can click to sort */
}

/* optional: highlight the sorted column */
#editable-rfq-table thead th.sorted {
  background: #d9edf7;
}