ion-segment { display: block; }

.ion-segment {
  display: flex;
  flex: 1;
  width: 100%;

  > .button {

    flex: 1;
    display: block;

    overflow: hidden;

    padding: 0 16px;

    width: 0;

    border-width: 1px 0px 1px 1px;
    border-radius: 0;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;

    background: none;

    &.active {
    }

    &:first-of-type {
      border-radius: $button-border-radius 0px 0px $button-border-radius;
    }
    &:last-of-type {
      border-right-width: 1px;
      border-radius: 0px $button-border-radius $button-border-radius 0px;
    }
  }
}