/* Compact receipts and attachments in both client and staff discussions. */
.message-author-row{display:flex;align-items:center;gap:7px;min-width:0;margin:0 0 6px}
.message-author-avatar{display:inline-flex;flex:none;line-height:1}
body .message-author-row .message-avatar{position:relative;display:grid;place-items:center;width:27px;height:27px;min-width:27px;flex:none;overflow:hidden;border:1px solid var(--line);border-radius:50%;background:var(--hover);color:var(--text);font-size:10px;font-weight:600;line-height:1}
.message-avatar .user-avatar-image{position:absolute;inset:0;display:block;width:100%;height:100%;max-height:none;object-fit:cover;border-radius:inherit}
.message-avatar:has(>.user-avatar-image)>.avatar-initials{visibility:hidden}
body .message-author-row>.author,body #task-content .message-author-row>.message-author{display:block;min-width:0;margin:0;line-height:1.35;overflow-wrap:anywhere}
body .message-delivery,body .message-delivery.viewed{font-size:11px;font-weight:400;letter-spacing:-1.5px;line-height:1;color:var(--muted);opacity:.72;margin-left:5px}
body .message .message-footer,body #task-content .message .message-footer{display:flex;align-items:center;justify-content:flex-end;gap:5px;flex-wrap:nowrap;margin-top:5px;min-height:13px;color:var(--muted)}
body .message .message-footer time,body #task-content .message .message-footer time{float:none;display:inline;margin:0;font-size:10px;line-height:1.3;font-weight:400;color:var(--muted);white-space:nowrap}
body .message .message-footer .message-edited{font-size:10px;line-height:1.3;font-weight:400;color:var(--muted);white-space:nowrap}
body .message .message-footer .message-delivery{display:inline-flex;align-items:center;justify-content:center;margin:0;letter-spacing:normal;opacity:.78;flex:none}
body .message .message-delivery svg,body #task-content .message .message-delivery svg{width:15px;height:11px;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}
body .message .message-delivery:not(.viewed) svg,body #task-content .message .message-delivery:not(.viewed) svg{width:11px}
body .message .message-actions[hidden],body #task-content .message .message-actions[hidden]{display:none!important}
body .message.grouped,body #task-content .message.grouped{padding-top:8px}
body .message.mine,body #task-content .message.own{background:color-mix(in srgb,var(--green) 9%,var(--field));border:1px solid color-mix(in srgb,var(--green) 19%,var(--line))}
.message-attachments{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0;max-width:100%}
.message-attachments:empty{display:none}
.message .text-quote{display:block;border-left:2px solid var(--line);padding-left:9px;color:var(--muted)}
body textarea[hidden]{display:none!important}
.message-attachment{display:flex;flex-direction:column;justify-content:space-between;gap:6px;width:126px;max-width:100%;min-width:0;height:134px;padding:8px;box-sizing:border-box;border:1px solid var(--line);border-radius:10px;background:var(--field);overflow:hidden}
body .message-attachment .attachment-preview,body #task-content .message-attachment .screenshot-button,body #task-content .message-attachment .message-video{width:100%;height:76px;min-height:0;max-height:76px;margin:0;border:0;border-radius:6px;overflow:hidden;background:transparent}
body .message-attachment img,body .message-attachment video,body #task-content .message-attachment img,body #task-content .message-attachment video{display:block;width:100%;height:96px;max-height:96px;object-fit:contain;border-radius:6px;background:color-mix(in srgb,var(--text) 4%,transparent)}
.message-attachment .attachment-name{font-size:11px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text)}
.message-attachment .attachment-download{font-size:11px;font-weight:500;color:var(--muted);background:transparent;border:0;padding:0;text-align:left;text-decoration:none;cursor:pointer}
.message-attachment .attachment-document{display:grid;place-items:center;height:68px;font-size:28px;color:var(--muted)}
body .message-attachment .message-video small{display:none}
body .composer>.row{justify-content:flex-end;gap:8px}
body .composer>.row .chat-file-count{order:-1;margin-right:auto}
body .composer>.row .message-text-tools{margin-right:auto}
body .composer>.row .media-button{margin-left:0;margin-right:0}
body #task-content .composer-bottom>.screenshot-attach{margin-left:auto!important;margin-right:0!important}
.message-context-menu,.text-format-menu{position:fixed;z-index:10000;display:flex;flex-direction:column;gap:2px;min-width:175px;max-height:calc(100vh - 16px);overflow:auto;padding:5px;background:var(--panel,var(--field));color:var(--text);border:1px solid var(--line);border-radius:8px;box-shadow:0 8px 28px #0003}
.message-context-menu button,.text-format-menu button{border:0!important;background:transparent;color:var(--text);border-radius:4px;padding:8px 12px;font-size:12px;font-weight:500;text-align:left;cursor:pointer}
.message-context-menu button:hover,.text-format-menu button:hover,.message-context-menu button:focus-visible,.text-format-menu button:focus-visible{background:var(--hover)}
.message-context-menu .context-danger{color:var(--red,#d97676)}
body .message-text-tools{position:relative;flex:none;color:var(--muted);font-size:12px}
.message-text-tools>summary{list-style:none;cursor:pointer;padding:7px;border-radius:5px}
.message-text-tools>div{position:absolute;bottom:calc(100% + 7px);left:0;z-index:20;display:flex;flex-wrap:wrap;width:230px;padding:5px;border:1px solid var(--line);border-radius:6px;background:var(--panel);box-shadow:0 6px 18px #0002}
.message-text-tools button{font-size:11px!important;padding:6px!important;background:transparent;color:var(--text)}
body .composer .editor-surface{min-height:0;width:100%}
body .composer .rich-editor{box-sizing:border-box;min-height:64px;max-height:180px;overflow:auto;padding:10px 12px;border:1px solid var(--line);border-radius:6px;background:var(--field);color:var(--text);font-size:13px;line-height:1.5;cursor:text;white-space:pre-wrap;overflow-wrap:anywhere}
body .composer .rich-editor:empty:before,body .rich-editor:has(>div:only-child>br:only-child):before{content:attr(data-placeholder);color:var(--muted);pointer-events:none}
body .rich-editor[contenteditable=false]{opacity:.65;cursor:default}
body .editor-surface:has(>.message-text-tools),body #task-content .editor-surface:has(>.text-toolbox){position:relative;overflow:visible!important}
body .editor-surface>.message-text-tools,body #task-content .editor-surface>.text-toolbox{position:absolute!important;inset:auto auto 5px 5px!important;display:block!important;width:fit-content;margin:0!important;padding:0!important;border:0!important;background:transparent!important;z-index:8;pointer-events:auto}
body .editor-surface>.message-text-tools>summary,body #task-content .editor-surface>.text-toolbox>summary{padding:5px 7px;font-size:12px;line-height:16px;color:var(--muted);border-radius:4px}
body .editor-surface>.message-text-tools>summary:hover,body #task-content .editor-surface>.text-toolbox>summary:hover{background:var(--hover)!important}
body .editor-surface:has(>.message-text-tools)>.rich-editor,body #task-content .editor-surface:has(>.text-toolbox)>.rich-editor{padding:10px 12px 38px!important;border-radius:6px}
body #task-content .editor-surface>.text-toolbox .text-tools{position:absolute;top:auto;bottom:calc(100% + 5px);left:0;max-width:calc(100vw - 70px);flex-wrap:wrap;min-width:0;width:max-content;padding:5px;background:var(--panel)!important;border:1px solid var(--line);border-radius:6px;box-shadow:0 4px 16px #0002}
body #client-request-form .rich-editor,body #modal .rich-editor{min-height:130px;padding:12px;border:1px solid var(--line);border-radius:6px;background:var(--field);color:var(--text);overflow:auto;max-height:350px;white-space:pre-wrap;cursor:text}
@media(max-width:600px){.message-attachment{width:112px;height:126px}}
body .message.system-message,body #task-content .message.system-message{display:flex!important;align-items:flex-start;align-self:center!important;gap:9px;width:fit-content!important;max-width:calc(100% - 18px)!important;margin:10px auto!important;padding:10px 13px!important;float:none;border:1px solid var(--line)!important;border-left:3px solid color-mix(in srgb,var(--green) 65%,var(--line))!important;border-radius:8px!important;background:color-mix(in srgb,var(--field) 88%,transparent)!important;color:var(--text)!important;box-shadow:none!important;font-size:12px;line-height:1.5;box-sizing:border-box}.system-message-icon{flex:none;display:grid;place-items:center;width:19px;height:23px;color:var(--green)}.system-message-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.system-message>div{min-width:0}.system-message strong{display:block;margin-bottom:2px;font-size:10px;font-weight:600;color:var(--muted)}body .message.system-message p,body #task-content .message.system-message p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;font-weight:500;line-height:1.5}body .message.system-message time,body #task-content .message.system-message time{display:block;float:none;margin:4px 0 0;color:var(--muted);font-size:10px;text-align:right}.message.system-reopened{border-left-color:var(--line)!important}.system-reopened .system-message-icon{color:var(--muted)}

body .message.system-message,body #task-content .message.system-message{align-items:center;padding:5px 8px!important;border:0!important;border-left:0!important;background:transparent!important;border-radius:0!important;gap:7px;color:var(--muted)!important}
.system-message>div{display:flex;align-items:baseline;justify-content:center;gap:5px 9px;flex-wrap:wrap}
body .message.system-message p,body #task-content .message.system-message p{font-size:11px;font-weight:500;text-align:center;color:var(--muted)}
body .message.system-message time,body #task-content .message.system-message time{display:inline;margin:0;font-size:9px;white-space:nowrap}
.system-message-icon{width:16px;height:19px;color:var(--muted)}.system-message-icon svg{width:15px;height:15px}.system-completed .system-message-icon{color:var(--green)}
