.table-scroll-buttons {
  width: 100%;
}

.table-scroll-buttons-outer {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
  .table-scroll-buttons-button-left, .table-scroll-buttons-button-right {
    display: none;
    position: absolute;
    z-index: 1;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 1.25rem;
    line-height: 2.5rem;
    font-size: 1rem;
    text-align: center;
    background: white;
    color: black;
    border: 1px solid var(--nook-grey-dark);
    box-shadow: 0 0.25rem 0.5rem var(--nook-grey-dark);
  }
  .table-scroll-buttons-button-left {
    left: 1.5rem;
  }
  .table-scroll-buttons-button-right {
    right: 1.5rem;
  }
}

.table-scroll-buttons-outer.table-scroll-buttons-scrollable-left {
  .table-scroll-buttons-button-left {
    display: block;
  }
}

.table-scroll-buttons-outer.table-scroll-buttons-scrollable-right {
  .table-scroll-buttons-button-right {
    display: block;
  }
}