/* Live chat — shared by customer (site.css vars) and admin (admin.css vars) pages */
.chat{display:flex;flex-direction:column;border:1.5px solid var(--line,#e4e0d3);border-radius:16px;overflow:hidden;background:#fff}
.chat-stream{display:flex;flex-direction:column;gap:10px;padding:18px;height:460px;overflow-y:auto;background:#FCFBF7;scroll-behavior:smooth}
.bubble{max-width:78%;padding:9px 13px;border-radius:14px;font-size:14.5px;line-height:1.5;position:relative;word-wrap:break-word;overflow-wrap:anywhere;animation:bubblein .18s ease}
@keyframes bubblein{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.bubble.theirs{align-self:flex-start;background:#fff;border:1px solid var(--line,#e4e0d3);border-bottom-left-radius:5px}
.bubble.mine{align-self:flex-end;background:var(--jungle,#0C3B34);color:#fff;border-bottom-right-radius:5px}
.bubble .who{display:block;font-size:11px;font-weight:600;opacity:.6;margin-bottom:3px}
.bubble .btext{display:block;white-space:pre-wrap}
.bubble time{display:block;font-size:10.5px;opacity:.55;margin-top:4px;text-align:right}
.bubble .chat-img{display:block;margin-top:6px}
.bubble .chat-img img{max-width:230px;max-height:240px;border-radius:10px;display:block}
.bubble .chat-file{display:inline-flex;align-items:center;gap:7px;margin-top:6px;padding:8px 11px;border-radius:10px;background:rgba(0,0,0,.06);font-size:13.5px;font-weight:500;text-decoration:none;color:inherit}
.bubble.mine .chat-file{background:rgba(255,255,255,.16);color:#fff}
.bubble .chat-file span{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chat-empty{align-self:center;color:var(--muted,#5E6E69);font-size:13.5px;margin:auto 0}
.chat-preview{padding:10px 14px;border-top:1px solid var(--line,#e4e0d3);background:#fff}
.chat-preview[hidden]{display:none}
.pv-chip{display:inline-flex;align-items:center;gap:9px;background:#F3F1E8;border:1px solid var(--line,#e4e0d3);border-radius:10px;padding:6px 10px;font-size:13px;max-width:100%}
.pv-chip img{width:34px;height:34px;object-fit:cover;border-radius:6px}
.pv-name{max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pv-x{border:none;background:transparent;cursor:pointer;color:var(--muted,#5E6E69);font-size:13px;line-height:1}
.chat-compose{display:flex;align-items:flex-end;gap:8px;padding:11px;border-top:1px solid var(--line,#e4e0d3);background:#fff}
.chat-attach{cursor:pointer;font-size:20px;line-height:1;padding:9px;border-radius:10px;user-select:none;flex:0 0 auto}
.chat-attach:hover{background:#f0eee4}
.chat-compose textarea{flex:1;font:inherit;font-size:14.5px;padding:10px 13px;border:1.5px solid var(--line,#e4e0d3);border-radius:12px;resize:none;max-height:140px;line-height:1.4;min-height:20px}
.chat-compose textarea:focus{outline:none;border-color:var(--ocean,#2E7C86);box-shadow:0 0 0 3px rgba(46,124,134,.15)}
.chat-send{flex:0 0 auto;width:42px;height:42px;border:none;border-radius:12px;background:var(--jungle,#0C3B34);color:#fff;font-size:16px;cursor:pointer;transition:.15s}
.chat-send:hover{background:#0a4d43}
.chat-send:disabled{opacity:.5;cursor:default}
.chat-live{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted,#5E6E69)}
.chat-live::before{content:"";width:7px;height:7px;border-radius:50%;background:#3fae6a;box-shadow:0 0 0 0 rgba(63,174,106,.5);animation:livepulse 2s infinite}
@keyframes livepulse{0%{box-shadow:0 0 0 0 rgba(63,174,106,.5)}70%{box-shadow:0 0 0 6px rgba(63,174,106,0)}100%{box-shadow:0 0 0 0 rgba(63,174,106,0)}}