//
// Paginators and Pagers
// --------------------------------------------------


// Full-width pager
.pager-aligned {
  .buttons {
    overflow: auto;

    .btn {
      .opacity(0.8);

      .material-icons {
        font-size: @font-size-base + 4px;
      }
    }

    .btn-first-page, .btn-last-page {
      .opacity(1);
    }

    .btn-previous-page {
      float: left;
      margin-right: 8px;
    }

    .btn-next-page {
      float: right;
      margin-left: 8px;
    }

    .btn-first-page {
      .material-icons:first-child {
        margin-right: @font-size-base * -1.25;
      }
    }

    .btn-last-page {
      .material-icons:last-child {
        margin-left: @font-size-base * -1.25;
      }
    }
  }

  .help-text {
    margin-top: @line-height-computed * -1 - 8px;

    text-align: center;
  }


  @media (max-width: @screen-sm-max) {
    // Upscale buttons on small displays
    .buttons {
      .btn {
        .material-icons {
          font-size: @font-size-base * 2;
        }
      }

      .btn-first-page {
        .material-icons:first-child {
          margin-right: @font-size-base * -1.75;
        }
      }

      .btn-last-page {
        .material-icons:last-child {
          margin-left: @font-size-base * -1.75;
        }
      }
    }

    // Don't negative margin middle label
    .help-text {
      margin-top: @line-height-computed * .75;

      color: @text-muted;
      font-size: @font-size-small;
    }
  }
}