.pagination {
  border-top: var(--border-thin) solid var(--color-text-strong);
  padding-top: var(--space-away);
  display: flex;
  justify-content: center;
}

.pagination-nav {
  align-items: center;
}

.pagination-element {
  font-size: 1em;
  display: grid;
  place-content: center;
  line-height: 1;
  inline-size: 1em;
  block-size: 1em;

  &[aria-current="page"] {
    color: var(--color-brand-strong);
    --font-weight: var(--font-weight-bold);
  }
}

.pagination-icon {
  &:hover:not([aria-disabled]) {
    color: var(--color-brand-strong);
  }

  & > svg {
    width: 100%;
    height: 100%;
    display: block;
  }
}