/* =============================================================================
   fh-chat.css v9.0.0
   Chat panel, messages, input area, avatars, reply bar
   ============================================================================= */

.gp-chat-panel { display:flex; flex-direction:column; height:460px; background:#f0f2f5; }
.gp-chat-messages { flex:1; overflow-y:auto; padding:16px; display:flex; flex-direction:column; gap:4px;
  background:#e5ddd5; background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="80" height="80"><rect fill="%23e5ddd5" width="80" height="80"/><circle fill="%23d1c4b8" opacity=".04" cx="40" cy="40" r="24"/></svg>'); }
.gp-chat-empty { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; color:#94a3b8; font-size:14px; text-align:center; }
.gp-chat-empty p { margin:4px 0 0; }

/* Message row */
.gp-chat-msg { display:flex; max-width:75%; gap:6px; align-items:flex-start; animation:gp-chat-slide-in .2s ease-out; }
@keyframes gp-chat-slide-in { from{opacity:0;transform:translateY(6px);} to{opacity:1;transform:translateY(0);} }
.gp-chat-msg-other { align-self:flex-start; }
.gp-chat-msg-own { align-self:flex-end; flex-direction:row-reverse; }
.gp-chat-msg-avatar { width:28px; height:28px; border-radius:50%; background:linear-gradient(135deg,#667eea,#764ba2);
  color:#fff; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:600; flex-shrink:0; margin-top:2px; }
.gp-chat-msg-body { display:flex; flex-direction:column; min-width:0; }
.gp-chat-msg-sender { font-size:11px; font-weight:600; color:#4338ca; margin-bottom:2px; margin-left:6px; }
.gp-chat-msg-own .gp-chat-msg-sender { display:none; }

/* Reply context */
.gp-chat-msg-reply { background:rgba(0,0,0,.06); border-left:3px solid #4338ca;
  padding:4px 8px; border-radius:4px; margin-bottom:3px; margin-left:6px; font-size:12px; max-width:260px; overflow:hidden; }
.gp-chat-msg-reply strong { color:#4338ca; display:block; font-size:11px; margin-bottom:1px; }
.gp-chat-msg-reply span { color:#64748b; display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* Bubble */
.gp-chat-msg-row { display:inline-flex; align-items:flex-start; gap:5px; }
.gp-chat-msg-bubble { padding:7px 11px; border-radius:8px; font-size:14px; line-height:1.45;
  box-shadow:0 1px 2px rgba(0,0,0,.08); word-wrap:break-word; max-width:340px; }
.gp-chat-msg-bubble p { margin:0; }
.gp-chat-msg-other .gp-chat-msg-bubble { background:#fff; color:#0f172a; border-bottom-left-radius:2px; }
.gp-chat-msg-own .gp-chat-msg-bubble { background:#d9fdd3; color:#0f172a; border-bottom-right-radius:2px; }
.gp-chat-edited { font-size:10px; color:#94a3b8; font-style:italic; margin-left:4px; }

/* Meta */
.gp-chat-msg-meta { display:inline-flex; align-items:center; gap:3px; opacity:0; transition:opacity .15s; flex-shrink:0; }
.gp-chat-msg:hover .gp-chat-msg-meta { opacity:1; }
.gp-chat-msg-time { font-size:10px; color:#94a3b8; white-space:nowrap; }
.gp-chat-reply-btn { width:20px; height:20px; border-radius:50%; border:0; background:rgba(0,0,0,.05);
  color:#94a3b8; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .15s; }
.gp-chat-reply-btn:hover { background:rgba(0,0,0,.1); color:#4338ca; transform:scale(1.1); }
.gp-chat-reply-btn i { font-size:11px; }

/* Input area */
.gp-chat-input-area { border-top:1px solid #e2e8f0; background:#f8fafc; padding:0; }
.gp-chat-reply-bar { display:flex; align-items:center; padding:8px 14px; background:rgba(67,56,202,.08); border-left:3px solid #4338ca; gap:8px; }
.gp-chat-reply-content { flex:1; min-width:0; }
.gp-chat-reply-name { font-size:12px; font-weight:600; color:#4338ca; display:block; }
.gp-chat-reply-text { font-size:12px; color:#64748b; display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:300px; }
.gp-chat-reply-cancel { width:24px; height:24px; border-radius:50%; border:0; background:transparent; color:#94a3b8; cursor:pointer; font-size:14px;
  display:flex; align-items:center; justify-content:center; }
.gp-chat-reply-cancel:hover { color:#0f172a; }
.gp-chat-input-row { display:flex; align-items:flex-end; gap:8px; padding:10px 14px; }
.gp-chat-input { flex:1; border:1px solid #e2e8f0; border-radius:18px; padding:9px 14px; font-size:14px;
  font-family:inherit; resize:none; outline:0; max-height:100px; line-height:1.4; background:#fff; transition:border-color .15s; }
.gp-chat-input:focus { border-color:#6366f1; box-shadow:0 0 0 3px rgba(99,102,241,.1); }
.gp-chat-input:disabled { opacity:.5; cursor:not-allowed; }
.gp-chat-send-btn { width:36px; height:36px; border-radius:50%; border:0; background:#4338ca; color:#fff;
  cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .15s; flex-shrink:0; }
.gp-chat-send-btn:hover { background:#3730a3; transform:scale(1.05); }
.gp-chat-send-btn:disabled { background:#cbd5e1; cursor:not-allowed; transform:none; }
.gp-chat-send-btn i { font-size:14px; }

/* Scrollbar */
.gp-chat-messages::-webkit-scrollbar { width:5px; }
.gp-chat-messages::-webkit-scrollbar-track { background:transparent; }
.gp-chat-messages::-webkit-scrollbar-thumb { background:rgba(0,0,0,.15); border-radius:3px; }
.gp-chat-messages::-webkit-scrollbar-thumb:hover { background:rgba(0,0,0,.25); }

@media (max-width:600px) { .gp-chat-panel{height:380px;} .gp-chat-msg{max-width:88%;} .gp-chat-msg-bubble{max-width:260px;} }