/*  pagination.st.css  */
@namespace "Pagination";

/* = Project info and vars */
:import {
  -st-from: "./project.st.css";
  -st-default: Base;
  -st-named:
    mobile,
    --spacing-unit,
    --color-hint,
    --color-link,
    --color-link-active;
}

:import {
  -st-from: "../../components/Pagination/pagination.st.css";
  -st-default: Pagination;
}

@st-scope Base {
  Pagination {
    margin-bottom: calc(var(--spacing-unit) * 4);
  }

  Pagination::listItem {
    margin: 0 1px;
    padding: var(--spacing-unit) var(--spacing-unit) 0 var(--spacing-unit);
  }

  Pagination::pageList,
  Pagination::listItem {
    margin-left: var(--spacing-unit);
    margin-right: var(--spacing-unit);
  }

  Pagination::anchor {
    color: var(--color-link);
  }

  Pagination::current {
    color: var(--color-hint);
    text-decoration: none;
  }

  Pagination::pageList:focus,
  Pagination::current:focus,
  Pagination::anchor:focus {
    color: var(--color-link-active);
  }

  Pagination::pageList {
    display: flex;
    flex: 1;
    justify-content: center;
    list-style: none;
  }
}