/**
 * @file
 * Custom "show more" pager for the events Search API view.
 *
 * The button intentionally mirrors the theme's `.pager-show-more li a` styling
 * (scss/components/_show_more.scss) so it looks identical to the old
 * views_show_more pager it replaces.
 *
 * Selectors are scoped under `.js-bb-custom-pager` (two classes) so they beat
 * Bootstrap's single-class `.btn-primary` on specificity, regardless of
 * stylesheet load order.
 */

/* Rows past the current batch. !important beats the Bootstrap grid display. */
.bb-custom-pager__row--hidden {
  display: none !important;
}

/* Wrapper — mirrors `.pager-show-more`. */
.js-bb-custom-pager .bb-custom-pager {
  padding: 0;
  margin-top: 20px;
  text-align: center;
}

/* Button — mirrors `.pager-show-more li a`. */
.js-bb-custom-pager .bb-custom-pager__button {
  display: block;
  width: 50%;
  max-width: 175px;
  margin: 0 auto 0.5rem;
  padding: 0.375rem 0;
  border: none;
  border-radius: 0;
  background: #344b51;
  color: #fff;
  font-family: inherit;
  font-size: 1rem;
  font-weight: 400;
  cursor: pointer;
}

.js-bb-custom-pager .bb-custom-pager__button:hover {
  background: #5a6268;
  color: #fff;
  transition: 0.7s;
}