/* PCRecruiter Pagination - Structural Styles Only */
/* Visual styles (colors, fonts, etc.) should be defined in your theme */

/* Layout container */
.pcr-pagination {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  margin: 20px 0;
}

/* Result count info */
.pagination-info {
  text-align: center;
}

/* Button container */
.pagination-controls {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

/* Page numbers wrapper - structural only */
.pcr-page-numbers {
  display: inline-flex;
  gap: 8px;
  align-items: center;
}

/* Ellipsis - prevent selection */
.pagination-ellipsis {
  user-select: none;
}
.btn-pagination {
  padding: 8px 12px;
  border: 1px solid #ccc;
  background: #fff;
}
/* RESPONSIVE: Hide page numbers on mobile */
@media (max-width: 768px) {
  .pcr-page-numbers {
    display: none !important;
  }

  .pagination-controls {
    gap: 12px;
  }
}

/* RESPONSIVE: Show only current page on tablet */
@media (min-width: 769px) and (max-width: 1024px) {
  .pcr-page-numbers .pcr-page-btn:not(.active) {
    display: none;
  }

  .pcr-page-numbers .pcr-page-btn.active {
    display: inline-flex;
  }

  .pcr-page-numbers .pagination-ellipsis {
    display: none;
  }
}

/* 
 * NOTE: All visual styling (colors, borders, padding, fonts, etc.) 
 * should be defined in your theme's CSS using these classes:
 * 
 * - .btn-pagination       (all buttons)
 * - .pcr-prev-btn         (previous button)
 * - .pcr-next-btn         (next button)
 * - .pcr-page-btn         (page number buttons)
 * - .pcr-page-btn.active  (current page)
 * - .pagination-info      (result count text)
 * - .pagination-ellipsis  (...)
 */