// Spacers
// -------------------------

[class*='u-spacer-'] {
  margin-bottom: $line-height-base / 2;
}

@for $i from 1 through 5 {
  .u-spacer-#{$i} {
    height: $line-height-base * $i;
  }
}



// Padding
// -------------------------

@for $i from 0 through 5 {
  .u-vertical-padding-#{$i} {
    padding-top:    rem($line-height-base * $i) !important;
    padding-bottom: rem($line-height-base * $i) !important;
  }
}

.u-vertical-padding-gutter, // <-- DEPRECATED: Remove in ≥ v0.23.0
.u-vertical-padding-half {
  padding-top:    rem($line-height-base / 2) !important;
  padding-bottom: rem($line-height-base / 2) !important;
}

.u-vertical-padding-3-halves {
  padding-top:    rem($line-height-base * 1.5) !important;
  padding-bottom: rem($line-height-base * 1.5) !important;
}

[class*="u-vertical-padding-"] {
  @include consume-margins();
}


// Margin
// -------------------------

@for $i from 0 through 5 {
  .u-vertical-margin-#{$i} {
    margin-top:    rem($line-height-base * $i) !important;
    margin-bottom: rem($line-height-base * $i) !important;
  }

  .u-margin-top-#{$i} {
    margin-top:    rem($line-height-base * $i) !important;
  }

  .u-margin-bottom-#{$i} {
    margin-bottom:    rem($line-height-base * $i) !important;
  }
}

.u-vertical-margin-half {
  margin-top:    rem($line-height-base / 2) !important;
  margin-bottom: rem($line-height-base / 2) !important;
}

.u-margin-top-half {
  margin-top:    rem($line-height-base / 2) !important;
}

.u-margin-bottom-half {
  margin-bottom:    rem($line-height-base / 2) !important;
}