@mixin text-ellipsis {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

@mixin visually-hidden {
  position: absolute;
  height: 1px;
  width: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}

@mixin media-query($size) {
  @media (min-width: #{map-get($screen-breakpoints, $size)}) {
    @content;
  }
}