#veic-ai-root{position:fixed;z-index:99999;bottom:20px;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;}
#veic-ai-root.veic-ai-pos-left{left:20px;}
#veic-ai-root.veic-ai-pos-right{right:20px;}

.veic-ai-launcher{display:flex;align-items:center;gap:10px;background:#0f3d63;color:#fff;border:none;border-radius:999px;padding:12px 18px;box-shadow:0 6px 20px rgba(15,61,99,.35);cursor:pointer;font-size:14px;font-weight:600;}
.veic-ai-launcher:hover{background:#0c3151;}
.veic-ai-launcher svg{width:20px;height:20px;flex-shrink:0;}

.veic-ai-panel{display:none;flex-direction:column;width:340px;max-width:calc(100vw - 40px);height:460px;max-height:70vh;background:#fff;border-radius:14px;box-shadow:0 12px 40px rgba(0,0,0,.2);overflow:hidden;position:absolute;bottom:64px;}
#veic-ai-root.veic-ai-pos-left .veic-ai-panel{left:0;}
#veic-ai-root.veic-ai-pos-right .veic-ai-panel{right:0;}
.veic-ai-panel.veic-ai-open{display:flex;}

.veic-ai-header{background:#0f3d63;color:#fff;padding:14px 16px;display:flex;justify-content:space-between;align-items:center;}
.veic-ai-header-title{font-weight:700;font-size:15px;}
.veic-ai-header-sub{font-size:12px;opacity:.85;}
.veic-ai-close{background:none;border:none;color:#fff;font-size:20px;cursor:pointer;line-height:1;padding:0;}

.veic-ai-messages{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px;background:#f7f9fb;}
.veic-ai-msg{max-width:85%;padding:9px 12px;border-radius:12px;font-size:13.5px;line-height:1.45;white-space:pre-wrap;}
.veic-ai-msg-bot{background:#fff;border:1px solid #e2e6ea;align-self:flex-start;color:#1d2327;}
.veic-ai-msg-user{background:#0f3d63;color:#fff;align-self:flex-end;}
.veic-ai-msg-sources{font-size:11px;color:#646970;margin-top:4px;}
.veic-ai-msg-sources a{color:#0f3d63;}

.veic-ai-contact-link{display:inline-block;margin-top:6px;color:#fff;background:#0f3d63;border-radius:16px;padding:6px 14px;font-size:12.5px;font-weight:600;text-decoration:none;}
.veic-ai-contact-link:hover{background:#0c3151;}

.veic-ai-suggestions{display:flex;flex-wrap:wrap;gap:6px;padding:0 14px 10px;}
.veic-ai-suggestion{background:#eef3f7;border:1px solid #d7e2ea;border-radius:999px;padding:5px 10px;font-size:12px;cursor:pointer;color:#0f3d63;}
.veic-ai-suggestion:hover{background:#dfe9f1;}

.veic-ai-inputrow{display:flex;gap:8px;padding:10px;border-top:1px solid #e2e6ea;background:#fff;}
.veic-ai-input{flex:1;border:1px solid #d7dade;border-radius:20px;padding:9px 14px;font-size:13.5px;outline:none;}
.veic-ai-input:focus{border-color:#0f3d63;}
.veic-ai-send{background:#0f3d63;color:#fff;border:none;border-radius:50%;width:36px;height:36px;flex-shrink:0;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.veic-ai-send:disabled{opacity:.5;cursor:default;}
/* v1.4.5: the send-button arrow icon had no explicit CSS sizing of its
   own (unlike .veic-ai-launcher svg above, which already has one) — on
   a site whose own theme stylesheet includes a common responsive-media
   reset such as "svg{max-width:100%;height:auto}", that rule beats the
   plain width="16"/height="16" HTML attributes on the icon (an author
   stylesheet rule always outranks a presentation attribute), so the
   icon collapsed to nothing and only the round blue background showed.
   These rules give it its own explicit box and force the intended
   white outline regardless of the host page's stylesheet. */
.veic-ai-send svg{display:block;width:16px;height:16px;flex-shrink:0;fill:none !important;stroke:#fff !important;stroke-width:2 !important;}

.veic-ai-typing{display:inline-flex;gap:3px;padding:4px 0;}
.veic-ai-typing span{width:6px;height:6px;border-radius:50%;background:#98a2ad;animation:veic-ai-bounce 1.2s infinite ease-in-out;}
.veic-ai-typing span:nth-child(2){animation-delay:.15s;}
.veic-ai-typing span:nth-child(3){animation-delay:.3s;}
@keyframes veic-ai-bounce{0%,80%,100%{transform:translateY(0);}40%{transform:translateY(-4px);}}

@media (max-width:480px){
	.veic-ai-panel{width:calc(100vw - 24px);height:75vh;bottom:60px;}

	/* Icon-only launcher on mobile: the brand-name label is hidden (not
	   removed — see chatbot.js) so the floating button collapses to a
	   round logo/icon button; the aria-label on the button still reads
	   "Open <name> chat" to screen readers. Tapping the button still
	   opens the chat panel — no JS change, the click handler is on the
	   whole button, unaffected by hiding the label visually. */
	.veic-ai-launcher{gap:0;padding:0;width:56px;height:56px;justify-content:center;border-radius:50%;}
	.veic-ai-launcher-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
	.veic-ai-launcher-icon{width:24px;height:24px;}
}
