@use './breakpoints' as util-breakpoints;
@use './flexbox' as util-flexbox;
@use './sizing' as util-sizing;
@use './spacing' as util-spacing;
@use './grid' as util-grid;
@use './display' as util-display;
@use './alignment' as util-alignment;
@use './elevations' as util-elevations;
@use './text' as util-text;
@use './font-size' as util-fontSize;
@use './flag' as util-flag;
@use './font' as util-font;

// Mixin for all theme utilities
// @see theming file
@mixin design-system-utilities() {
  // Define default utilities
  @include util-grid.mic-grid-utilities();
  @include util-flexbox.mic-flexbox-utilities();
  @include util-sizing.mic-sizing-utilities();
  @include util-spacing.mic-spacing-utilities();
  @include util-display.mic-display-utilities();
  @include util-alignment.mic-alignment-utilities();
  @include util-text.mic-text-utilities();
  @include util-fontSize.mic-font-utilities();
  @include util-flag.mic-flag-utilities();
  // Wrap the font-family mixin within a style rule
  body {
    @include util-font.font-family('Michelin Unit Titling');
  }

  // Define utilities using breakpoints prefix
  @each $size, $i in util-breakpoints.$media-sizes {
    @media (#{$i}) {
      @include util-grid.mic-grid-utilities($size + '-');
      @include util-flexbox.mic-flexbox-utilities($size + '-');
      @include util-sizing.mic-sizing-utilities($size + '-');
      @include util-spacing.mic-spacing-utilities($size + '-');
      @include util-display.mic-display-utilities($size + '-');
      @include util-alignment.mic-alignment-utilities($size + '-');
      @include util-text.mic-text-utilities($size + '-');
      @include util-fontSize.mic-font-utilities($size + '-');
    }
  }

  // Define icon classes
  @include util-sizing.mat-icon-sizing-utilities('large', 40px, 24px);
  @include util-sizing.mat-icon-sizing-utilities('medium', 32px, 19px);
  @include util-sizing.mat-icon-sizing-utilities('small', 26px, 16px);
  @include util-sizing.mat-icon-sizing-utilities('tiny', 20px, 12px);
}
