:root {
  --blue-dark: #18384A;
  --green: #8FD341;
  --cyan: #56979E;
  --off-white: #f1f1f1;
  --font-family-primary: "DM Sans",'Times New Roman', sans-serif;
}

table#product_Table {
  background: #fff;
  font-family: var(--font-family-primary);
  border-collapse: collapse;
  overflow: hidden;
}

table, th, td {
  border: 1px solid rgba(151,151,151,0.2);
  border-collapse: collapse;
}

thead tr#headerName {
  background: var(--blue-dark) !important;
  color: #fff;
    > th {
    font-size: 12px;
    padding: 10px;
    vertical-align: bottom;
  }
  .content-header {
    display: flex;
    align-items: flex-end;
    span{
      display: block;
      text-align: left;
    }
    button {
      font-size: 10px;
      padding: 2px 5px !important;
      display: flex;
      border: none;
      border-radius: 5px;
      letter-spacing: -0.8px;
      cursor: pointer;
    }
    gap: 19px;
  }
}

thead tr#headerFilter {
  background: var(--cyan);
  padding: 10px;
  color: #fff;
  > th {
    font-size: 10px;
    padding: 10px;
    text-align: left;
    tr {
      display: block;
      > a {margin-bottom: 5px;display: block;}
    }
    tr:nth-child(2) {
      margin-top: 5px;
    }
  }
  select {
    background: #fff;
    border: none;
    border-radius: 5px;
    box-shadow: none;
    height: 22px;
    font-size: 10px;
    width: 100%;
    cursor: pointer;
  }
}


tbody#product_Body tr:nth-child(odd){
  background: var(--off-white);
}

tbody#product_Body tr td{
  padding: 8px 10px;
  font-size: 14px;
  text-align: center
}