.discount-slider {
  display: flex;
  align-items: flex-end;
  gap: 20px;

  .track {
    position: relative;
    flex: 1;
    padding-top: 26px;
  }

  .anchor {
    position: absolute;
    top: 0;
    transform: translateX(-50%);
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;

    &::after {
      content: "▼";
      display: block;
      text-align: center;
      font-size: 9px;
    }
  }

  input[type="range"] {
    width: 100%;
    margin: 0;
  }

  .scale {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    color: var(--muted);
  }
}

.discount-table {
  tbody tr {
    cursor: pointer;

    &:hover {
      background: #f8fafc;
    }

    &.current {
      background: #e0f2fe;
      font-weight: 600;
    }
  }
}