/* Authoritative layout for inc/booking-search-form.php on every booking page.
   Only layout lives here; endpoint codes, dates and booking state stay in JS/PHP. */
/* Cùng khung 1200px với phần còn lại của trang; 1480px làm ô tìm vé giãn dài trên màn hình lớn. */
.hvr-page .hvr-hero > .hvr-shell:has(.hvb-search-form) { width: min(1200px,calc(100% - 48px)); }
.hvr-page.hvrt-page .hvb-search-form[data-hvrt-search] {
 display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); grid-template-areas:none;
 gap:8px; padding:12px; align-items:center; border-radius: 16px;
}
.hvr-page.hvrt-page .hvb-search-form .hvr-field {
 min-width:0; margin:0; padding:7px 12px 6px; border:1.5px solid #cbd5e1; border-radius:10px;
 background:#ffffff; box-shadow:0 1px 2px rgba(0,0,0,0.04);
 display:flex; flex-direction:column; justify-content:center;
 min-height:58px; box-sizing:border-box; cursor:pointer; position:relative;
 transition:border-color 0.15s ease, box-shadow 0.15s ease;
}
.hvr-page.hvrt-page .hvb-search-form .hvr-field:hover {
 border-color:#f59e0b; box-shadow:0 2px 6px rgba(245,158,11,0.15);
}
.hvr-page.hvrt-page .hvb-search-form .hvr-field:focus-within {
 border-color:#eab308; box-shadow:0 0 0 3px rgba(234,179,8,0.25); background:#ffffff;
}
.hvr-page.hvrt-page .hvb-search-form .hvb-mode-control {
 min-width:0; margin:0; padding:0; border:0; grid-column:auto; grid-row:auto;
 display:flex; flex-direction:column; justify-content:center; min-height:58px; box-sizing:border-box;
}
.hvr-page.hvrt-page .hvb-search-form label,
.hvr-page.hvrt-page .hvb-search-form .hvr-field-label {
 display:block; margin:0 0 2px; min-height:14px; font-size:11px; line-height:14px;
 font-weight:700; color:#64748b; text-transform:uppercase; letter-spacing:.04em; pointer-events:none;
}
.hvr-page.hvrt-page .hvb-search-form input:not([type=radio]),
.hvr-page.hvrt-page .hvb-search-form select {
 width:100%; min-width:0; height:28px; min-height:28px; margin:0; padding:0 22px 0 0;
 font-family:inherit; font-size:15px; font-weight:700; line-height:28px; color:#0f172a;
 background-color:transparent; border:0; border-radius:0; box-shadow:none; outline:none;
 cursor:pointer; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;
}
.hvr-page.hvrt-page .hvb-search-form input[type=date] { padding-right:0; }
.hvr-page.hvrt-page .hvb-search-form input[readonly] { padding-right:0; }
.hvr-page.hvrt-page .hvb-search-form .hvr-return-field { display:contents; }
.hvr-page.hvrt-page .hvb-search-form .hvrt-return-endpoints { display:none !important; }
.hvr-page.hvrt-page .hvb-search-form [hidden] { display:none !important; }
.hvr-page.hvrt-page .hvb-search-form .hvb-mode-control { grid-area:return; padding-inline:0; }
.hvr-page.hvrt-page .hvb-search-form .hvb-return-date { grid-area:backdate; }
.hvr-page.hvrt-page .hvb-search-form [data-hvrt-inline-toggle]:not(.hvr-trip-mode-tab) {
 min-height:44px; margin:0; padding:0; border:0; background:transparent; box-shadow:none;
 gap:6px; font-size:15px; letter-spacing:0; text-transform:none;
}
.hvb-search-form .hvr-trip-switch-track { transform:scale(.86); transform-origin:left center; margin-right:-7px; }
.hvr-page.hvrt-page .hvb-search-form > .hvr-search-submit {
 grid-area:submit; align-self:center; min-width:0; width:100%; height:58px; min-height:58px; margin:0;
 padding:10px 8px; font-size:16px; font-weight:800; line-height:1.25; white-space:normal; border-radius:10px;
}
.hvr-page.hvrt-page .hvb-search-form > .hvr-field-from { grid-area:from; }
.hvr-page.hvrt-page .hvb-search-form > .hvr-field-to { grid-area:to; }
.hvr-page.hvrt-page .hvb-search-form > .hvr-field-date { grid-area:date; }
.hvr-page.hvrt-page .hvb-search-form > .hvr-field-guests { grid-area:guests; }
.hvr-page.hvrt-page .hvb-search-form > .hvr-swap {
 grid-area:swap; width:32px; height:32px; min-width:32px; min-height:32px;
 align-self:center; justify-self:center; margin:0; position:static; font-size:15px;
 border-radius:50%; background:#ffffff; border:1.5px solid #cbd5e1;
 box-shadow:0 1px 3px rgba(0,0,0,0.06); color:#475569;
 display:flex; align-items:center; justify-content:center;
 text-decoration:none; cursor:pointer; transition:all 0.2s ease;
}
.hvr-page.hvrt-page .hvb-search-form > .hvr-swap:hover {
 background:#ffbe00; border-color:#e0a600; color:#0f172a; transform:rotate(180deg);
}
.hvr-page.hvrt-page .hvb-search-form.hvr-search-unified {
 grid-template-columns:minmax(0,1.3fr) 32px minmax(0,1.3fr) minmax(0,1.1fr) minmax(160px,1fr) minmax(70px,.6fr) 115px;
 grid-template-areas:"from swap to date return guests submit";
}
.hvr-page.hvrt-page:is(.hvrt-inline-roundtrip, .hvrt-return-optional) .hvb-search-form.hvr-search-unified {
 grid-template-columns:minmax(0,1.3fr) 32px minmax(0,1.2fr) minmax(120px,1.1fr) minmax(120px,1.1fr) minmax(130px,1fr) 60px 94px;
 grid-template-areas:"from swap to date backdate return guests submit";
 gap:5px;
}
/* Dedicated round-trip forms keep their direction/pair controls, using the same field sizing. */
.hvr-page.hvrt-page .hvb-search-form:not(.hvr-search-unified) {
 grid-template-columns:repeat(4,minmax(0,1fr));
 grid-template-areas:"direction direction pair pair" "date backdate guests submit";
}
.hvr-page.hvrt-page .hvb-search-form:not(.hvr-search-unified):not(:has(.hvrt-pair-field)) {
 grid-template-areas:"direction direction guests submit" "date backdate . .";
}
.hvr-page.hvrt-page .hvb-search-form > .hvrt-direction { grid-area:direction; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
.hvr-page.hvrt-page .hvb-search-form > .hvrt-pair-field { grid-area:pair; }
.hvr-page.hvrt-page .hvb-search-form .hvrt-direction label { margin:0; }
@media(min-width:1400px) {
 .hvr-page.hvrt-page .hvb-search-form:not(.hvr-search-unified) {
  grid-template-columns:210px minmax(280px,1.8fr) 140px 140px 80px 110px;
  grid-template-areas:"direction pair date backdate guests submit";
 }
 .hvr-page.hvrt-page .hvb-search-form:not(.hvr-search-unified):not(:has(.hvrt-pair-field)) {
  grid-template-columns:minmax(0,2fr) 140px 140px 80px 110px;
  grid-template-areas:"direction date backdate guests submit";
 }
}
@media(max-width:1200px) {
 .hvr-page.hvrt-page .hvb-search-form.hvr-search-unified,
 .hvr-page.hvrt-page:is(.hvrt-inline-roundtrip, .hvrt-return-optional) .hvb-search-form.hvr-search-unified {
  grid-template-columns:repeat(12,minmax(0,1fr)); gap:8px;
  grid-template-areas:"from from from from from swap swap to to to to to" "date date date date return return return guests guests submit submit submit";
 }
 .hvr-page.hvrt-page:is(.hvrt-inline-roundtrip, .hvrt-return-optional) .hvb-search-form.hvr-search-unified {
  grid-template-areas:"from from from from from swap swap to to to to to" "date date date date backdate backdate backdate backdate return return guests submit";
 }
}
/* Bật khứ hồi là thêm 4 ô nữa vào cùng một hàng: dưới 1500px thì ô điểm đi/điểm
   đến bị bóp còn vài chữ ("Quận 1 – Phòn…"). Xuống hàng như bản hẹp cho dễ đọc. */
@media(min-width:1201px) and (max-width:1500px) {
 .hvr-page.hvrt-page:is(.hvrt-inline-roundtrip, .hvrt-return-optional) .hvb-search-form.hvr-search-unified {
  grid-template-columns:repeat(12,minmax(0,1fr)); gap:8px;
  grid-template-areas:"from from from from from swap swap to to to to to" "date date date date backdate backdate backdate backdate return return guests submit";
 }
}
@media(max-width:700px) {
 .hvr-page.hvrt-page .hvb-search-form:not(.hvr-search-unified),
 .hvr-page.hvrt-page .hvb-search-form:not(.hvr-search-unified):not(:has(.hvrt-pair-field)) {
  grid-template-columns:repeat(2,minmax(0,1fr));
  grid-template-areas:"direction direction" "pair pair" "date backdate" "guests submit";
 }
}
@media(max-width:560px) {
 .hvr-page .hvr-hero > .hvr-shell:has(.hvb-search-form) { width:calc(100% - 28px); }
 .hvr-page.hvrt-page .hvb-search-form.hvr-search-unified,
 .hvr-page.hvrt-page:is(.hvrt-inline-roundtrip, .hvrt-return-optional) .hvb-search-form.hvr-search-unified {
  grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; padding:10px;
  grid-template-areas:"from from" "to to" "date date" "return guests" "submit submit";
 }
 .hvr-page.hvrt-page:is(.hvrt-inline-roundtrip, .hvrt-return-optional) .hvb-search-form.hvr-search-unified {
  grid-template-areas:"from from" "to to" "date backdate" "return guests" "submit submit";
 }
 .hvr-page.hvrt-page .hvb-search-form > .hvr-swap {
  grid-area:from; justify-self:end; align-self:end; margin:0 6px -16px 0; position:relative; z-index:3;
  width:32px; height:32px; min-width:32px; min-height:32px; border-radius:50%; background:#ffffff;
  border:1.5px solid #cbd5e1; box-shadow:0 2px 4px rgba(0,0,0,0.1); display:flex; align-items:center;
  justify-content:center; font-size:14px;
 }
 .hvr-page.hvrt-page .hvb-search-form > .hvr-field-from { padding-right:44px; }
 .hvr-page.hvrt-page .hvb-search-form .hvr-field { padding:6px 10px 5px; min-height:56px; }
 .hvr-page.hvrt-page .hvb-search-form .hvb-mode-control { min-height:56px; padding:0; }
 .hvr-page.hvrt-page .hvb-search-form input:not([type=radio]),
 .hvr-page.hvrt-page .hvb-search-form select { font-size:15px; height:26px; min-height:26px; line-height:26px; }
 .hvr-page.hvrt-page .hvb-search-form input[type=date] { font-size:15px; }
 .hvr-page.hvrt-page:has(> .hvr-sticky) { padding-bottom:calc(80px + env(safe-area-inset-bottom,0px)); }
}

/* Segmented Trip Mode Selector (Một chiều / Khứ hồi) */
.hvr-page.hvrt-page .hvb-search-form .hvr-trip-mode-segmented,
.hvr-trip-mode-segmented {
  display: inline-flex !important;
  align-items: center !important;
  background: #f1f5f9 !important;
  border-radius: 10px !important;
  padding: 3px !important;
  border: 1px solid #cbd5e1 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  min-height: 42px !important;
}

.hvr-page.hvrt-page .hvb-search-form .hvr-trip-mode-tab,
.hvr-trip-mode-tab {
  flex: 1 1 50% !important;
  border: 0 !important;
  outline: none !important;
  background: transparent !important;
  padding: 8px 12px !important;
  border-radius: 7px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #64748b !important;
  cursor: pointer !important;
  text-align: center !important;
  transition: all 0.15s ease !important;
  white-space: nowrap !important;
  min-height: 36px !important;
  height: 36px !important;
  box-shadow: none !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.hvr-page.hvrt-page .hvb-search-form .hvr-trip-mode-tab:hover,
.hvr-trip-mode-tab:hover {
  color: #1e293b !important;
}

.hvr-page.hvrt-page .hvb-search-form .hvr-trip-mode-tab.is-active,
.hvr-trip-mode-tab.is-active {
  background: #ffffff !important;
  color: #0f172a !important;
  font-weight: 700 !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12) !important;
}

/* Quick Time Filter Bar above trip schedule */
.hvrt-workspace .hv-time-filter-bar,
.hv-time-filter-bar {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 16px 0 14px !important;
  padding: 10px 14px !important;
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03) !important;
}

.hvrt-workspace .hv-time-filter-label,
.hv-time-filter-label {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  white-space: nowrap !important;
}

.hvrt-workspace .hv-time-chips,
.hv-time-chips {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
  scrollbar-width: none !important;
  padding: 2px 0 !important;
}

.hvrt-workspace .hv-time-chips::-webkit-scrollbar,
.hv-time-chips::-webkit-scrollbar {
  display: none !important;
}

.hvrt-workspace .hv-time-chip,
.hv-time-chip {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 36px !important;
  height: 36px !important;
  padding: 6px 14px !important;
  border-radius: 999px !important;
  border: 1px solid #cbd5e1 !important;
  background: #f8fafc !important;
  color: #334155 !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: all 0.15s ease !important;
  outline: none !important;
  box-shadow: none !important;
  margin: 0 !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  box-sizing: border-box !important;
}

.hvrt-workspace .hv-time-chip:hover,
.hv-time-chip:hover {
  border-color: #ffbe00 !important;
  background: #fffdf5 !important;
  color: #1e293b !important;
}

.hvrt-workspace .hv-time-chip.is-active,
.hv-time-chip.is-active {
  background: #ffbe00 !important;
  border-color: #e0a600 !important;
  color: #1e293b !important;
  font-weight: 800 !important;
  box-shadow: 0 2px 6px rgba(255, 190, 0, 0.3) !important;
}

@media (max-width: 640px) {
  .hvrt-workspace .hv-time-filter-bar,
  .hv-time-filter-bar {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 8px !important;
    padding: 10px 12px !important;
  }
  .hvrt-workspace .hv-time-chips,
  .hv-time-chips {
    width: 100% !important;
    padding-bottom: 4px !important;
  }
}
