/* Messenger layout; deliberately scoped to chat so transit and assistant stay independent. */
.chat-shell { --chat-blue:#3390ec; --chat-soft:#e8f3ff; --chat-canvas:#dce5dd; --chat-outgoing:#e3ffc9; color:var(--space-ink); }
.chat-shell > .mobile-chat-heading { display:none; }
.chat-shell > .member-panel { display:none; }
.chat-shell > .member-panel.members-open { display:flex;position:fixed;inset:0 auto 0 0;z-index:31;width:min(340px,calc(100% - 32px));height:100dvh;padding:28px 18px; }
.chat-shell .members-backdrop { display:block;position:fixed;inset:0;background:#0006;z-index:30;border:0; }
.chat-shell .members-close { display:block;align-self:flex-end;min-height:36px;min-width:36px;background:transparent;color:inherit;border:0;font-size:24px; }
.chat-shell .members-open :is(.brand div,.member-name,.member-heading span,.member-call-actions,.assistant-button span) { display:revert; }
.chat-shell .members-open .brand { justify-content:flex-start; }
.chat-shell .members-open .member-row { padding:9px 10px; }
.chat-shell .members-open .assistant-button { justify-content:flex-start; }
.chat-shell .members-open .account-button { display:flex;font-size:14px;justify-content:space-between; }
.chat-shell .advanced-messaging { width:100%;height:100%; }
.chat-shell .conversation-sidebar { display:flex;flex-direction:column;width:340px;flex:0 0 340px;padding:0;background:var(--space-surface);border-right:1px solid var(--space-border);overflow:hidden; }
.chat-shell .chats-heading { display:flex;align-items:center;gap:14px;padding:16px 16px 10px; }
.chat-shell .chats-heading h2 { flex:1;font:700 23px/1.3 system-ui;margin:0; }
.chat-shell .messenger-icon { border:0;border-radius:50%;width:44px;height:44px;font-size:25px;color:var(--space-muted);background:transparent; }
.chat-shell .messenger-icon:hover { background:var(--space-bg); }
.chat-shell .chat-list-search { display:flex;align-items:center;gap:10px;margin:0 16px 12px;padding:0 14px;background:var(--space-bg);border-radius:24px;color:var(--space-muted); }
.chat-shell .chat-list-search > span { font-size:26px; }
.chat-shell .chat-list-search input { width:100%;min-width:0;border:0;background:transparent;margin:0;padding:12px 0;font:inherit;box-shadow:none; }
.chat-shell .chat-folders { display:flex;gap:6px;padding:0 14px;border-bottom:1px solid var(--space-border); }
.chat-shell .chat-folders button { flex:1;position:relative;min-height:46px;padding:8px 4px;background:none;color:var(--space-muted);border:0;font-weight:650;font-size:13px; }
.chat-shell .chat-folders button.active { color:var(--chat-blue); }
.chat-shell .chat-folders button.active:after { content:'';position:absolute;bottom:0;left:8px;right:8px;height:3px;border-radius:3px;background:var(--chat-blue); }
.chat-shell .chat-folders button span { border-radius:10px;padding:1px 5px;background:var(--chat-blue);color:white; }
.chat-shell .conversation-tools { padding:6px 12px;justify-content:space-between;gap:4px; }
.chat-shell .conversation-tools button { border:0;background:transparent;padding:8px;color:var(--space-muted);font-size:12px;margin:0; }
.chat-shell .chat-list { flex:1;overflow:auto;min-height:0;padding:0 7px; }
.chat-shell .conversation-row { border:0;border-radius:10px;margin:2px 0;padding:12px 9px;gap:12px;min-height:80px;color:var(--space-ink); }
.chat-shell .conversation-row.selected { background:var(--chat-blue);color:white; }
.chat-shell .conversation-row:hover:not(.selected) { background:var(--space-bg); }
.chat-shell .conversation-row.selected :is(small,.conversation-time,em) { color:#fff; }
.chat-shell .conversation-row strong { font-size:15px;font-weight:650; }
.chat-shell .conversation-row small { font-size:13px;margin-top:6px; }
.chat-shell .conversation-row em { color:#d66b54;font-style:normal; }
.chat-shell .conversation-icon { width:50px;height:50px;flex:0 0 50px;border-radius:50%;background:linear-gradient(135deg,#79baf2,#3c8ed9);color:white;font:600 18px system-ui; }
.chat-shell .conversation-icon.group { background:linear-gradient(135deg,#b29de7,#8064bc); }
.chat-shell .conversation-icon.family { background:linear-gradient(135deg,#8acdbd,#4ca08a);font-size:29px; }
.chat-shell .conversation-time { align-self:flex-start;font-size:11px;white-space:nowrap;padding-top:4px; }
.chat-shell .unread-badge { background:var(--chat-blue);color:white;font-size:12px; }
.chat-shell .selected .unread-badge { background:white;color:#2379c4; }
.chat-shell .muted-indicator { color:inherit;opacity:.6;font-size:13px; }
.chat-shell .chat-list-empty { text-align:center;padding:50px 20px;color:var(--space-muted);font-size:14px; }
.chat-shell .chat-list-footer { display:flex;align-items:center;gap:8px;padding:12px 20px;font-size:11px;color:var(--space-muted);border-top:1px solid var(--space-border); }
.chat-shell .connection-dot { width:7px;height:7px;border-radius:50%;background:#da9855; }
.chat-shell .connection-dot.connected { background:#51ae7e; }
.chat-shell .advanced-conversation { background:var(--chat-canvas);background-image:radial-gradient(#73997a19 1px,transparent 1px);background-size:20px 20px; }
.chat-shell .advanced-conversation header { min-height:76px;padding:10px 20px;gap:8px;background:var(--space-surface); }
.chat-shell .advanced-conversation header > button { border:0;background:transparent;color:var(--space-muted);min-width:40px;min-height:42px;padding:8px; }
.chat-shell .advanced-conversation header .thread-identity { display:flex;align-items:center;gap:12px;text-align:left;flex:1;min-width:0;border-radius:10px;padding:0;color:var(--space-ink); }
.chat-shell .thread-identity > span:last-child { min-width:0; }
.chat-shell .thread-identity h1 { font:650 17px/1.5 system-ui; }
.chat-shell .thread-identity small { font-size:12px; }
.chat-shell .thread-identity .conversation-icon { width:44px;height:44px;flex-basis:44px; }
.chat-shell .header-call svg { width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:1.6; }
.chat-shell .message-search { display:none;background:var(--space-surface); }
.chat-shell .message-search.search-open { display:flex; }
.chat-shell .advanced-message-list { padding:16px max(24px,calc((100% - 800px)/2)); }
.chat-shell .message-day { display:flex;justify-content:center;margin:8px 0 18px; }
.chat-shell .message-day span { background:#69866d99;color:white;font:500 12px/1.5 system-ui;padding:4px 12px;border-radius:14px; }
.chat-shell .advanced-message { margin:7px 0;align-items:flex-end; }
.chat-shell .advanced-message .avatar { width:28px;height:28px;flex-basis:28px; }
.chat-shell .mine > .avatar { display:none; }
.chat-shell .message-bubble { position:relative;border-radius:14px 14px 14px 4px;background:var(--space-surface);box-shadow:0 1px 2px #0001;min-width:130px;max-width:82%;padding:8px 12px;color:var(--space-ink); }
.chat-shell .mine .message-bubble { background:var(--chat-outgoing);border-radius:14px 14px 4px 14px; }
.chat-shell .message-meta { display:flex;align-items:baseline;gap:20px;justify-content:space-between; }
.chat-shell .message-meta strong { color:#368693;font-size:12px; }
.chat-shell .mine .message-meta strong { display:none; }
.chat-shell .mine .message-meta { justify-content:flex-end; }
.chat-shell .message-bubble time { font-size:10px; }
.chat-shell .message-bubble p { margin:4px 0;line-height:1.5;font-size:14px; }
.chat-shell .receipt { font-size:10px; }
.chat-shell .message-actions { display:flex;justify-content:flex-end;margin:0; }
.chat-shell .message-actions summary { list-style:none;color:var(--space-muted);padding:0 4px;line-height:14px; }
.chat-shell .message-actions[open] > div { padding:8px; }
.chat-shell .reactions .reacted { border-color:var(--chat-blue);background:var(--chat-soft);color:#286da8; }
.chat-shell .system-message .message-bubble { background:#69866d99;box-shadow:none;color:white; }
.chat-shell .typing-status { padding:0 26px;min-height:22px;color:var(--space-ink);font-size:12px; }
.chat-shell .advanced-composer { margin:4px max(20px,calc((100% - 800px)/2)) 18px;gap:4px;align-items:flex-end;border:0;border-radius:16px;background:var(--space-surface);box-shadow:0 1px 3px #0001;padding:7px; }
.chat-shell .advanced-composer textarea { min-height:44px;max-height:160px;padding:12px 6px;font-size:15px;line-height:20px; }
.chat-shell .advanced-composer button { background:transparent;color:var(--space-muted);border-radius:50%; }
.chat-shell .advanced-composer .send-button { background:var(--chat-blue);color:white;font-size:24px; }
.chat-shell .upload-tray:has(>input:only-child) { display:none; }
.chat-shell .compose-mode,.chat-shell .upload-tray,.chat-shell .recording-tray { background:var(--space-surface);color:var(--space-ink); }
.chat-shell .latest-jump { position:absolute;right:20px;bottom:110px;width:44px;height:44px;border:0;border-radius:50%;background:var(--space-surface);color:var(--chat-blue);box-shadow:0 2px 8px #0002;font-size:25px; }
.chat-shell .latest-jump[hidden] { display:none; }
:root[data-theme="dark"] .chat-shell { --chat-blue:#519ce0;--chat-soft:#254563;--chat-canvas:#111c27;--chat-outgoing:#294d69; }
:root[data-theme="dark"] .chat-shell .chat-list-search input { background:transparent; }
:root[data-theme="dark"] .chat-shell .message-bubble { background:var(--space-surface); }
:root[data-theme="dark"] .chat-shell .mine .message-bubble { background:var(--chat-outgoing); }
:root[data-theme="dark"] .chat-shell .advanced-composer button:not(.send-button) { background:transparent; }
@media (max-width:1000px) and (min-width:741px) { .chat-shell .conversation-sidebar { width:290px;flex-basis:290px; } }
@media (max-width:740px) {
 .chat-shell .advanced-messaging { height:auto;min-height:0;flex:1; }
 .chat-shell .conversation-sidebar { width:100%;flex:1;border:0; }
 .chat-shell .conversation-open .conversation-sidebar { display:none; }
 .chat-shell .advanced-conversation header { padding:8px;min-height:66px;gap:2px; }
 .chat-shell .advanced-conversation header > button { min-width:36px;padding:6px; }
 .chat-shell .thread-identity .conversation-icon { display:none; }
 .chat-shell .thread-identity h1 { font-size:16px; }
 .chat-shell .advanced-message-list { padding:10px; }
 .chat-shell .message-bubble { max-width:88%; }
 .chat-shell .advanced-composer { margin:4px 8px 10px; }
 .chat-shell .advanced-composer textarea { font-size:16px; }
 .chat-shell .advanced-composer button { min-width:40px; }
 .chat-shell .latest-jump { right:12px;bottom:100px; }
 .chat-shell .members-open .brand div { display:block; }
}
.chat-shell .mobile-search-toggle { display:inline-flex;align-items:center;justify-content:center; }
.chat-shell .message-actions { display:block;text-align:right; }
.chat-shell .message-actions:not([open]) > div { display:none; }
.chat-shell .message-actions[open] > div { text-align:left; }
.chat-shell .thread-loading { padding:5px 16px;background:var(--space-surface);font-size:12px;color:var(--space-muted); }
@media (max-width:740px) {
 .chat-shell .advanced-messaging { height:0;flex:1 1 0; }
 .chat-shell .conversation-sidebar { min-height:0; }
}
:root[data-theme="dark"] .chat-shell .chat-list-search input:not([type="checkbox"]):not([type="radio"]):not([type="color"]) { background-color:transparent; }
.chat-shell .thread-picture { flex:0 0 44px;width:44px;height:44px;overflow:hidden;border-radius:50%; }
.chat-shell .thread-picture .attachment-card { margin:0; }
.chat-shell .thread-picture .attachment-card img { display:block;width:44px;height:44px;max-height:none;object-fit:cover;border-radius:50%; }
.chat-shell .thread-picture .attachment-card button { width:44px;height:44px;overflow:hidden;font-size:10px;padding:2px; }
/* Alerts remain available outside the messenger and above mobile navigation. */
.chat-notification-toast { position:fixed; z-index:1400; top:calc(16px + env(safe-area-inset-top)); right:16px; display:flex; align-items:center; width:min(400px,calc(100vw - 32px)); background:var(--space-surface); color:var(--space-ink); border:1px solid var(--space-border); border-radius:18px; box-shadow:var(--space-shadow-lg); padding:8px; }
.chat-notification-toast>a { display:flex; align-items:center; gap:12px; flex:1; min-width:0; padding:8px; text-decoration:none; color:inherit; }
.chat-notification-toast>a>span:last-child { min-width:0; }
.chat-notification-toast strong,.chat-notification-toast small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chat-notification-toast small { color:var(--space-muted); margin-top:4px; }
.chat-notification-icon { display:grid; place-items:center; width:42px; height:42px; border-radius:14px; color:var(--space-accent); background:var(--space-soft); flex-shrink:0; }
.chat-notification-toast>button { border:0; background:transparent; padding:8px; min-width:44px; }
[data-chat-link] { position:relative; }
.chat-unread-badge { position:absolute; top:2px; right:8px; display:grid; place-items:center; min-width:18px; height:18px; padding:0 4px; border-radius:12px; background:var(--space-error); color:var(--space-on-accent); font-size:10px; line-height:1; }
.chat-unread-badge[hidden] { display:none; }
.chat-notification-settings { padding:20px; border:1px solid var(--space-border); border-radius:18px; background:var(--space-surface); margin:24px 0; scroll-margin-top:80px; }
.chat-notification-settings h3 { display:flex; align-items:center; gap:8px; }
.chat-notification-settings p,.chat-notification-settings>small { color:var(--space-muted); font-size:13px; line-height:1.6; }
.chat-notification-settings>small { display:block; margin-top:12px; }
.chat-notification-settings label { display:flex; align-items:center; gap:10px; margin:16px 0; }
.chat-notification-link { display:flex; align-items:center; gap:8px; padding:8px 20px; min-height:44px; font-size:12px; text-decoration:none; }
.my-nickname { display:flex; align-items:center; justify-content:space-between; gap:4px; color:var(--space-muted); }
.my-nickname small { min-width:0; overflow-wrap:anywhere; }
.contacts-empty { font-size:12px; color:var(--space-muted); padding:8px 0; }
.remove-contact-button { border:0; background:transparent; padding:6px; min-width:32px; color:var(--space-muted); }
.remove-contact-button .app-icon { width:16px; height:16px; }
.contact-picker p { font-size:13px; color:var(--space-muted); line-height:1.5; }
.contact-picker form { display:flex; gap:8px; align-items:end; }
.contact-picker label { flex:1; min-width:0; margin-top:8px; }
.contact-picker form button { flex-shrink:0; }
.contact-search-result { display:flex; gap:12px; flex-wrap:wrap; align-items:center; padding:16px 0; }
.contact-search-result>span { flex:1; min-width:0; }
.contact-search-result strong,.contact-search-result small { display:block; overflow-wrap:anywhere; }
.contact-search-result .primary-button { margin-top:0; }