/* HGN Vehicle Finder: layout only; colours and fields come from the Partdo theme. */
.hgn-vf { position: relative; }
.hgn-vf.is-loading { opacity: .7; pointer-events: none; }

/* Bar: five fields and the button on one row; three per row on laptops/tablets; one per row on phones. */
/* form.hgn-vf prefixes outrank the theme's ".klbth-module-search .service-search-form" flex rules. */
form.hgn-vf.hgn-vf--bar { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)) auto; gap: 12px; align-items: stretch; margin: 0; }
form.hgn-vf--bar > .hgn-vf__col { min-width: 0; margin: 0; padding: 0; max-width: none; width: auto; flex: none; }

form.hgn-vf.hgn-vf--stack { display: flex; flex-direction: column; gap: 10px; margin: 0; }
form.hgn-vf--stack > .hgn-vf__col { width: 100%; max-width: 100%; margin: 0; padding: 0; flex: none; }
.hgn-vf--stack .hgn-vf__submit .btn { width: 100%; }

.hgn-vf__select { width: 100%; min-height: 44px; }
.hgn-vf .select2-container { width: 100% !important; }
.hgn-vf .btn { min-height: 44px; white-space: nowrap; }
.hgn-vf .select2-container--disabled .select2-selection__rendered { color: #9a9a9a; }
.hgn-vf__col.is-required .select2-selection,
.hgn-vf__col.is-required .hgn-vf__select { outline: 2px solid #e2383f; outline-offset: 1px; }

/* Native selects (phones, or if select2 is missing): match the theme's rounded white fields. */
.hgn-vf select.hgn-vf__select:not(.select2-hidden-accessible) {
  -webkit-appearance: none; appearance: none;
  height: 44px; padding: 0 36px 0 16px;
  border: 1px solid #e2e4e8; border-radius: 8px;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23333' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 14px center;
  color: #1d1d1f; font-size: 16px; line-height: 44px;
}
.hgn-vf select.hgn-vf__select:not(.select2-hidden-accessible):disabled { background-color: #ebebeb; color: #888; opacity: 1; }

@media (max-width: 1199px) {
  form.hgn-vf.hgn-vf--bar { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hgn-vf--bar .hgn-vf__submit .btn { width: 100%; }
}
@media (max-width: 767px) {
  form.hgn-vf.hgn-vf--bar { grid-template-columns: 1fr; }
}

.hgn-vf-heading { font-size: 1.5rem; line-height: 1.3; margin: 0 0 16px; }
.hgn-vf-fits { margin: 8px 0 16px; }
.hgn-vf-fits a { text-decoration: underline; }