/* Chatbot "Bé Minh" – khung chat theo ngôn ngữ thiết kế Lucian (tokens --ux-*) */
.bot{position:fixed;z-index:90;right:16px;bottom:18px;font-size:15px}
.bot-fab{display:flex;align-items:center;gap:10px;height:58px;padding:0 20px 0 7px;border:0;border-radius:999px;background:var(--ux-surface);color:var(--ux-ink);box-shadow:0 0 0 1px var(--ux-line),0 18px 36px -14px var(--ux-shadow-strong);font-weight:700;transition:transform .45s var(--ux-spring),opacity .3s}
.bot-fab:hover{transform:translateY(-2px)}
.bot.open .bot-fab{transform:scale(.6);opacity:0;pointer-events:none}
.bot-av{width:44px;height:44px;flex:none;border-radius:50%;background:var(--brand-grad);display:grid;place-items:center;color:var(--brand-navy);font-weight:800;font-size:14px;overflow:hidden}
.bot-av img{width:100%;height:100%;object-fit:cover}
.bot-dot{position:absolute;left:42px;top:9px;width:12px;height:12px;border-radius:50%;background:var(--ux-mint);box-shadow:0 0 0 3px var(--ux-surface)}
.bot.nudge .bot-fab{animation:botNudge 1.2s var(--ux-spring) 2}
@keyframes botNudge{0%,100%{transform:none}30%{transform:translateY(-8px) rotate(-3deg)}60%{transform:translateY(0) rotate(2deg)}}
@media (max-width:520px){.bot-fab-tx{display:none}.bot-fab{padding:0 7px;width:58px}}

.bot-panel{position:absolute;right:0;bottom:0;width:min(390px,calc(100vw - 32px));height:min(620px,calc(100svh - 110px));display:flex;flex-direction:column;border-radius:26px;overflow:hidden;background:var(--ux-surface);box-shadow:0 0 0 1px var(--ux-line),0 40px 80px -30px var(--ux-shadow-strong);transform-origin:100% 100%;transform:scale(.6) translateY(20px);opacity:0;visibility:hidden;transition:transform .5s var(--ux-spring),opacity .3s,visibility .5s}
.bot.open .bot-panel{transform:none;opacity:1;visibility:visible}
.bot-hd{display:flex;align-items:center;gap:12px;padding:14px 14px 14px 16px;background:var(--brand-navy);color:#F5F1E6}
.bot-hd b{display:block;font-size:16px}
.bot-hd small{display:flex;align-items:center;gap:6px;font-size:12.5px;opacity:.75}
.bot-hd small i{width:7px;height:7px;border-radius:50%;background:#7EE8C0}
.bot-x{margin-left:auto;width:38px;height:38px;border:0;border-radius:12px;background:rgba(255,255,255,.08);color:inherit;display:grid;place-items:center}
.bot-x svg{width:18px;height:18px}
.bot-log{flex:1;overflow-y:auto;padding:16px 14px;display:flex;flex-direction:column;gap:10px;background:var(--ux-surface-2);overscroll-behavior:contain}
.bot-msg{display:flex;flex-direction:column;max-width:86%;animation:msgIn .45s var(--ux-spring) both}
@keyframes msgIn{from{opacity:0;transform:translateY(10px) scale(.96)}}
.bot-msg--user{align-self:flex-end}
.bot-bub{padding:11px 14px;border-radius:18px;line-height:1.55;font-size:14.5px}
.bot-msg--bot .bot-bub{background:var(--ux-surface);color:var(--ux-ink);border-bottom-left-radius:6px;box-shadow:0 0 0 1px var(--ux-line)}
.bot-msg--user .bot-bub{background:var(--brand-grad);color:var(--brand-navy);border-bottom-right-radius:6px;font-weight:500}
.bot-bub a{color:var(--ux-accent);font-weight:700;text-decoration:none;white-space:nowrap}
.bot-typing{display:inline-flex;gap:4px;padding:4px 2px}
.bot-typing i{width:7px;height:7px;border-radius:50%;background:var(--ux-ink-3);animation:dotB 1.1s infinite ease-in-out}
.bot-typing i:nth-child(2){animation-delay:.15s}.bot-typing i:nth-child(3){animation-delay:.3s}
@keyframes dotB{0%,80%,100%{transform:translateY(0);opacity:.5}40%{transform:translateY(-5px);opacity:1}}
.bot-sug{display:flex;gap:6px;overflow-x:auto;padding:10px 12px 0;background:var(--ux-surface);scrollbar-width:none}
.bot-sug::-webkit-scrollbar{display:none}
.bot-sug button{flex:none;border:0;padding:8px 13px;border-radius:999px;background:var(--ux-accent-soft);color:var(--ux-ink);font-size:13px;font-weight:600;transition:transform .3s var(--ux-spring)}
.bot-sug button:active{transform:scale(.94)}
.bot-in{display:flex;gap:8px;padding:10px 12px 12px;background:var(--ux-surface)}
.bot-in input{flex:1;min-width:0;height:46px;padding:0 16px;border-radius:999px;border:0;background:var(--ux-surface-2);color:var(--ux-ink);font:inherit;font-size:15px}
.bot-in input:focus{outline:2px solid var(--ux-accent);outline-offset:0}
.bot-in button{width:46px;height:46px;border:0;border-radius:50%;background:var(--brand-grad);color:var(--brand-navy);display:grid;place-items:center}
.bot-in button svg{width:19px;height:19px}
.bot-phone{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.bot-phone input{flex:1 1 130px;min-width:0;height:42px;padding:0 12px;border-radius:12px;border:0;background:var(--ux-surface);box-shadow:inset 0 0 0 1.5px var(--ux-line-2);color:var(--ux-ink);font:inherit;font-size:14px}
.bot-phone input.err{box-shadow:inset 0 0 0 1.5px var(--ux-danger)}
.bot-phone button{height:42px;padding:0 16px;border:0;border-radius:12px;background:var(--ux-ink);color:var(--ux-page);font-weight:700}
.bot-phone :disabled{opacity:.55}
