@mixin btn-group-size($name, $paddingX, $paddingY, $font-size, $radius) {
  .ui-btn-group-#{$name} {
    > .ui-btn, > ui-btn-group > .ui-btn, > ui-dropdown > .ui-btn {
      @include input-size($paddingY, $paddingX, 0, $font-size);
    }
    > .ui-btn:first-child, > ui-btn-group:first-child > .ui-btn:first-of-type, > ui-dropdown:first-child > .ui-btn:first-of-type {
      border-top-left-radius: $radius;
      border-bottom-left-radius: $radius;
    }
    > .ui-btn:last-child, > ui-btn-group:last-child > .ui-btn:last-of-type, > ui-dropdown:last-child > .ui-btn:last-of-type {
      border-top-right-radius: $radius;
      border-bottom-right-radius: $radius;
    }
  }
}

ui-btn-group {
  position: relative;
  display: inline-table;
  white-space: nowrap;
  > .ui-btn {
    display: table-cell;
    border-radius: 0;
    margin-left: -1px;
    &:first-child {
      margin-left: 0;
    }
    &:first-child {
      border-top-left-radius: $button-radius;
      border-bottom-left-radius: $button-radius;
    }
    &:last-child {
      border-top-right-radius: $button-radius;
      border-bottom-right-radius: $button-radius;
    }
  }

  > .ui-btn:not(:first-child), ui-dropdown:not(:first-child) > .ui-btn {

    &.ui-btn-default {
      border-left-color: $color-gray;
    }
    &.ui-btn-dark {
      border-left-color: darken($color-dark, 10);
    }
    &.ui-btn-gray {
      border-left-color: darken($color-gray-dark, 10);
    }
    &.ui-btn-primary {
      border-left-color: darken($color-primary, 10);
    }
    &.ui-btn-info {
      border-left-color: darken($color-info, 10);
    }
    &.ui-btn-success {
      border-left-color: darken($color-success, 10);
    }
    &.ui-btn-warning {
      border-left-color: darken($color-warning, 10);
    }
    &.ui-btn-danger {
      border-left-color: darken($color-danger, 10);
    }
  }

  > ui-btn-group, > ui-dropdown {
    margin-left: -1px;
    &:first-child {
      margin-left: 0;
    }
    > .ui-btn {
      border-radius: 0;
    }
    &:first-child > .ui-btn:first-of-type {
      border-top-left-radius: $button-radius;
      border-bottom-left-radius: $button-radius;
    }
    &:last-child > .ui-btn:last-of-type {
      border-top-right-radius: $button-radius;
      border-bottom-right-radius: $button-radius;
    }
  }
}

@include btn-group-size(sm, $button-padding-horizontal-sm, $button-padding-vertical-sm, $button-font-size-sm, $button-radius-sm);
@include btn-group-size(lg, $button-padding-horizontal-lg, $button-padding-vertical-lg, $button-font-size-lg, $button-radius-lg);