/* ============================================================
   List footer — paginated-list footer pairing a "Showing N of M"
   count with a centered Load more button.

   Promoted 2026-06-15 from Fans CRM (F6 fan list pagination).
   Use under any data-list / product-list that loads in batches.
   The host page owns the count text + batch logic; this only
   lays out the strip. Hide the whole strip (e.g. .hidden) when
   the list is empty.

   Anatomy:
     .list-footer
       .list-footer__count   (left, muted "Showing N of M")
       <button.btn …>        (right / centered Load more)
   ============================================================ */
.list-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-12);
  margin-top: var(--sp-16);
  flex-wrap: wrap;
}
/* [hidden] 要蓋過 display:flex（整條頁尾在清單為空時隱藏，或內部 Load more／count 互斥隱藏）*/
.list-footer[hidden],
.list-footer [hidden] { display: none; }
.list-footer__count {
  font-family: var(--font-ui);
  font-size: var(--fs-12);
  color: var(--muted-foreground);
}
/* --center：Load more 置中變體（E-Shop F4 分批載入，載完只剩 end-cap 時視覺置中）。
   加大上下留白（清單 → 載入更多的呼吸感）。 */
.list-footer--center {
  justify-content: center;
  margin-top: 0;
  padding: 36px 0 var(--sp-6);
}