.sds-button-group--secondary.sds-button-group--segmented,
.sds-button-group.sds-button-group--segmented {
  @include add-list-reset;
  @include u-display('flex');
  @include u-flex('row');
  @include u-margin('105');

  .sds-button-group__item > .usa-button {
    @include u-margin-x('neg-1px');
  }

  .sds-button-group__item:not(:first-child):not(:last-child) > .usa-button {
    @include u-radius(0);
  }

  .sds-button-group__item:first-child > .usa-button {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }

  .sds-button-group__item:last-child > .usa-button {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }
}

.sds-button-group--secondary.sds-button-group--segmented {
  .sds-button-group__item {
    .usa-button {
      @include u-border('secondary-dark');
      @include u-bg('secondary-dark');
      @include u-text('white');
      //height: 100%;
    }

    .usa-button.usa-button--outline {
      @include u-bg('white');
      @include u-text('secondary-dark');
      @include u-border('secondary-dark');
    }
  }
}

.sds-button-group--modular.sds-button-group--segmented {
  mat-button-toggle:not(:last-of-type){
    margin-right: 10px;
  }
  .sds-button-group__item {
    .mat-button-toggle-button{
      padding: 8px;
    }
    border-radius: 8px;
    box-shadow: 1px 2px 4px 0px #00000080;
    @include u-bg('base-lightest');
    @include u-border(2px, !important);
    @include u-border('solid');
    @include u-border('base-lightest', !important);

    .mat-button-toggle-focus-overlay{
      background-color: transparent;
    }

    &:not(.mat-button-toggle-disabled):hover{
      @include u-bg('accent-cool-lighter');
      @include u-border('accent-cool-lighter', !important);
      cursor: pointer;
    }
    &:not(.mat-button-toggle-disabled).mat-button-toggle-checked, &:not(.mat-button-toggle-disabled):active{
    
      @include u-border('secondary', !important);
      @include u-border(2px, !important);
    }
    &.mat-button-toggle-disabled{
      @include u-bg('base-light');
      @include u-border('base-light', !important);
      @include u-border(2px, !important);
      @include u-text('base-dark');
    }
    // Focus is placed on this class when tabbing
    .mat-button-toggle-button:focus{
      outline: solid 2px #2491FF;
      outline-offset: 5px;
    }

  }
}