/* chat.css */
.chat-demo-wrap { display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:center; }
.chat-window { background:var(--bg2); border:1px solid var(--border2); border-radius:var(--r2); overflow:hidden; box-shadow:0 24px 60px rgba(0,0,0,0.4); }
.chat-header { background:var(--bg3); padding:16px 20px; border-bottom:1px solid var(--border); display:flex; align-items:center; gap:12px; }
.ai-avatar { width:32px; height:32px; background:var(--grad1); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:0.8rem; font-weight:700; color:#030712; }
.chat-ai-name   { font-size:0.9rem; font-weight:700; }
.chat-ai-status { font-size:0.75rem; color:var(--accent); }
.chat-messages  { padding:20px; display:flex; flex-direction:column; gap:12px; min-height:280px; }
.msg { max-width:85%; padding:12px 16px; border-radius:14px; font-size:0.85rem; line-height:1.6; opacity:0; animation:msgIn 0.4s ease forwards; }
.msg-user { background:rgba(74,222,128,0.15); border:1px solid rgba(74,222,128,0.2); color:var(--text); align-self:flex-end; border-radius:14px 14px 4px 14px; }
.msg-ai   { background:var(--surface); border:1px solid var(--border); color:var(--text); align-self:flex-start; border-radius:14px 14px 14px 4px; }
.msg-ai strong { color:var(--accent); }
.chat-input-bar { padding:12px 16px; border-top:1px solid var(--border); display:flex; gap:8px; align-items:center; }
.chat-input { flex:1; background:var(--surface); border:1px solid var(--border2); border-radius:10px; padding:10px 14px; font-family:var(--font); font-size:0.85rem; color:var(--text); outline:none; }
.chat-input:focus { border-color:rgba(74,222,128,0.4); }
.chat-send { width:36px; height:36px; background:var(--accent); border:none; border-radius:10px; color:#030712; cursor:pointer; font-size:1rem; display:flex; align-items:center; justify-content:center; transition:var(--transition); }
.chat-send:hover { background:#86efac; transform:scale(1.05); }
.chat-info h3 { font-size:1.4rem; font-weight:700; margin-bottom:1rem; }
.chat-info p  { color:var(--text2); line-height:1.7; margin-bottom:1.5rem; font-size:0.9rem; }
.suggested-prompts { display:flex; flex-direction:column; gap:8px; }
.prompt-pill { padding:10px 16px; background:var(--surface); border:1px solid var(--border2); border-radius:10px; font-size:0.82rem; color:var(--text2); cursor:pointer; transition:var(--transition); text-align:left; font-family:var(--font); }
.prompt-pill:hover { background:var(--surface2); color:var(--text); border-color:rgba(74,222,128,0.3); }