@use 'sass:math';

@use 'config' as *;
@use '../common/var' as *;
@use 'element-plus/theme-chalk/src/mixins/mixins' as elMixins;

@mixin col-size($size) {
  @include elMixins.res($size, $pd-breakpoints) {
    .#{$namespace}-col-#{$size}-0 {
      display: none;
      @include elMixins.when(guttered) {
        display: none;
      }
    }
    @for $i from 0 through 24 {
      .#{$namespace}-col-#{$size}-#{$i} {
        @if $i != 0 {
          display: block;
        }
        max-width: (math.div(1, 24) * $i * 100) * 1%;
        flex: 0 0 (math.div(1, 24) * $i * 100) * 1%;
      }

      .#{$namespace}-col-#{$size}-offset-#{$i} {
        margin-left: (math.div(1, 24) * $i * 100) * 1%;
      }

      .#{$namespace}-col-#{$size}-pull-#{$i} {
        position: relative;
        right: (math.div(1, 24) * $i * 100) * 1%;
      }

      .#{$namespace}-col-#{$size}-push-#{$i} {
        position: relative;
        left: (math.div(1, 24) * $i * 100) * 1%;
      }
    }
  }
}