/* The assistant bubble, shared by the shop (Remis) and the back office (Neri): a launcher bottom-right, a panel
   above it, full screen on phones. It reads the page's own tokens — the shop's --moss / --bg-2 / --radius, the
   admin's --accent / --bg / --r — through the local --a-* names below. */
.asst{--a-acc:var(--moss,var(--accent));--a-acc-2:var(--moss-2,var(--accent-2));--a-soft:var(--bg-2,var(--bg));
  --a-r:var(--radius,var(--r-sm));--a-rl:var(--radius-lg,var(--r))}
.asst[hidden]{display:none}
.asst-initials{display:flex;align-items:center;justify-content:center;background:var(--a-acc);color:#fff;font-weight:500;font-size:13px}
.asst-title .asst-initials{width:40px;height:40px;border-radius:50%;border:2px solid rgba(255,255,255,.7);font-size:17px;background:rgba(255,255,255,.18)}
.asst-launch .asst-ico-open .asst-initials{width:56px;height:56px;border-radius:50%;font-size:22px}
.asst-launch{position:fixed;right:24px;bottom:24px;z-index:60;width:62px;height:62px;border-radius:50% 50% 14px 50%;border:3px solid #fff;padding:0;background:#fff;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 10px 28px rgba(27,36,32,.28);transition:transform .15s,background .15s}
/* speech-bubble shape: three round corners, the lower right a small rounded point; the white fill makes that
   corner part of the ring, the face stays a circle inside */
.asst-launch .asst-ico-open img{width:56px;height:56px;border-radius:50%;display:block}   /* inside the 3 px white ring */   /* Remis's face invites the click; the X takes over when open */
.asst-launch .asst-ico-open .asst-hover{display:none}   /* must out-rank ".asst-launch .asst-ico-open img{display:block}" */
.asst-launch:hover .asst-ico-open img:not(.asst-hover){display:none}   /* hover: only the face changes (blue variant), nothing else */
.asst-launch:hover .asst-ico-open .asst-hover{display:block}
.asst-launch .asst-ico-close,.asst.open .asst-launch .asst-ico-open{display:none}
.asst.open .asst-launch .asst-ico-close{display:flex}
.asst.open .asst-launch{background:var(--a-acc)}   /* the white X needs the green fill */
.asst-panel{position:fixed;right:24px;bottom:96px;z-index:60;width:min(520px,calc(100vw - 48px));max-height:calc(100dvh - 112px);display:none;flex-direction:column;background:var(--a-soft);border-radius:var(--a-rl);box-shadow:0 24px 60px rgba(27,36,32,.24);overflow:hidden;border:1px solid var(--line)}
.asst.open .asst-panel{display:flex}
.asst-head{display:flex;align-items:center;justify-content:space-between;background:var(--a-acc);color:#fff;padding:10px 10px 10px 16px}
.asst-title{display:flex;align-items:center;gap:10px;font-weight:600;font-size:15px}
.asst-title img{width:40px;height:40px;border-radius:50%;border:2px solid rgba(255,255,255,.7);display:block}
.asst-title small{font-weight:400;font-size:12px;opacity:.85;margin-left:2px}
.asst-tools{display:flex;gap:2px}
.asst-tools button{width:36px;height:36px;border:0;border-radius:var(--a-r);background:transparent;color:rgba(255,255,255,.85);display:flex;align-items:center;justify-content:center;cursor:pointer}
.asst-tools button:hover{background:rgba(255,255,255,.15);color:#fff}
.asst-log{flex:1 1 auto;height:420px;min-height:120px;overflow-y:auto;padding:16px 16px 4px;background:var(--a-soft);display:flex;flex-direction:column;gap:10px;font-size:14.5px;line-height:1.5}
.asst-msg{max-width:88%}
.asst-msg p{margin:0}
.asst-msg p+p,.asst-msg ul{margin-top:8px}
.asst-msg ul,.asst-msg ol{padding-left:18px}
.asst-msg .tbl{overflow-x:auto;margin-top:8px}
.asst-msg table{border-collapse:collapse;font-size:13px;min-width:100%}
.asst-msg th,.asst-msg td{text-align:left;padding:5px 8px;border-bottom:1px solid var(--line);vertical-align:top}
.asst-msg th{font-weight:500;color:var(--ink-2);background:#fff}
.asst-msg a{color:var(--a-acc);text-decoration:underline}
.asst-msg.user{align-self:flex-end;background:#fff;border:1px solid var(--line);border-radius:14px 14px 4px 14px;padding:8px 12px}
.asst-msg.assistant{align-self:flex-start;color:var(--ink);display:flex;gap:8px;align-items:flex-start;max-width:94%}
.asst-msg .asst-face{width:28px;height:28px;border-radius:50%;flex:none;margin-top:2px}
.asst-msg .asst-body{min-width:0;padding-top:4px}   /* Remis's replies are plain text beside his face; only the visitor's questions sit in a bubble */
.asst-msg .dots i{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--muted);margin-right:4px;animation:asst-pulse 1.2s ease-in-out infinite}
.asst-msg .dots i:nth-child(2){animation-delay:.2s}
.asst-msg .dots i:nth-child(3){animation-delay:.4s}
@keyframes asst-pulse{0%,100%{opacity:.25}50%{opacity:1}}
.asst-msg .cursor{display:inline-block;width:2px;height:1em;background:var(--muted);vertical-align:-2px;margin-left:2px;animation:asst-pulse 1s infinite}
.asst-chips{display:flex;flex-wrap:wrap;gap:6px;padding:6px 16px 0;background:var(--a-soft)}
.asst-chips button{border:1px solid var(--line-2);background:#fff;border-radius:20px;padding:6px 12px;font:inherit;font-size:13px;color:var(--ink-2);cursor:pointer}
.asst-chips button:hover{border-color:var(--a-acc);color:var(--a-acc)}
.asst-chips[hidden]{display:none}
.asst-form{display:flex;align-items:center;gap:8px;margin:12px 16px 6px;background:#fff;border:1px solid var(--line);border-radius:var(--a-r);padding:4px 4px 4px 12px}
.asst-form input{flex:1;border:0;background:transparent;font:inherit;font-size:14.5px;padding:8px 0;outline:none}
.asst-form button{width:34px;height:34px;border:0;border-radius:50%;background:var(--a-acc);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer}
.asst-form button[disabled]{background:var(--line-2);cursor:default}
.asst-foot{margin:0;padding:0 16px 10px;font-size:11.5px;color:var(--muted);line-height:1.4;text-align:center}
@media (max-width:767px){
  .asst-panel{inset:0;width:auto;max-height:none;border-radius:0;border:0;bottom:auto;right:0;height:100dvh}   /* JS narrows it to the visible area when the keyboard opens */
  .asst-log{height:auto;flex:1}
  .asst.open .asst-launch{display:none}   /* full screen: the X in the head closes it, no second X at the bottom */
  body.asst-open{overflow:hidden}
}
/* the back office draws its icons with Lucide's script: size them like the shop's inline ones */
.asst-launch svg{width:26px;height:26px}
.asst-tools svg{width:19px;height:19px}
.asst-form button svg{width:18px;height:18px}