/*
  category-more.css
  "Load more stories" button (replaces the page numbers), the "Newer stories" link, and the
  screen-reader-only text. Needs css/base.css.
*/

.fm-more { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 1rem; margin-top: calc(var(--fm-gap) * 1.1); }
.fm-loadmore {
  display: inline-block; padding: 0.9rem 2rem;
  font: inherit; font-size: var(--fm-t-sm); font-weight: 700; line-height: 1.2;
  color: #fff; background: var(--fm-blue); border: 0; border-radius: 999px; cursor: pointer;
}
.fm-loadmore:hover { background: var(--fm-blue-deep); }
.fm-loadmore[aria-busy="true"] { opacity: 0.6; pointer-events: none; }
.fm-more__prev { font-size: var(--fm-t-sm); font-weight: 700; color: var(--fm-blue); }
.fm-more__prev:hover { text-decoration: underline; text-underline-offset: 4px; }

.fm-category__empty { padding: 1.5rem; border-radius: var(--fm-radius); background: #fff; }
.fm-category__empty a { color: var(--fm-blue); text-decoration: underline; text-underline-offset: 3px; }

/* Text for screen readers only */
.fm-visually-hidden {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}