.panel-group {
  &__label {
    max-height: 280px;
    overflow-y: auto;
    position: relative;

    &--scroll-labels {
      &:before {
        content: "";
        position: sticky;
        display: block;
        z-index: 1;
        top: -2px;
        left: 0;
        width: 100%;
        height: 17px;
        // We explicityly use rgba(255,255,255,0) because it's equivalent to transparent for most broswers except Safari.
        background-image: linear-gradient(
          to bottom,
          #f9fafc,
          rgba(255, 255, 255, 0)
        );
      }

      &:after {
        content: "";
        position: sticky;
        display: block;
        bottom: -1px;
        left: 0;
        width: 100%;
        height: 17px;
        // We explicityly use rgba(255,255,255,0) because it's equivalent to transparent for most broswers except Safari.
        background-image: linear-gradient(
          to bottom,
          rgba(255, 255, 255, 0),
          #f9fafc
        );
      }
    }
  }
}
