/* ==========================================================
   /modules/kategori/css/16-pager.css  (FULL PRO)
   - Pager alanı: prev + load-more
   - Hizalama + boşluk + responsive
   ========================================================== */

.kategori-page .pager{
  margin-top: var(--s5);
  display:flex;
  justify-content:center;
  align-items:center;
  gap: var(--s3);
  flex-wrap:wrap;
}

/* Load more butonu zaten 10-buttons.css içinde “primary”,
   burada sadece genişlik ve konum stabilizasyonu */
.kategori-page .pager .load-more{
  max-width: 520px;
}

/* Prev buton: küçük ve net */
.kategori-page .pager .pager-prev{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  width: 46px;
  height: 46px;

  border-radius: 16px;
  font-size: 22px;
  line-height: 1;

  background: var(--surface);
  border: 1px solid var(--border);

  box-shadow: var(--sh-xs);
  transition:
    transform var(--t-fast) var(--ease),
    box-shadow var(--t) var(--ease),
    border-color var(--t) var(--ease);
}

.kategori-page .pager .pager-prev:hover{
  transform: translateY(-1px);
  box-shadow: var(--sh-sm);
  border-color: rgba(37,99,235,.25);
}

.kategori-page .pager .pager-prev:focus-visible{
  outline:none;
  box-shadow: var(--focus), var(--sh-sm);
  border-color: rgba(37,99,235,.55);
}

/* Mobil */
@media (max-width: 920px){
  .kategori-page .pager{
    gap: var(--s2);
  }
  .kategori-page .pager .load-more{
    width: 100%;
    max-width: none;
  }
}