/* © 2026 Qder.ai (Itay Funes). All rights reserved. Proprietary and confidential; see LICENSE. */
/*
 * The hop from the diners page's ask box into the chat (2026-10-17).
 *
 * qder.ai and chat.qder.ai are two origins, so the browser's own cross-document
 * view transition cannot carry anything across. The move is played in two
 * halves that meet on one frame instead: js/handoff.js grows the chat's room
 * out of the ask box and lifts the sentence into a sent bubble, then
 * navigates; this file's other half paints that same frame first on the chat page (the
 * position travels in the fragment, beside #q=) and plays the rest in.
 *
 * Both pages load this file, so the room and the bubble are one drawing.
 * Values are pixels, not rem: the two pages do not share a root font size.
 */

/* The bubble's face, under a name of its own so declaring it here never
   changes the type on the diners page. Same files as fonts.css, so on the
   chat page it is the cache entry the thread's own text already uses. */
@font-face {
  font-family: "Qder Handoff";
  font-style: normal; font-weight: 400; font-display: swap;
  src: url(/fonts/assistant-400-hebrew.woff2) format("woff2");
  unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
@font-face {
  font-family: "Qder Handoff";
  font-style: normal; font-weight: 400; font-display: swap;
  src: url(/fonts/assistant-400-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* The chat's ground, as the chat page paints it: table.css "The room" keeps
   the three lights in body::before but switches them off (display: none),
   so what shows is the flat body colour. Measured, not read off the rule. */
.handoff-room.handoff-room {
  position: fixed; inset: 0; z-index: 2147483000;
  background: #F7F9FE;
}

/* A sent message, drawn as the chat draws one (.msg.me in table.css). The
   class is doubled to outrank table.css `body.chat-page > *`, which would
   make anything appended to the chat's body relative. */
.handoff-bubble.handoff-bubble {
  position: fixed; top: 0; left: 0; z-index: 2147483001;
  box-sizing: border-box; margin: 0;
  max-width: var(--hb-max, 300px);
  padding: 9.6px 15.2px;
  border: 1px solid #0B3FD9; border-radius: 20px; border-end-end-radius: 6px;
  background: #0B3FD9; color: #fff;
  font: 400 15.68px/1.5 "Qder Handoff", "Assistant", "Segoe UI", system-ui, sans-serif;
  letter-spacing: normal; text-align: start;
  white-space: pre-wrap; overflow-wrap: anywhere;
  pointer-events: none;
  transform-origin: 0 0;
  will-change: transform;
}

/* Arriving: the room and the bubble are already on screen, so nothing else
   may paint until js/handoff.js plays it in. The page's own fade-in (table.css
   html.no-vt, where the browser has no cross-document view transitions)
   would start the whole body from transparent and break the match, so it
   stands down for this whole visit: `handed` is never taken off, while
   `arriving` comes off when the bars play in (the fresh review, Firefox). */
html.handed body.chat-page { animation: none; }
html.arriving .chat-top,
html.arriving .composer-wrap,
html.arriving .thread { opacity: 0; }
