/* Imis chat window (js/imis.js). Same world as the site: deep black frosted glass, chrome silver rim and light,
   the aduok glass feel on the bubbles and send button. Bottom-right on laptops, a sheet from the bottom on phones. */
.imis{position:fixed;z-index:9990;right:clamp(12px,3vw,48px);bottom:clamp(12px,3vw,48px);width:min(390px,calc(100vw - 24px));height:min(600px,calc(100svh - 120px));
  display:flex;flex-direction:column;border-radius:28px;overflow:hidden;color:#F5F4EE;font:inherit;
  background:linear-gradient(160deg,rgba(40,40,40,.78),rgba(14,14,14,.86) 45%,rgba(20,20,20,.9));
  -webkit-backdrop-filter:blur(28px) saturate(150%);backdrop-filter:blur(28px) saturate(150%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),inset 0 0 0 1px rgba(222,220,219,.14),0 30px 80px -20px rgba(0,0,0,.9),0 0 0 1px rgba(0,0,0,.6);
  opacity:0;transform:translateY(18px) scale(.96);transform-origin:100% 100%;
  transition:opacity .28s ease,transform .45s cubic-bezier(.22,1,.36,1)}
.imis.is-open{opacity:1;transform:none}
.imis[hidden]{display:none}
/* chrome rim, bright at top-left like the buttons */
.imis::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  background:conic-gradient(from -75deg at 50% 50%,rgba(255,255,255,.7),rgba(255,255,255,0) 6% 40%,rgba(255,255,255,.45) 50%,rgba(255,255,255,0) 60% 94%,rgba(255,255,255,.7))}

.imis-head{display:flex;align-items:center;gap:12px;padding:16px 16px 14px 18px;border-bottom:1px solid rgba(222,220,219,.09)}
.imis-orb{position:relative;width:34px;height:34px;flex:none;border-radius:50%;
  background:radial-gradient(circle at 32% 28%,#fff 0,#E2E0DE 18%,#9A9897 52%,#3a3a3a 100%);
  box-shadow:inset 0 -3px 6px rgba(0,0,0,.45),0 0 18px rgba(222,220,219,.25)}
.imis-orb::after{content:"";position:absolute;right:-1px;bottom:-1px;width:10px;height:10px;border-radius:50%;background:#3ad16b;box-shadow:0 0 0 2px #151515}
.imis-who{display:flex;flex-direction:column;line-height:1.15;min-width:0;flex:1}
.imis-who b{font-size:16px;font-weight:650;letter-spacing:-.01em}
.imis-who small{font-size:12.5px;color:rgba(245,244,238,.55)}
.imis-x{display:grid;place-items:center;width:34px;height:34px;border:0;border-radius:50%;background:rgba(222,220,219,.08);color:#F5F4EE;cursor:pointer;
  box-shadow:inset 0 0 0 1px rgba(222,220,219,.14);transition:background .2s,transform .2s}
.imis-x:hover{background:rgba(222,220,219,.16)}
.imis-x:active{transform:scale(.92)}
.imis-x svg,.imis-send svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

.imis-log{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:18px 16px 8px;display:flex;flex-direction:column;gap:10px;scrollbar-width:thin;scrollbar-color:rgba(222,220,219,.2) transparent}
.imis-msg{max-width:84%;padding:10px 14px;border-radius:20px;font-size:14.5px;line-height:1.45;word-wrap:break-word;animation:imis-in .35s cubic-bezier(.22,1,.36,1) both}
.imis-ai{align-self:flex-start;border-bottom-left-radius:7px;background:rgba(222,220,219,.07);box-shadow:inset 0 1px 0 rgba(255,255,255,.07),inset 0 0 0 1px rgba(222,220,219,.10)}
.imis-me{align-self:flex-end;border-bottom-right-radius:7px;color:#0B0B0B;
  background:linear-gradient(180deg,#F1F0EE,#D3D1CF);box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(0,0,0,.18),0 6px 14px -8px rgba(0,0,0,.8)}
.imis-link{display:inline-block;margin-top:8px;padding:6px 12px;border-radius:999px;color:#F5F4EE;text-decoration:none;font-weight:600;font-size:13.5px;
  background:linear-gradient(-75deg,rgba(222,220,219,.10),rgba(222,220,219,.30),rgba(222,220,219,.10));box-shadow:inset 0 0 0 1px rgba(222,220,219,.3),inset 0 -1px 1px rgba(255,255,255,.3);transition:transform .3s cubic-bezier(.22,1,.36,1),background .2s}
.imis-link:hover{transform:translateY(-1px)}
.imis-typing{display:flex;gap:5px;padding:14px 16px}
.imis-typing i{width:7px;height:7px;border-radius:50%;background:rgba(245,244,238,.6);animation:imis-dot 1.1s ease-in-out infinite}
.imis-typing i:nth-child(2){animation-delay:.15s}.imis-typing i:nth-child(3){animation-delay:.3s}
@keyframes imis-dot{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
@keyframes imis-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.imis-chips{display:flex;flex-wrap:wrap;gap:8px;padding:4px 16px 10px}
.imis-chips[hidden]{display:none}
.imis-chip{border:0;border-radius:999px;padding:8px 13px;font:inherit;font-size:13px;color:#F5F4EE;cursor:pointer;
  background:rgba(222,220,219,.06);box-shadow:inset 0 0 0 1px rgba(222,220,219,.18);transition:background .2s,transform .3s cubic-bezier(.22,1,.36,1)}
.imis-chip:hover{background:rgba(222,220,219,.13);transform:translateY(-1px)}

.imis-form{display:flex;align-items:flex-end;gap:8px;margin:0 12px;padding:6px 6px 6px 16px;border-radius:24px;
  background:rgba(0,0,0,.35);box-shadow:inset 0 0 0 1px rgba(222,220,219,.16),inset 0 1px 2px rgba(0,0,0,.5)}
.imis-form:focus-within{box-shadow:inset 0 0 0 1px rgba(222,220,219,.42),inset 0 1px 2px rgba(0,0,0,.5)}
.imis-form textarea{flex:1;min-width:0;resize:none;border:0;outline:0;background:none;color:#F5F4EE;font:inherit;font-size:15px;line-height:1.4;padding:8px 0;max-height:120px}
.imis-form textarea::placeholder{color:rgba(245,244,238,.42)}
.imis-send{position:relative;display:grid;place-items:center;width:38px;height:38px;flex:none;border:0;border-radius:50%;cursor:pointer;color:#0B0B0B;
  background:linear-gradient(180deg,#F4F3F1 0%,#D8D6D4 45%,#A9A7A6 52%,#E2E0DE 100%);box-shadow:inset 0 1px 0 #fff,0 6px 14px -6px rgba(0,0,0,.9);
  transition:transform .35s cubic-bezier(.22,1,.36,1),opacity .2s}
.imis-send:hover{transform:translateY(-2px) scale(1.05)}
.imis-send:active{transform:scale(.94)}
.imis-send:disabled{opacity:.45;cursor:default;transform:none}
.imis-fine{margin:8px 18px 12px;font-size:11px;line-height:1.35;color:rgba(245,244,238,.4);text-align:center}

@media (max-width:600px){
  .imis{right:0;left:0;bottom:0;width:auto;height:min(82svh,640px);border-radius:26px 26px 0 0;transform:translateY(40px);transform-origin:50% 100%}
  .imis.is-open{transform:none}
  .imis-form textarea{font-size:16px}   /* no zoom-in on iPhone */
}
@media (prefers-reduced-motion:reduce){.imis,.imis-msg{transition:none;animation:none}.imis-typing i{animation:none}}
@media (prefers-reduced-transparency:reduce){.imis{background:#141414;-webkit-backdrop-filter:none;backdrop-filter:none}}

/* the round launcher, bottom-right on every page: a chrome orb that opens into a pill with "Ask Imis" on hover */
.imis-fab{position:fixed;z-index:9980;right:clamp(14px,2vw,28px);bottom:calc(clamp(14px,2vw,28px) + env(safe-area-inset-bottom));
  display:flex;align-items:center;gap:0;height:58px;padding:5px;border:0;border-radius:999px;cursor:pointer;color:#F5F4EE;font:inherit;
  background:linear-gradient(-75deg,rgba(222,220,219,.10),rgba(222,220,219,.32),rgba(222,220,219,.10)),rgba(20,20,20,.55);
  -webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),inset 0 0 0 1px rgba(222,220,219,.26),0 14px 30px -12px rgba(0,0,0,.9);
  transition:transform .45s cubic-bezier(.22,1,.36,1),opacity .3s ease,box-shadow .3s ease}
.imis-fab-orb{position:relative;display:grid;place-items:center;width:48px;height:48px;flex:none;border-radius:50%;color:#0B0B0B;
  background:radial-gradient(circle at 32% 26%,#fff 0,#ECEAE8 22%,#BDBBBA 56%,#8A8887 100%);
  box-shadow:inset 0 -3px 6px rgba(0,0,0,.35),inset 0 1px 0 #fff,0 0 22px rgba(222,220,219,.22)}
.imis-fab-orb::after{content:"";position:absolute;right:1px;top:1px;width:11px;height:11px;border-radius:50%;background:#3ad16b;box-shadow:0 0 0 2px #1a1a1a}
.imis-fab-orb svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.imis-fab-t{max-width:0;overflow:hidden;white-space:nowrap;font-size:14.5px;font-weight:600;opacity:0;transition:max-width .45s cubic-bezier(.22,1,.36,1),opacity .3s ease,padding .45s cubic-bezier(.22,1,.36,1)}
@media (hover:hover) and (pointer:fine){
  .imis-fab:hover{transform:translateY(-3px)}
  .imis-fab:hover .imis-fab-t{max-width:110px;opacity:1;padding:0 14px 0 12px}
}
.imis-fab:active{transform:scale(.95)}
.imis-fab.is-away,.imis-on .imis-fab,.bag-open .imis-fab{opacity:0;transform:translateY(16px) scale(.9);pointer-events:none}
@media (max-width:833px){.imis-fab{bottom:calc(84px + env(safe-area-inset-bottom));height:54px}.imis-fab-orb{width:44px;height:44px}}
@media (prefers-reduced-motion:reduce){.imis-fab,.imis-fab-t{transition:none}}

/* (Sir, Nov 3) no chat bubble on the Booking page: it covered the Brand / Model fields */
body.book .imis-fab{display:none !important}
