:root{
	--cba-ai-ink:#0a3d62;
	--cba-ai-accent:#135e8f;
	--cba-ai-accent-soft:#e4edf3;
	--cba-ai-line:#e2e5ea;
	--cba-ai-bg:#f8fafb;
}
/* Matches the real site's --pcba-navy / --pcba-navy-light / --pcba-bg variables from pengcba-theme/style.css. */

.cba-ai-widget{ position:fixed; right:20px; bottom:20px; z-index:99999; font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; }
.cba-ai-bubble{
	width:56px; height:56px; border-radius:50%; background:var(--cba-ai-ink); color:#fff; border:none;
	display:flex; align-items:center; justify-content:center; box-shadow:0 12px 28px rgba(0,0,0,0.22); cursor:pointer;
	transition:transform .15s ease;
}
.cba-ai-bubble:hover{ transform:scale(1.05); }
.cba-ai-bubble svg{ width:24px; height:24px; }
.cba-ai-icon-close{ display:none; }
.cba-ai-widget.open .cba-ai-icon-open{ display:none; }
.cba-ai-widget.open .cba-ai-icon-close{ display:block; }

.cba-ai-panel{
	position:absolute; right:0; bottom:72px; width:350px; max-width:calc(100vw - 40px);
	background:#fff; border:1px solid var(--cba-ai-line); box-shadow:0 24px 60px rgba(0,0,0,0.24);
	display:flex; flex-direction:column; height:460px; max-height:70vh; border-radius:8px; overflow:hidden;
}
.cba-ai-head{ background:var(--cba-ai-ink); color:#fff; padding:16px 18px; }
.cba-ai-head-title{ font-weight:700; font-size:15px; }
.cba-ai-head-sub{ font-size:11px; color:#a9b6c9; margin-top:2px; }

.cba-ai-messages{ flex:1; overflow-y:auto; padding:16px; display:flex; flex-direction:column; gap:10px; background:var(--cba-ai-bg); }
.cba-ai-row{ display:flex; }
.cba-ai-row.from-user{ justify-content:flex-end; }
.cba-ai-msg{ max-width:82%; padding:10px 13px; font-size:13.5px; line-height:1.5; border-radius:8px; background:#fff; border:1px solid var(--cba-ai-line); color:var(--cba-ai-ink); }
.cba-ai-row.from-user .cba-ai-msg{ background:var(--cba-ai-accent); color:#fff; border-color:var(--cba-ai-accent); }

.cba-ai-typing{ display:flex; gap:4px; align-items:center; padding:12px 13px; }
.cba-ai-typing span{ width:6px; height:6px; border-radius:50%; background:#8a94a3; display:inline-block; animation:cbaAiTyping 1.2s infinite ease-in-out; }
.cba-ai-typing span:nth-child(2){ animation-delay:.15s; }
.cba-ai-typing span:nth-child(3){ animation-delay:.3s; }
@keyframes cbaAiTyping{ 0%,60%,100%{ opacity:0.3; transform:translateY(0); } 30%{ opacity:1; transform:translateY(-3px); } }

.cba-ai-quick{ display:flex; gap:8px; padding:0 16px 12px; flex-wrap:wrap; }
.cba-ai-chip{ font-size:12px; border:1px solid var(--cba-ai-line); background:#fff; padding:7px 12px; border-radius:20px; color:#5b6675; cursor:pointer; transition:border-color .15s ease, color .15s ease; }
.cba-ai-chip:hover{ border-color:var(--cba-ai-accent); color:var(--cba-ai-accent); }

.cba-ai-input-row{ display:flex; gap:8px; padding:12px; border-top:1px solid var(--cba-ai-line); background:#fff; }
.cba-ai-text-input{ flex:1; padding:10px 12px; font-size:13.5px; border:1px solid var(--cba-ai-line); border-radius:6px; font-family:inherit; }
.cba-ai-send{ width:40px; height:40px; flex-shrink:0; background:var(--cba-ai-ink); color:#fff; border:none; border-radius:6px; display:flex; align-items:center; justify-content:center; cursor:pointer; }
.cba-ai-send svg{ width:16px; height:16px; }

@media (max-width:480px){
	.cba-ai-widget{ right:14px; bottom:14px; }
	.cba-ai-panel{ width:calc(100vw - 28px); height:64vh; }
}