// Pagination variants

.pagination-variant(@color, @hover, @active) {
  & {
    background-color: @color;

    li {
      &.previous {
        > a {
          border-right-color: mix(@color, white, 66%);
        }
      }
      > a, > span {
        border-left-color: mix(@color, white, 66%);

        &:hover, &:focus {
          border-left-color: mix(@color, white, 66%);
          background-color: @hover;
        }
        &:active {
          background-color: @active;
        }
      }
      &.active {
        > a, > span {
          background-color: @active;

          &:hover, &:focus {
            border-left-color: mix(@color, white, 66%);
            background-color: @hover;
          }
        }
      }
    }
  }
}