@import "globals";

.button-group {
  margin: 0;
  line-height: normal;

  &-buttons {
    span, a {
      padding: 6px 10px;
      display: inline-block;

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

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

      &:first-child:last-child {
        border-radius: 4px;
      }
    }

    span {
      background-color: $button-active-background-color;
      color: $button-active-text-color;
    }

    a {
      &, &:visited, &:hover {
        background-color: $button-background-color;
        color: $button-text-color;
        text-decoration: none;
      }

      &:hover {
        background-color: $button-hover-background-color;
        color: $button-hover-text-color;
      }
    }
  }

  &-label {
    margin-right: 10px;
  }
}