.sticky {
  position: sticky;
  top: 0;
}

.grid-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(30ch, 400px), 1fr));
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  justify-items: stretch;
  align-items: stretch;

  & article {
    height: 100%;
  }
}

.scroll-container {
  position: relative;
  overflow-y: auto;

  &.max-h-30 {
    max-height: 30rem;
  }

  &.max-h-80 {
    max-height: 80rem;
  }

  &.min-h-30 {
    min-height: 30rem;
  }

  & thead th {
    position: sticky;
    top: 0;
  }
}

.max-fit-content {
  max-width: fit-content;
}

.overflow-scroll {
  overflow: auto;
}