.pageContainer {
  height: calc(100vh - 16px);
}

.pageContainer.withFixedScrollBar [data-class='page-scrollable-content'] {
  &::-webkit-scrollbar {
    height: 0;
    width: 12px;
  }

  &::-webkit-scrollbar-button {
    display: none;
    height: 6px;
  }

  &::-webkit-scrollbar-thumb {
    background-color: var(--wds-scrollbar-fill, var(--wsr-color-B30, #a8caff));
    background-clip: content-box;
    border-radius: var(--wds-border-radius-full, calc(3px * 2));
    border: calc((12px - var(--wds-scrollbar-width, 6px)) / 2) solid transparent;
    height: 72px;
  }

  @media (hover: hover) {
    &::-webkit-scrollbar-thumb:hover {
      background-color: var(--wds-scrollbar-fill-hover, var(--wsr-color-B20, #5999ff));
    }
  }

  &::-webkit-scrollbar-thumb:active {
    background-color: var(--wds-scrollbar-fill-active, var(--wsr-color-B10, #116dff));
  }
}

.backgroundGradient {
  background: linear-gradient(97deg, #e7e7ff 0%, #ddedff 52%, #ddedff 100%);
}