/* ---------- Nút hỗ trợ & hộp hội thoại (khung chờ gắn chatbot) ---------- */
.float .stack .chatbtn,.chatbtn{width:54px;height:54px;border-radius:50%;background:linear-gradient(145deg,#5ad8f5,#16a6e4);border:0;display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;box-shadow:0 8px 20px rgba(22,166,228,.35);transition:transform .2s}
.chatbtn:hover{transform:scale(1.07)}
.chatbtn::before{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid rgba(90,216,245,.55);animation:cbPulse 2.4s ease-out infinite}
@keyframes cbPulse{0%{transform:scale(.85);opacity:1}100%{transform:scale(1.35);opacity:0}}
@media(prefers-reduced-motion:reduce){.chatbtn::before{animation:none;display:none}}
#chatpanel{position:fixed;left:22px;bottom:22px;width:360px;max-width:calc(100vw - 24px);height:540px;max-height:calc(100vh - 44px);background:#fff;border-radius:24px;box-shadow:0 20px 50px rgba(17,60,90,.25);display:flex;flex-direction:column;overflow:hidden;z-index:130;transform-origin:bottom left;transform:scale(.6);opacity:0;pointer-events:none;transition:transform .25s cubic-bezier(.2,1.3,.4,1),opacity .2s;font-size:14px}
#chatpanel.open{transform:scale(1);opacity:1;pointer-events:auto}
.cp-head{background:linear-gradient(145deg,#5ad8f5,#16a6e4);color:#fff;padding:18px 18px 26px;display:flex;gap:12px;align-items:center;position:relative}
.cp-head::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:16px;background:#f4fbfe;border-radius:16px 16px 0 0}
.cp-ava{width:52px;height:52px;flex:none;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 10px rgba(0,0,0,.12)}
.cp-title{font-weight:700;font-size:16px;outline:none}
.cp-sub{font-size:12px;opacity:.95;display:flex;align-items:center;gap:6px}
.cp-sub i{width:8px;height:8px;border-radius:50%;background:#7dffb0;box-shadow:0 0 0 3px rgba(125,255,176,.3)}
.cp-x{margin-left:auto;align-self:flex-start;background:rgba(255,255,255,.25);border:0;color:#fff;width:30px;height:30px;border-radius:50%;font-size:16px;cursor:pointer}
.cp-x:hover{background:rgba(255,255,255,.4)}
.cp-body{flex:1;overflow-y:auto;background:#f4fbfe;padding:6px 16px 12px;display:flex;flex-direction:column;gap:10px}
.cp-msg{max-width:82%;padding:10px 14px;border-radius:18px;line-height:1.5;font-size:13.5px;animation:cpIn .25s ease-out}
@keyframes cpIn{from{transform:translateY(6px);opacity:0}to{transform:none;opacity:1}}
.cp-bot{background:#fff;border:1px solid #dcf1fa;border-bottom-left-radius:6px;align-self:flex-start;color:#24323f}
.cp-me{background:linear-gradient(145deg,#38c6ef,#16a6e4);color:#fff;border-bottom-right-radius:6px;align-self:flex-end}
.cp-row{display:flex;gap:8px;align-items:flex-end}
.cp-row .cp-mini{width:28px;height:28px;flex:none}
.cp-chips{display:flex;flex-wrap:wrap;gap:6px;padding-left:36px}
.cp-chips button{border:1.5px solid #9fe0f5;background:#fff;color:#0f86bd;border-radius:999px;padding:6px 12px;font-size:12.5px;cursor:pointer}
.cp-chips button:hover{background:#e6f7fd}
.cp-foot{border-top:1px solid #e3f1f7;padding:10px 12px;display:flex;gap:8px;align-items:center;background:#fff}
.cp-foot input{flex:1;border:1.5px solid #dcecf3;border-radius:999px;padding:10px 14px;font:inherit;font-size:13.5px;outline:none}
.cp-foot input:focus{border-color:#5ad8f5}
.cp-send{width:40px;height:40px;border-radius:50%;border:0;background:linear-gradient(145deg,#5ad8f5,#16a6e4);color:#fff;font-size:16px;cursor:pointer}
.cp-note{text-align:center;font-size:11px;color:#8a9aa8;padding:0 12px 10px;background:#fff}
.cp-typing{display:inline-flex;gap:4px}.cp-typing i{width:6px;height:6px;border-radius:50%;background:#9fd9ee;animation:cpDot 1s infinite}
.cp-typing i:nth-child(2){animation-delay:.15s}.cp-typing i:nth-child(3){animation-delay:.3s}
@keyframes cpDot{0%,80%,100%{transform:translateY(0)}40%{transform:translateY(-4px)}}

/* trợ lý ở góc trái, biểu tượng tải lên cho nút */
.float .lstack{position:absolute;left:16px;bottom:16px;display:flex;flex-direction:column;gap:6px}
.fbtn.hasicon{color:transparent!important;font-size:0!important;background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important;background-color:#fff!important}
#lp .icrow{display:flex;gap:6px;align-items:center}
#lp .icrow button{border:1px solid var(--line);background:#fff;border-radius:6px;padding:6px 8px;font-size:12px;flex:1}
#lp .icrow button:hover{border-color:var(--ui);background:var(--ui-soft)}
#lp .icprev{width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:#f4f6f9 center/cover no-repeat;flex:none}