/* D106 (2026-09-17) — homepage search "Command bar". Its own file: the shared CSS budget is full (D104).
   Selectors start at .hz-command .home-destination-options (0,2,0+) on purpose: styles.css still styles
   .home-destination-options button/b/small for the old list, and those rules must lose everywhere here. */

/* The form is no longer a grey box around the white field, and it stacks above the hero buttons below it. */
.hz-command.home-search{padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;z-index:40}
.hz-command #home-search-status:empty{display:none}

/* Focus stays visible, but on the whole bar: an outline inside the white pill looked detached. */
.hz-command #home-destination:focus-visible{outline:0;box-shadow:none}
.hz-command .home-search-control:focus-within{box-shadow:0 0 0 3px var(--hz-sun),0 20px 60px rgba(0,0,0,.35)}

.hs-field{position:relative;flex:1;min-width:0;display:flex}
.hz-command .hs-field input{width:100%}
.hs-field input::placeholder{color:transparent}
.hs-field input:focus::placeholder{color:var(--hz-muted)}
.hs-hint{position:absolute;inset:0;display:flex;align-items:center;gap:.3em;pointer-events:none;font:600 18px/1.2 var(--hz-body);color:#666f82;white-space:nowrap;overflow:hidden;transition:opacity .18s ease}
.hs-hint b{color:var(--hz-ink);font-weight:750;transition:opacity .28s ease,transform .28s ease}
.hs-hint b.is-out{opacity:0;transform:translateY(-5px)}
.hs-field input:focus+.hs-hint,.hs-field input:not(:placeholder-shown)+.hs-hint{opacity:0}
.hs-cancel{display:none;flex:0 0 auto;border:0;background:transparent;color:var(--hz-sun-ink-strong);font:800 15px/1 var(--hz-body);padding:12px 6px;cursor:pointer}

/* Popular in Europe, under the field. */
.hs-picks{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:16px;max-width:680px}
.hs-picks-label{margin-right:2px;font:700 11.5px/1.2 var(--hz-body);letter-spacing:.12em;text-transform:uppercase;color:#c7d2e8}
.hs-pick{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:4px 13px 4px 4px;border:1px solid rgba(255,255,255,.24);border-radius:999px;background:rgba(7,13,28,.46);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;font:700 13.5px/1.1 var(--hz-body);cursor:pointer;transition:border-color .2s ease,background .2s ease}
.hs-pick:hover{border-color:var(--hz-sun);background:rgba(7,13,28,.62)}
.hs-pick b{color:var(--hz-sun-hi);font-weight:750}
.hs-pick-img{width:30px;height:30px;border-radius:50%;object-fit:cover;flex:0 0 30px;background:var(--hz-night-3)}
.hs-pick-pack{padding-left:14px;border-style:dashed}

/* The list: a curated start when the field is empty, results with a photo while typing. No inner scroll on desktop. */
.hz-command .home-destination-options{top:calc(100% + 6px);right:auto;width:min(700px,calc(100vw - 32px));max-height:none;overflow:visible;padding:8px;border:0;border-radius:20px;background:var(--hz-surface);box-shadow:0 30px 80px rgba(3,7,18,.45)}
.hz-command .home-destination-options .hs-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:6px}
.hz-command .home-destination-options .hs-h{margin:8px 12px 6px;font:700 11.5px/1.2 var(--hz-body);letter-spacing:.12em;text-transform:uppercase;color:var(--hz-muted)}
.hz-command .home-destination-options .hs-row{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:12px;align-items:center;width:100%;min-height:56px;padding:7px 12px;border:0;border-radius:12px;background:transparent;color:var(--hz-ink);text-align:left;cursor:pointer}
.hz-command .home-destination-options .hs-row:hover,.hz-command .home-destination-options .hs-row[aria-selected=true]{background:var(--hz-surface-2)}
.hz-command .home-destination-options .hs-thumb,.hz-command .home-destination-options .hs-pack-img{display:block;width:42px;height:42px;border-radius:11px;object-fit:cover;background:var(--hz-surface-2)}
.hz-command .home-destination-options .hs-mono{display:grid;place-items:center;background:linear-gradient(135deg,#1d2b52,#34467a);color:#e6ecf8;font:800 13px/1 var(--hz-body)}
.hz-command .home-destination-options .hs-name b{display:block;font:700 15.5px/1.2 var(--hz-body);color:var(--hz-ink)}
.hz-command .home-destination-options .hs-name mark{background:transparent;color:var(--hz-sun-ink-strong);font-weight:800}
.hz-command .home-destination-options .hs-name small,.hz-command .home-destination-options .hs-price small{display:block;margin-top:2px;font:600 12.5px/1.3 var(--hz-body);color:var(--hz-muted)}
.hz-command .home-destination-options .hs-price{text-align:right;font:800 15.5px/1.1 var(--hz-body);color:var(--hz-ink)}
.hz-command .home-destination-options .hs-region{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;min-height:44px;padding:9px 12px;border:0;border-radius:12px;background:transparent;color:var(--hz-ink);font:700 15px/1.2 var(--hz-body);text-align:left;cursor:pointer}
.hz-command .home-destination-options .hs-region:hover{background:var(--hz-surface-2)}
.hz-command .home-destination-options .hs-region small{display:inline;margin:0;font:600 13px/1.2 var(--hz-body);color:var(--hz-muted)}
.hz-command .home-destination-options .hs-pack{display:grid;grid-template-columns:56px minmax(0,1fr);gap:12px;align-items:center;width:calc(100% - 8px);margin:8px 4px 4px;padding:10px;border:0;border-radius:14px;background:linear-gradient(135deg,var(--hz-night-2),#1c2b57);color:var(--hz-night-ink);text-align:left;cursor:pointer}
.hz-command .home-destination-options .hs-pack .hs-pack-img{width:56px;height:56px;border-radius:10px}
.hz-command .home-destination-options .hs-pack b{display:block;font:750 15px/1.2 var(--hz-body);color:var(--hz-night-ink)}
.hz-command .home-destination-options .hs-pack small{display:block;margin-top:3px;font:600 12.5px/1.35 var(--hz-body);color:#c7d2e8}
.hz-command .home-destination-options .hs-pack strong{color:var(--hz-sun)}
.hz-command .home-destination-options .hs-empty{margin:0;padding:22px 14px;color:var(--hz-muted);font-size:15px}
.hz-command .home-destination-options .hs-empty b{display:inline;color:var(--hz-ink)}
.hz-command .home-destination-options .hs-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;margin:6px 0 0;padding:10px 12px 4px;border-top:1px solid var(--hz-line);font:600 12px/1.4 var(--hz-body);color:var(--hz-muted)}
.hz-command .home-destination-options kbd{font:700 11px/1 var(--hz-body);padding:2px 5px;border:1px solid var(--hz-line);border-bottom-width:2px;border-radius:5px;color:var(--hz-ink)}
.hs-picks,.hz-command .home-destination-options{scroll-margin-top:96px}
.hz-all-group{scroll-margin-top:96px}
@media (pointer:coarse){.hz-command .home-destination-options .hs-foot{display:none}}

/* Phone: the list becomes a full-screen sheet with Cancel; the page behind it does not scroll. */
@media (max-width:620px){
  .hs-hint{font-size:16px}
  .hs-picks .hs-pick:nth-of-type(n+5){display:none}
  .hs-picks-label{flex-basis:100%}
  .hz-command .home-destination-options .hs-grid{grid-template-columns:minmax(0,1fr)}
  .hz-command.home-search.hs-open{position:fixed;inset:0;z-index:1300;max-width:none;margin:0;display:flex;flex-direction:column;background:var(--hz-surface);padding:calc(env(safe-area-inset-top,0px) + 12px) 12px 0}
  .hz-command.hs-open .home-search-control{flex:0 0 auto;background:var(--hz-surface-2);box-shadow:none;padding:4px 4px 4px 12px}
  .hz-command.hs-open .home-search-control .btn{display:none}
  .hz-command.hs-open .hs-cancel{display:block}
  .hz-command.hs-open .home-destination-options{position:static;flex:1 1 auto;width:auto;margin:8px -12px 0;padding:4px 8px calc(env(safe-area-inset-bottom,0px) + 16px);border-radius:0;box-shadow:none;overflow-y:auto;overscroll-behavior:contain}
  .hz-command.hs-open .home-search-control:focus-within{box-shadow:0 0 0 2px var(--hz-sun)}
  .hz-command.hs-open input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;display:none}
  html.hs-lock,html.hs-lock body{overflow:hidden}
  /* The site header and the floating buttons sit in a higher layer than the hero: hide them under the sheet. */
  html.hs-lock body>header,html.hs-lock .scroll-fab{visibility:hidden}
}
@media (prefers-reduced-motion:reduce){.hs-hint,.hs-hint b,.hs-pick{transition:none}}