/*------------------------------------------------------------
HELPERS
====================================*/

/* Variables Custom */
$positionsSpace: (
        "top",
        "right",
        "bottom",
        "left"
) !default;
/***************************************/

// Colors
@each $color, $value in $theme-colors {
  .bg-#{$color} {
    background: $value;
  }
}

@each $color, $value in $grays {
  .bg-gray-#{$color} {
    background: $value;
  }
}

// Margin/Padding
body {
  .margin-auto {
    margin: auto;
  }
  @for $i from 0 through 5 {
    .margin-#{$i} {
      margin: #{$i}rem;
    }

    .padding-#{$i} {
      padding: #{$i}rem;
    }
  }
  @each $position in $positionsSpace {
    .margin-#{$position}-auto {
      margin-#{$position}: auto;
    }

    @for $i from 0 through 5 {
      .margin-#{$position}-#{$i} {
        margin-#{$position}: #{$i}rem;
      }

      .padding-#{$position}-#{$i} {
        padding-#{$position}: #{$i}rem;
      }
    }
  }
}
