/* ==========================================================
   Scenic Iceland — 列表分页
   the_posts_pagination() 的输出结构：
   nav.pagination > div.nav-links > a.page-numbers / span.page-numbers.current
   省略号是 span.page-numbers.dots，前后翻页是 .prev / .next。
   ========================================================== */

.pagination {
  margin-top: var(--space-6);
  padding-top: var(--space-4);
  border-top: 1px solid var(--color-border);
}

/* 原生输出把所有页码塞在 .nav-links 里，默认是行内元素、左对齐。 */
.pagination .nav-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  /* 44px 是触摸目标的下限，同时让单双位数页码宽度一致。 */
  min-width: 44px;
  height: 44px;
  padding: 0 0.75rem;
  border: 1.5px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-white);
  color: var(--color-text);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.01em;
  text-decoration: none;
  transition: var(--transition);
}

.pagination a.page-numbers:hover,
.pagination a.page-numbers:focus-visible {
  border-color: var(--color-accent-bright);
  background: var(--color-sky-soft);
  color: var(--color-accent-hover);
  transform: translateY(-1px);
  box-shadow: var(--shadow-sm);
}

/* 当前页用冰川渐变实心，和卡片上的绿色 CTA 区分开 —— 绿色只留给下单动作。 */
.pagination .page-numbers.current {
  border-color: transparent;
  background: var(--gradient-glacier);
  color: var(--color-white);
  box-shadow: 0 6px 18px rgba(42, 122, 150, 0.28);
}

/* 省略号不可点，不该长得像按钮。 */
.pagination .page-numbers.dots {
  min-width: 0;
  padding: 0 0.25rem;
  border-color: transparent;
  background: none;
  color: var(--color-text-muted);
  letter-spacing: 0.1em;
}

.pagination .page-numbers.dots:hover {
  transform: none;
  box-shadow: none;
}

/* 箭头比数字略大一点，扫视时先落在翻页上。 */
.pagination .page-numbers.prev,
.pagination .page-numbers.next {
  font-size: 1.25rem;
  color: var(--color-accent);
}

@media (max-width: 480px) {
  .pagination .nav-links { gap: 0.375rem; }

  .pagination .page-numbers {
    min-width: 40px;
    height: 40px;
    padding: 0 0.5rem;
    font-size: 0.9375rem;
  }
}