/* NEXO chat: compact conversation layout, inspired by familiar mobile messengers. */
.chat-workspace{border:1px solid #e3e9e7;border-radius:20px;box-shadow:0 14px 45px #244b3b08;grid-template-columns:290px minmax(0,1fr)}
.chat-directory{background:#fff;padding:23px 14px}.chat-directory>b{font-size:17px;font-weight:700;color:#263c34}.chat-directory>input{background:#f3f5f4;border-radius:24px;border:0;padding:12px 17px}.contact-row{padding:16px 11px;border-radius:12px;gap:12px}.contact-row[aria-current],.contact-row:hover{background:#eaf7ef}.contact-row i,.conversation-heading i{border-radius:50%;background:#ddefe5;color:#41785d;font-size:21px;width:46px;height:46px}.contact-copy b{color:#253a31;font-size:15px}.contact-copy small{margin-top:3px;color:#8a948e;font-size:12px}.unread-count{background:#06b955}.conversation-pane{background:#dfe9ed;background-image:radial-gradient(ellipse at top right,#eaf0f2,transparent 65%)}
.conversation-heading{background:#fcfefd;min-height:76px;padding:15px 23px;border-bottom:1px solid #dbe4df;gap:12px}.conversation-heading b{font-size:17px;color:#213b2e}.conversation-heading small{color:#819088;font-size:11px;margin-top:2px}.conversation-pane #messages{padding:24px 28px;gap:20px}.bubble{background:white;color:#233930;border:0;border-radius:17px 17px 17px 4px;box-shadow:0 2px 3px #304d4208;max-width:78%;font-size:15px;line-height:1.7;padding:12px 16px}.bubble.mine{background:#a9ec87;color:#173b20;border:0;border-radius:17px 17px 4px 17px}.bubble small,.bubble.mine small{color:#526c5c;font-size:10px;opacity:1}.bubble:has(.message-image),.bubble:has(.preview-photo){padding:5px;background:transparent;box-shadow:none}.bubble:has(.message-image)>small,.bubble:has(.preview-photo)>small{padding:4px 5px}.bubble .message-image,.preview-photo{border-radius:15px;max-height:390px}.message-attachment{color:inherit;font-weight:600}.message-composer,.preview-compose{background:#fff;border-top:1px solid #dce5df;padding:12px 18px 4px;gap:10px;align-items:center}.message-composer textarea,.preview-compose input{background:#f2f5f3;border:1px solid #e8ede9;border-radius:24px;padding:12px 17px;min-height:46px;font-size:15px}.message-composer button,.preview-compose button{background:#06ad50;color:#fff;border:0;border-radius:50%;width:46px;height:46px;min-width:46px;min-height:46px;padding:0;font-size:14px}.message-composer button:hover{background:#079844}.composer-hint{background:#fff;color:#89958d;font-size:10px;padding:3px 22px 12px}.message-composer .attach-control{color:#728579;font-size:10px}.attach-control input::file-selector-button{background:#edf6ef;color:#31804c;border:0;border-radius:18px}.preview-toolbar{display:flex;gap:8px;margin-left:auto}.preview-toolbar button{background:transparent;color:#426451;border:0;border-radius:50%;width:40px;height:40px;min-height:40px;padding:8px;opacity:1}.preview-toolbar svg{width:23px;height:23px;display:block}.preview-compose button:disabled{opacity:1;background:#06ad50;color:#fff}.preview-compose button:first-child{background:transparent;color:#5b7967;font-size:30px}.preview-compose input:disabled{opacity:1}.chat-welcome::before{background:#d1efdd;color:#33945b;box-shadow:none;transform:none;border-radius:28px}.chat-welcome h2{color:#39584a}.chat-welcome p{color:#799087}.chat-back{color:#42805e}
.call-toolbar{background:#fff;border:1px solid #e4eae6;border-radius:14px;padding:10px 14px}.call-toolbar button{background:#eaf7ef;color:#248448;border:0}.call-toolbar button svg{width:20px;height:20px}.call-panel>p{margin:7px 0;font-size:11px;color:#78897e}.call-info{font-size:11px;color:#77897d}
@media(max-width:900px){.chat-workspace{grid-template-columns:230px minmax(0,1fr)}}
@media(max-width:650px){.chat-workspace{display:block;border-radius:16px}.conversation-heading{min-height:69px;padding:12px 14px}.conversation-heading i{height:39px;width:39px;font-size:18px}.conversation-heading b{font-size:16px}.conversation-pane #messages{padding:20px 14px;gap:18px}.bubble{max-width:85%;font-size:15px;padding:11px 14px}.bubble .message-image,.preview-photo{max-height:310px}.message-composer{padding:9px 11px 3px;gap:7px}.message-composer textarea{flex:1 1 calc(100% - 60px);font-size:16px;order:1}.message-composer button{order:2;width:42px;height:42px;min-width:42px;min-height:42px}.message-composer .attach-control{order:3;flex-basis:100%;max-width:100%;display:flex;align-items:center;gap:8px}.message-composer .attach-control input{width:auto;min-height:28px;font-size:10px}.attach-control input::file-selector-button{min-height:27px;padding:5px 10px}.composer-hint{padding-bottom:max(8px,env(safe-area-inset-bottom))}.preview-compose{padding:10px}.preview-compose input{font-size:16px}.preview-toolbar button{width:34px;height:34px;padding:5px}.chat-directory{padding:20px 12px}}
/* Reference layout: integrated circular call actions and compact mobile dock. */
.conversation-pane{background:linear-gradient(170deg,#fbdce8 0%,#f1b5cb 35%,#dab5c9 65%,#f4b6cc 100%)}
.conversation-heading{background:#fff4f8e8;flex-shrink:0;gap:10px}.conversation-heading>i{flex-shrink:0;background:#f5d6e5;color:#75445e}.conversation-heading>div:not(.call-toolbar):not(.preview-toolbar){min-width:0;flex:1}.conversation-heading b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.conversation-heading small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.conversation-heading .call-toolbar,.preview-toolbar{display:flex;flex:0 0 auto;gap:8px;margin:0 0 0 auto;padding:0;background:none;border:0}.conversation-heading .call-toolbar button,.preview-toolbar button{display:grid;place-items:center;width:44px;height:44px;min-width:44px;min-height:44px;border:1px solid #d8bbc9;border-radius:50%;padding:10px;background:#fff5fa99;color:#392b35;box-shadow:none}.conversation-heading .call-toolbar svg,.preview-toolbar svg{width:23px;height:23px}.call-toolbar [hidden]{display:none!important}.call-panel-integrated{padding:0!important;border:0!important;background:transparent!important;margin:0 0 8px!important}.call-panel-integrated>p,.call-panel-integrated .call-info{font-size:11px;margin:4px 0}
.bubble{background:#ffdeeb;color:#2b2430;border-radius:22px 22px 22px 7px}.bubble.mine{background:#242326;color:#fff;border-radius:22px 22px 7px 22px}.bubble.mine small{color:#d6ced4}.bubble:has(.message-image),.bubble:has(.preview-photo){background:transparent}.bubble:has(.message-image) small,.bubble:has(.preview-photo) small{color:#594551}
.message-composer,.preview-compose,.composer-hint{background:#ffd2e3}.message-composer textarea,.preview-compose input{min-width:0;background:#ffe6ef;border:0}.message-composer button,.preview-compose button:disabled{background:#30232c;color:#fff}.preview-compose button:first-child{background:transparent;color:#30232c}
@media(max-width:650px){.chat-page .shell,.chat-page main{min-width:0;max-width:100%;width:auto}.chat-workspace{max-width:100%;min-width:0}.conversation-heading{padding:10px;gap:7px}.conversation-heading>i{width:34px;height:34px;min-width:34px}.conversation-heading b{font-size:14px}.conversation-heading small{font-size:10px;max-width:100%}.conversation-heading .call-toolbar,.preview-toolbar{gap:5px}.conversation-heading .call-toolbar button,.preview-toolbar button{width:38px;height:38px;min-width:38px;min-height:38px;padding:8px}.chat-back{flex:0 0 28px;padding:0;text-align:center}.conversation-pane #messages{padding:15px 10px;gap:14px}.bubble{max-width:85%;overflow-wrap:anywhere}.message-image,.preview-photo{max-width:100%!important;height:auto}.message-composer{display:grid!important;grid-template-columns:minmax(0,1fr) 42px}.message-composer textarea{width:100%;grid-column:1;grid-row:1}.message-composer button{grid-column:2;grid-row:1}.message-composer .attach-control{grid-column:1 / -1;grid-row:2;min-width:0;overflow:hidden}.message-composer .attach-control input{min-width:0;max-width:100%}.preview-compose{display:flex;gap:6px}.preview-compose input{width:0;flex:1}.preview-compose button{flex:0 0 38px;width:38px;min-width:38px;height:38px;min-height:38px}.preview-main{padding:12px!important}.preview-toolbar{flex-shrink:0}}
/* User-selected wallpaper keeps the default neutral. */
.conversation-pane{background:var(--chat-wallpaper,#eef1f5);background-size:cover;background-position:center}.conversation-heading{background:#ffffffed}.conversation-heading>i{background:#ede9fb;color:#6352a0}.bubble{background:#fff;color:#282632}.bubble.mine{background:#ded7ff;color:#312756}.bubble.mine small{color:#655b80}.message-composer,.preview-compose,.composer-hint{background:#ffffffed}.message-composer textarea,.preview-compose input{background:#f0f1f6}.message-composer button,.preview-compose button:disabled{background:#7460d5}.chat-theme{position:relative;flex-shrink:0;background:#ffffffed;padding:5px 12px;font-size:12px}.chat-theme summary{cursor:pointer;color:#655384;width:max-content}.chat-theme-options{display:flex;flex-wrap:wrap;gap:9px;align-items:center;padding:10px 0}.chat-theme-options button{padding:7px 12px;min-height:36px;font-size:12px;border-radius:18px}.chat-theme-options input[type=file]{max-width:100%;width:210px;font-size:12px}.chat-theme-options label{display:flex;align-items:center;gap:7px}.chat-theme-note{font-size:11px;margin:3px 0;color:#716b7c}.chat-theme [role=status]{font-size:12px}
.call-toolbar[hidden]{display:none!important}
/* Keep the conversation page free of extra headings and idle call notices. */
.chat-page .heading{display:none}.chat-page #call-panel{padding:0!important;margin:0!important;border:0!important;background:none!important}.chat-page #call-panel>.call-info{display:none}.chat-page #call-status:empty{display:none}.chat-page #call-status:not(:empty){padding:8px 12px;margin:0 0 8px;border-radius:10px;background:#fff4dc;color:#704d18}.chat-page .chat-workspace{height:calc(100dvh - 160px)}
@media(max-width:650px){.chat-page .chat-workspace{height:calc(100dvh - 155px);min-height:320px}.chat-page .shell{margin-top:4px}}
/* Remove the obsolete recipient dropdown and own-account label from chat. */
#call-target{display:none!important}
body:has(.chat-workspace)>header{display:none}
body:has(.chat-workspace) .sidebar .side-note{display:none}
body:has(.chat-workspace) .shell{margin-top:12px}
body:has(.chat-workspace) .chat-workspace{height:calc(100dvh - 40px)}
@media(max-width:650px){body:has(.chat-workspace) .chat-workspace{height:calc(100dvh - 92px)}}
/* Fit the composer within the visible viewport, including mobile keyboards. */
.preview-wrap>.heading{display:none}.preview-wrap{margin:12px auto}.preview-wrap>.preview-label{font-size:11px;margin:0 0 8px}.conversation-heading{flex-wrap:nowrap}.message-composer,.preview-compose,.composer-hint{flex-shrink:0}.chat-workspace{min-height:0!important}.conversation-pane .chat-theme[open]{max-height:35%;overflow:auto}.conversation-pane #messages{overflow-y:auto}.preview-compose{padding-bottom:max(10px,env(safe-area-inset-bottom))}
/* The app owns the viewport; only the message list scrolls. */
body.nexo-chat-layout{height:var(--chat-app-height,100dvh);min-height:0;overflow:hidden;overscroll-behavior:none}
body.nexo-chat-layout .shell,body.nexo-chat-layout .preview-wrap{height:100%;max-height:100%;min-height:0;margin:0 auto!important;padding:12px 18px;box-sizing:border-box}
body.nexo-chat-layout .shell{grid-template-rows:minmax(0,1fr)}
body.nexo-chat-layout .shell>main,body.nexo-chat-layout .preview-wrap{display:flex;flex-direction:column;min-height:0;min-width:0}
body.nexo-chat-layout .chat-workspace{height:auto!important;max-height:none!important;min-height:0!important;flex:1 1 0}
body.nexo-chat-layout .conversation-pane{overflow:hidden}.conversation-pane #messages{overscroll-behavior:contain;overflow-anchor:none;scroll-behavior:auto}
body.nexo-chat-layout .sidebar{position:static;overflow:auto}
@media(max-width:650px){body.nexo-chat-layout .shell{display:flex;flex-direction:column;padding:0;gap:0}body.nexo-chat-layout .shell>main{order:1;flex:1 1 0;width:100%;min-height:0}body.nexo-chat-layout .shell>.sidebar{order:2;flex:0 0 auto}body.nexo-chat-layout .sidebar nav{position:static;inset:auto;padding:5px 4px max(5px,env(safe-area-inset-bottom));gap:2px}body.nexo-chat-layout .sidebar nav a{flex:1;min-width:0;min-height:44px;font-size:10px;padding:3px 2px}body.nexo-chat-layout.nexo-keyboard-open .sidebar{display:none}body.nexo-chat-layout .preview-wrap{padding:8px}body.nexo-chat-layout .chat-workspace{border-radius:0;border:0}.message-composer textarea{max-height:80px}.composer-hint{display:none}.chat-theme{padding:4px 10px}}
.call-record{display:flex;flex-direction:column;gap:4px;min-width:170px;max-width:85%;border:1px solid #e4dfef;box-shadow:none}.call-record b{font-size:14px;color:inherit}.call-record>span{font-size:13px}.call-record small{font-size:10px}.call-record.mine{border-color:#c9bee9}
.chat-directory-actions{display:flex;gap:8px;margin-top:10px}.chat-directory-actions a{flex:1;min-width:0;text-align:center;background:#f0edf9;border-radius:10px;padding:9px 7px;font-size:12px;color:#6550aa}.chat-section-label{font-size:13px;margin:18px 10px 6px;color:#7c718d}.group-empty-note{font-size:12px;line-height:1.7;color:#82798b;padding:0 10px}.group-empty-note a{color:#6450aa}
