.fare-route-meta {
  display: flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
  margin-top: .35rem;
}

.fare-results-head .fare-route-meta small {
  margin-top: 0;
}

.hourly-pricing {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .34rem .58rem;
  border: 1px solid #c9eafb;
  border-radius: 999px;
  background: #eaf7ff;
  color: #007fca;
  font-size: .68rem;
  line-height: 1;
  white-space: nowrap;
}

.hourly-pricing[hidden] {
  display: none;
}

.hourly-pricing strong {
  font-size: inherit;
}

.hourly-pricing span {
  padding-left: .45rem;
  border-left: 1px solid #abdff8;
  color: var(--ink-soft);
  font-size: .62rem;
}

@media (max-width: 700px) {
  .fare-route-meta {
    align-items: flex-start;
    gap: .38rem;
  }

  .hourly-pricing {
    max-width: 100%;
    flex-wrap: wrap;
    gap: .35rem;
    padding: .32rem .5rem;
    font-size: .62rem;
    line-height: 1.25;
    white-space: normal;
  }

  .hourly-pricing span {
    font-size: .58rem;
  }

  .fare-input-wrap {
    position: relative;
  }

  .fare-suggestions {
    position: static !important;
    inset: auto !important;
    width: 100%;
    max-height: min(40vh, 240px);
    margin-top: .3rem;
    overflow-y: auto;
    overscroll-behavior: contain;
    box-shadow: none;
  }
}
