/* ==========================================================================
   PX Search Results
   ========================================================================== */

.px-search {
  padding-top: var(--space-d3);
  padding-bottom: var(--space-d5);
}

.px-search__header {
  margin-bottom: var(--space-d2);
}

.px-search__query {
  color: var(--action);
}

/* -- Result items -- */
.px-search__results {
  display: flex;
  flex-direction: column;
  gap: var(--space-d2);
}

.px-search-result {
  padding-bottom: var(--space-d2);
  border-bottom: 1px solid var(--sand);
}

.px-search-result__title {
  margin-bottom: var(--space-d025);
}

.px-search-result__title a {
  color: var(--text-heading);
  transition: color var(--duration-normal) var(--ease-smooth);
}

.px-search-result__title a:hover {
  color: var(--action);
}

.px-search-result__excerpt {
  color: var(--gray-mid);
}

/* -- Pagination -- */
.px-search__pagination {
  margin-top: var(--space-d3);
}

.px-search__pagination .nav-links {
  display: flex;
  justify-content: center;
  gap: var(--space-d05);
  font-family: var(--font-display);
  font-weight: var(--weight-medium);
}

.px-search__pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.5rem;
  height: 2.5rem;
  padding: var(--space-d025) var(--space-d05);
  border-radius: var(--radius-s);
  transition: background-color var(--duration-normal) var(--ease-smooth),
              color var(--duration-normal) var(--ease-smooth);
}

.px-search__pagination .page-numbers:hover {
  background-color: var(--ice-blue);
  color: var(--action);
}

.px-search__pagination .page-numbers.current {
  background-color: var(--action);
  color: var(--white);
}

/* -- No results -- */
.px-search__no-results {
  max-width: 40rem;
  margin-bottom: var(--space-d2);
}

.px-search__form {
  max-width: 30rem;
}