/* Evolution Chat — estilos isolados do restante do portal */
.chat-app{--chat-ink:#172b4d;--chat-muted:#718198;--chat-line:#e8edf3;--chat-accent:#175cd3;--chat-soft:#f5f8fc;display:grid;grid-template-columns:320px minmax(0,1fr);height:min(780px,calc(100vh - 190px));min-height:560px;background:#fff;border:1px solid #e5eaf1;border-radius:18px;overflow:hidden;box-shadow:0 16px 46px #122b4c12;color:var(--chat-ink);font-family:Arial,Helvetica,sans-serif}
.chat-app *{box-sizing:border-box}.chat-sidebar{display:flex;flex-direction:column;min-height:0;background:#fbfcfe;border-right:1px solid var(--chat-line)}.chat-brand{height:76px;padding:0 20px;display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--chat-line)}.chat-brand-mark{width:39px;height:39px;border-radius:12px;display:grid;place-items:center;background:#eaf2ff;color:#175cd3;font-size:18px}.chat-brand strong,.chat-brand small,.chat-user-card strong,.chat-user-card small{display:block}.chat-brand strong{font-size:15px;letter-spacing:-.2px}.chat-brand small{font-size:11px;color:var(--chat-muted);margin-top:3px}.chat-sidebar-actions{display:flex;gap:9px;padding:17px 17px 14px}.chat-new-button,.chat-primary,.chat-secondary{border:0;border-radius:9px;min-height:40px;padding:0 15px;cursor:pointer;font-weight:700;font-size:13px;transition:background .16s,transform .16s}.chat-new-button,.chat-primary{background:#175cd3;color:#fff;box-shadow:0 3px 8px #175cd326}.chat-new-button{flex:1}.chat-new-button i,.chat-primary i{margin-right:6px}.chat-new-button:hover,.chat-primary:hover{background:#124ba9;transform:translateY(-1px)}.chat-secondary{background:#edf1f6;color:#334660}.chat-secondary:hover{background:#e1e7ef}.chat-icon-button{border:1px solid var(--chat-line);background:#fff;color:#5e6f86;border-radius:9px;width:40px;min-width:40px;height:40px;cursor:pointer}.chat-icon-button:hover{background:#eff4fa;color:#175cd3}.chat-search,.chat-modal-search{display:flex;align-items:center;gap:9px;margin:0 17px 17px;padding:0 12px;height:39px;border:1px solid #e4e9ef;border-radius:9px;background:#fff;color:#8795a9}.chat-search input,.chat-modal-search input{border:0;outline:0;min-width:0;width:100%;background:transparent;color:var(--chat-ink);font-size:12px}.chat-search:focus-within,.chat-modal-search:focus-within{border-color:#86a9e8;box-shadow:0 0 0 3px #175cd315}.chat-section-heading,.chat-colleague-heading{height:30px;padding:0 19px;display:flex;align-items:center;justify-content:space-between;color:#8a97a9;font-size:10px;font-weight:800;letter-spacing:1px}.chat-section-heading button{border:0;background:transparent;color:#66788f;font-size:13px;cursor:pointer}.chat-room-list,.chat-colleague-list{overflow:auto}.chat-room-list{max-height:40%;min-height:85px;padding:0 8px}.chat-room-item,.chat-person-item{width:100%;display:flex;align-items:center;text-align:left;gap:10px;border:0;background:transparent;cursor:pointer;color:var(--chat-ink)}.chat-room-item{padding:10px;border-radius:10px;min-height:66px}.chat-room-item:hover,.chat-person-item:hover{background:#f0f4f9}.chat-room-item.active{background:#eaf2ff}.chat-room-copy{min-width:0;flex:1}.chat-room-copy strong,.chat-room-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-room-copy strong{font-size:12px;font-weight:700;margin-bottom:5px}.chat-room-copy small{font-size:11px;color:var(--chat-muted)}.chat-room-item time{font-size:9px;color:#8c9aad;align-self:flex-start;margin-top:4px}.chat-avatar{width:38px;height:38px;min-width:38px;display:inline-grid;place-items:center;border-radius:50%;object-fit:cover;background:#e8eff8;color:#315785;font-size:12px;font-weight:800}.chat-avatar.small{width:30px;height:30px;min-width:30px;font-size:10px}.chat-avatar.profile-large{width:74px;height:74px;min-width:74px;margin:0 auto 10px;font-size:20px}.chat-avatar-group{background:#e9efff;color:#496ac1;border-radius:13px}.chat-colleague-heading{margin-top:9px}.chat-colleague-list{padding:3px 9px 8px;max-height:190px}.chat-person-item{padding:7px 9px;border-radius:9px;font-size:11px}.chat-person-item span:nth-child(2){overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.chat-online-dot{font-size:8px;color:#2ca878}.chat-user-card{margin-top:auto;border-top:1px solid var(--chat-line);padding:12px 15px;display:flex;align-items:center;gap:9px;min-height:66px}.chat-user-card .chat-avatar{width:34px;height:34px;min-width:34px}.chat-user-card>span:nth-child(2){min-width:0;flex:1}.chat-user-card strong{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-user-card small{font-size:9px;color:var(--chat-muted);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-user-card button{border:0;background:transparent;color:#8491a2;cursor:pointer}.chat-main{min-width:0;display:flex;flex-direction:column;background:#fff}.chat-toolbar{height:76px;border-bottom:1px solid var(--chat-line);display:flex;align-items:center;justify-content:space-between;padding:0 24px;color:var(--chat-muted);font-size:12px}.chat-room-heading{display:flex;align-items:center;gap:11px}.chat-room-heading>span:last-child strong,.chat-room-heading>span:last-child small{display:block}.chat-room-heading strong{font-size:14px;color:var(--chat-ink)}.chat-room-heading small{font-size:10px;color:var(--chat-muted);margin-top:4px}.chat-admin-toggle{border:1px solid #e5eaf1;background:#fff;color:#536982;border-radius:8px;height:35px;padding:0 11px;font-size:11px;font-weight:700;cursor:pointer}.chat-admin-toggle i{margin-right:5px;color:#536fc2}.chat-admin-toggle:hover{background:#f6f8fb}.chat-content{flex:1;min-height:0;display:flex;flex-direction:column}.chat-welcome,.chat-error{margin:auto;text-align:center;max-width:430px;padding:35px}.chat-welcome-icon{width:74px;height:74px;margin:0 auto 20px;display:grid;place-items:center;border-radius:23px;color:#3871d7;background:#edf4ff;font-size:28px}.chat-welcome h2,.chat-error h2{font-size:22px;margin:0 0 10px;letter-spacing:-.5px}.chat-welcome p,.chat-error p{font-size:13px;color:var(--chat-muted);line-height:1.7;margin:0 0 22px}.chat-error>i{font-size:28px;color:#d26464;margin-bottom:16px}.chat-messages{flex:1;overflow:auto;padding:26px 8% 22px;scroll-behavior:smooth}.chat-message{display:flex;gap:9px;align-items:flex-end;margin:0 0 15px}.chat-message.mine{justify-content:flex-end}.chat-bubble-wrap{max-width:min(72%,600px)}.chat-message-author{font-size:10px;color:#75849a;margin:0 0 5px 3px}.chat-bubble{position:relative;background:#f1f4f8;padding:11px 13px 22px;border-radius:4px 13px 13px 13px;font-size:13px;line-height:1.55;overflow-wrap:anywhere;white-space:normal}.chat-message.mine .chat-bubble{background:#e9f1ff;border-radius:13px 4px 13px 13px}.chat-bubble time{position:absolute;right:9px;bottom:5px;color:#8693a5;font-size:9px}.chat-first-message{height:100%;min-height:140px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#718198;text-align:center;gap:8px}.chat-first-message>span{width:52px;height:52px;border-radius:17px;display:grid;place-items:center;background:#f0f5fc;color:#527cc1;font-size:20px}.chat-first-message strong{font-size:13px;color:#435873}.chat-first-message small{font-size:11px}.chat-composer{position:relative;margin:0 7% 17px;border:1px solid #dfe6ef;border-radius:13px;background:#fff;box-shadow:0 4px 16px #142f5010}.chat-composer:focus-within{border-color:#9cb9eb;box-shadow:0 0 0 3px #175cd311}.chat-composer-row{display:flex;align-items:flex-end;gap:7px;padding:9px 10px}.chat-composer-tool,.chat-send-button{width:37px;height:37px;min-width:37px;border:0;border-radius:9px;display:grid;place-items:center;cursor:pointer}.chat-composer-tool{background:transparent;color:#718198;font-size:17px}.chat-composer-tool:hover{background:#f3f6fa;color:#175cd3}.chat-composer textarea{flex:1;resize:none;min-height:37px;max-height:130px;border:0;outline:0;padding:10px 5px 7px;font:13px Arial,sans-serif;color:var(--chat-ink)}.chat-send-button{background:#175cd3;color:#fff}.chat-send-button:disabled{opacity:.55;cursor:wait}.chat-compose-note{border-top:1px solid #f0f2f5;padding:7px 13px;color:#8895a7;font-size:9px}.chat-compose-note i{color:#7390bf;margin-right:4px}.chat-emoji-picker{position:absolute;bottom:100%;left:10px;max-width:270px;padding:9px;display:flex;flex-wrap:wrap;gap:3px;background:#fff;border:1px solid var(--chat-line);border-radius:12px;box-shadow:0 8px 28px #19345622}.chat-emoji-picker[hidden]{display:none}.chat-emoji-picker button{border:0;background:transparent;border-radius:7px;padding:6px;font-size:20px;cursor:pointer}.chat-emoji-picker button:hover{background:#f1f4f8}.chat-loading,.chat-empty-list{padding:15px;color:#8a97a9;font-size:11px;text-align:center}.chat-modal-backdrop{position:fixed;z-index:10001;inset:0;background:#101c2d85;display:grid;place-items:center;padding:20px;backdrop-filter:blur(3px)}.chat-modal{width:min(510px,100%);max-height:min(86vh,760px);overflow:auto;background:#fff;border-radius:16px;padding:20px 22px;box-shadow:0 22px 70px #06112444}.chat-modal header{display:flex;align-items:center;justify-content:space-between;margin-bottom:17px}.chat-modal header h2{font-size:18px;margin:0;color:var(--chat-ink)}.chat-modal form>label,.chat-profile-form>label{display:block;margin:0 0 14px;color:#4d5e74;font-size:11px;font-weight:700}.chat-modal form>label input:not([type=file]),.chat-modal form>label select{display:block;width:100%;height:41px;margin-top:7px;border:1px solid #dfe5ed;border-radius:8px;padding:0 10px;background:#fff;color:var(--chat-ink);font-size:12px;outline:none}.chat-modal input:focus,.chat-modal select:focus{border-color:#87a9e4;box-shadow:0 0 0 3px #175cd312}.chat-modal fieldset{border:1px solid #e3e8ef;border-radius:10px;padding:11px 12px}.chat-modal legend{padding:0 5px;color:#4d5e74;font-size:11px;font-weight:700}.chat-member-picker{display:grid;grid-template-columns:1fr 1fr;gap:2px;max-height:180px;overflow:auto}.chat-member-picker label{display:flex;align-items:center;gap:7px;padding:7px 3px;min-width:0;font-size:10px;color:#53657c;cursor:pointer}.chat-member-picker label span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-member-picker input{accent-color:#175cd3}.chat-member-picker .chat-avatar{width:27px;height:27px;min-width:27px;font-size:8px}.chat-form-note,.chat-modal form small{font-size:10px;color:#8995a5}.chat-modal footer{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}.chat-modal footer button{min-height:37px}.chat-modal-search{margin:0 0 9px}.chat-direct-list{max-height:360px;overflow:auto}.chat-direct-list>button{width:100%;display:flex;align-items:center;gap:10px;padding:10px 5px;border:0;border-bottom:1px solid #f0f2f5;background:#fff;text-align:left;cursor:pointer;color:var(--chat-ink)}.chat-direct-list>button:hover{background:#f6f8fb}.chat-direct-list>button>span:nth-child(2){flex:1}.chat-direct-list strong,.chat-direct-list small{display:block}.chat-direct-list strong{font-size:12px}.chat-direct-list small{font-size:10px;color:#8592a4;margin-top:4px}.chat-direct-list>button>i{color:#9aa5b3;font-size:10px}.chat-modal #chatProfileForm>.chat-avatar{display:grid}.chat-modal input[type=file]{display:block;margin:8px 0;font-weight:400}.chat-toast{position:fixed;z-index:10002;right:25px;bottom:25px;max-width:min(450px,calc(100vw - 35px));padding:14px 17px;border-radius:11px;background:#28364a;color:#fff;box-shadow:0 8px 28px #111a2b38;font:12px/1.5 Arial,sans-serif}.chat-monitor{height:100%;overflow:auto;padding:26px;display:grid;grid-template-columns:minmax(240px,.9fr) minmax(280px,1.1fr);gap:18px;background:#f8fafd}.chat-monitor>section{align-self:start;background:#fff;border:1px solid var(--chat-line);border-radius:13px;padding:18px}.chat-monitor-heading{display:flex;align-items:center;justify-content:space-between;padding-bottom:13px;border-bottom:1px solid #edf0f4}.chat-monitor-heading>div>span,.chat-admin-transcript-head>div>span{font-size:9px;color:#8492a5;font-weight:800;letter-spacing:1px}.chat-monitor-heading h2,.chat-admin-transcript h2{font-size:16px;margin:5px 0 0}.chat-count{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:#edf3ff;color:#2762c5;font-size:11px;font-weight:800}.chat-monitor-note{color:#7c899a;font-size:10px;line-height:1.5}.chat-monitor-room-list,.chat-log-list{max-height:460px;overflow:auto}.chat-monitor-room{width:100%;display:flex;align-items:center;gap:9px;padding:10px 0;border:0;border-bottom:1px solid #f0f2f5;background:#fff;text-align:left;cursor:pointer;color:#64758c}.chat-monitor-room>span{flex:1;min-width:0}.chat-monitor-room strong,.chat-monitor-room small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-monitor-room strong{font-size:11px;color:#344961}.chat-monitor-room small{font-size:9px;margin-top:4px}.chat-monitor-room>i:last-child{font-size:9px}.chat-log-item{padding:12px 0;border-bottom:1px solid #edf0f4}.chat-log-category{display:inline-block;padding:4px 7px;background:#fff2eb;color:#b55832;border-radius:6px;font-size:9px;font-weight:700;text-transform:capitalize}.chat-log-item p{font-size:12px;color:#33455c;line-height:1.5;margin:8px 0}.chat-log-item small{font-size:9px;color:#8995a5}.chat-monitor-empty{min-height:170px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#7e8ca0;text-align:center}.chat-monitor-empty i{font-size:23px;color:#40a47b}.chat-monitor-empty strong{font-size:12px;color:#4b5f78}.chat-monitor-empty span{font-size:10px}.chat-admin-transcript{height:100%;overflow:auto;padding:22px 7%}.chat-admin-transcript-head{display:flex;justify-content:space-between;align-items:center;padding-bottom:14px;border-bottom:1px solid var(--chat-line)}.chat-admin-transcript-head button{font-size:10px}.chat-admin-messages{max-width:680px;margin:8px auto}.chat-admin-messages article{display:flex;gap:10px;padding:12px 0;border-bottom:1px solid #f0f2f5}.chat-admin-messages article>div{min-width:0}.chat-admin-messages strong{font-size:10px}.chat-admin-messages p{font-size:12px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere;margin:5px 0;color:#344961}.chat-admin-messages time{font-size:9px;color:#8793a3}
@media(max-width:900px){.chat-app{grid-template-columns:270px minmax(0,1fr)}.chat-monitor{grid-template-columns:1fr}.chat-monitor>section{min-width:0}}
@media(max-width:650px){.chat-app{height:calc(100vh - 145px);min-height:540px;grid-template-columns:92px minmax(0,1fr);border-radius:12px}.chat-brand{justify-content:center;padding:0}.chat-brand>div,.chat-sidebar-actions .chat-new-button,.chat-search,.chat-section-heading,.chat-colleague-heading,.chat-room-copy,.chat-room-item time,.chat-person-item>span:nth-child(2),.chat-online-dot,.chat-user-card>span:nth-child(2),.chat-user-card>button{display:none}.chat-sidebar-actions{padding:12px 9px;flex-direction:column;align-items:center}.chat-sidebar-actions .chat-icon-button{width:39px;min-width:39px}.chat-room-list{max-height:47%;padding:0 8px}.chat-room-item,.chat-person-item{justify-content:center;padding:8px 0}.chat-colleague-list{padding:3px 8px}.chat-user-card{justify-content:center;padding:9px}.chat-toolbar{height:64px;padding:0 12px}.chat-toolbar>span{font-size:10px}.chat-admin-toggle{font-size:0;width:34px;padding:0}.chat-admin-toggle i{font-size:13px;margin:0}.chat-room-heading{gap:7px}.chat-room-heading .chat-avatar{width:32px;height:32px;min-width:32px}.chat-room-heading strong{font-size:12px}.chat-room-heading small{font-size:9px}.chat-messages{padding:17px 12px}.chat-bubble-wrap{max-width:85%}.chat-composer{margin:0 9px 9px}.chat-compose-note{font-size:8px}.chat-welcome{padding:20px}.chat-welcome h2{font-size:18px}.chat-welcome p{font-size:11px}.chat-monitor{padding:12px;gap:10px}.chat-monitor>section{padding:13px}.chat-modal{padding:17px}.chat-member-picker{grid-template-columns:1fr}.chat-toast{right:12px;bottom:12px}}

/* Evolution Chat — acabamento visual integrado ao Portal Evolution */
.chat-app {
  --chat-ink: #28232a;
  --chat-muted: #817780;
  --chat-line: #eee6e8;
  --chat-accent: #b50920;
  --chat-soft: #fff7f8;
  height: min(820px, calc(100vh - 205px));
  min-height: 590px;
  border: 1px solid #eadfe1;
  border-radius: 20px;
  box-shadow: 0 18px 50px rgba(49, 14, 20, .11);
  font-family: Inter, "Segoe UI", Arial, sans-serif;
}
.chat-sidebar { background: linear-gradient(180deg, #fff 0%, #fffafb 100%); }
.chat-brand { height: 82px; padding: 0 22px; }
.chat-brand-mark {
  width: 43px; height: 43px; border-radius: 14px;
  background: linear-gradient(145deg, #c8102e, #890018); color: #fff;
  box-shadow: 0 7px 16px rgba(181, 9, 32, .2);
}
.chat-brand strong { font-size: 16px; letter-spacing: -.35px; }
.chat-brand small { color: #8b7b80; font-size: 11px; }
.chat-new-button, .chat-primary, .chat-send-button { background: #b50920; }
.chat-new-button, .chat-primary { box-shadow: 0 5px 14px rgba(181, 9, 32, .18); }
.chat-new-button:hover, .chat-primary:hover { background: #910019; }
.chat-icon-button { border-color: #eee2e4; color: #66585c; }
.chat-icon-button:hover { background: #fff0f2; color: #a4071c; }
.chat-search { background: #fff; border-color: #eee5e7; border-radius: 11px; height: 42px; }
.chat-search:focus-within, .chat-modal-search:focus-within { border-color: #d88996; box-shadow: 0 0 0 3px rgba(181, 9, 32, .09); }
.chat-section-heading, .chat-colleague-heading { color: #95858a; font-size: 9px; letter-spacing: 1.15px; }
.chat-room-list { max-height: 44%; padding: 0 10px; }
.chat-room-item { min-height: 70px; padding: 11px 10px; border-radius: 12px; transition: background .16s, transform .16s; }
.chat-room-item:hover, .chat-person-item:hover { background: #fff1f3; }
.chat-room-item:hover { transform: translateX(2px); }
.chat-room-item.active { background: #fff0f2; box-shadow: inset 3px 0 #b50920; }
.chat-room-copy strong { font-size: 12px; color: #30262a; }
.chat-room-copy small { color: #8a7d81; }
.chat-avatar { background: #f7e9ec; color: #9f1026; }
.chat-avatar-group { background: #f7e8eb; color: #a70d24; }
.chat-person-item { min-height: 43px; border-radius: 10px; }
.chat-online-dot { color: #21966b; }
.chat-user-card { border-top-color: #eee5e7; min-height: 72px; }
.chat-user-card strong { color: #30262a; }
.chat-main { background: #fff; }
.chat-toolbar { height: 82px; padding: 0 28px; border-bottom-color: #eee6e8; }
.chat-room-heading .chat-avatar { box-shadow: 0 0 0 4px #fff6f7; }
.chat-room-heading strong { color: #2e2529; font-size: 15px; }
.chat-room-heading small { font-size: 11px; }
.chat-admin-toggle { border-color: #eee1e4; border-radius: 10px; color: #6b4a51; }
.chat-admin-toggle i { color: #b50920; }
.chat-admin-toggle:hover { background: #fff5f6; }
.chat-messages {
  padding: 30px clamp(22px, 7vw, 92px) 24px;
  background: radial-gradient(ellipse at 50% 0%, #fffafb 0, #fff 65%);
}
.chat-message { gap: 11px; margin-bottom: 19px; }
.chat-message-author { color: #82747a; font-size: 11px; margin-bottom: 6px; }
.chat-bubble { background: #f5f1f2; border: 1px solid #f0e9eb; padding: 12px 15px 24px; border-radius: 5px 16px 16px 16px; font-size: 13px; line-height: 1.65; }
.chat-message.mine .chat-bubble { background: #fff0f2; border-color: #f6dfe3; border-radius: 16px 5px 16px 16px; }
.chat-bubble time { color: #98898e; }
.chat-first-message { gap: 10px; }
.chat-first-message>span { background: #fff0f2; color: #b50920; border-radius: 18px; width: 58px; height: 58px; }
.chat-first-message strong { color: #42343a; font-size: 14px; }
.chat-composer { margin: 0 clamp(16px, 6vw, 76px) 20px; border-color: #e9dfe1; border-radius: 16px; box-shadow: 0 8px 24px rgba(48, 20, 26, .07); }
.chat-composer:focus-within { border-color: #d88996; box-shadow: 0 0 0 3px rgba(181, 9, 32, .08), 0 8px 24px rgba(48, 20, 26, .07); }
.chat-composer-tool { color: #85767b; }
.chat-composer-tool:hover { background: #fff0f2; color: #a4071c; }
.chat-composer textarea { font: 13px/1.5 Inter, "Segoe UI", Arial, sans-serif; }
.chat-send-button { border-radius: 11px; box-shadow: 0 4px 10px rgba(181, 9, 32, .18); }
.chat-compose-note { background: #fffafb; color: #918388; border-color: #f2eaec; border-radius: 0 0 16px 16px; }
.chat-compose-note i { color: #b50920; }
.chat-emoji-picker { border-color: #eee1e4; box-shadow: 0 14px 36px rgba(49, 14, 20, .15); }
.chat-modal { border: 1px solid #f0e4e7; border-radius: 20px; box-shadow: 0 28px 80px rgba(33, 12, 17, .24); }
.chat-modal form>label, .chat-profile-form>label { color: #57484d; }
.chat-modal form>label input:not([type=file]), .chat-modal form>label select { border-radius: 10px; }
.chat-member-picker input { accent-color: #b50920; }
.chat-monitor { background: #fffafb; }
.chat-monitor>section { border-color: #eee3e5; border-radius: 16px; box-shadow: 0 6px 20px rgba(50, 17, 23, .04); }
.chat-count { background: #fff0f2; color: #a4071c; }
.chat-monitor-room:hover { color: #a4071c; }
.chat-log-category { background: #fff0e9; color: #a24f2a; }
.chat-toast { border-radius: 13px; box-shadow: 0 12px 34px rgba(22, 10, 12, .24); }

@media (max-width: 900px) {
  .chat-app { height: min(820px, calc(100vh - 180px)); }
  .chat-toolbar { padding: 0 20px; }
}
@media (max-width: 650px) {
  .chat-app { min-height: 540px; height: calc(100vh - 150px); border-radius: 14px; }
  .chat-brand-mark { width: 38px; height: 38px; }
  .chat-messages { padding: 18px 12px; }
  .chat-composer { margin: 0 10px 10px; }
  .chat-toolbar { padding: 0 12px; }
  .chat-room-item.active { box-shadow: inset 0 -3px #b50920; }
}

/* Refinos finais de hierarquia, estados e acessibilidade */
.chat-app { isolation: isolate; }
.chat-sidebar, .chat-main { min-height: 0; }
.chat-sidebar { position: relative; }
.chat-sidebar::after { content: ""; position: absolute; z-index: 1; top: 0; right: -1px; width: 1px; height: 100%; background: linear-gradient(180deg, transparent, #eadfe1 16%, #eadfe1 84%, transparent); pointer-events: none; }
.chat-room-list, .chat-colleague-list, .chat-messages, .chat-monitor-room-list, .chat-log-list, .chat-admin-transcript, .chat-modal { scrollbar-color: #decbd0 transparent; scrollbar-width: thin; }
.chat-room-item:focus-visible, .chat-person-item:focus-visible, .chat-direct-list>button:focus-visible, .chat-monitor-room:focus-visible { outline: 2px solid rgba(181, 9, 32, .42); outline-offset: -2px; }
.chat-room-item.active .chat-avatar:not(.chat-avatar-group) { box-shadow: 0 0 0 2px #fff, 0 0 0 4px #f0cbd1; }
.chat-person-item .chat-avatar { width: 34px; height: 34px; min-width: 34px; }
.chat-toolbar { background: linear-gradient(90deg, #fff 0%, #fff 74%, #fffafb 100%); }
.chat-content { background: #fff; }
.chat-message.mine .chat-bubble { color: #442b31; }
.chat-bubble { box-shadow: 0 2px 6px rgba(51, 22, 28, .025); }
.chat-composer-row { padding: 10px 11px; }
.chat-send-button { transition: transform .16s, background .16s, box-shadow .16s; }
.chat-send-button:hover:not(:disabled) { background: #910019; transform: translateY(-1px); box-shadow: 0 6px 14px rgba(181, 9, 32, .24); }
.chat-welcome-icon { box-shadow: 0 10px 24px rgba(181, 9, 32, .09); }
.chat-modal header { padding-bottom: 12px; border-bottom: 1px solid #f1e8ea; }
.chat-modal footer .chat-primary { min-width: 132px; }
.chat-log-item:last-child, .chat-direct-list>button:last-child { border-bottom: 0; }
@media (prefers-reduced-motion: reduce) {
  .chat-app *, .chat-app *::before, .chat-app *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* Área de mensagens: leitura limpa, remetente visível e horários fora das bolhas */
.chat-messages {
  background: linear-gradient(180deg, #fffafb 0%, #fff 34%, #fff 100%);
  padding-top: 28px;
  padding-bottom: 20px;
}
.chat-message {
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 18px;
}
.chat-message.continued { margin-left: 40px; }
.chat-message .chat-avatar.small { margin-top: 2px; box-shadow: 0 0 0 3px #fff; }
.chat-bubble-wrap {
  display: flex;
  min-width: 0;
  max-width: min(76%, 680px);
  flex-direction: column;
  align-items: flex-start;
}
.chat-message.mine .chat-bubble-wrap { align-items: flex-end; }
.chat-message-author {
  max-width: 100%;
  margin: 0 0 6px 4px;
  color: #69565d;
  font-size: 11px;
  font-weight: 650;
}
.chat-message.mine .chat-message-author { margin-right: 4px; }
.chat-bubble {
  width: fit-content;
  max-width: 100%;
  padding: 11px 15px;
  border: 1px solid #eee5e7;
  border-radius: 5px 16px 16px 16px;
  background: #fff;
  box-shadow: 0 3px 10px rgba(45, 18, 24, .045);
  color: #352c30;
  font-size: 13px;
  line-height: 1.65;
  white-space: normal;
}
.chat-message.mine .chat-bubble {
  border-color: #f1d5da;
  border-radius: 16px 5px 16px 16px;
  background: #fff0f2;
  color: #442b31;
}
.chat-bubble-text { display: block; overflow-wrap: anywhere; }
.chat-message-time {
  position: static;
  align-self: flex-start;
  margin: 5px 4px 0;
  color: #96878c;
  font-size: 9px;
  line-height: 1.2;
  white-space: nowrap;
}
.chat-message-meta { display: flex; align-items: center; gap: 7px; min-height: 28px; margin-top: 3px; }
.chat-message.mine .chat-message-meta { justify-content: flex-end; }
.chat-message-edit-button { display: grid; width: 26px; height: 26px; place-items: center; border: 1px solid #4a4852; border-radius: 8px; background: #303037; color: #d9d6ff; cursor: pointer; opacity: 0; pointer-events: none; transition: opacity .15s, background .15s; }
.chat-message.mine:hover .chat-message-edit-button,
.chat-message.mine:focus-within .chat-message-edit-button { opacity: 1; pointer-events: auto; }
.chat-message-edit-button:hover { background: #48445f; }
.chat-message-delete-button { display: grid; width: 26px; height: 26px; place-items: center; border: 1px solid #564044; border-radius: 8px; background: #352b30; color: #ff9aa4; cursor: pointer; opacity: 0; pointer-events: none; transition: opacity .15s, background .15s; }
.chat-message:hover .chat-message-delete-button,
.chat-message:focus-within .chat-message-delete-button { opacity: 1; pointer-events: auto; }
.chat-message-delete-button:hover { background: #55363d; }
.chat-message-delete-button:disabled { cursor: wait; opacity: .75; }
.chat-message-edit-form { display: grid; width: min(520px, 70vw); gap: 8px; }
.chat-message-edit-form textarea { width: 100%; min-height: 76px; max-height: 180px; resize: vertical; padding: 9px 10px; border: 1px solid #6b6594; border-radius: 8px; outline: 0; background: #25252b; color: #f3f2f7; font: 13px/1.55 Arial, sans-serif; }
.chat-message-edit-form textarea:focus { border-color: #a59bf5; }
.chat-message-edit-form>div { display: flex; justify-content: flex-end; gap: 7px; }
.chat-message-edit-form button { min-height: 30px; padding: 0 10px; border: 1px solid #4a4852; border-radius: 7px; background: #38373f; color: #e6e4ed; font-size: 10px; cursor: pointer; }
.chat-message-edit-form button[type="submit"] { border-color: #7567e8; background: #6254c8; color: #fff; }
.chat-message-edit-form button:disabled { opacity: .6; cursor: wait; }
.chat-modal.chat-avatar-preview-modal { width: min(820px, 94vw); max-height: 90vh; padding: 18px; }
.chat-avatar-preview { display: grid; min-height: min(70vh, 620px); place-items: center; overflow: hidden; border: 1px solid #414149; border-radius: 12px; background: #1d1d22; }
.chat-avatar-preview img { display: block; width: auto; height: auto; max-width: 100%; max-height: min(70vh, 620px); object-fit: contain; }
@media (max-width: 650px) {
  .chat-modal.chat-avatar-preview-modal { width: min(100%, 94vw); padding: 12px; }
  .chat-avatar-preview { min-height: min(62vh, 500px); }
  .chat-avatar-preview img { max-height: min(62vh, 500px); }
}
.chat-composer {
  border: 1px solid #e7dadd;
  background: #fff;
}
.chat-composer-row { min-height: 59px; }
.chat-composer textarea { min-height: 39px; padding: 11px 7px 8px; }
.chat-compose-note { padding: 8px 14px; font-size: 10px; }
.chat-first-message { margin: auto; padding: 26px; }
@media (max-width: 650px) {
  .chat-message.continued { margin-left: 36px; }
  .chat-bubble-wrap { max-width: min(84%, 680px); }
  .chat-message { margin-bottom: 15px; }
  .chat-compose-note { line-height: 1.4; }
}

/* Chat em tela ampla: aproveita o espaço disponível do portal */
body:not(.modo-login) #conteudo.conteudo-chat {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 14px clamp(14px, 1.5vw, 28px) 18px;
}
.chat-app {
  width: 100%;
  max-width: none;
  height: min(1000px, calc(100vh - 170px));
  min-height: 590px;
  grid-template-columns: 370px minmax(0, 1fr);
  border-radius: 20px;
}
.chat-sidebar { min-width: 0; }
.chat-brand { min-height: 86px; }
.chat-brand-mark { width: 48px; height: 48px; font-size: 20px; }
.chat-brand strong { font-size: 17px; }
.chat-brand small { font-size: 12px; }
.chat-sidebar-actions { padding: 17px 19px 15px; }
.chat-new-button, .chat-icon-button { min-height: 46px; height: 46px; }
.chat-icon-button { width: 46px; min-width: 46px; font-size: 16px; }
.chat-search { height: 46px; margin: 0 19px 16px; }
.chat-room-list { padding: 0 11px; }
.chat-room-item { min-height: 76px; gap: 12px; padding: 12px; }
.chat-room-item .chat-avatar { width: 46px; height: 46px; min-width: 46px; font-size: 14px; }
.chat-room-item .chat-avatar-group { font-size: 17px; }
.chat-room-copy strong { font-size: 13px; }
.chat-room-copy small { font-size: 11px; }
.chat-room-item time { font-size: 10px; }
.chat-section-heading, .chat-colleague-heading { height: 35px; padding: 0 21px; font-size: 10px; }
.chat-colleague-list { padding: 4px 12px 10px; max-height: 220px; }
.chat-person-item { min-height: 54px; gap: 12px; padding: 8px 10px; font-size: 12px; }
.chat-person-item .chat-avatar { width: 42px; height: 42px; min-width: 42px; font-size: 13px; }
.chat-person-item .chat-online-dot { font-size: 9px; }
.chat-user-card { min-height: 82px; padding: 14px 18px; gap: 12px; }
.chat-user-card .chat-avatar { width: 44px; height: 44px; min-width: 44px; }
.chat-user-card strong { font-size: 12px; }
.chat-user-card small { font-size: 10px; }
.chat-toolbar { min-height: 86px; height: 86px; padding: 0 32px; }
.chat-room-heading { gap: 14px; }
.chat-room-heading .chat-avatar { width: 52px; height: 52px; min-width: 52px; font-size: 15px; }
.chat-room-heading strong { font-size: 16px; }
.chat-room-heading small { font-size: 11px; }
.chat-messages { padding: 34px clamp(30px, 8vw, 120px) 28px; }
.chat-bubble-wrap { max-width: min(78%, 760px); }
.chat-bubble { padding: 13px 17px; font-size: 14px; line-height: 1.7; }
.chat-message-author { font-size: 12px; }
.chat-message-time { font-size: 10px; }
.chat-composer { margin: 0 clamp(24px, 6vw, 92px) 24px; }
.chat-composer-row { min-height: 70px; padding: 12px 14px; gap: 10px; }
.chat-composer-tool, .chat-send-button { width: 44px; height: 44px; min-width: 44px; }
.chat-composer-tool { font-size: 19px; }
.chat-send-button { font-size: 16px; }
.chat-composer textarea { min-height: 44px; font-size: 14px; }
.chat-compose-note { padding: 9px 16px; font-size: 10px; }
@media (max-width: 900px) {
  .chat-app { grid-template-columns: 320px minmax(0, 1fr); height: calc(100vh - 180px); }
  .chat-messages { padding-right: 28px; padding-left: 28px; }
  .chat-composer { margin-right: 22px; margin-left: 22px; }
}
@media (max-width: 650px) {
  body:not(.modo-login) #conteudo.conteudo-chat { padding: 8px; }
  .chat-app { height: calc(100vh - 150px); min-height: 540px; grid-template-columns: 92px minmax(0, 1fr); }
  .chat-brand-mark { width: 42px; height: 42px; }
  .chat-room-item .chat-avatar, .chat-person-item .chat-avatar { width: 44px; height: 44px; min-width: 44px; }
  .chat-messages { padding: 18px 12px; }
  .chat-bubble-wrap { max-width: min(84%, 760px); }
  .chat-composer { margin: 0 9px 10px; }
  .chat-composer-row { min-height: 58px; padding: 8px; gap: 4px; }
  .chat-composer-tool, .chat-send-button { width: 38px; height: 38px; min-width: 38px; }
  .chat-compose-note { padding: 7px 9px; font-size: 8px; }
}

/* Tema escuro inspirado no Teams para a área de comunicação */
.chat-app {
  --chat-ink: #f4f4f5;
  --chat-muted: #a1a1aa;
  --chat-line: #3b3b42;
  --chat-accent: #7567e8;
  --chat-soft: #24242a;
  border-color: #393941;
  background: #29292e;
  color: #f4f4f5;
  box-shadow: 0 20px 54px rgba(0, 0, 0, .28);
}
.chat-sidebar { background: #111923; border-right-color: #30343d; }
.chat-sidebar::after { background: linear-gradient(180deg, transparent, #353944 16%, #353944 84%, transparent); }
.chat-brand { border-bottom-color: #30343d; }
.chat-brand-mark { background: #4b4a9b; color: #fff; box-shadow: none; }
.chat-brand strong, .chat-user-card strong { color: #f7f7fb; }
.chat-brand small, .chat-user-card small { color: #a7a9b4; }
.chat-new-button, .chat-primary, .chat-send-button { background: #6254c8; box-shadow: 0 4px 12px rgba(98, 84, 200, .24); }
.chat-new-button:hover, .chat-primary:hover, .chat-send-button:hover:not(:disabled) { background: #7567e8; }
.chat-icon-button { color: #d4d5df; border-color: #424650; background: #1b222d; }
.chat-icon-button:hover { color: #fff; background: #292f3a; }
.chat-search, .chat-modal-search { color: #a9acb7; border-color: #41444e; background: #1b222c; }
.chat-search input, .chat-modal-search input { color: #f4f4f5; }
.chat-section-heading, .chat-colleague-heading { color: #a5a8b3; }
.chat-section-heading button { color: #bdc0ca; }
.chat-room-item, .chat-person-item { color: #e7e8ed; }
.chat-room-item:hover, .chat-person-item:hover { background: #222a35; }
.chat-room-item.active { background: #292d3b; box-shadow: inset 3px 0 #8b82ff; }
.chat-room-item.active .chat-avatar:not(.chat-avatar-group) { box-shadow: 0 0 0 2px #292d3b, 0 0 0 4px #7770d4; }
.chat-room-copy strong { color: #f2f2f5; }
.chat-room-copy small, .chat-room-item time { color: #a6a8b2; }
.chat-avatar { background: #383b4b; color: #ecebff; }
.chat-avatar-group { background: #46436e; color: #e5e1ff; }
.chat-online-dot { color: #55d69a; }
.chat-user-card { border-top-color: #343943; }
.chat-user-card button { color: #c0c2cd; }
.chat-main, .chat-content { background: #29292e; }
.chat-toolbar { border-bottom-color: #3a3a41; background: #242428; color: #b8b8c2; }
.chat-room-heading strong { color: #f3f3f6; }
.chat-room-heading small { color: #a5a5b0; }
.chat-room-heading .chat-avatar { box-shadow: 0 0 0 4px #303036; }
.chat-admin-toggle { border-color: #494850; background: #2c2c33; color: #ececf1; }
.chat-admin-toggle i { color: #a99fff; }
.chat-admin-toggle:hover, .chat-secondary:hover { background: #393840; }
.chat-messages { background: #29292e; }
.chat-message-author { color: #c2c2cb; }
.chat-bubble { border-color: #414148; background: #38383f; color: #f1f1f4; box-shadow: none; }
.chat-message.mine .chat-bubble { border-color: #6558bd; background: #6254c8; color: #fff; }
.chat-message-time { color: #a5a5af; }
.chat-first-message { color: #b8b8c2; }
.chat-first-message>span { background: #393650; color: #b9b1ff; box-shadow: none; }
.chat-first-message strong { color: #f0eff6; }
.chat-first-message small { color: #b0b0bb; }
.chat-composer { border-color: #4a4850; background: #29292e; box-shadow: 0 6px 22px rgba(0, 0, 0, .15); }
.chat-composer:focus-within { border-color: #8177e8; box-shadow: 0 0 0 3px rgba(117, 103, 232, .18); }
.chat-composer textarea { color: #f4f4f5; background: transparent; }
.chat-composer textarea::placeholder { color: #a6a6b0; }
.chat-composer-tool { color: #d0d0d8; }
.chat-composer-tool:hover { background: #3b3a43; color: #d5d0ff; }
.chat-compose-note { border-color: #3f3e45; background: #25252a; color: #b5b3bd; }
.chat-compose-note i { color: #ada4ff; }
.chat-emoji-picker { width: min(380px, calc(100vw - 110px)); max-width: 380px; max-height: 310px; overflow-y: auto; display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 4px; border-color: #494851; background: #232329; box-shadow: 0 16px 44px rgba(0, 0, 0, .4); }
.chat-emoji-picker button { min-height: 38px; border-radius: 9px; font-size: 23px; }
.chat-emoji-picker button:hover { background: #3b3947; }
.chat-modal { border-color: #46454e; background: #29292f; color: #f2f2f5; }
.chat-modal header { border-bottom-color: #414149; }
.chat-modal header h2, .chat-modal form>label, .chat-profile-form>label, .chat-modal legend { color: #f0eff5; }
.chat-modal form>label input:not([type=file]), .chat-modal form>label select { border-color: #4a4952; background: #202026; color: #f2f2f5; }
.chat-modal fieldset { border-color: #4a4952; }
.chat-member-picker label { color: #d3d3dc; }
.chat-form-note, .chat-modal form small { color: #b0afba; }
.chat-direct-list>button { border-bottom-color: #414149; background: #29292f; color: #f2f2f5; }
.chat-direct-list>button:hover { background: #393841; }
.chat-direct-list small { color: #b0afba; }
.chat-secondary { background: #3a3941; color: #f0eff5; }
.chat-monitor { background: #242428; }
.chat-monitor>section { border-color: #414149; background: #2d2d33; box-shadow: none; }
.chat-monitor-heading { border-bottom-color: #44434b; }
.chat-monitor-heading h2, .chat-admin-transcript h2 { color: #f1f1f4; }
.chat-monitor-heading>div>span, .chat-admin-transcript-head>div>span { color: #b6b5c0; }
.chat-count { background: #403d61; color: #d4d0ff; }
.chat-monitor-note, .chat-monitor-empty, .chat-monitor-empty span { color: #b6b5c0; }
.chat-monitor-room { border-bottom-color: #414149; background: transparent; color: #d3d2dc; }
.chat-monitor-room strong { color: #f0eff4; }
.chat-monitor-room small, .chat-monitor-room>i:last-child { color: #b0afba; }
.chat-log-item { border-bottom-color: #414149; }
.chat-log-item-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.chat-log-delete { min-height: 30px; display: inline-flex; align-items: center; gap: 6px; padding: 0 9px; border: 1px solid #60434a; border-radius: 8px; background: #342a30; color: #ffb1ba; font: 650 10px "Segoe UI", Arial, sans-serif; cursor: pointer; }
.chat-log-delete:hover { border-color: #a65361; background: #493038; color: #fff; }
.chat-log-delete:disabled { opacity: .55; cursor: wait; }
.chat-log-item p { color: #e2e1e7; }
.chat-log-blocked-message {
  display: grid;
  gap: 7px;
  margin: 11px 0 8px !important;
  padding: 11px 13px;
  border: 1px solid #60434a;
  border-left: 3px solid #d16b7d;
  border-radius: 9px;
  background: #342a30;
  color: #f0e8eb !important;
  line-height: 1.55;
  overflow-wrap: anywhere;
}
.chat-log-blocked-message strong { color: #ffb5bf; font-size: 10px; letter-spacing: .03em; text-transform: uppercase; }
.chat-log-blocked-message.is-empty { display: block; color: #b6b5c0 !important; font-size: 11px; }
.chat-log-item small { color: #b0afba; }
.chat-admin-transcript-head { border-bottom-color: #414149; }
.chat-admin-messages article { border-bottom-color: #414149; }
.chat-admin-messages strong, .chat-admin-messages p { color: #e2e1e7; }
.chat-admin-messages time { color: #aaa9b4; }
.chat-loading, .chat-empty-list { color: #b0afba; }
.chat-modal-backdrop { background: rgba(5, 7, 12, .78); }
.chat-toast { background: #34333b; color: #fff; }
@media (max-width: 650px) {
  .chat-emoji-picker { width: min(330px, calc(100vw - 112px)); grid-template-columns: repeat(6, minmax(0, 1fr)); max-height: 260px; }
}

/* Cabeçalho e início do chat com hierarquia de ferramenta corporativa */
.chat-app { grid-template-columns: 390px minmax(0, 1fr); }
.chat-toolbar { min-height: 92px; height: 92px; gap: 18px; }
.chat-toolbar-intro { display: grid; gap: 5px; }
.chat-toolbar-intro strong { color: #f3f3f6; font-size: 16px; letter-spacing: -.2px; }
.chat-toolbar-kicker { color: #aaa6c4; font-size: 9px; font-weight: 800; letter-spacing: 1.15px; }
.chat-toolbar-actions { display: flex; align-items: center; gap: 8px; }
.chat-toolbar-action { min-height: 39px; display: inline-flex; align-items: center; gap: 8px; padding: 0 12px; border: 1px solid #45444d; border-radius: 9px; background: #2d2d34; color: #eeedf3; font: 650 11px "Segoe UI", Arial, sans-serif; cursor: pointer; transition: background .16s, border-color .16s, transform .16s; }
.chat-toolbar-action i { color: #b5adff; }
.chat-toolbar-action:hover { transform: translateY(-1px); border-color: #7369c4; background: #393744; }
.chat-toolbar .chat-room-heading { flex: 1; min-width: 0; }
.chat-welcome { width: min(100%, 970px); max-width: 970px; padding: clamp(26px, 4vw, 54px); }
.chat-welcome-eyebrow { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 21px; color: #c5c1dc; font-size: 9px; font-weight: 800; letter-spacing: 1.25px; }
.chat-welcome-eyebrow i { color: #5ed39a; font-size: 7px; }
.chat-welcome-icon { width: 82px; height: 82px; margin-bottom: 21px; border: 1px solid #56516f; border-radius: 24px; background: linear-gradient(145deg, #39354d, #302e3a); color: #c0b9ff; font-size: 31px; }
.chat-welcome h2 { color: #f6f5f9; font-size: clamp(22px, 2.2vw, 30px); letter-spacing: -.65px; }
.chat-welcome p { max-width: 600px; margin: 0 auto 23px; color: #c1bfca; font-size: 13px; line-height: 1.75; }
.chat-welcome-actions { display: flex; justify-content: center; gap: 10px; }
.chat-welcome-actions .chat-primary, .chat-welcome-actions .chat-secondary { min-height: 44px; padding: 0 17px; }
.chat-welcome-actions .chat-secondary { border: 1px solid #494751; background: #333239; }
.chat-welcome-actions .chat-secondary:hover { background: #41404a; }
.chat-feature-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 36px; text-align: left; }
.chat-feature-grid article { min-height: 118px; padding: 16px; border: 1px solid #41414a; border-radius: 13px; background: linear-gradient(145deg, #303036, #2b2b31); }
.chat-feature-grid article>span { width: 32px; height: 32px; display: grid; place-items: center; margin-bottom: 13px; border-radius: 9px; background: #3e3b56; color: #c2bbff; font-size: 13px; }
.chat-feature-grid strong, .chat-feature-grid small { display: block; }
.chat-feature-grid strong { color: #f0eff5; font-size: 11px; }
.chat-feature-grid small { margin-top: 6px; color: #b2b0bc; font-size: 10px; line-height: 1.5; }
.chat-welcome-search { margin-top: 17px; padding: 7px 10px; border: 0; border-radius: 7px; background: transparent; color: #c5c0e4; font: 600 10px "Segoe UI", Arial, sans-serif; cursor: pointer; }
.chat-welcome-search:hover { background: #35343c; color: #fff; }
.chat-welcome-search i { margin-right: 5px; }
@media (max-width: 900px) {
  .chat-app { grid-template-columns: 320px minmax(0, 1fr); }
  .chat-toolbar { padding: 0 18px; }
  .chat-toolbar-action { padding: 0 9px; }
  .chat-welcome { padding: 26px 20px; }
}
@media (max-width: 650px) {
  .chat-app { grid-template-columns: 92px minmax(0, 1fr); }
  .chat-toolbar { min-height: 68px; height: auto; padding: 8px 10px; gap: 6px; }
  .chat-toolbar-intro { display: none; }
  .chat-toolbar-actions { gap: 5px; }
  .chat-toolbar-action { width: 34px; min-height: 34px; justify-content: center; padding: 0; font-size: 0; }
  .chat-toolbar-action i { font-size: 13px; }
  .chat-toolbar .chat-admin-toggle { flex: 0 0 34px; }
  .chat-welcome { padding: 19px 12px; }
  .chat-welcome-eyebrow { margin-bottom: 13px; font-size: 7px; }
  .chat-welcome-icon { width: 60px; height: 60px; margin-bottom: 14px; border-radius: 18px; font-size: 23px; }
  .chat-welcome h2 { font-size: 19px; }
  .chat-welcome p { font-size: 11px; line-height: 1.55; }
  .chat-welcome-actions { flex-wrap: wrap; }
  .chat-welcome-actions .chat-primary, .chat-welcome-actions .chat-secondary { min-height: 39px; padding: 0 11px; font-size: 11px; }
  .chat-feature-grid { grid-template-columns: 1fr; gap: 7px; margin-top: 18px; }
  .chat-feature-grid article { min-height: 0; display: grid; grid-template-columns: 31px 1fr; column-gap: 9px; padding: 9px; }
  .chat-feature-grid article>span { grid-row: span 2; width: 30px; height: 30px; margin: 0; }
  .chat-feature-grid small { margin-top: 3px; }
  .chat-welcome-search { margin-top: 8px; }
}

/* Layout completo inspirado no fluxo de trabalho do Microsoft Teams */
.chat-app { grid-template-columns: 64px 330px minmax(0, 1fr); }
.chat-navrail { display: flex; min-width: 0; flex-direction: column; align-items: center; gap: 10px; padding: 15px 7px; border-right: 1px solid #33343d; background: #18191f; }
.chat-navrail-brand { width: 38px; height: 38px; display: grid; place-items: center; margin-bottom: 10px; border-radius: 12px; background: linear-gradient(140deg, #7162d9, #4e47a7); color: #fff; font-size: 17px; }
.chat-navrail>button { width: 42px; height: 42px; display: grid; place-items: center; border: 0; border-radius: 11px; background: transparent; color: #c8c7d1; font-size: 17px; cursor: pointer; transition: background .15s, color .15s; }
.chat-navrail>button:hover { background: #2c2b35; color: #fff; }
.chat-navrail>button.active { background: #37334f; color: #a99fff; box-shadow: inset 3px 0 #9185ff; }
.chat-navrail>button.chat-navrail-profile { width: 36px; height: 36px; margin-top: auto; overflow: hidden; border: 2px solid #4c4b58; border-radius: 50%; padding: 0; }
.chat-navrail-profile .chat-avatar { width: 32px; height: 32px; min-width: 32px; }
.chat-sidebar { background: #1e1f25; border-right-color: #373840; }
.chat-brand { min-height: 78px; height: 78px; justify-content: space-between; padding: 0 15px 0 19px; border-bottom-color: #373840; }
.chat-brand-title { display: flex; min-width: 0; align-items: center; gap: 11px; }
.chat-brand-title>div { min-width: 0; }
.chat-brand strong { font-size: 20px; color: #f6f5f8; }
.chat-brand small { color: #aaa9b4; }
.chat-brand-mark { width: 38px; height: 38px; flex: 0 0 auto; border-radius: 12px; background: #393651; color: #c2bbff; box-shadow: none; }
.chat-brand-actions { display: flex; gap: 3px; }
.chat-brand-actions .chat-icon-button { width: 34px; min-width: 34px; height: 34px; border: 0; background: transparent; }
.chat-brand-actions .chat-icon-button:hover { background: #34343d; }
.chat-sidebar-actions { padding: 12px 16px 10px; }
.chat-sidebar-actions .chat-new-button { min-height: 39px; height: 39px; justify-content: center; border-radius: 8px; }
.chat-search { height: 39px; margin: 0 16px 8px; border-color: #42434b; border-radius: 7px; background: #292a31; }
.chat-search input { color: #f1f0f4; }
.chat-search input::placeholder { color: #aaa9b2; }
.chat-list-title { min-height: 42px; display: flex; align-items: center; justify-content: space-between; padding: 0 17px; color: #f2f1f5; }
.chat-list-title strong { font-size: 13px; }
.chat-list-title button { width: 30px; height: 30px; border: 0; border-radius: 7px; background: transparent; color: #b7b6c1; cursor: pointer; }
.chat-list-title button:hover { background: #34343d; color: #fff; }
.chat-room-filters { display: flex; gap: 6px; padding: 0 15px 10px; }
.chat-room-filters button { min-height: 28px; padding: 0 10px; border: 1px solid #484850; border-radius: 999px; background: transparent; color: #c3c1cc; font: 11px "Segoe UI", Arial, sans-serif; cursor: pointer; }
.chat-room-filters button:hover { background: #303139; color: #fff; }
.chat-room-filters button.active { border-color: #756bd0; background: #393650; color: #e1deff; }
.chat-room-list { padding: 0 8px; }
.chat-room-row { gap: 0; }
.chat-room-item { min-height: 67px; border-radius: 8px; }
.chat-room-item.active { background: #34343c; box-shadow: inset 3px 0 #8b82ff; }
.chat-room-item:hover, .chat-person-item:hover { background: #2d2e35; }
.chat-room-item.active .chat-room-copy small { color: #c4c2cd; }
.chat-room-menu { flex-basis: 30px; }
.chat-user-card { background: #191a20; border-top-color: #373840; }
.chat-main { background: #25252b; }
.chat-toolbar { min-height: 76px; height: 76px; padding: 0 20px 0 25px; gap: 16px; background: #25252b; border-bottom-color: #414149; }
.chat-room-heading { flex: 0 1 auto; min-width: 170px; }
.chat-room-heading strong { font-size: 16px; }
.chat-conversation-tabs { display: flex; align-self: stretch; align-items: stretch; gap: 3px; }
.chat-conversation-tabs button { position: relative; min-width: 57px; padding: 0 10px; border: 0; background: transparent; color: #c4c2cb; font: 13px "Segoe UI", Arial, sans-serif; cursor: pointer; }
.chat-conversation-tabs button:hover { color: #fff; background: #303036; }
.chat-conversation-tabs button.active { color: #fff; font-weight: 700; }
.chat-conversation-tabs button.active::after { content: ""; position: absolute; right: 8px; bottom: 0; left: 8px; height: 3px; border-radius: 3px 3px 0 0; background: #9185ff; }
.chat-toolbar-actions { gap: 6px; }
.chat-toolbar-action { min-height: 34px; padding: 0 9px; border-color: transparent; background: transparent; color: #cbc9d2; }
.chat-toolbar-action:hover { border-color: #4c4a57; background: #33323b; }
.chat-toolbar-action i { color: #c2bbff; }
.chat-admin-toggle { min-height: 34px; height: 34px; border-color: #4b4954; background: transparent; color: #dbd9e2; }
.chat-messages { background: #25252b; padding: 28px clamp(24px, 6vw, 94px) 20px; }
.chat-message.mine .chat-bubble { border-color: #7062d3; background: #6254c8; }
.chat-composer { margin-bottom: 17px; }
.chat-shared-view { flex: 1; min-height: 0; overflow: auto; padding: 26px clamp(20px, 4vw, 60px); background: #25252b; }
.chat-shared-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; padding-bottom: 15px; border-bottom: 1px solid #414149; }
.chat-shared-heading>span:first-child { display: grid; gap: 5px; }
.chat-shared-heading small { color: #aaa8b4; font-size: 9px; font-weight: 800; letter-spacing: 1px; }
.chat-shared-heading strong { color: #f2f1f5; font-size: 19px; }
.chat-shared-count { padding: 6px 9px; border: 1px solid #4a4852; border-radius: 999px; color: #ceccd6; font-size: 10px; }
.chat-shared-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 13px; }
.chat-shared-file { min-height: 132px; display: flex; flex-direction: column; align-items: flex-start; padding: 15px; border: 1px solid #45444d; border-radius: 11px; background: #303036; color: #f1f0f5; text-decoration: none; }
.chat-shared-file:hover { border-color: #7770c3; background: #373640; }
.chat-shared-file>span { width: 38px; height: 38px; display: grid; place-items: center; margin-bottom: 12px; border-radius: 9px; background: #403e5b; color: #c2bbff; }
.chat-shared-file strong { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.chat-shared-file small { margin-top: 5px; color: #aaa9b4; font-size: 9px; }
.chat-shared-photo { position: relative; min-height: 150px; overflow: hidden; border: 1px solid #45444d; border-radius: 11px; background: #303036; color: #fff; text-decoration: none; }
.chat-shared-photo img { display: block; width: 100%; height: 170px; object-fit: cover; }
.chat-shared-photo>span { height: 170px; display: grid; place-items: center; color: #b9b3dc; font-size: 28px; }
.chat-shared-photo small { position: absolute; right: 0; bottom: 0; left: 0; overflow: hidden; padding: 8px 10px; background: linear-gradient(transparent, #111c); text-overflow: ellipsis; white-space: nowrap; font-size: 10px; }
.chat-shared-empty { grid-column: 1/-1; min-height: 300px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 9px; color: #b4b2bd; text-align: center; }
.chat-shared-empty>i { margin-bottom: 4px; color: #aaa2e2; font-size: 29px; }
.chat-shared-empty strong { color: #edecf2; font-size: 13px; }
.chat-shared-empty span { font-size: 11px; }
.chat-participant-list { max-height: 52vh; overflow: auto; }
.chat-participant-row { display: flex; align-items: center; gap: 11px; padding: 10px 3px; border-bottom: 1px solid #414149; }
.chat-participant-row:last-child { border-bottom: 0; }
.chat-participant-row>span:last-child { min-width: 0; }
.chat-participant-row strong, .chat-participant-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-participant-row strong { color: #f1f0f5; font-size: 12px; }
.chat-participant-row small { margin-top: 4px; color: #b0afba; font-size: 10px; }
.chat-message-search-results { max-height: 50vh; overflow: auto; }
.chat-message-search-results button { width: 100%; display: grid; gap: 5px; padding: 11px 8px; border: 0; border-bottom: 1px solid #414149; background: transparent; color: #eeedf2; text-align: left; cursor: pointer; }
.chat-message-search-results button:hover { background: #373640; }
.chat-message-search-results strong { font-size: 10px; }
.chat-message-search-results small { overflow: hidden; color: #c7c5cf; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.chat-message-search-results time { color: #a5a3af; font-size: 9px; }
.chat-modal-search { border-color: #4a4952; background: #202026; }
.chat-modal-search input { color: #f1f0f5; }
.chat-app .chat-modal { background: #29292f; }
.chat-app nav.chat-conversation-tabs { align-self: stretch; display: flex; justify-content: flex-start; gap: 3px; padding: 0; border: 0; background: #25252b; box-shadow: none; }
.chat-app nav.chat-conversation-tabs button { min-height: 0; padding: 0 10px; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: #c4c2cb; font: 13px "Segoe UI", Arial, sans-serif; }
.chat-app nav.chat-conversation-tabs button:hover { background: #303036; color: #fff; }
.chat-app nav.chat-conversation-tabs button.active { background: transparent; color: #fff; }
.chat-app nav.chat-navrail { justify-content: flex-start; gap: 10px; padding: 15px 7px; border: 0; border-right: 1px solid #33343d; background: #18191f; box-shadow: none; }
.chat-app nav.chat-navrail>button { min-height: 42px; padding: 0; border: 0; border-radius: 11px; box-shadow: none; }
.chat-app .chat-room-heading { flex: 0 0 auto; max-width: min(34%, 340px); }
.chat-app .chat-room-heading>span:last-child { min-width: 0; }
.chat-app .chat-room-heading strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-app .chat-conversation-tabs { flex: 0 0 auto; margin-right: auto; }
.chat-app .chat-toolbar-actions { flex: 0 0 auto; }
.chat-bubble-wrap { position: relative; }
.chat-message-hover-tools { position: absolute; z-index: 8; top: -37px; right: 0; display: inline-flex; align-items: center; gap: 2px; max-width: min(100vw - 32px, 360px); padding: 4px 6px; border: 1px solid #45444d; border-radius: 11px; background: #222228; box-shadow: 0 8px 24px rgba(0,0,0,.32); opacity: 0; pointer-events: none; transform: translateY(3px); transition: opacity .12s ease, transform .12s ease; }
.chat-message:not(.mine) .chat-message-hover-tools { right: auto; left: 0; }
.chat-message:hover .chat-message-hover-tools, .chat-message:focus-within .chat-message-hover-tools { opacity: 1; pointer-events: auto; transform: translateY(0); }
.chat-quick-reaction, .chat-hover-more-reactions, .chat-message-hover-tools .chat-message-edit-button, .chat-message-more-toggle { position: relative; display: grid; width: 34px; height: 32px; min-width: 34px; place-items: center; padding: 0; border: 0; border-radius: 8px; background: transparent; color: #ecebf1; cursor: pointer; }
.chat-quick-reaction { font-size: 20px; line-height: 1; }
.chat-quick-reaction:hover, .chat-hover-more-reactions:hover, .chat-message-hover-tools .chat-message-edit-button:hover, .chat-message-more-toggle:hover { background: #3a3943; }
.chat-hover-more-reactions { font-size: 17px; }
.chat-mini-plus { position: absolute; right: 3px; bottom: 3px; display: grid; width: 11px; height: 11px; place-items: center; border: 1px solid #222228; border-radius: 50%; background: #7d72da; color: #fff; font-size: 7px; }
.chat-message-hover-tools .chat-message-edit-button { width: 34px; min-width: 34px; height: 32px; margin: 0; border: 0; border-radius: 8px; background: transparent; color: #e6e4ec; opacity: 1; pointer-events: auto; }
.chat-message-more-wrap { position: relative; }
.chat-message-more-toggle { font-size: 16px; }
.chat-message-more-menu { position: absolute; z-index: 12; top: calc(100% + 6px); right: 0; min-width: 145px; padding: 5px; border: 1px solid #474650; border-radius: 10px; background: #29292f; box-shadow: 0 12px 30px rgba(0,0,0,.4); }
.chat-message-more-menu[hidden] { display: none; }
.chat-message-menu-action { width: 100%; min-height: 34px; display: flex; align-items: center; gap: 9px; padding: 0 9px; border: 0; border-radius: 7px; background: transparent; color: #eae9ef; text-align: left; font: 11px "Segoe UI", Arial, sans-serif; cursor: pointer; }
.chat-message-menu-action:hover { background: #3b3a43; }
.chat-message-menu-action i { width: 14px; color: #c1bbff; text-align: center; }
.chat-message-menu-action.is-destructive, .chat-message-menu-action.is-destructive i { color: #ffabb4; }
.chat-message-menu-action.is-destructive:hover { background: #493239; }
.chat-message-reactions { min-height: 0; margin-top: 5px; }
.chat-message-reactions:empty { display: none; }
@media (max-width: 1100px) {
  .chat-app .chat-room-heading { max-width: 38%; }
  .chat-app .chat-conversation-tabs { margin-right: auto; }
}
@media (max-width: 760px) {
  .chat-app .chat-room-heading { max-width: 100%; }
  .chat-app .chat-conversation-tabs { margin-right: 0; }
  .chat-message-hover-tools { top: -35px; max-width: calc(100vw - 124px); padding: 3px 4px; }
  .chat-quick-reaction, .chat-hover-more-reactions, .chat-message-hover-tools .chat-message-edit-button, .chat-message-more-toggle { width: 29px; height: 29px; min-width: 29px; }
  .chat-quick-reaction { font-size: 17px; }
}
@media (hover: none) {
  .chat-message-hover-tools { opacity: 1; pointer-events: auto; transform: none; }
  .chat-message { margin-top: 34px; }
}
@media (max-width: 1100px) {
  .chat-app { grid-template-columns: 58px 285px minmax(0, 1fr); }
  .chat-toolbar { gap: 8px; padding-right: 12px; padding-left: 15px; }
  .chat-toolbar-action span { display: none; }
  .chat-toolbar-action { width: 34px; justify-content: center; padding: 0; }
  .chat-room-heading { min-width: 125px; }
}
@media (max-width: 760px) {
  .chat-navrail { display: none; }
  .chat-app { grid-template-columns: 92px minmax(0, 1fr); }
  .chat-sidebar { width: 92px; }
  .chat-brand-title, .chat-brand-actions, .chat-sidebar-actions, .chat-search, .chat-list-title, .chat-room-filters, .chat-room-copy, .chat-room-item time, .chat-room-menu { display: none; }
  .chat-brand { justify-content: center; padding: 0; }
  .chat-room-list { padding: 0 8px; }
  .chat-room-item { justify-content: center; padding: 8px 0; }
  .chat-user-card { justify-content: center; padding: 9px; }
  .chat-user-card>span:nth-child(2), .chat-user-card>button { display: none; }
  .chat-toolbar { flex-wrap: wrap; min-height: 94px; height: auto; justify-content: space-between; padding: 7px 9px 0; }
  .chat-room-heading { min-width: 0; flex: 1 1 100%; }
  .chat-conversation-tabs { order: 3; height: 34px; }
  .chat-toolbar-actions { order: 2; position: absolute; top: 8px; right: 8px; }
  .chat-toolbar-action, .chat-admin-toggle { width: 31px; min-width: 31px; height: 31px; min-height: 31px; font-size: 0; padding: 0; }
  .chat-toolbar-action i, .chat-admin-toggle i { margin: 0; font-size: 12px; }
  .chat-shared-view { padding: 15px 10px; }
  .chat-shared-grid { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 8px; }
}

/* Anexos no chat */
.chat-composer-tool:disabled { opacity: .7; cursor: wait; }
.chat-attachment {
  display: flex;
  align-items: center;
  gap: 12px;
  width: min(390px, 100%);
  min-width: min(260px, 100%);
  padding: 10px 12px;
  border: 1px solid #e8dadd;
  border-radius: 12px;
  background: #fff8f9;
  color: #342b30;
  text-decoration: none;
  transition: transform .15s, border-color .15s, background .15s;
}
a.chat-attachment:hover { transform: translateY(-1px); border-color: #ca9ca5; background: #fff; }
.chat-attachment-icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  min-width: 42px;
  border-radius: 11px;
  background: #f8e9ec;
  color: #a80c24;
  font-size: 18px;
}
.chat-attachment-copy { display: block; min-width: 0; flex: 1; }
.chat-attachment-copy strong, .chat-attachment-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-attachment-copy strong { color: inherit; font-size: 12px; }
.chat-attachment-copy small { margin-top: 4px; color: #81757a; font-size: 10px; }
.chat-attachment-download { color: #a80c24; font-size: 13px; }
.chat-attachment-pending { cursor: default; }
.chat-attachment-pending .chat-attachment-icon { animation: chatAttachmentPulse 1s ease-in-out infinite alternate; }
@keyframes chatAttachmentPulse { to { opacity: .55; } }
.chat-message.mine .chat-attachment {
  border-color: rgba(255,255,255,.2);
  background: rgba(26,20,74,.2);
  color: #fff;
}
.chat-message.mine .chat-attachment-icon { background: rgba(20,16,58,.28); color: #fff; }
.chat-message.mine .chat-attachment-copy small, .chat-message.mine .chat-attachment-download { color: #e6e3ff; }

/* Mantém arquivos e ações legíveis no tema escuro do chat */
.chat-attachment { border-color: #4d4c56; background: #34343b; color: #f1f1f5; }
a.chat-attachment:hover { border-color: #7b72d8; background: #3b3a44; }
.chat-attachment-icon { background: #403e5c; color: #d1ccff; }
.chat-attachment-copy small { color: #bab9c4; }
.chat-attachment-download { color: #c3bdff; }
.chat-message.mine .chat-attachment { border-color: rgba(255,255,255,.22); background: rgba(28,24,67,.32); }
.chat-message.mine .chat-attachment-icon { background: rgba(20,16,58,.4); color: #fff; }
.chat-inline-image-link { display: block; width: fit-content; max-width: min(100%, 480px); overflow: hidden; border-radius: 10px; line-height: 0; }
.chat-inline-image { display: block; width: auto; max-width: 100%; max-height: 380px; border-radius: 10px; object-fit: contain; cursor: zoom-in; }
.chat-message.mine .chat-inline-image-link { margin-left: auto; }
@media (max-width: 650px) {
  .chat-attachment { min-width: 0; gap: 8px; padding: 8px; }
  .chat-attachment-icon { width: 36px; height: 36px; min-width: 36px; }
  .chat-inline-image { max-height: 300px; }
}
.chat-admin-attachment { display: inline-flex; align-items: center; gap: 7px; color: #6e60d2; font-weight: 650; text-decoration: none; }
.chat-admin-attachment:hover { text-decoration: underline; }

/* A lista de conversas ocupa a barra lateral; colegas aparecem só na busca. */
.chat-room-list { flex: 1 1 auto; min-height: 0; max-height: none !important; }
.chat-search-results-heading { flex: 0 0 35px; margin: 8px 0 2px; }
.chat-room-row { position: relative; display: flex; align-items: center; gap: 3px; margin: 0 0 3px; }
.chat-room-row .chat-room-item { width: auto; min-width: 0; flex: 1 1 auto; }
.chat-room-menu { flex: 0 0 34px; position: relative; }
.chat-room-menu summary { width: 32px; height: 36px; display: grid; place-items: center; list-style: none; border-radius: 8px; color: #a7a9b5; cursor: pointer; opacity: .78; transition: opacity .14s, background .14s; }
.chat-room-row:hover .chat-room-menu summary, .chat-room-menu:focus-within summary, .chat-room-menu[open] summary { opacity: 1; }
.chat-room-menu summary::-webkit-details-marker { display: none; }
.chat-room-menu summary:hover, .chat-room-menu[open] summary { background: #30333d; color: #fff; }
.chat-room-menu-popover { position: fixed; z-index: 10020; min-width: 195px; padding: 5px; border: 1px solid #3d414d; border-radius: 10px; background: #242730; color: #ececf1; box-shadow: 0 12px 32px #0006; }
.chat-room-menu-popover button { width: 100%; min-height: 38px; display: flex; align-items: center; gap: 9px; padding: 0 10px; border: 0; border-radius: 7px; background: transparent; color: inherit; text-align: left; font: 12px Arial, sans-serif; cursor: pointer; }
.chat-room-menu-popover button:hover { background: #343843; }
.chat-room-menu-popover button i { width: 14px; color: #b5b7c3; }
.chat-room-menu-popover button.chat-room-delete-action { color: #ff9aa4; }
.chat-room-menu-popover button.chat-room-delete-action i { color: #ff9aa4; }
.chat-room-menu-popover {
  min-width: 258px;
  padding: 7px;
  border-color: #424550;
  border-radius: 12px;
  background: #22252d;
  box-shadow: 0 16px 38px rgba(0, 0, 0, .42), 0 2px 8px rgba(0, 0, 0, .2);
}
.chat-room-menu-popover button {
  min-height: 58px;
  gap: 11px;
  padding: 7px 9px;
  border-radius: 8px;
  font-family: "Segoe UI", Arial, sans-serif;
}
.chat-room-menu-popover button>i {
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: #333640;
  color: #c7c5d1;
}
.chat-room-menu-popover button:hover { background: #30333d; }
.chat-room-menu-popover .chat-room-menu-copy { display: grid; min-width: 0; flex: 1; gap: 4px; }
.chat-room-menu-popover .chat-room-menu-copy strong { color: #f0eff4; font-size: 12px; font-weight: 650; }
.chat-room-menu-popover .chat-room-menu-copy small { color: #a9aab5; font-size: 10px; line-height: 1.35; }
.chat-room-menu-popover button.chat-room-delete-action { margin-top: 5px; border-top: 1px solid #3a3c45; border-radius: 0 0 8px 8px; color: #ff9aa4; }
.chat-room-menu-popover button.chat-room-delete-action>i { background: #402d34; color: #ff9aa4; }
.chat-room-menu-popover button.chat-room-delete-action:hover { background: #3b2b32; }
.chat-room-menu-popover button.chat-room-delete-action .chat-room-menu-copy strong { color: #ffb0b8; }
@media (max-width: 650px) { .chat-room-menu summary { opacity: 1; } }

/* Seletor Unicode completo com busca, categorias, bandeiras e tons de pele */
.chat-emoji-picker {
  display: block;
  width: min(470px, calc(100vw - 56px));
  height: 500px;
  max-width: 470px;
  max-height: min(500px, 70vh);
  padding: 0;
  overflow: hidden;
  border: 1px solid #484750;
  border-radius: 14px;
  background: #24242a;
}
.chat-emoji-picker[hidden] { display: none; }
.chat-emoji-picker emoji-picker {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 14px;
  --background: #24242a;
  --border-color: #414149;
  --border-radius: 14px;
  --button-hover-background: #3a3942;
  --button-active-background: #454252;
  --indicator-color: #9188ff;
  --emoji-size: 32px;
  --num-columns: 9;
  font-family: "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif;
  --input-border-color: #53525c;
  --input-font-color: #f2f1f6;
  --input-placeholder-color: #aaa9b3;
  --category-font-color: #dedde5;
  --outline-color: #a9a1ff;
}
.chat-emoji-loading {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  color: #d7d5e1;
  font-size: 12px;
}
.chat-emoji-fallback {
  display: grid;
  height: 100%;
  grid-template-columns: repeat(9, minmax(0, 1fr));
  align-content: start;
  gap: 4px;
  padding: 10px;
  overflow: auto;
}
.chat-emoji-fallback button {
  min-height: 46px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #fff;
  font-size: 29px;
  font-family: "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif;
  cursor: pointer;
}
.chat-emoji-fallback button:hover { background: #3a3942; }
#menuPrincipal #btnChat { position: relative; overflow: visible; }
.chat-menu-unread-badge {
  position: absolute;
  top: -13px;
  right: -7px;
  z-index: 2;
  min-width: 19px;
  height: 19px;
  display: grid;
  place-items: center;
  padding: 0 5px;
  border: 2px solid #fff;
  border-radius: 999px;
  background: #b4233a;
  color: #fff;
  box-shadow: 0 1px 3px rgba(25, 17, 30, .18);
  font: 700 10px/1 Arial, sans-serif;
  pointer-events: none;
}
.chat-room-unread-count {
  min-width: 20px;
  height: 20px;
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
  margin-left: 6px;
  padding: 0 6px;
  border: 1px solid rgba(187, 176, 255, .3);
  border-radius: 7px;
  background: #5549b8;
  color: #fff;
  font: 700 11px/1 Arial, sans-serif;
  letter-spacing: .01em;
}
.chat-room-item.has-unread .chat-room-copy strong { color: #fff; font-weight: 800; }
.chat-room-item.has-unread .chat-room-copy small { color: #e0ddff; }
.chat-app .chat-composer textarea:focus {
  border: 0;
  outline: none;
  box-shadow: none;
  background: transparent;
}
.chat-app .chat-messages { scroll-behavior: auto; }
.chat-paste-preview {
  display: flex;
  align-items: center;
  gap: 11px;
  margin: 10px 14px 0;
  padding: 8px 10px;
  border: 1px solid #46454f;
  border-radius: 12px;
  background: #333239;
}
.chat-paste-preview[hidden] { display: none; }
.chat-paste-thumb {
  width: 54px;
  height: 54px;
  flex: 0 0 auto;
  border-radius: 8px;
  background: #202027;
  object-fit: cover;
}
.chat-paste-copy { display: block; min-width: 0; flex: 1; }
.chat-paste-copy strong,
.chat-paste-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-paste-copy strong { color: #f2f1f6; font-size: 12px; }
.chat-paste-copy small { margin-top: 4px; color: #b6b4c0; font-size: 10px; }
.chat-paste-remove {
  display: grid;
  width: 32px;
  height: 32px;
  flex: 0 0 auto;
  place-items: center;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: #c2c0cc;
  cursor: pointer;
}
.chat-paste-remove:hover { background: #484650; color: #fff; }
.chat-message-reactions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  min-height: 28px;
  margin: 6px 3px 0;
}
.chat-reaction-chip,
.chat-reaction-add {
  min-height: 29px;
  border: 1px solid #e6e2e8;
  border-radius: 999px;
  background: #fff;
  color: #4d4652;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease, transform .15s ease;
}
.chat-reaction-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 2px 9px;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2;
}
.chat-reaction-chip:hover,
.chat-reaction-add:hover { border-color: #a99ef5; background: #f5f3ff; }
.chat-reaction-chip:active,
.chat-reaction-add:active { transform: scale(.96); }
.chat-reaction-chip.is-mine {
  border-color: #8f83e8;
  background: #f0edff;
  color: #40359b;
}
.chat-reaction-count { font: 700 11px/1 Arial, sans-serif; }
.chat-reaction-control { position: relative; display: inline-flex; }
.chat-reaction-add {
  position: relative;
  display: grid;
  width: 29px;
  height: 29px;
  min-height: 29px;
  place-items: center;
  padding: 0;
  color: #6358bd;
  font-size: 13px;
}
.chat-reaction-add span {
  position: absolute;
  top: -3px;
  right: 2px;
  font: 700 10px/1 Arial, sans-serif;
}
.chat-reaction-picker {
  position: absolute;
  z-index: 30;
  bottom: calc(100% + 8px);
  left: 0;
  width: min(420px, calc(100vw - 32px));
  height: 450px;
  max-height: 62vh;
  overflow: hidden;
  border: 1px solid #484750;
  border-radius: 14px;
  background: #24242a;
  box-shadow: 0 12px 34px rgba(12, 10, 20, .28);
}
.chat-message.mine .chat-reaction-picker { right: 0; left: auto; }
.chat-reaction-picker[hidden] { display: none; }
.chat-reaction-picker emoji-picker {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 14px;
  --background: #24242a;
  --border-color: #414149;
  --border-radius: 14px;
  --button-hover-background: #3a3942;
  --button-active-background: #454252;
  --indicator-color: #9188ff;
  --emoji-size: 30px;
  --num-columns: 9;
  font-family: "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif;
  --input-border-color: #53525c;
  --input-font-color: #f2f1f6;
  --input-placeholder-color: #aaa9b3;
  --category-font-color: #dedde5;
  --outline-color: #a9a1ff;
}
.chat-message.mine .chat-reaction-chip {
  border-color: rgba(255,255,255,.4);
  background: rgba(255,255,255,.92);
}
.chat-message.mine .chat-reaction-chip.is-mine { border-color: #8f83e8; background: #f0edff; }

.chat-message-reply-button {
  display: grid;
  width: 27px;
  height: 27px;
  place-items: center;
  border: 1px solid #4a4852;
  border-radius: 8px;
  background: #303037;
  color: #d9d6ff;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transition: opacity .15s, background .15s;
}
.chat-message:hover .chat-message-reply-button,
.chat-message:focus-within .chat-message-reply-button { opacity: 1; pointer-events: auto; }
.chat-message-reply-button:hover { background: #48445f; }
.chat-reply-reference {
  display: flex;
  width: min(100%, 430px);
  align-items: center;
  gap: 9px;
  margin: 0 0 9px;
  padding: 8px 10px;
  border: 0;
  border-left: 3px solid #a69cf4;
  border-radius: 5px;
  background: rgba(26, 25, 38, .2);
  color: inherit;
  text-align: left;
  cursor: pointer;
}
.chat-reply-reference>i { flex: 0 0 auto; color: #b8b1ff; }
.chat-reply-reference span { display: grid; min-width: 0; gap: 2px; }
.chat-reply-reference strong { font-size: 10px; }
.chat-reply-reference small { overflow: hidden; color: currentColor; font-size: 11px; opacity: .8; text-overflow: ellipsis; white-space: nowrap; }
.chat-reply-preview {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 8px 14px 0;
  padding: 9px 11px;
  border-left: 3px solid #9185ef;
  border-radius: 8px;
  background: #34333d;
  color: #e9e8f1;
}
.chat-reply-preview[hidden] { display: none; }
.chat-reply-preview>i { color: #bcb5ff; }
.chat-reply-preview>span { display: grid; min-width: 0; gap: 3px; }
.chat-reply-preview strong { font-size: 11px; }
.chat-reply-preview small { overflow: hidden; color: #b8b7c2; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.chat-reply-preview button { display: grid; width: 27px; height: 27px; margin-left: auto; place-items: center; border: 0; border-radius: 7px; background: transparent; color: #cbc9d4; cursor: pointer; }
.chat-reply-preview button:hover { background: #484751; color: #fff; }
.chat-message-highlight .chat-bubble { outline: 2px solid #a69cf4; outline-offset: 3px; transition: outline-color .3s; }
.chat-typing-indicator { min-height: 25px; flex: 0 0 auto; align-self: flex-start; display: flex; align-items: center; gap: 8px; margin: 0 clamp(24px, 6vw, 92px) 4px; padding: 3px 9px; color: #c8c4ff; font: 11px/1.2 "Segoe UI",Arial,sans-serif; }
.chat-typing-indicator[hidden] { display: none; }
.chat-typing-dots { height: 19px; display: inline-flex; align-items: center; gap: 3px; padding: 0 7px; border: 1px solid #44434d; border-radius: 999px; background: #33323a; }
.chat-typing-dots i { width: 4px; height: 4px; display: block; border-radius: 50%; background: #bcb5ff; animation: chatTypingPulse 1.15s infinite ease-in-out; }
.chat-typing-dots i:nth-child(2) { animation-delay: .15s; }
.chat-typing-dots i:nth-child(3) { animation-delay: .3s; }
.chat-typing-text { color: #cbc8d7; }
@keyframes chatTypingPulse { 0%,60%,100% { opacity:.35; transform:translateY(0) } 30% { opacity:1; transform:translateY(-3px) } }
@media(max-width:900px){.chat-typing-indicator{margin-right:22px;margin-left:22px}}
@media(max-width:650px){.chat-typing-indicator{margin:0 12px 3px;font-size:10px}}
.chat-read-receipt { display: inline-flex; width: 15px; height: 15px; flex: 0 0 15px; align-items: center; justify-content: center; margin-left: 3px; vertical-align: middle; }
.chat-read-dot { display: grid; width: 14px; height: 14px; place-items: center; border: 1.5px solid #a49aff; border-radius: 50%; background: transparent; color: #b8b0ff; font: 700 8px/1 Arial, sans-serif; transition: background .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease; }
.chat-read-receipt.is-seen .chat-read-dot { border-color: #9388ff; background: #9388ff; color: #262333; box-shadow: 0 0 0 2px rgba(147,136,255,.12); }

/* Ajuste de hierarquia visual inspirado na lista e no painel do Teams */
@media (min-width: 761px) {
  .chat-app { grid-template-columns: 64px clamp(360px, 24vw, 440px) minmax(0, 1fr); }
  .chat-sidebar { background: #111923; }
  .chat-brand { min-height: 76px; padding: 0 26px; }
  .chat-brand-mark { width: 42px; height: 42px; }
  .chat-brand strong { font-size: 21px; letter-spacing: -.35px; }
  .chat-brand small { font-size: 13px; }
  .chat-sidebar-actions { padding: 12px 22px; }
  .chat-new-button, .chat-icon-button { min-height: 48px; height: 48px; font-size: 14px; }
  .chat-search { height: 44px; margin: 0 22px 12px; }
  .chat-search input { font-size: 14px; }
  .chat-section-heading, .chat-colleague-heading { height: 40px; padding: 0 24px; font-size: 12px; letter-spacing: .15px; }
  .chat-room-list { padding: 0 9px; }
  .chat-room-item { min-height: 78px; gap: 14px; padding: 11px 17px; border-radius: 8px; }
  .chat-room-item .chat-avatar { width: 48px; height: 48px; min-width: 48px; font-size: 15px; }
  .chat-room-copy strong { font-size: 16px; margin-bottom: 5px; }
  .chat-room-copy small { font-size: 13px; }
  .chat-room-item time { font-size: 12px; }
  .chat-user-card { min-height: 80px; padding: 13px 20px; }
  .chat-user-card strong { font-size: 14px; }
  .chat-user-card small { font-size: 11px; }
  .chat-toolbar { min-height: 76px; height: 76px; padding: 0 27px; }
  .chat-toolbar-intro { display: none; }
  .chat-toolbar .chat-room-heading { flex: 1 1 auto; max-width: 48%; }
  .chat-room-heading .chat-avatar { width: 48px; height: 48px; min-width: 48px; }
  .chat-room-heading strong { font-size: 20px; }
  .chat-room-heading small { font-size: 13px; }
  .chat-toolbar-action { min-height: 42px; font-size: 13px; }
  .chat-messages { padding: 30px clamp(28px, 6vw, 104px) 24px; }
  .chat-message { margin-bottom: 18px; }
  .chat-message-author { font-size: 14px; }
  .chat-bubble { padding: 13px 16px; font-size: 16px; line-height: 1.5; }
  .chat-message-time { font-size: 11px; }
  .chat-composer { margin: 0 clamp(20px, 5vw, 78px) 20px; }
  .chat-composer-row { min-height: 64px; }
  .chat-composer textarea { font-size: 16px; }
  .chat-compose-note { font-size: 10px; }
}

@media (max-width: 650px) {
  .chat-emoji-picker { width: min(380px, calc(100vw - 36px)); height: 420px; max-height: 62vh; }
  .chat-reaction-picker { width: min(380px, calc(100vw - 36px)); height: 420px; max-height: 62vh; }
  .chat-message-edit-form { width: min(100%, calc(100vw - 145px)); }
  .chat-message-edit-button { opacity: 1; pointer-events: auto; }
  .chat-message-delete-button { opacity: 1; pointer-events: auto; }
  .chat-message-reply-button { opacity: 1; pointer-events: auto; }
  .chat-emoji-picker emoji-picker { --emoji-size: 27px; --num-columns: 7; }
  .chat-reaction-picker emoji-picker { --emoji-size: 27px; --num-columns: 7; }
  .chat-emoji-fallback { grid-template-columns: repeat(7, minmax(0, 1fr)); }
  .chat-emoji-fallback button { font-size: 27px; }
}

/* Horário e confirmação de leitura ao lado da bolha, como no Teams */
@media (min-width: 761px) {
  .chat-message.mine .chat-bubble-wrap { position: relative; }
  .chat-message.mine .chat-message-meta {
    position: static;
    display: contents;
    min-height: 0;
    margin: 0;
  }
  .chat-message.mine .chat-message-time {
    position: absolute;
    right: 0;
    bottom: -18px;
    display: block;
    margin: 0;
    color: #aaa9b4;
    font-size: 11px;
    line-height: 1.2;
    transition: opacity .15s ease;
  }
  .chat-message.mine .chat-read-receipt {
    position: absolute;
    top: 50%;
    right: -21px;
    margin: 0;
    transform: translateY(-50%);
  }
  .chat-message.mine:hover .chat-message-time,
  .chat-message.mine:focus-within .chat-message-time {
    visibility: visible;
    opacity: 1;
  }

  /* Campo de composição compacto e alinhado, inspirado no Teams */
  .chat-composer {
    margin: 0 clamp(20px, 5vw, 78px) 18px;
    overflow: visible;
    border: 1px solid #55545d;
    border-radius: 9px;
    background: #29292e;
    box-shadow: none;
  }
  .chat-composer:focus-within {
    border-color: #7a71d7;
    box-shadow: 0 0 0 1px rgba(122, 113, 215, .22);
  }
  .chat-composer-row {
    min-height: 58px;
    align-items: center;
    gap: 5px;
    padding: 5px 9px 5px 14px;
  }
  .chat-composer textarea {
    order: 1;
    min-height: 42px;
    padding: 12px 4px;
    font: 16px/1.45 "Segoe UI", Arial, sans-serif;
  }
  .chat-composer-tool {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 7px;
    color: #c7c6ce;
  }
  #chatEmojiToggle { order: 2; }
  #chatAttachButton { order: 3; }
  .chat-composer-tool:hover { background: #3b3a43; color: #fff; }
  .chat-send-button {
    order: 4;
    width: 40px;
    height: 38px;
    min-width: 40px;
    margin-left: 4px;
    border-left: 1px solid #4b4a52;
    border-radius: 0 6px 6px 0;
    background: transparent;
    color: #d4d2dc;
    box-shadow: none;
  }
  .chat-send-button:hover:not(:disabled) { background: #3b3a43; color: #fff; }
  .chat-compose-note {
    padding: 6px 14px;
    border-radius: 0 0 8px 8px;
    background: #25252a;
    font-size: 10px;
  }
}

.chat-date-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin: 18px auto 24px;
  color: #aaa9b4;
  font: 12px/1.3 "Segoe UI", Arial, sans-serif;
}
.chat-date-divider::before,
.chat-date-divider::after {
  width: auto;
  flex: 1 1 auto;
  height: 1px;
  background: #414149;
  content: "";
}
.chat-date-divider span {
  padding: 0 2px;
  color: #b7b6c0;
  background: transparent;
  white-space: nowrap;
}
@media (hover: hover) {
  .chat-message .chat-message-time { visibility: hidden; opacity: 0; transition: opacity .15s ease; }
  .chat-message:hover .chat-message-time,
  .chat-message:focus-within .chat-message-time { visibility: visible; opacity: 1; }
}

/* Ao rolar até o chat, o painel usa quase toda a altura disponível */
@media (min-width: 761px) {
  body:not(.modo-login) #conteudo.conteudo-chat { padding-top: 8px; padding-bottom: 12px; }
  .chat-app {
    height: max(680px, calc(100vh - 105px));
    min-height: 680px;
    max-height: none;
  }
}

.chat-user-card .chat-presence-toggle {
  display: inline-flex;
  min-width: 72px;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 6px 8px;
  border: 1px solid #424650;
  border-radius: 7px;
  background: #20252e;
  color: #e3e4eb;
  font: 600 11px "Segoe UI", Arial, sans-serif;
  cursor: pointer;
}
.chat-user-card .chat-presence-toggle:hover { background: #2c313b; }
.chat-user-card .chat-presence-toggle .fa-chevron-down { font-size: 8px; color: #a4a6b0; }
.chat-online-dot.is-online, .chat-presence-toggle .is-online, .chat-presence-options .is-online { color: #55d69a; }
.chat-online-dot.is-away, .chat-presence-toggle .is-away, .chat-presence-options .is-away { color: #f0b64e; }
.chat-presence-note { margin: 0 0 12px; color: #b6b5c0; font-size: 12px; line-height: 1.5; }
.chat-presence-options { display: grid; gap: 7px; }
.chat-presence-options button {
  display: flex;
  min-height: 64px;
  align-items: center;
  gap: 12px;
  padding: 9px 12px;
  border: 1px solid #414149;
  border-radius: 9px;
  background: #25252b;
  color: #ecebf1;
  text-align: left;
  cursor: pointer;
}
.chat-presence-options button:hover, .chat-presence-options button.is-selected { border-color: #7167bf; background: #302e3c; }
.chat-presence-options button>span { display: grid; flex: 1; gap: 4px; }
.chat-presence-options button strong { font-size: 13px; }
.chat-presence-options button small { color: #b6b5c0; font-size: 11px; }
.chat-presence-options button>i:last-child:not(:first-child) { color: #b7afff; }

.chat-modal.chat-profile-modal {
  width: min(560px, calc(100vw - 32px));
  padding: 25px 27px 22px;
  border-color: #45454f;
  border-radius: 16px;
  background: linear-gradient(155deg, #2d2d35, #25252b 72%);
}
.chat-modal.chat-profile-modal header { margin-bottom: 20px; padding-bottom: 15px; border-color: #414149; }
.chat-modal.chat-group-modal {
  width: min(680px, calc(100vw - 36px));
  max-height: min(90vh, 820px);
  padding: 25px 28px 23px;
  border: 1px solid #494852;
  border-radius: 20px;
  background: linear-gradient(155deg, #2d2d35, #25252b 72%);
  box-shadow: 0 28px 80px rgba(0, 0, 0, .52), inset 0 1px 0 rgba(255,255,255,.035);
}
.chat-modal.chat-group-modal header { margin-bottom: 21px; padding-bottom: 16px; border-bottom: 1px solid #414149; }
.chat-modal.chat-group-modal header h2 { color: #f4f3f7; font: 700 20px "Segoe UI", Arial, sans-serif; letter-spacing: -.25px; }
.chat-modal.chat-group-modal header .chat-icon-button { width: 42px; height: 42px; border: 1px solid #34343c; border-radius: 11px; background: #20232b; color: #d9d8e0; }
.chat-modal.chat-group-modal header .chat-icon-button:hover { border-color: #514b75; background: #353342; color: #fff; }
.chat-modal.chat-group-modal form>label { margin-bottom: 17px; color: #dedde5; font: 650 12px "Segoe UI", Arial, sans-serif; }
.chat-modal.chat-group-modal form>label input:not([type=file]),
.chat-modal.chat-group-modal form>label select { height: 46px; margin-top: 8px; padding: 0 13px; border-color: #4a4953; border-radius: 10px; background: #202026; color: #f4f3f7; font: 13px "Segoe UI", Arial, sans-serif; }
.chat-modal.chat-group-modal form>label input::placeholder { color: #92919d; }
.chat-modal.chat-group-modal fieldset { margin: 19px 0 0; padding: 12px 14px 13px; border-color: #4a4953; border-radius: 13px; background: rgba(255,255,255,.015); }
.chat-modal.chat-group-modal legend { padding: 0 7px; color: #e7e5ee; font: 650 12px "Segoe UI", Arial, sans-serif; }
.chat-modal.chat-group-modal .chat-member-picker { max-height: min(34vh, 280px); grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 10px; }
.chat-modal.chat-group-modal .chat-member-picker label { min-height: 46px; gap: 9px; padding: 6px 8px; border: 1px solid transparent; border-radius: 9px; color: #dedde5; font: 11px "Segoe UI", Arial, sans-serif; transition: background .15s, border-color .15s; }
.chat-modal.chat-group-modal .chat-member-picker label:hover { border-color: #484653; background: #33323a; }
.chat-modal.chat-group-modal .chat-member-picker input { width: 16px; height: 16px; flex: 0 0 16px; accent-color: #796be2; }
.chat-modal.chat-group-modal .chat-member-picker .chat-avatar { width: 32px; height: 32px; min-width: 32px; font-size: 9px; }
.chat-modal.chat-group-modal .chat-form-note { margin: 10px 0 0; color: #aaa9b4; font: 11px "Segoe UI", Arial, sans-serif; }
.chat-modal.chat-group-modal form>footer { display: flex; justify-content: flex-end; gap: 10px; margin-top: 19px; padding-top: 17px; border-top: 1px solid #414149; }
.chat-modal.chat-group-modal form>footer button { min-height: 42px; padding: 0 17px; border-radius: 10px; font: 650 12px "Segoe UI", Arial, sans-serif; }
.chat-modal.chat-group-modal form>footer .chat-secondary { border: 1px solid #44434c; background: #383840; color: #e5e4eb; }
.chat-modal.chat-group-modal form>footer .chat-secondary:hover { background: #44434c; }
.chat-modal.chat-group-modal form>footer .chat-primary { background: #6758d2; box-shadow: 0 7px 16px rgba(65,53,166,.28); }
.chat-modal.chat-group-modal form>footer .chat-primary:hover { background: #786be3; }
@media (max-width: 560px) {
  .chat-modal.chat-group-modal { width: calc(100vw - 24px); padding: 19px 17px 17px; }
  .chat-modal.chat-group-modal .chat-member-picker { grid-template-columns: 1fr; max-height: 34vh; }
}
.chat-modal.chat-profile-modal header h2 { font: 700 19px "Segoe UI", Arial, sans-serif; letter-spacing: -.2px; }
.chat-profile-form { display: grid; gap: 20px; }
.chat-profile-hero { display: flex; align-items: center; gap: 17px; padding: 2px 1px 4px; }
.chat-profile-avatar { position: relative; flex: 0 0 auto; padding: 4px; border: 1px solid #5b567d; border-radius: 50%; background: #34323f; }
.chat-profile-avatar .chat-avatar.profile-large { width: 76px; height: 76px; min-width: 76px; margin: 0; border: 2px solid #29292f; }
.chat-profile-hero>div:last-child { min-width: 0; }
.chat-profile-hero strong { color: #f4f3f7; font-size: 14px; }
.chat-profile-hero p { margin: 5px 0 0; color: #b9b8c3; font-size: 12px; line-height: 1.5; }
.chat-profile-field { display: grid; gap: 8px; color: #dedde5; font-size: 12px; font-weight: 650; }
.chat-profile-field input:not([type=file]) { width: 100%; height: 44px; padding: 0 12px; border: 1px solid #4a4953; border-radius: 9px; outline: none; background: #202026; color: #f4f3f7; font: 14px "Segoe UI", Arial, sans-serif; }
.chat-profile-field input:not([type=file]):focus { border-color: #8277eb; box-shadow: 0 0 0 3px rgba(130, 119, 235, .16); }
.chat-profile-field input::placeholder { color: #8f8e99; }
.chat-profile-field-title { color: #dedde5; font-size: 12px; font-weight: 650; }
.chat-profile-upload-row { display: flex; min-width: 0; align-items: center; gap: 12px; }
.chat-profile-upload { display: inline-flex; min-height: 38px; flex: 0 0 auto; align-items: center; gap: 8px; padding: 0 12px; border: 1px solid #555361; border-radius: 8px; background: #35343e; color: #ecebf2; font-size: 12px; font-weight: 650; cursor: pointer; transition: background .15s, border-color .15s; }
.chat-profile-upload:hover { border-color: #8277eb; background: #403d50; }
.chat-profile-upload i { color: #b9b2ff; }
.chat-profile-file-input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.chat-profile-file-input:focus-visible + span { outline: 2px solid #8277eb; outline-offset: 3px; }
.chat-profile-upload-row>span { min-width: 0; overflow: hidden; color: #aeadb8; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.chat-profile-form footer { display: flex; justify-content: flex-end; gap: 9px; margin-top: 2px; padding-top: 17px; border-top: 1px solid #414149; }
.chat-profile-form footer button { min-height: 40px; padding: 0 16px; border-radius: 8px; font-size: 12px; }
.chat-profile-form footer .chat-primary { background: #6658cf; }
.chat-profile-form footer .chat-primary:hover { background: #7669e3; }
.chat-profile-form footer .chat-primary i { margin-right: 6px; }
@media (max-width: 520px) {
  .chat-modal.chat-profile-modal { padding: 19px 17px 16px; }
  .chat-profile-hero { gap: 12px; }
  .chat-profile-avatar .chat-avatar.profile-large { width: 64px; height: 64px; min-width: 64px; }
  .chat-profile-upload-row { align-items: flex-start; flex-direction: column; gap: 8px; }
}