/**
 * c-button-group
 */
@import url('../../styles/variables.css');

.c-button-group {
  display: inline-block;

  & .c-button {
    float: left;
    border-radius: 0;

    &:first-child {
      border-radius: 3px 0 0 3px;
    }

    &:last-child {
      border-radius: 0 3px 3px 0;
    }

    &:not(.c-button--outline) {
      border-left: 1px solid color(var(--gray) l(68%));

      &:first-child {
        border-left: none;
      }
    }

    &.c-button--outline:not(:first-child) {
      border-left: 0;
    }
  }

  & .c-button:focus {
    position: relative;
    z-index: 1;
  }

  & .c-button + .c-button {
    margin-left: 0;
  }
}

.c-button-group .c-button--primary:not(.c-button--outline) {
  border-left-color: color(var(--primary-color) l(+8%));
}

.c-button-group .c-button--danger:not(.c-button--outline) {
  border-left-color: color(var(--danger-color) l(+8%));
}

.c-button-group + .c-button-group {
  margin-left: 8px;
}