:root{ --cmd-primary:#153268; --cmd-bg:#f7f9fc; --cmd-flyout-w:360px; }
.cmd-chatbot{font:15.5px/1.58 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif; width:var(--cmd-flyout-w); max-height:640px; background:var(--cmd-bg); border:1px solid #e6eaf1; border-radius:14px; box-shadow:0 20px 60px rgba(0,0,0,.18); display:flex; flex-direction:column; overflow:hidden}
.cmd-topbar{display:flex; align-items:center; gap:10px; padding:10px 12px; background:#fff; border-bottom:1px solid #eef1f6}
.cmd-avatar{width:32px; height:32px; border-radius:50%; object-fit:cover; background:#e6eef7}
.cmd-hello strong{font-size:14px; color:#0f172a}
.cmd-hello .cmd-sub{font-size:12px; color:#5b677e; margin-left:6px}
.cmd-close{margin-left:auto; background:transparent; border:0; font-size:18px; color:#6b7280; cursor:pointer}
.cmd-toolbar{display:flex; align-items:center; gap:12px; padding:8px 12px; border-bottom:1px dashed #e8ebf2; font-size:12px}
.cmd-toparea{padding:8px 12px; border-bottom:1px dashed #e8ebf2; background:#fff}
.cmd-suggestions{display:flex; flex-wrap:wrap; gap:8px}
.cmd-suggestions button{background:#e6eef7; color:#153268; border:1px solid rgba(21,50,104,.2); border-radius:999px; padding:6px 10px; font-size:13px; cursor:pointer}
.cmd-faq{padding:8px 12px; border-bottom:1px dashed #e8ebf2; max-height:180px; overflow:auto}
.cmd-faq details{border:1px solid #e6eaf1; background:#fafcff; border-radius:10px; padding:8px 10px; margin-bottom:6px}
.cmd-faq summary{cursor:pointer; font-weight:600}
.cmd-messages{flex:1; overflow:auto; padding:12px; background:linear-gradient(#ffffff, #fafcff)}
.cmd-msg{display:flex; gap:8px; margin:10px 0}
.cmd-msg.user{justify-content:flex-end}
.cmd-msg .bubble{max-width:85%; padding:12px 13px; border-radius:12px; box-shadow:0 1px 0 rgba(0,0,0,.03)}
.cmd-msg.user .bubble{background:var(--cmd-primary); color:#fff}
.cmd-msg.bot .bubble{background:#ffffff; border:1px solid #e6eaf1; color:#0f172a}
.cmd-msg .bubble h1,.cmd-msg .bubble h2,.cmd-msg .bubble h3{margin:.4em 0 .2em}
.cmd-msg .bubble ul{margin:.2em 0 .2em 1.2em}
.cmd-msg .bubble code{background:#f0f3f8; padding:1px 4px; border-radius:4px}
/* Input area with 15% transparency of #003866 */
.cmd-input{display:flex; gap:8px; padding:12px; border-top:1px solid #eef1f6; background:rgba(0,56,102,0.15)}
.cmd-input textarea{flex:1; min-height:48px; resize:vertical; padding:10px; border:1px solid #dfe3ea; border-radius:10px; font-size:14px; background:#fff}
.cmd-send{background:var(--cmd-primary); color:#fff; border:0; padding:0 14px; border-radius:10px; font-size:14px; cursor:pointer}
.cmd-footer{font-size:11px; color:#667085; padding:8px 12px 12px}
.cmd-floating{position:fixed; right:18px; bottom:18px; z-index:2147483000}
.cmd-fab{width:56px; height:56px; border-radius:999px; background:#fff; border:0; box-shadow:0 10px 26px rgba(0,0,0,.2); cursor:pointer; overflow:hidden; position:relative}
.cmd-fab-img{position:absolute; inset:0; width:100%; height:100%; object-fit:contain; padding:6px}
.cmd-flyout{position:fixed; right:18px; bottom:86px; max-width:calc(100vw - 36px)}
@media (max-width:480px){ :root{ --cmd-flyout-w: calc(100vw - 36px); } }