/* ── E2EE CHAT ── */
.chat-widget-toggle { position:fixed; bottom:24px; right:24px; width:56px; height:56px; border-radius:50%; background:var(--primary); color:#fff; display:flex; align-items:center; justify-content:center; font-size:24px; cursor:pointer; box-shadow:0 4px 12px rgba(0,0,0,0.3); z-index:9998; transition:transform 0.2s; }
.chat-widget-toggle:hover { transform:scale(1.05); }

.chat-layout { display:none; position:fixed; bottom:90px; right:24px; width:800px; height:500px; max-width:95vw; max-height:85vh; border-radius:12px; box-shadow:0 10px 40px rgba(0,0,0,0.25); background:rgba(255,255,255,0.9); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); overflow:hidden; border:1px solid rgba(0,0,0,0.1); z-index:9999; flex-direction:row; resize:both; min-width:400px; min-height:300px; }
.chat-layout.open { display:flex; }

.chat-sidebar { width:280px; border-right:1px solid var(--border); display:flex; flex-direction:column; background:rgba(250,249,247,0.7); flex-shrink:0; }
.chat-sidebar-head { padding:14px; border-bottom:1px solid var(--border); display:flex; justify-content:space-between; align-items:center; cursor:move; background:#f0ede7; }
.chat-sidebar-head h3 { font-size:16px; margin:0; }
.chat-list { flex:1; overflow-y:auto; }
.chat-item { display:flex; align-items:center; gap:12px; padding:12px 14px; cursor:pointer; border-bottom:1px solid var(--border); transition:background .15s; }
.chat-item:hover { background:#f3f2f0; }
.chat-item.active { background:#eef2ff; border-left:3px solid var(--info); }
.chat-item .av { width:44px; height:44px; border-radius:50%; background:var(--accent); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; flex-shrink:0; position:relative; font-size:16px; }
.chat-item .status-dot { position:absolute; bottom:0; right:0; width:12px; height:12px; border-radius:50%; border:2px solid #fff; }
.status-dot.online { background:var(--success); }
.status-dot.offline { background:var(--text-muted); }
.chat-item-info { flex:1; min-width:0; }
.chat-item-name { font-weight:600; font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:flex; justify-content:space-between; }
.chat-item-time { font-size:10px; color:var(--text-muted); font-weight:400; }
.chat-item-last { font-size:12px; color:var(--text-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:4px; display:flex; justify-content:space-between; align-items:center; }
.chat-unread { background:var(--success); color:#fff; font-size:10px; font-weight:700; padding:2px 6px; border-radius:10px; }

.chat-main { flex:1; display:flex; flex-direction:column; background:rgba(239,234,226,0.65); position:relative; }
.chat-header { height:65px; background:#fff; border-bottom:1px solid var(--border); display:flex; align-items:center; padding:0 20px; justify-content:space-between; }
.chat-header-info { display:flex; align-items:center; gap:12px; }
.chat-header-name { font-weight:700; font-size:16px; }
.chat-header-status { font-size:12px; color:var(--text-muted); margin-top:2px; }

.chat-messages { flex:1; padding:20px; overflow-y:auto; display:flex; flex-direction:column; gap:8px; }
.chat-msg { max-width:65%; display:flex; flex-direction:column; position:relative; }
.chat-msg.me { align-self:flex-end; }
.chat-msg.them { align-self:flex-start; }
.chat-bubble { padding:8px 12px; border-radius:8px; font-size:14px; line-height:1.4; position:relative; box-shadow:0 1px 1px rgba(0,0,0,0.1); word-wrap:break-word; }
.chat-msg.me .chat-bubble { background:#dcf8c6; border-top-right-radius:0; }
.chat-msg.them .chat-bubble { background:#fff; border-top-left-radius:0; }
.chat-meta { display:flex; align-items:center; justify-content:flex-end; gap:4px; margin-top:4px; font-size:10px; color:var(--text-muted); }
.chat-meta .ticks { font-size:12px; letter-spacing:-2px; margin-left:4px; }
.ticks.sent { color:#999; }
.ticks.delivered { color:#999; }
.ticks.read { color:#34b7f1; }

.chat-input-area { background:#f0f0f0; padding:12px 20px; display:flex; align-items:center; gap:12px; border-top:1px solid var(--border); }
.chat-input-area button { background:none; border:none; font-size:24px; cursor:pointer; color:var(--text-muted); padding:4px; border-radius:50%; transition:background .15s; display:flex; align-items:center; justify-content:center; width:40px; height:40px; }
.chat-input-area button:hover { background:rgba(0,0,0,0.05); }
.chat-input { flex:1; background:#fff; border:none; border-radius:24px; padding:12px 20px; font-size:15px; outline:none; font-family:inherit; box-shadow:inset 0 1px 2px rgba(0,0,0,0.05); }
.chat-empty { flex:1; display:flex; align-items:center; justify-content:center; flex-direction:column; color:var(--text-muted); background:#f8fafc; }
.chat-empty-icon { font-size:70px; margin-bottom:20px; opacity:0.3; }

.encryption-notice { text-align:center; font-size:11px; color:#888; background:#fff3cd; padding:8px 16px; border-radius:8px; margin:10px auto; width:fit-content; border:1px solid #ffeeba; }
.chat-draft-indicator { font-size:12px; color:var(--warning); font-style:italic; margin-top:4px; padding:6px 20px; background:#fff; border-top:1px solid var(--border); }

.chat-attachment { max-width:250px; max-height:250px; border-radius:8px; cursor:pointer; margin-bottom:6px; box-shadow:0 1px 3px rgba(0,0,0,0.15); display:block; }
.chat-date-header { text-align:center; margin:16px 0; }
.chat-date-header span { background:#e1f5fe; color:#0288d1; font-size:11px; font-weight:700; padding:4px 12px; border-radius:12px; text-transform:uppercase; letter-spacing:0.5px; }