/*
 * Listing sort: a "Sort by" dropdown above a listing.
 *
 * Selectors include .form-item.form-type-select to win over the global form
 * styles in the theme's main.css, which loads after component CSS.
 */

.listing-sort {
  margin-bottom: 65px;
}

.listing-sort .form-item.form-type-select {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.listing-sort .form-item.form-type-select label {
  display: flex;
  flex-basis: 100px;
  align-items: center;
  margin: 0 10px 0 0;
}

.listing-sort .form-item.form-type-select select {
  display: inline;
  min-width: 240px;
  margin: 0 10px 0 0;
  padding: 8.5px 15px;
  border-color: transparent;
  background: #f3f3f3 url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='13' height='8' viewBox='0 0 13 8' fill='none'><path d='M11.3198 1.32031L6.31982 6.32031L1.31982 1.32031' stroke='%23123B73' stroke-width='2.64' stroke-linecap='round' stroke-linejoin='round'/></svg>") no-repeat right 1.35rem center;
  color: #444;
  font-family: "Nunito Sans", sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.25rem;
}
