body {
  font-family: sans-serif;
  padding: 1rem;
}

input {
  margin-bottom: 1rem;
  padding: 0.5rem;
  width: 300px;
}

table {
  width: 100%;
  border-collapse: collapse;
}

th, td {
  padding: 0.5rem;
  border: 1px solid #ccc;
}

th.sortable {
  cursor: pointer;
}

th.sortable::after {
  content: ' ⇅';
  font-size: 0.8em;
  color: #999;
}

.has-old-price {
    background-color: #99ffb4; /* light green background */
  }

.has-promo {
  background-color: #ffeca0; /* Light yellow background */
}

.has-old-price.has-promo {
  background-color: #a0a2ff; /* Light blue background */
}