@use "../../../../styles/int.scss";

.stretch {
  position: relative;
  margin-left: calc(-1 * var(--ModuleContainer-card-padding, 0px));
  margin-right: calc(-1 * var(--ModuleContainer-card-padding, 0px));
  width: calc(100% + (2 * var(--ModuleContainer-card-padding, 0px)));

  &::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: int.$spacing-5;
    height: 100%;
    background: linear-gradient(to right, rgba(white, .5), rgba(white, .5));
    z-index: 10;
    pointer-events: none;
  }

  &::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: int.$spacing-5;
    height: 100%;
    background: linear-gradient(to left, rgba(white, .5), rgba(white, 0));
    z-index: 10;
    pointer-events: none;
  }
}

.panning {
  min-width: 800px;
}