/* ==========================================================================
   Trợ lý chat dùng chung (fx/chat.js) — trang chủ và 6 trang đối tác (29/10/2026).
   Tự đứng được: màu lấy biến của trang nếu có, không có thì dùng màu FleckifyS.
   Điện thoại (≤ 780px, Nam 29/10: "chatbot đang che hết"): nút tròn nhỏ, mở thành ngăn kéo nửa dưới màn hình.
   ========================================================================== */
#chatbtn{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom));z-index:44;display:flex;align-items:center;gap:9px;
  min-height:48px;border:1.5px solid var(--on-signal,#0D0C0A);background:var(--signal,#FDBF07);color:var(--on-signal,#0D0C0A);
  font:600 15px var(--ui,"Inter",system-ui,sans-serif);padding:13px 19px;border-radius:999px;cursor:pointer;box-shadow:0 10px 30px rgba(0,0,0,.35)}
#chatbtn i{width:9px;height:9px;border-radius:50%;background:var(--on-signal,#0D0C0A);display:block}
#chatbtn svg{display:none}
#chatbtn[hidden]{display:none!important}
#chatpanel{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom));z-index:46;width:min(400px,calc(100vw - 32px));
  max-height:min(620px,calc(100vh - 36px));max-height:min(620px,calc(100svh - 36px));display:none;flex-direction:column;
  background:var(--bg,#0D0C0A);color:var(--fg,#F5F1E6);border:1px solid var(--line-2,rgba(245,241,230,.26));border-radius:18px;overflow:hidden;
  box-shadow:0 24px 70px rgba(0,0,0,.5);font:400 15px/1.5 var(--ui,"Inter",system-ui,sans-serif)}
#chatpanel.open{display:flex}
#chatpanel .chead{display:flex;align-items:center;gap:11px;padding:12px 12px 12px 14px;border-bottom:1px solid var(--line,rgba(245,241,230,.12));background:var(--bg-2,#16140F)}
#chatpanel .chead img{border-radius:8px;width:34px;height:34px}
#chatpanel .chead .t{font-weight:600;font-size:15px}
#chatpanel .chead .s{font-size:12.5px;color:var(--fg-2,#B4AE9F);line-height:1.35}
#chatx{margin-left:auto;min-width:44px;min-height:44px;border:0;background:transparent;font-size:24px;line-height:1;cursor:pointer;color:var(--fg-2,#B4AE9F)}
#chatlog{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:14px;display:flex;flex-direction:column;gap:10px;min-height:120px}
#chatlog>*{flex-shrink:0;min-height:0;margin:0}
#chatlog .msg{max-width:88%;padding:10px 13px;border-radius:14px;font-size:15px;white-space:pre-wrap;line-height:1.5;overflow-wrap:anywhere}
#chatlog .msg.bot{background:var(--bg-3,#1F1C16);border:1px solid var(--line,rgba(245,241,230,.12));align-self:flex-start;border-bottom-left-radius:5px}
#chatlog .msg.me{background:var(--fg,#F5F1E6);color:var(--bg,#0D0C0A);align-self:flex-end;border-bottom-right-radius:5px}
#chatlog .msg.err{background:rgba(255,163,143,.1);border:1px solid rgba(255,163,143,.4);color:var(--danger,#FFA38F);align-self:flex-start;font-size:14px}
#chatlog .msg a{color:var(--signal,#FDBF07)}
#chatlog .csafe{font-size:12.5px;color:var(--fg-2,#B4AE9F);margin:2px 0 0;padding:0 2px}
#chatlog .typing{display:flex;gap:5px;padding:12px 14px;background:var(--bg-3,#1F1C16);border:1px solid var(--line,rgba(245,241,230,.12));border-radius:14px;align-self:flex-start;width:fit-content}
#chatlog .typing i{width:7px;height:7px;border-radius:50%;background:var(--fg-2,#B4AE9F);animation:fsblink 1.1s infinite}
#chatlog .typing i:nth-child(2){animation-delay:.16s}
#chatlog .typing i:nth-child(3){animation-delay:.32s}
@keyframes fsblink{0%,60%,100%{opacity:.25}30%{opacity:1}}
#chatpanel .chips{display:flex;flex-wrap:wrap;gap:7px;padding:0 14px 12px}
#chatpanel .chip{border:1px solid var(--line-2,rgba(245,241,230,.26));background:var(--bg-2,#16140F);color:var(--fg,#F5F1E6);border-radius:999px;
  padding:10px 13px;min-height:44px;font:500 13px var(--ui,"Inter",system-ui,sans-serif);cursor:pointer;white-space:nowrap}
#chatpanel .chip:hover{border-color:var(--fg,#F5F1E6)}
#chatpanel .cbar{display:flex;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));border-top:1px solid var(--line,rgba(245,241,230,.12));background:var(--bg-2,#16140F)}
#chatpanel .cbar input{flex:1;min-width:0;border-radius:999px;padding:11px 15px;font:400 16px/1.4 var(--ui,"Inter",system-ui,sans-serif);
  color:var(--fg,#F5F1E6);background:var(--bg-3,#1F1C16);border:1.5px solid var(--line-2,rgba(245,241,230,.26))}
#chatpanel .cbar input:focus{border-color:var(--signal,#FDBF07);outline:none}
#chatsend{border:0;background:var(--fg,#F5F1E6);color:var(--bg,#0D0C0A);border-radius:999px;padding:11px 18px;min-height:44px;
  font:600 14px var(--ui,"Inter",system-ui,sans-serif);cursor:pointer}
#chatsend:disabled,#chatpanel .cbar input:disabled{opacity:.5;cursor:not-allowed}
#chatpanel .skip{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
body.lbx-open #chatbtn{display:none}
/* chip tài khoản (fx/account-chip.js) cũng nằm góc phải dưới: đẩy chip lên trên nút chat */
body:has(#chatbtn:not([hidden])) .fs-chip--float{bottom:calc(80px + env(safe-area-inset-bottom))}

/* ---- điện thoại: nút tròn 56px, ngăn kéo nửa dưới ---- */
@media (max-width:780px){
  #chatbtn{width:56px;height:56px;min-height:56px;padding:0;justify-content:center;gap:0;font-size:0;right:14px;
    bottom:calc(16px + env(safe-area-inset-bottom))}
  #chatbtn i,#chatbtn span{display:none}
  #chatbtn svg{display:block;width:26px;height:26px}
  #chatpanel{left:0;right:0;bottom:0;width:100%;height:52vh;height:52svh;min-height:330px;max-height:none;
    border-radius:18px 18px 0 0;border-left:0;border-right:0;border-bottom:0}
  #chatpanel .chead{padding:6px 6px 6px 12px}
  #chatpanel .chead img{width:28px;height:28px}
  #chatpanel .chead .s{font-size:12px}
  #chatlog{padding:12px}
  #chatpanel .chips{flex-wrap:nowrap;overflow-x:auto;padding:0 12px 10px;scrollbar-width:none}
  #chatpanel .chips::-webkit-scrollbar{display:none}
  body.chat-open #dock{display:none}
  body:has(#chatbtn:not([hidden])) .fs-chip--float{bottom:calc(84px + env(safe-area-inset-bottom))}
  body.past-hero:has(#dock):has(#chatbtn:not([hidden])) .fs-chip--float{bottom:calc(150px + env(safe-area-inset-bottom))}
}