@use "variables" as _variables;
@use "functions" as _functions;
@use "breakpoints" as _bp;

// ----------------------------------------------------------------------------------------------
//  •• SPACING - utility classes with value for each breakpoint
//  Author : Ian Reid Langevin https://www.reidlangevin.com
// ----------------------------------------------------------------------------------------------

@if _variables.$s-spacing-fractions and _variables.$s-spacing-values {

   @each $breakpoint in map-keys(_variables.$s-breakpoints) {

      $prefix: _functions.breakpoint-prefix($breakpoint, _variables.$s-breakpoints);

      @each $spacing-fraction, $percentage in _variables.$s-spacing-fractions {

         @include _bp.media-up($breakpoint) {

            @each $property, $abbr in (margin: m, padding: p) {

               // if percentage is not none
               @if $percentage != 0 {
                  // without orientation
                  .#{$prefix}#{$abbr}-#{$spacing-fraction} {
                     #{$property}: calc(var(--spacing) * #{$percentage});
                  }
                  // with orientation
                  @each $orientation, $orientationabbr in (bottom: b, top: t) {
                     .#{$prefix}#{$abbr}#{$orientationabbr}-#{$spacing-fraction} {
                        #{$property}-#{$orientation}: calc(var(--spacing) * #{$percentage});
                     }
                  }

               } @else {
                  // without orientation
                  .#{$prefix}#{$abbr}-#{$spacing-fraction} {
                     #{$property}: 0;
                  }
                  // with orientation
                  @each $orientation, $orientationabbr in (bottom: b, top: t) {
                     .#{$prefix}#{$abbr}#{$orientationabbr}-#{$spacing-fraction} {
                        #{$property}-#{$orientation}: 0;
                     }
                  }

               }

            }
         }
      }
   }
}