/* ==== Jashoo layout: speed-first =========================================
   Search bar on top (tap, don't type), results as the main column, chat as a
   side helper (a sheet on phones), trip details + map in a drawer. */
:root{--mv-navy:#1c4d50;--mv-navy-2:#296c70;--mv-red:#dc5f32;--mv-brass:#b8893f;--mv-ink:#153b3d;
 --mv-paper:#fbfaf7;--mv-line:#dfefef;--mv-soft:#eef9f9;--header:64px}
body{background:linear-gradient(180deg,#eef9f9 0,#f6fbfb 220px,#fbfaf7 520px)}

/* ---- search bar */
.search-bar{position:sticky;top:var(--header);z-index:30;padding:14px 24px 12px;
 background:linear-gradient(180deg,#1c4d50 0%,#215a5d 100%);box-shadow:0 10px 30px -18px #0b2f3166}
.sb-shell{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1.3fr) minmax(0,1fr) auto;gap:6px;max-width:1180px;margin:0 auto;
 padding:6px;border-radius:18px;background:var(--mv-paper);box-shadow:0 1px 0 #ffffff1a inset}
.sb-field{display:flex;flex-direction:column;justify-content:center;gap:1px;min-width:0;padding:6px 14px;border-radius:13px;transition:background .15s}
.sb-field:hover,.sb-field:focus-within{background:var(--mv-soft)}
.sb-field+.sb-field{border-inline-start:1px solid var(--mv-line)}
.sb-label{font-size:10.5px;font-weight:700;color:var(--mv-red);letter-spacing:0}
.sb-field input,.sb-value{all:unset;box-sizing:border-box;width:100%;min-height:30px;font:inherit;font-size:14.5px;font-weight:700;color:var(--mv-ink);cursor:pointer}
.sb-field input{cursor:text}.sb-field input::placeholder{color:#99bdbe;font-weight:500}
.sb-value{display:flex;flex-direction:column;justify-content:center;gap:0}
.sb-value strong{font-size:14px;line-height:1.6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sb-value small{font-size:11px;color:#6a8f91;font-weight:500}
.sb-value:focus-visible,.sb-field input:focus-visible{outline:2px solid var(--mv-navy-2);outline-offset:4px;border-radius:6px}
.sb-go{display:flex;align-items:center;justify-content:center;gap:8px;min-height:54px;padding:0 24px;border:0;border-radius:13px;
 background:var(--mv-red);color:#fff;font-weight:800;font-size:14.5px;box-shadow:0 10px 22px -12px #dc5f32cc;cursor:pointer}
.sb-go:hover:not(:disabled){background:#c75228}.sb-go:disabled{opacity:.6;cursor:default}
.sb-go svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.sb-hint{max-width:1180px;margin:8px auto 0;color:#ffe7de;font-size:12px}

/* ---- main: results + chat */
main.mv-main{display:grid;grid-template-columns:minmax(0,1fr) 380px;grid-template-areas:'results chat';gap:24px;
 height:auto;min-height:calc(100dvh - var(--header) - 84px);max-width:1228px;margin:0 auto;padding:22px 24px 40px}
.mv-results{grid-area:results;min-width:0}
.mv-chat{grid-area:chat;position:sticky;top:calc(var(--header) + 96px);align-self:start;display:flex;flex-direction:column;
 height:calc(100dvh - var(--header) - 120px);min-height:420px;border:1px solid var(--mv-line);border-radius:20px;background:#fff;overflow:hidden;
 box-shadow:0 18px 40px -30px #1c4d5066}
.mv-chat-head{display:flex;align-items:baseline;gap:8px;padding:14px 16px 10px;border-bottom:1px solid var(--mv-line);background:var(--mv-soft)}
.mv-chat-head strong{color:var(--mv-ink)}.mv-chat-head span{font-size:11.5px;color:#6a8f91}
#chat-close{display:none;margin-inline-start:auto;border:0;background:none;font-size:18px;color:#6a8f91}
.mv-chat #messages{flex:1;overflow-y:auto;padding:12px 14px;margin:0;overscroll-behavior:contain}
.mv-chat #messages .bubble{max-width:100%;font-size:13px}
.mv-chat #composer{margin:0 12px;position:static}
.mv-chat #composer textarea{min-height:46px}
.mv-note{display:block;padding:6px 14px 10px;font-size:10.5px;color:#89aaac;text-align:center}
.mv-chat .response-mode{padding:0 12px}

/* ---- welcome */
.mv-welcome{padding:40px 8px 28px;text-align:right}
.mv-welcome h1{margin:6px 0 8px;font-size:32px;color:var(--mv-ink)}
.mv-welcome p{max-width:560px;margin:0 0 18px;color:#54797b;line-height:2}
.city-chips{display:flex;flex-wrap:wrap;gap:8px}
.city-chip{min-height:42px;padding:6px 18px;border:1px solid var(--mv-line);border-radius:999px;background:#fff;color:var(--mv-ink);
 font-weight:700;box-shadow:0 6px 16px -14px #1c4d5080;cursor:pointer}
.city-chip:hover{border-color:var(--mv-navy-2);background:var(--mv-soft)}

/* ---- results */
#hotel-choices{margin-top:0}
.results-toolbar{grid-column:1/-1;display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:4px}
.results-toolbar h3{margin:0;font-size:16px;color:var(--mv-ink)}
.results-toolbar h3 span{margin-inline-start:8px;font-size:12px;font-weight:500;color:#6a8f91}
.results-filters{display:flex;gap:6px;flex-wrap:wrap;margin-inline-start:auto}
.results-filters button{min-height:34px;padding:4px 12px;border:1px solid var(--mv-line);border-radius:999px;background:#fff;color:#396567;font-size:12px;cursor:pointer}
.results-filters button[aria-pressed=true]{background:var(--mv-navy);border-color:var(--mv-navy);color:#fff}
.results-toolbar select{min-height:36px;padding:4px 10px;border:1px solid var(--mv-line);border-radius:10px;background:#fff;font:inherit;font-size:12.5px;color:var(--mv-ink)}
.results-empty{grid-column:1/-1}
#hotel-choices .choice-action{background:var(--mv-navy)}
#hotel-choices .hotel-choice:hover:not(:disabled) .choice-action{background:var(--mv-red)}

/* ---- trip drawer (map + details) at every width */
main.mv-main #trip{position:fixed;inset:calc(var(--header) + 8px) 8px 8px auto;width:min(380px,calc(100vw - 16px));z-index:60;
 transform:translateX(110%);transition:transform .25s ease;border-radius:20px;box-shadow:0 30px 80px -30px #0b2f3180;overflow:auto;visibility:hidden}
body.show-trip main.mv-main #trip{transform:none;visibility:visible}
[dir=rtl] main.mv-main #trip{inset:calc(var(--header) + 8px) auto 8px 8px;transform:translateX(-110%)}
[dir=rtl] body.show-trip main.mv-main #trip{transform:none}

/* ---- dialogs */
.mv-dialog{width:min(460px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:16px 18px 18px;border:1px solid var(--mv-line);
 border-radius:22px;background:var(--mv-paper);color:var(--mv-ink);box-shadow:0 30px 90px #0b2f3155}
.mv-dialog::backdrop{background:#0b2f3155;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.mv-dialog-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.mv-dialog-head h2{margin:0;font-size:17px}
.mv-close{width:40px;height:40px;border:1px solid var(--mv-line);border-radius:12px;background:#fff;font-size:16px;cursor:pointer}
.mv-stepper{display:grid;grid-template-columns:1fr 44px 40px 44px;align-items:center;gap:6px;padding:12px 0;border-bottom:1px solid var(--mv-line)}
.mv-stepper small{display:block;font-size:11px;color:#6a8f91}
.mv-stepper button{height:44px;border:1px solid var(--mv-line);border-radius:12px;background:#fff;font-size:20px;cursor:pointer}
.mv-stepper button:disabled{opacity:.4;cursor:default}
.mv-stepper output{text-align:center;font-weight:800;font-size:16px}
.mv-ages{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;padding:12px 0}
.mv-ages label{display:grid;gap:4px;font-size:11.5px;color:#54797b}
.mv-ages select{min-height:40px;border:1px solid var(--mv-line);border-radius:10px;background:#fff;font:inherit}
.mv-primary{width:100%;min-height:48px;margin-top:12px;border:0;border-radius:13px;background:var(--mv-navy);color:#fff;font-weight:800;cursor:pointer}

/* ---- chat floating button (phones) */
.chat-fab{display:none}

@media(max-width:1000px){
 main.mv-main{grid-template-columns:minmax(0,1fr);grid-template-areas:'results';padding:16px 14px 96px}
 .mv-chat{position:fixed;inset:auto 0 0 0;top:auto;z-index:70;height:min(78dvh,640px);min-height:0;border-radius:22px 22px 0 0;
  transform:translateY(105%);transition:transform .25s ease;visibility:hidden}
 body.show-chat .mv-chat{transform:none;visibility:visible}
 #chat-close{display:block}
 .chat-fab{display:flex;align-items:center;gap:8px;position:fixed;z-index:65;bottom:18px;inset-inline-start:18px;min-height:52px;padding:0 20px;
  border:0;border-radius:999px;background:var(--mv-navy);color:#fff;font-weight:800;box-shadow:0 14px 30px -12px #1c4d50cc;cursor:pointer}
 .chat-fab svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2}
 body.show-chat .chat-fab{display:none}
}
@media(max-width:760px){
 .search-bar{padding:10px 10px 10px}
 .sb-shell{grid-template-columns:1fr 1fr;gap:4px}
 .sb-field.sb-city{grid-column:1/-1}
 .sb-field+.sb-field{border-inline-start:0}
 .sb-field.sb-dates{border-inline-end:1px solid var(--mv-line)}
 .sb-go{grid-column:1/-1;min-height:48px}
 .mv-welcome{padding:24px 4px}.mv-welcome h1{font-size:26px}
}
@media(prefers-reduced-motion:reduce){.mv-chat,main.mv-main #trip{transition:none}}
/* Scroll targets land below the sticky header + search bar. */
#hotel-choices,#booking>*,#voucher,.passenger-form{scroll-margin-top:calc(var(--header) + 110px)}
@media(max-width:760px){#hotel-choices,#booking>*,#voucher,.passenger-form{scroll-margin-top:calc(var(--header) + 190px)}}
/* One engine: the fast/precise switch from Nakhoda has no meaning here. */
.response-mode{display:none!important}
@media(max-width:560px){#toggle span{display:none}#toggle{min-width:44px;justify-content:center}.brand span{display:none}}

/* ==== Jashoo: Gulf sunset ==================================================
   Deep teal + coral + sand. The waiting card shows gulls over a setting sun. */
.wait-sea{background:linear-gradient(180deg,#fff4ea 0%,#fde3cf 55%,#cfe7e3 100%)}
.sea-sunset .gull{animation:gull-drift 9s ease-in-out infinite;animation-delay:calc(var(--i) * -2.2s)}
.sea-sunset .gull-wings{transform-box:fill-box;transform-origin:50% 100%;animation:gull-flap 1.6s ease-in-out infinite;animation-delay:calc(var(--i) * -.4s)}
@keyframes gull-drift{0%,100%{transform:translate(var(--x,0),0)}50%{transform:translate(6px,-3px)}}
@keyframes gull-flap{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.45)}}
.response-wait[data-mode=voyage] .sea-sunset .gull-wings{animation-duration:.5s}
.response-wait[data-mode=voyage] .sea-sunset .gull{animation-duration:3.5s}
.sunset-sun{animation:sun-glow 4s ease-in-out infinite}
@keyframes sun-glow{0%,100%{opacity:.92}50%{opacity:1}}
@media(prefers-reduced-motion:reduce){.sea-sunset .gull,.sea-sunset .gull-wings,.sunset-sun{animation:none!important}}
/* Stagger without inline styles (CSP style-src 'self'). */
.sea-sunset .gull.g0{--i:0}.sea-sunset .gull.g1{--i:1}.sea-sunset .gull.g2{--i:2}.sea-sunset .gull.g3{--i:3}