@use 'variables';

// Mixins
//
// Use these in other classes by calling @include

@mixin show-flex-on-medium {
  @media (min-width: variables.$breakpoint-md) {
    display: flex !important
  }
}

@mixin show-block-on-medium {
  @media (min-width: variables.$breakpoint-md) {
    display: block !important
  }
}

@mixin inline-flex {
  display: inline-flex;
  gap: 2rem;
  max-width: 100%;
  overflow: auto;
  scrollbar-color: var(--scrollbar-color);
}

@mixin grid {
  display: grid;
  grid-gap: 1.75rem;
}