// Pagination
//

@include rtl-only {
  .pagination {
    padding-right: 0;
  }
}

// Add spacing between pagination items
.page-item + .page-item .page-link,
.pagination li + li > a:not(.page-link) {
  margin-left: $pagination-spacer;

  @include rtl-style {
    margin-right: $pagination-spacer;
    margin-left: 0;
  }
}

.page-link,
.page-link > a {
  min-width: calc(#{"#{($font-size-base * $pagination-line-height) + ($pagination-padding-y * 2)} + #{$pagination-border-width * 2}"});
  text-align: center;
  line-height: $pagination-line-height;

  @include border-radius($border-radius);

  @if $material-style {
    font-weight: $btn-font-weight;
  }

  &:focus {
    color: $pagination-hover-color;
  }
}

.page-link.btn-primary {
  box-shadow: none !important;
}

// *******************************************************************************
// * Make Bootstrap 3 pagination compatible with Bootstrap 4

.pagination > li > a:not(.page-link) {
  position: relative;
  display: block;
  padding: $pagination-padding-y $pagination-padding-x;
  min-width: calc(#{"#{($font-size-base * $pagination-line-height) + ($pagination-padding-y * 2)} + #{$pagination-border-width * 2}"});
  border: $pagination-border-width solid $pagination-border-color;
  background-color: $pagination-bg;
  color: $pagination-color;
  text-align: center;
  line-height: $pagination-line-height !important;

  @include border-radius($border-radius);
  @include hover-focus {
    border-color: $pagination-hover-border-color;
    background-color: $pagination-hover-bg;
    color: $pagination-hover-color;
    text-decoration: none;
  }

  @if $material-style {
    font-weight: $btn-font-weight;
  }

  &:focus {
    color: $pagination-hover-color;
  }
}

// *******************************************************************************
// * Material ripple

@if $material-style {
  .page-link .waves-ripple,
  .pagination > li .waves-ripple {
    background: rgba(0, 0, 0, .1);
  }

  .page-link.waves-effect {
    display: block;
  }

  .page-item.active .page-link .waves-ripple,
  .page-item.disabled .page-link .waves-ripple,
  .pagination > li.active .waves-ripple,
  .pagination > li.disabled .waves-ripple {
    display: none;
  }
}

// *******************************************************************************
// * Sizing

.pagination-lg .page-link,
.pagination-lg > li > a:not(.page-link) {
  min-width: calc(#{"#{($font-size-lg * $pagination-line-height) + ($pagination-padding-y-lg * 2)} + #{$pagination-border-width * 2}"});
  line-height: 1;

  @include border-radius($border-radius-lg);
}

.pagination-sm .page-link,
.pagination-sm > li > a:not(.page-link) {
  min-width: calc(#{"#{($font-size-sm * $pagination-line-height) + ($pagination-padding-y-sm * 2)} + #{$pagination-border-width * 2}"});
  line-height: 1;

  @include border-radius($border-radius-sm);
}
