/* Shared UX chrome shipped flat because Encore is not rebuilt on deploy.
   Mirrored in assets/scss (components/_buttons.scss, _sharedComponents.scss). */

/* Outlined green button: secondary CTA that still reads as an action. */
.btn-outline-primary {
  color: #1d7d5a;
  background-color: #fff;
  border: 2px solid #1d7d5a;
  font-weight: 600;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
  color: #fff;
  background-color: #1d7d5a;
  border-color: #1d7d5a;
  text-decoration: none;
}

.company-login-register i {
  margin-right: 6px;
}

/* Listing header: count on the left, sort control on the right, one row
   whenever the title is short enough; wraps under it otherwise. */
.list-overview {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  column-gap: 12px;
}

.list-overview .title {
  flex: 1 1 auto;
  min-width: 0;
  margin-bottom: 0;
}

.list-overview .filter-select {
  position: relative;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  margin-left: auto;
  cursor: pointer;
}

.list-overview .filter-select label {
  margin: 0 2px 0 0;
  pointer-events: none;
}

.list-overview .filter-select::after {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 4px;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 5px solid currentColor;
  pointer-events: none;
}

/* Invisible native select covers the whole "Sort" label + arrow. */
.list-overview .filter-select select {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  opacity: 0;
  cursor: pointer;
  border: none;
  font-size: inherit;
}

.list-overview .filter-select select option {
  color: #333;
}

/* City/route listing: hide As Featured On, and collapse the quote pad so
   the movers list can sit in the first phone viewport. */
@media (max-width: 767px) {
  #header:has(+ .city-lead-form) h1,
  #header.route-page h1 {
    padding: 10px 0 4px;
  }

  .route-quick-answer {
    margin-bottom: 8px;
  }

  .city-lead-form,
  .route-lead-form {
    margin-bottom: 8px;
  }

  .city-lead-form .section,
  .route-lead-form .section {
    padding: 6px 0 8px;
  }

  .city-lead-form .widget,
  .city-lead-form .quote-step-1-wrap,
  .route-lead-form .widget,
  .route-lead-form .quote-step-1-wrap {
    margin-bottom: 0;
    padding-top: 4px;
    padding-bottom: 4px;
  }

  .city-lead-form .as-seen-in-wrap {
    display: none;
  }

  .route-lead-form .route-lead-phone {
    display: none;
  }
}

/* Mid-list note on long-distance listings: after a few movers, not above them. */
.listing-inline-note {
  margin: 8px 0 20px;
  padding: 12px 0 4px;
  color: #555;
  font-size: 15px;
  line-height: 1.45;
}

.listing-inline-note p {
  margin: 0;
}