/* Appsgain Assistant: floating help chat (app/views/partials/chatbot.php + assets/js/chatbot.js), including the
   AI notice, the "Request a callback" form (Settings › Chatbot) and the optional voice-input button.

   Placement: bottom-LEFT. The launcher sits above the sticky help bar (partials/site-footer.php); chatbot.js writes
   --cb-lift on #cb-root = the height of whatever is under the launcher's column (help bar, footer bar when it
   scrolls into view, a left-hand WhatsApp button, the consent card). The WhatsApp / Call buttons keep the right
   column (assets/css/ui-footer.css). Phones (< 640px): the open panel is a near full-screen sheet that follows the
   on-screen keyboard (--cb-kb / --cb-vvh from window.visualViewport).
   z-index: help bar 45 < floating buttons 60 < launcher 61 < consent banner 70 < open panel 71.

   Colours follow the theme variables (Settings › Appearance): header = dark ramp (--navy-900 → --navy-800;
   charcoal in "crimson", navy in "classic"), accents = --brand-600/700. Every text/background pair is ≥ 4.5:1.
   To restyle quickly, change the --cb-* tokens on .cb-widget below. */
.cb-widget {
  --cb-x: 1.25rem;                 /* launcher / panel distance from the left edge */
  --cb-y: 1.25rem;                 /* gap between the launcher and what is below it */
  --cb-lift: calc(var(--hb-h, 0px) + var(--fab-safe, 0px));
  --cb-safe-b: env(safe-area-inset-bottom, 0px);
  --cb-safe-l: env(safe-area-inset-left, 0px);
  --cb-bottom: calc(var(--cb-y) + max(var(--cb-lift), var(--cb-safe-b)));
  --cb-red: var(--brand-600, #d90032);
  --cb-red-hi: var(--brand-500, #f00037);
  --cb-red-dk: var(--brand-700, #b0002a);
  --cb-dark-1: var(--navy-900, #191919);
  --cb-dark-2: var(--navy-800, #1f1f1f);
  --cb-ink: #1f1f1f;
  --cb-muted: #5c5c5c;
  --cb-body: #f7f5f2;              /* warm off-white conversation background */
  --cb-line: #e8e4df;
  --cb-wa: #25d366;
  --cb-ok: #22c55e;
  --cb-ring: #16b07a;              /* launcher ring + online dot */
  font-size: 1rem;
}
.cb-widget[hidden], .cb-panel[hidden] { display: none !important; }
:where(.cb-widget) button { font: inherit; }

/* ------------------------------------------------------------ Launcher
   Closed: the counsellor avatar inside a green ring with a white gap and a green "online" dot.
   Open: a red round button with a chevron (minimise). */
.cb-launcher {
  position: fixed; z-index: 61; left: calc(var(--cb-x) + var(--cb-safe-l)); bottom: var(--cb-bottom);
  width: 4rem; height: 4rem; padding: 3px; border-radius: 9999px; display: grid; place-items: center; color: #fff; cursor: pointer;
  background: #fff; border: 3px solid var(--cb-ring);
  box-shadow: 0 10px 26px -8px rgba(0,0,0,.35);
  transition: transform .18s ease, box-shadow .18s ease;
}
.cb-launcher .cb-ico-chat { position: relative; display: block; width: 100%; height: 100%; }
.cb-launcher .cb-ico-chat img { display: block; width: 100%; height: 100%; border-radius: 9999px; }
.cb-launch-dot { position: absolute; right: -5px; bottom: -3px; width: 1rem; height: 1rem; border-radius: 9999px; background: var(--cb-ring); border: 2.5px solid #fff; }
.cb-launcher .cb-ico-close { width: 1.6rem; height: 1.6rem; }
.cb-launcher:hover { transform: translateY(-2px); box-shadow: 0 14px 30px -8px rgba(0,0,0,.4); }
.cb-launcher:focus-visible { outline: 3px solid transparent; box-shadow: 0 0 0 3px #fff, 0 0 0 6px var(--cb-ink), 0 10px 24px -6px rgba(0,0,0,.35); }
.cb-widget.is-open .cb-launcher {
  padding: 0; border-color: transparent; background-color: var(--cb-red);
  background-image: linear-gradient(135deg, var(--cb-red-hi) 0%, var(--cb-red) 55%, var(--cb-red-dk) 100%);
  box-shadow: 0 0 0 3px #fff, 0 10px 24px -6px rgba(110,0,26,.5);
}
.cb-widget.is-open .cb-ico-chat, .cb-widget:not(.is-open) .cb-ico-close { display: none; }

/* "Chat with us" label: desktop only, beside the launcher (once per visit, and on hover / focus) */
.cb-label {
  display: none; position: fixed; z-index: 61; left: calc(var(--cb-x) + var(--cb-safe-l) + 4.75rem); bottom: calc(var(--cb-bottom) + 1.1rem);
  padding: .4rem .85rem; border-radius: 9999px; background: #fff; color: var(--cb-ink); font-size: .8125rem; font-weight: 600; line-height: 1.2; white-space: nowrap;
  box-shadow: 0 6px 18px -6px rgba(0,0,0,.3), 0 0 0 1px rgba(31,31,31,.08); pointer-events: none;
  opacity: 0; transform: translateX(-.375rem); transition: opacity .2s ease, transform .2s ease;
}
@media (min-width: 1024px) {
  .cb-label { display: block; }
  .cb-launcher:hover + .cb-label, .cb-launcher:focus-visible + .cb-label, .cb-widget.cb-peek .cb-label { opacity: 1; transform: none; }
  .cb-widget.is-open .cb-label { opacity: 0; }
}
/* Footer clearance: at the end of the page chatbot.js parks the launcher just above the footer bar, i.e. over the
   bottom-left corner of the footer grid (phones: the "Contact us" button of .sf-col-help). Reserve that corner
   wherever the page gutter is narrower than the launcher (the 80rem footer reaches x ≈ 84px from 1400px up). */
@media (max-width: 1439.98px) {
  body:has(#cb-root:not([hidden])) .sf-grid { padding-bottom: 2.5rem; }
}

/* ------------------------------------------------------------ Panel */
.cb-panel {
  position: fixed; z-index: 71; left: calc(var(--cb-x) + var(--cb-safe-l)); bottom: calc(var(--cb-bottom) + 4.25rem);
  width: 23.75rem; max-width: calc(100vw - 1.5rem); height: 39rem;
  max-height: min(80vh, calc(100vh - var(--cb-bottom) - 8.75rem)); /* stays below the sticky site header */
  display: flex; flex-direction: column; overflow: hidden; background: #fff; color: var(--cb-ink); border-radius: 1.5rem;
  box-shadow: 0 32px 70px -18px rgba(0,0,0,.38), 0 12px 24px -12px rgba(0,0,0,.18), 0 0 0 1px rgba(31,31,31,.06);
  font-size: .9375rem; line-height: 1.5; transform-origin: bottom left; animation: cb-pop .22s ease-out;
}
@supports (height: 100dvh) { .cb-panel { max-height: min(80dvh, calc(100dvh - var(--cb-bottom) - 8.75rem)); } }

/* Header: dark band with a faint dot pattern and a soft brand glow in the top-right corner */
.cb-head {
  position: relative; isolation: isolate; overflow: hidden; flex: none; display: flex; align-items: center; gap: .8rem;
  min-height: 6rem; padding: 1rem .75rem 1rem 1.1rem; color: #fff;
  background-color: var(--cb-dark-2);
  background-image: radial-gradient(120% 140% at 100% 0%, rgb(var(--c-brand-500, 240 0 55) / .22) 0%, rgb(var(--c-brand-500, 240 0 55) / 0) 55%),
    linear-gradient(135deg, var(--cb-dark-1) 0%, var(--cb-dark-2) 100%);
}
.cb-head::before {
  content: ""; position: absolute; z-index: -1; top: 0; right: 0; width: 12rem; height: 100%; pointer-events: none;
  background-image: radial-gradient(rgba(255,255,255,.26) 1px, transparent 1.4px); background-size: 11px 11px;
  -webkit-mask-image: radial-gradient(90% 90% at 100% 0%, #000 0%, transparent 72%); mask-image: radial-gradient(90% 90% at 100% 0%, #000 0%, transparent 72%);
}
.cb-avatar { position: relative; flex: none; width: 3.25rem; height: 3.25rem; border-radius: 9999px; background: #ffdcc8; box-shadow: 0 0 0 2px rgba(255,255,255,.16); }
.cb-avatar img { display: block; width: 100%; height: 100%; border-radius: 9999px; }
.cb-avatar::after { content: ""; position: absolute; right: 0; bottom: 1px; width: .8rem; height: .8rem; border-radius: 9999px; background: var(--cb-ok); box-shadow: 0 0 0 2.5px var(--cb-dark-2); }
.cb-head-text { min-width: 0; flex: 1 1 auto; }
.cb-title { margin: 0; font-family: var(--font-display, inherit); font-size: 1.0625rem; font-weight: 700; line-height: 1.25; letter-spacing: -.005em; color: #fff; overflow-wrap: anywhere; }
/* Status line "● Online · Usually replies instantly": the "·" before an item that wraps to a new line is
   clipped (negative row margin + overflow hidden), so a wrapped line never starts with a separator. */
.cb-sub { margin: .3rem 0 0 -.25rem; padding-left: .25rem; overflow: hidden; font-size: .8125rem; line-height: 1.4; color: rgba(255,255,255,.84); }
.cb-sub-row { display: flex; flex-wrap: wrap; align-items: center; margin-left: -.9rem; }
.cb-sub-i { position: relative; display: inline-flex; align-items: center; gap: .4rem; padding-left: .9rem; }
.cb-sub-i::before { content: "\00B7"; position: absolute; left: .3rem; color: rgba(255,255,255,.6); }
.cb-dot { flex: none; width: .5rem; height: .5rem; border-radius: 9999px; background: var(--cb-ok); box-shadow: 0 0 0 3px rgba(34,197,94,.22); }
.cb-head-actions { flex: none; display: flex; align-items: center; gap: .1rem; align-self: flex-start; }
.cb-hbtn { flex: none; width: 2.25rem; height: 2.25rem; display: grid; place-items: center; border-radius: 9999px; color: #fff; background: transparent; border: 0; cursor: pointer; text-decoration: none; transition: background-color .15s ease; }
.cb-hbtn:hover { background: rgba(255,255,255,.14); color: #fff; }
.cb-hbtn-ico { width: 1.25rem; height: 1.25rem; }
.cb-head :focus-visible { outline: 2px solid #fff; outline-offset: 1px; border-radius: 9999px; }

/* ------------------------------------------------------------ Conversation */
.cb-log {
  flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 1rem .75rem 1.15rem;
  background: var(--cb-body); display: flex; flex-direction: column; gap: .7rem;
}
.cb-log:focus-visible { outline: 3px solid var(--cb-red); outline-offset: -3px; border-radius: 0; }
/* Notice strip between the conversation and the composer (AI/privacy notice + "Request a callback" /
   "Talk to our team"): outside the scrolling log, so it never scrolls away. Hidden while the callback form is open. */
.cb-note {
  flex: none; align-self: stretch; margin: 0; padding: .45rem .9rem; border-radius: 0; background: var(--cb-body); border-top: 1px solid var(--cb-line);
  color: #4f4f4f; font-size: .75rem; line-height: 1.45; text-align: center;
}
.cb-panel.is-lead .cb-note { display: none; }
.cb-note a, .cb-note .cb-linkbtn { color: var(--cb-red-dk); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.cb-note .cb-linkbtn { padding: 0; border: 0; background: none; font: inherit; font-weight: 600; cursor: pointer; }
.cb-note a:hover, .cb-note .cb-linkbtn:hover { color: var(--brand-800, #6d001a); }
.cb-note .cb-linkbtn[hidden] { display: none; }

/* Bot rows: round avatar (bottom-aligned) + white card; user messages: red bubbles on the right */
.cb-row { display: flex; align-items: flex-end; gap: .5rem; max-width: 100%; animation: cb-in .18s ease-out; }
.cb-row-bot { align-self: flex-start; padding-right: 1.25rem; }
.cb-ava { flex: none; width: 1.75rem; height: 1.75rem; border-radius: 9999px; overflow: hidden; background: #ffdcc8; box-shadow: 0 0 0 1px rgba(31,31,31,.06); }
.cb-ava img { display: block; width: 100%; height: 100%; }
.cb-msg { min-width: 0; padding: .7rem .9rem; border-radius: 1rem; line-height: 1.5; overflow-wrap: anywhere; }
.cb-msg p { margin: 0; white-space: pre-line; }
.cb-log .cb-quiet { animation: none; }
.cb-bot { background: #fff; color: var(--cb-ink); border: 1px solid var(--cb-line); border-bottom-left-radius: .35rem; box-shadow: 0 1px 3px rgba(31,31,31,.05); }
.cb-user { align-self: flex-end; max-width: 85%; color: #fff; background-color: var(--cb-red); border-bottom-right-radius: .35rem; animation: cb-in .18s ease-out; }
.cb-welcome { padding: .95rem 1rem; }
.cb-msg .cb-msg-title { margin-bottom: .25rem; font-family: var(--font-display, inherit); font-size: 1.0625rem; font-weight: 700; line-height: 1.3; color: var(--cb-ink); }
.cb-welcome .cb-msg-text { color: var(--cb-muted); font-size: .875rem; line-height: 1.55; }
.cb-list { margin: .45rem 0 0; padding-left: 1.1rem; list-style: disc; }
.cb-list li { margin-top: .3rem; }
.cb-list li::marker { color: var(--cb-red); }
.cb-msg a:not(.cb-btn) { color: var(--cb-red-dk); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.cb-msg a:not(.cb-btn):hover { color: var(--brand-800, #6d001a); }
.cb-user a:not(.cb-btn), .cb-user a:not(.cb-btn):hover { color: #fff; }
.cb-after { margin-top: .5rem !important; color: var(--cb-muted); font-size: .875rem; }
.cb-links { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .7rem; }
.cb-btn {
  display: inline-flex; align-items: center; min-height: 2.25rem; padding: .35rem .9rem; border-radius: 9999px; font-size: .8125rem; font-weight: 600; line-height: 1.2;
  color: var(--cb-red-dk); background: #fff; border: 1px solid rgb(var(--c-brand-200, 249 160 193)); text-decoration: none; cursor: pointer;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
.cb-btn:hover { background: rgb(var(--c-brand-50, 254 235 243)); border-color: var(--cb-red); }
.cb-btn.is-primary { color: #fff; background: var(--cb-red); border-color: var(--cb-red); }
.cb-btn.is-primary:hover { background: var(--cb-red-dk); border-color: var(--cb-red-dk); color: #fff; }
.cb-btn:focus-visible, .cb-chip:focus-visible { outline: 2px solid var(--cb-ink); outline-offset: 2px; }
/* AI fallback line (the rule-based helper answered instead) */
.cb-fb { margin-top: .5rem !important; color: var(--cb-muted); font-size: .75rem; line-height: 1.4; font-style: italic; }

/* Quick-reply chips (aligned with the bot cards): two per row; an odd last chip spans the row */
.cb-chips { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; padding-left: 2.25rem; animation: cb-in .18s ease-out; }
.cb-chips > :last-child:nth-child(odd) { grid-column: 1 / -1; }
.cb-chip {
  display: inline-flex; align-items: center; justify-content: center; gap: .4rem; min-width: 0; min-height: 2.75rem; padding: .625rem 1rem; border-radius: 9999px;
  background: #fff; border: 1px solid #d9d4ce; color: var(--cb-ink); font-size: .9375rem; font-weight: 500; line-height: 1.25; text-align: center;
  overflow-wrap: break-word; text-decoration: none; cursor: pointer; transition: border-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.cb-chip:hover, .cb-chip:focus-visible { border-color: var(--cb-red); color: var(--cb-red-dk); }
.cb-chip:hover { box-shadow: 0 4px 12px -8px rgba(110,0,26,.45); }
.cb-chip-ico { flex: none; width: 1.1rem; height: 1.1rem; color: var(--cb-red); }
.cb-chip-wa { border-color: var(--cb-wa); padding-left: .4rem; }
.cb-chip-wa:hover, .cb-chip-wa:focus-visible { border-color: #128c4a; color: var(--cb-ink); }
.cb-wa-ico { flex: none; width: 1.65rem; height: 1.65rem; border-radius: 9999px; display: grid; place-items: center; background: var(--cb-wa); color: #fff; }
.cb-wa-ico svg { width: 1rem; height: 1rem; }

/* Typing indicator */
.cb-typing { display: inline-flex; gap: .3rem; align-items: center; padding: .85rem 1rem; }
.cb-typing span { width: .45rem; height: .45rem; border-radius: 9999px; background: var(--brand-300, #f06593); animation: cb-blink 1s infinite ease-in-out; }
.cb-typing span:nth-child(2) { animation-delay: .15s; }
.cb-typing span:nth-child(3) { animation-delay: .3s; }

/* ------------------------------------------------------------ Composer */
.cb-form { flex: none; display: flex; align-items: center; gap: .6rem; padding: .8rem .85rem .45rem; background: #fff; border-top: 1px solid #ece9e5; }
.cb-field-wrap { position: relative; flex: 1 1 auto; min-width: 0; }
.cb-input {
  display: block; width: 100%; height: 3rem; padding: 0 1rem; border: 1px solid #8f8f8f; border-radius: 1rem;
  background: #f5f5f5; color: var(--cb-ink); font-size: 1rem; transition: border-color .15s ease, background-color .15s ease;
}
.cb-has-mic .cb-input { padding-right: 3rem; }
.cb-input::placeholder { color: #666; opacity: 1; }
.cb-input:focus { outline: 2px solid var(--cb-red); outline-offset: 1px; border-color: var(--cb-red); background: #fff; }
.cb-mic {
  position: absolute; right: .3rem; top: 50%; transform: translateY(-50%); width: 2.4rem; height: 2.4rem; border-radius: 9999px;
  display: grid; place-items: center; color: #4a4a4a; background: transparent; border: 0; cursor: pointer; transition: color .15s ease, background-color .15s ease;
}
.cb-mic svg { width: 1.3rem; height: 1.3rem; }
.cb-mic:hover { color: var(--cb-red-dk); background: rgba(31,31,31,.06); }
.cb-mic:focus-visible { outline: 2px solid var(--cb-ink); outline-offset: 1px; }
.cb-mic[aria-pressed="true"] { color: #fff; background: #c81e1e; animation: cb-pulse 1.4s ease-out infinite; }
.cb-send {
  flex: none; width: 3rem; height: 3rem; border-radius: 9999px; display: grid; place-items: center; color: #fff; border: 0; cursor: pointer;
  background: var(--cb-red); transition: background-color .15s ease, transform .15s ease;
}
.cb-send svg { width: 1.35rem; height: 1.35rem; }
.cb-send:hover:not(:disabled) { background: var(--cb-red-dk); }
.cb-send:active:not(:disabled) { transform: scale(.95); }
.cb-send:disabled { background: #e6e6e6; color: #767676; cursor: default; }
.cb-send:focus-visible { outline: 3px solid var(--cb-ink); outline-offset: 2px; }

/* Footer line: "Powered by …" centred, character counter on the right */
.cb-foot { flex: none; display: grid; grid-template-columns: 3rem minmax(0, 1fr) 3rem; align-items: center; gap: .25rem; padding: 0 .9rem .7rem; background: #fff; color: #636363; font-size: .75rem; line-height: 1.35; }
.cb-powered { grid-column: 2; margin: 0; text-align: center; }
.cb-powered strong { color: #333; font-weight: 700; }
.cb-count { grid-column: 3; justify-self: end; white-space: nowrap; font-variant-numeric: tabular-nums; }
.cb-count.is-near { color: #b42318; font-weight: 700; }

/* ------------------------------------------------------------ "Request a callback" form (replaces the conversation while open) */
.cb-lead { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 1rem 1rem 1.1rem; background: var(--cb-body); display: flex; flex-direction: column; gap: .6rem; }
.cb-lead[hidden], .cb-panel.is-lead .cb-log, .cb-panel.is-lead .cb-form { display: none !important; }
.cb-panel.is-lead .cb-count { visibility: hidden; }
.cb-panel.is-lead .cb-foot { padding-top: .6rem; border-top: 1px solid #ece9e5; }
.cb-lead-title { margin: 0; font-family: var(--font-display, inherit); font-size: 1.0625rem; font-weight: 700; color: var(--cb-ink); }
.cb-lead-intro { margin: 0; color: #3d3d3d; font-size: .8125rem; line-height: 1.45; }
.cb-lead-msg { margin: 0; color: #b42318; font-size: .8125rem; font-weight: 600; }
.cb-lead-msg:empty, .cb-err:empty { display: none; }
.cb-field { display: flex; flex-direction: column; gap: .25rem; }
.cb-field label { font-size: .8125rem; font-weight: 600; color: var(--cb-ink); }
.cb-field input, .cb-field select, .cb-field textarea { width: 100%; min-height: 2.75rem; padding: .5rem .8rem; border: 1px solid #8f8f8f; border-radius: .75rem; background: #fff; color: var(--cb-ink); font-size: 1rem; line-height: 1.35; }
.cb-field textarea { min-height: 3.75rem; resize: vertical; }
.cb-field input:focus, .cb-field select:focus, .cb-field textarea:focus, .cb-check input:focus-visible { outline: 2px solid var(--cb-red); outline-offset: 1px; border-color: var(--cb-red); }
.cb-lead [aria-invalid="true"] { border-color: #b42318; }
.cb-err { margin: 0; color: #b42318; font-size: .75rem; line-height: 1.35; }
.cb-check { display: flex; align-items: flex-start; gap: .5rem; font-size: .8125rem; line-height: 1.4; color: #3d3d3d; }
.cb-check input { flex: none; width: 1.1rem; height: 1.1rem; margin-top: .1rem; accent-color: var(--cb-red); }
.cb-check a { color: var(--cb-red-dk); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.cb-lead-actions { display: flex; flex-wrap: wrap; gap: .5rem; padding-top: .3rem; }
.cb-lead-actions .cb-btn { min-height: 2.75rem; padding: .5rem 1.15rem; font-size: .875rem; }
.cb-lead-actions .cb-btn[disabled] { opacity: .6; cursor: wait; }

/* ------------------------------------------------------------ Phones: near full-screen sheet above the keyboard */
@media (max-width: 639.98px) {
  .cb-widget { --cb-x: .75rem; --cb-y: 1rem; }
  .cb-launcher { width: 3.5rem; height: 3.5rem; }
  .cb-launcher .cb-ico-close { width: 1.5rem; height: 1.5rem; }
  .cb-panel {
    left: .5rem; right: .5rem; bottom: calc(.5rem + max(var(--cb-kb, 0px), var(--cb-safe-b))); width: auto; max-width: none;
    height: 88vh; max-height: calc(100vh - 1rem); border-radius: 1.25rem; transform-origin: bottom center;
  }
  @supports (height: 100dvh) { .cb-panel { height: min(88dvh, calc(var(--cb-vvh, 100dvh) - 1rem)); max-height: none; } }
  .cb-widget.is-open .cb-launcher, .cb-widget.is-open .cb-label { display: none; }
  .cb-head { min-height: 5.25rem; padding: .85rem .5rem .85rem .9rem; gap: .7rem; }
  .cb-avatar { width: 3rem; height: 3rem; }
  .cb-row-bot { padding-right: .5rem; }
  .cb-chip { padding: .5rem .75rem; }
  .cb-chip-wa { padding-left: .4rem; }
}
/* Short screens from 640px wide (landscape phones such as 844x390, short laptop windows): the open panel takes the
   full height (the launcher steps aside while it is open) and the header is compact, so the conversation keeps room
   next to the fixed header, notice strip, composer and footer line. */
@media (min-width: 640px) and (max-height: 600px) {
  .cb-panel { top: .5rem; bottom: calc(.5rem + max(var(--cb-kb, 0px), var(--cb-safe-b))); height: auto; max-height: none; }
  .cb-head { min-height: 4rem; padding-top: .5rem; padding-bottom: .5rem; }
  .cb-avatar { width: 2.5rem; height: 2.5rem; }
  .cb-widget.is-open .cb-launcher, .cb-widget.is-open .cb-label { display: none; }
}
/* While the visitor types in a page form on a touch screen, keep the launcher out of the way. */
@media (max-width: 767px), (pointer: coarse) {
  .cb-widget.cb-away:not(.is-open) .cb-launcher { display: none; }
}
/* The site's mobile menu (html.mnav-open, app.js) covers the page: step aside entirely. */
html.mnav-open .cb-widget { visibility: hidden; }

@keyframes cb-pop { from { opacity: 0; transform: translateY(.75rem) scale(.97); } to { opacity: 1; transform: none; } }
@keyframes cb-in { from { opacity: 0; transform: translateY(.35rem); } to { opacity: 1; transform: none; } }
@keyframes cb-blink { 0%, 80%, 100% { opacity: .3; } 40% { opacity: 1; } }
@keyframes cb-pulse { 0% { box-shadow: 0 0 0 0 rgba(200,30,30,.45); } 100% { box-shadow: 0 0 0 .6rem rgba(200,30,30,0); } }

@media (prefers-reduced-motion: reduce) {
  .cb-launcher, .cb-label, .cb-hbtn, .cb-btn, .cb-chip, .cb-send, .cb-mic, .cb-input { transition: none; }
  .cb-launcher:hover, .cb-send:active:not(:disabled) { transform: none; }
  .cb-panel, .cb-row, .cb-user, .cb-chips { animation: none; }
  .cb-typing span { animation: none; opacity: .7; }
  .cb-mic[aria-pressed="true"] { animation: none; box-shadow: 0 0 0 3px rgba(200,30,30,.35); }
}
@media (forced-colors: active) {
  .cb-launcher, .cb-send, .cb-hbtn, .cb-chip, .cb-btn, .cb-mic { border: 1px solid ButtonText; }
  .cb-panel { border: 1px solid CanvasText; }
  .cb-avatar::after, .cb-dot { forced-color-adjust: none; }
}
@media print { .cb-widget { display: none !important; } }