@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap');

.combo-sales-bill-table {
  width: 100%;
  font-family: 'Inter', sans-serif;

  .bill-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;

    thead {
      position: sticky;
      top: -1px;
      tr {
        background-color: #bdd4ff;

        th {
          padding: 4px 8px;
          font-weight: 600;
          color: #000;
          border: 1px solid #9c9c9c;
          font-size: 13px;
          white-space: nowrap;
          font-family: 'Poppins', sans-serif !important;
        }
      }
    }

    tbody {
      > tr:last-child {
        background-color: #e5d434 !important;
        position: sticky;
        bottom: 0;
      }
      tr {
        background-color: #fff;

        &.highlighted-row {
          background-color: #e5d434;
        }

        td {
          padding: 4px 8px;
          border: 1px solid #9c9c9c;
          color: #000;
          font-weight: 600;
          font-size: 13px;
        }
      }
    }
  }
  .hsnCodeTh {
    text-align: center;
    width: 90px;
  }
  .hsnCodeTd {
    text-align: left;
  }
  .productNameTh {
    text-align: center;
    // width: 300px !important;
    white-space: nowrap;
  }
  .productNameTd {
    text-align: left;
    white-space: nowrap;
    // width: 300px !important;
    display: flex;
    align-items: center;
    column-gap: 10px;
    row-gap: 0;

    p {
      background-color: #dbdbdb;
      padding: 0px 4px;
    }

    @media (max-width: 500px) {
      flex-direction: column;
      align-items: flex-start;
    }
  }
  .barcodeTh {
    text-align: center;
    width: 200px;
  }
  .barcodeTd {
    text-align: center;
  }
  .qtyTh {
    text-align: center;
    width: 100px;
  }
  .qtyTd {
    width: 100px;
    text-align: center;
  }
  .rateTh {
    width: 90px;
    text-align: center;
  }
  .rateTd {
    width: 90px;
    text-align: right;
  }
  .discPerTh {
    text-align: center;
    width: 70px;
  }
  .discPerTd {
    text-align: center;
  }
  .discAmtTh {
    text-align: center;
    width: 75px;
  }
  .discAmtTd {
    text-align: right;
  }
  .totalTh {
    text-align: center;
    width: 170px;
  }
  .totalTd {
    text-align: right;
  }
  .salesManTh {
    text-align: center;
    width: 85px;
  }
  .salesManTd {
    text-align: center;
    width: 85px;
  }

  .percentageTh {
    text-align: center;
  }
  .percentageTd {
    text-align: right;
  }
  .commissionTh {
    text-align: center;
    width: 95px;
  }
  .commissionTd {
    text-align: right;
    width: 95px;
  }
  .stockIdTh {
    text-align: center;
  }
  .stockIdTd {
    text-align: center;
  }
  .pointsTh {
    text-align: center;
  }
  .pointsTd {
    text-align: right;
  }
}