/* The assistant widget, shared by the public Tracole websites. It uses the theme variables from brand.css, so it follows
   every theme and both fonts without knowing about them. The widget arrives hidden; js/assistant.js reveals it, so a page
   with no script is unchanged. No inline styles are used anywhere (the content security policy forbids them). */

.ask{position:fixed;right:20px;bottom:20px;z-index:70;display:flex;flex-direction:column;align-items:flex-end;gap:14px;
  width:min(392px,calc(100vw - 40px));font-family:inherit}
.ask[hidden],.ask [hidden]{display:none!important}

/* ---- Launcher ---- */
.ask-fab{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 20px 0 16px;border:1px solid var(--line);
  border-radius:999px;background:var(--brand);color:var(--brand-fg);font:inherit;font-weight:800;font-size:15px;letter-spacing:-.01em;
  cursor:pointer;box-shadow:0 14px 34px rgba(6,21,25,.28);transition:transform .18s var(--ease),box-shadow .18s var(--ease)}
.ask-fab:hover{transform:translateY(-2px);box-shadow:0 18px 40px rgba(6,21,25,.34)}
.ask-fab:focus-visible,.ask-icon:focus-visible,.ask-chip:focus-visible,.ask-send:focus-visible,.ask-retry:focus-visible,
.ask-input:focus-visible,.ask-log:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.ask-fab svg{flex:none}
.ask-fab[aria-expanded="true"]{box-shadow:0 8px 20px rgba(6,21,25,.22)}

/* ---- Panel ---- */
.ask-card{display:flex;flex-direction:column;gap:12px;width:100%;padding:0 0 14px;border:1px solid var(--line);
  border-radius:24px;background:var(--card);color:var(--fg);box-shadow:0 28px 70px rgba(6,21,25,.34);overflow:hidden;
  animation:ask-in .22s var(--ease)}
@keyframes ask-in{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}

.ask-top{display:flex;align-items:center;gap:11px;padding:14px 14px 14px 16px;background:var(--brand);color:var(--brand-fg)}
.ask-avatar{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;
  background:var(--brand-disc);color:var(--brand-disc-fg)}
.ask-heading{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.ask-name{font-weight:800;font-size:15.5px;letter-spacing:-.01em;line-height:1.2}
.ask-status{font-size:12.5px;opacity:.85;line-height:1.3}
.ask-icon{flex:none;display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:50%;background:transparent;
  color:inherit;cursor:pointer;opacity:.9}
.ask-icon:hover{background:rgba(255,255,255,.16);opacity:1}
.ask-top .ask-icon:focus-visible{outline-color:var(--brand-fg)}

/* ---- Conversation ---- */
.ask-log{display:flex;flex-direction:column;gap:10px;max-height:min(46vh,420px);min-height:96px;overflow-y:auto;padding:4px 16px;
  scroll-behavior:smooth;overscroll-behavior:contain}
.ask-line{max-width:88%;margin:0;padding:10px 14px;border-radius:18px;font-size:14.5px;line-height:1.5;white-space:pre-wrap;
  overflow-wrap:anywhere;animation:ask-line .2s var(--ease)}
@keyframes ask-line{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.ask-line.bot{align-self:flex-start;background:var(--bg2);color:var(--fg);border-bottom-left-radius:6px}
.ask-line.you{align-self:flex-end;background:var(--brand);color:var(--brand-fg);border-bottom-right-radius:6px}
.ask-line.err{align-self:flex-start;background:transparent;border:1px solid var(--line-ui);color:var(--fg)}
.ask-line a{color:inherit;font-weight:700;text-decoration:underline;text-underline-offset:2px}
.ask-retry{display:inline-block;margin-top:8px;padding:6px 12px;border:1px solid var(--line-ui);border-radius:999px;background:transparent;
  color:inherit;font:inherit;font-size:13px;font-weight:800;cursor:pointer}
.ask-retry:hover{background:var(--bg2)}

.ask-typing{display:inline-flex;gap:5px;align-items:center;min-height:21px}
.ask-typing i{width:7px;height:7px;border-radius:50%;background:var(--muted);animation:ask-dot 1.1s infinite ease-in-out}
.ask-typing i:nth-child(2){animation-delay:.16s}
.ask-typing i:nth-child(3){animation-delay:.32s}
@keyframes ask-dot{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}

/* ---- Suggestions ---- */
.ask-chips{display:flex;flex-wrap:wrap;gap:7px;padding:0 16px}
.ask-chip{padding:8px 13px;border:1px solid var(--line-ui);border-radius:999px;background:transparent;color:var(--fg);
  font:inherit;font-size:13px;font-weight:700;cursor:pointer;text-align:left}
.ask-chip:hover{background:var(--bg2)}

/* ---- Question box ---- */
.ask-form{display:flex;gap:8px;align-items:flex-end;padding:0 16px}
.ask-input{flex:1;min-width:0;resize:none;padding:11px 14px;border:1px solid var(--line-ui);border-radius:18px;background:var(--bg);
  color:var(--fg);font:inherit;font-size:15px;line-height:1.45;max-height:132px;overflow-y:auto}
.ask-input::placeholder{color:var(--muted)}
.ask-send{flex:none;display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:var(--brand);
  color:var(--brand-fg);cursor:pointer;transition:opacity .15s}
.ask-send:disabled{opacity:.4;cursor:not-allowed}
.ask-count{margin:-6px 16px 0;font-size:12px;color:var(--muted);text-align:right}
.ask-count.over{color:var(--fg);font-weight:700}
.ask-note{margin:0;padding:0 16px;font-size:12.5px;line-height:1.45;color:var(--muted)}

/* ---- Small screens: the panel becomes a sheet over the bottom of the page ---- */
@media (max-width:640px){
  .ask{right:12px;bottom:12px;width:calc(100vw - 24px)}
  .ask-card{max-height:calc(100dvh - 96px)}
  .ask-log{flex:1;max-height:none}
  .ask-fab-label{display:none}
  .ask-fab{width:54px;min-height:54px;padding:0;justify-content:center}
  .ask-input{font-size:16px}  /* 16px stops iOS zooming the page when the box is focused */
}

@media (prefers-reduced-motion:reduce){
  .ask-fab,.ask-send{transition:none}
  .ask-card,.ask-line{animation:none}
  .ask-log{scroll-behavior:auto}
  .ask-typing i{animation:none;opacity:.6}
}

@media (forced-colors:active){
  .ask-fab,.ask-send,.ask-line.you{border:1px solid ButtonText}
}

/* Ready-made questions: the whole list stays available (scrolls when long) and the panel shows it is online. */
/* the suggestions sit inside the conversation, under the latest answer: one scroll area only */
.ask-log .ask-chips{padding:2px 0 4px;margin-top:2px;flex:none}
.ask-log .ask-chip{text-align:left;line-height:1.3}
.ask-dot{display:inline-block;width:8px;height:8px;margin-right:4px;border-radius:50%;background:#5BD18A;box-shadow:0 0 0 3px rgba(91,209,138,.25);vertical-align:1px}
.ask-chip:disabled,.ask-icon:disabled{opacity:.45;cursor:default}
