/*------------------------------------
  Border Width
------------------------------------*/

@each $breakpoint in map-keys($grid-breakpoints) {
  @include media-breakpoint-up($breakpoint) {
    $infix: breakpoint-infix($breakpoint, $grid-breakpoints);

    .g-brd-w {
      &-0#{$infix} {
        border-width: 0 !important;
      }

      &-1#{$infix} {
        border-width: 1px !important;
      }

      &-2#{$infix} {
        border-width: 2px !important;
      }

      &-3#{$infix} {
        border-width: 3px !important;
      }

      &-4#{$infix} {
        border-width: 4px !important;
      }

      &-5#{$infix} {
        border-width: 5px !important;
      }

      &-6#{$infix} {
        border-width: 6px !important;
      }

      &-7#{$infix} {
        border-width: 7px !important;
      }

      &-10#{$infix} {
        border-width: 10px !important;
      }

      &-12#{$infix} {
        border-width: 12px !important;
      }

      // Top
      &-top#{$infix} {
        &-0#{$infix} {
          border-top-width: 0 !important;
        }
        &-2#{$infix} {
          border-top-width: 2px !important;
        }
        &-3#{$infix} {
          border-top-width: 3px !important;
        }
        &-5#{$infix} {
          border-top-width: 5px !important;
        }
      }

      // Bottom
      &-bottom#{$infix} {
        &-0#{$infix} {
          border-bottom-width: 0 !important;
        }
        &-2#{$infix} {
          border-bottom-width: 2px !important;
        }
        &-5#{$infix} {
          border-bottom-width: 5px !important;
        }
      }

      // Left
      &-left#{$infix} {
        &-0#{$infix} {
          border-left-width: 0 !important;
        }

        &-1#{$infix} {
          border-left-width: 1px !important;
        }

        &-2#{$infix} {
          border-left-width: 2px !important;
        }

        &-3#{$infix} {
          border-left-width: 3px !important;
        }

        &-4#{$infix} {
          border-left-width: 4px !important;
        }
      }

      // Right
      &-right#{$infix} {
        &-0#{$infix} {
          border-right-width: 0 !important;
        }

        &-1#{$infix} {
          border-right-width: 1px !important;
        }

        &-2#{$infix} {
          border-right-width: 2px !important;
        }

        &-3#{$infix} {
          border-right-width: 3px !important;
        }

        &-4#{$infix} {
          border-right-width: 4px !important;
        }
      }
    }
  }
}
