@use '../variables' as *;
@use 'media.mixins' as *;

$-display-props: none, inline, inline-block, block, grid, flex, inline-flex;

@each $prop in $-display-props {
  .cat-#{$prop} {
    display: $prop !important;
  }
}

@each $key, $value in cat-token('size.screen') {
  @include from($key) {
    @each $prop in $-display-props {
      .cat-#{$prop}\:#{$key} {
        display: $prop !important;
      }
    }
  }
}