/// Provides styles for the ButtonGroup element.
/// @group buttons
/// @author Richard Davis
/// @example
///   // A button group with several buttons
///   <div class="ButtonGroup">
///     <button class="Button--solid-safe">Lorem Ipsum</button>
///     <button class="Button--solid-danger">Lorem Ipsum</button>
///   </div>
.ButtonGroup {
  display: flex;
  flex-direction: column;

  @include breakpoint-s {
    flex-flow: row wrap;
  }

  a,
  input,
  button {
    margin-top: spacing-size(1);
    margin-bottom: spacing-size(1);

    @include breakpoint-s {
      margin-left: spacing-size(1);
      margin-right: spacing-size(1);
    }
  }
}