/* stylelint-disable function-whitelist */

// mixins for clearfix
// ------------------------
@mixin clearfix() {
  zoom: 1;

  &::before,
  &::after {
    display: table;
    content: '';
  }

  &::after {
    clear: both;
  }
}

// mixins for grid system
// ------------------------
@mixin make-row($gutter: $grid-gutter-width) {
  @include clearfix;

  position: relative;
  height: auto;
  margin-right: ($gutter / -2);
  margin-left: ($gutter / -2);
}

// mixins for grid system
// ------------------------
@mixin make-grid-columns() {
  $inner-mgc: 1;
  // initial
  $item-mgc: '.#{$amos-prefix}-col-#{$inner-mgc}, .#{$amos-prefix}-col-xs-#{$inner-mgc}, .#{$amos-prefix}-col-sm-#{$inner-mgc}, .#{$amos-prefix}-col-md-#{$inner-mgc}, .#{$amos-prefix}-col-lg-#{$inner-mgc}';

  @while $inner-mgc <= $grid-columns {
    $inner-mgc: $inner-mgc + 1;

    @if $inner-mgc <= $grid-columns {
      // general
      $lists: '.#{$amos-prefix}-col-#{$inner-mgc}, .#{$amos-prefix}-col-xs-#{$inner-mgc}, .#{$amos-prefix}-col-sm-#{$inner-mgc}, .#{$amos-prefix}-col-md-#{$inner-mgc}, .#{$amos-prefix}-col-lg-#{$inner-mgc}';
      $item-mgc: '#{$item-mgc}, #{$lists}';
    }

    @else if $inner-mgc > $grid-columns {
      #{$item-mgc} {
        position: relative;
        // Prevent columns from collapsing when empty
        min-height: 1px;
        padding-right: ($grid-gutter-width / 2);
        padding-left: ($grid-gutter-width / 2);
      }
    }
  }
}

@mixin float-grid-columns($class) {
  // kickstart it
  $inner-mc: 1;
  // initial
  $item: '.#{$amos-prefix}-col#{$class}-#{$inner-mc}';

  @while $inner-mc <= $grid-columns {
    $inner-mc: $inner-mc + 1;
    // general col-1, col-2,, ..., col-24
    @if $inner-mc <= $grid-columns {
      // general
      $item: '#{$item}, .#{$amos-prefix}-col#{$class}-#{$inner-mc}';
    }

    @else if $inner-mc > $grid-columns {
      #{$item} {
        flex: 0 0 auto;
        float: left;
      }
    }
  }
}

// $index = 0
@mixin loop-grid-columns-zero($index, $class) {
  .#{$amos-prefix}-col#{$class}-#{$index} {
    display: none;
  }

  .#{$amos-prefix}-col-push-#{$index} {
    left: auto;
  }

  .#{$amos-prefix}-col-pull-#{$index} {
    right: auto;
  }

  .#{$amos-prefix}-col#{$class}-push-#{$index} {
    left: auto;
  }

  .#{$amos-prefix}-col#{$class}-pull-#{$index} {
    right: auto;
  }

  .#{$amos-prefix}-col#{$class}-offset-#{$index} {
    margin-left: 0;
  }

  .#{$amos-prefix}-col#{$class}-order-#{$index} {
    order: 0;
  }
}

// $index > 0
@mixin loop-grid-columns-more-zero($index, $class) {
  .#{$amos-prefix}-col#{$class}-#{$index} {
    display: block;
    width: percentage(($index / $grid-columns));
    box-sizing: border-box;
  }

  .#{$amos-prefix}-col#{$class}-push-#{$index} {
    left: percentage(($index / $grid-columns));
  }

  .#{$amos-prefix}-col#{$class}-pull-#{$index} {
    right: percentage(($index / $grid-columns));
  }

  .#{$amos-prefix}-col#{$class}-offset-#{$index} {
    margin-left: percentage(($index / $grid-columns));
  }

  .#{$amos-prefix}-col#{$class}-order-#{$index} {
    order: $index;
  }
}

@mixin loop-grid-columns($index, $class) {
  $inner-gc: $index + 1;

  @while $inner-gc >= 0 {
    $inner-gc: $inner-gc - 1;

    @if $inner-gc == 0 {
      @include loop-grid-columns-zero($inner-gc, $class);
    }

    @else if $inner-gc > 0 {
      @include loop-grid-columns-more-zero($inner-gc, $class);
    }
  }
}

@mixin make-grid($class: '') {
  @include float-grid-columns($class);
  @include loop-grid-columns($grid-columns, $class);
}