.order-note-emoji-trigger{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;width:34px;height:34px;margin:5px 4px;padding:5px;border:1px solid var(--touch-theme-border,#c5d9df);border-radius:10px;background:var(--touch-theme-hover,#edf8fc);color:var(--touch-theme-text,#35536a);cursor:pointer}.order-note-emoji-trigger:hover{background:#ffedc9;color:#9a5b0c;box-shadow:0 0 0 2px #f2b75d44}.order-note-emoji-trigger:focus-visible{outline:2px solid #e8a340;outline-offset:2px}#orderNoteEmojiPicker[hidden]{display:none!important}#orderNoteEmojiPicker{position:fixed;z-index:100300;display:grid;grid-template-columns:repeat(6,36px);gap:3px;padding:10px;box-sizing:border-box;border:1px solid var(--touch-theme-border,#c5d9df);border-radius:15px;background:var(--touch-theme-surface,#fff);color:var(--touch-theme-text,#263645);box-shadow:0 10px 35px #0004;max-width:calc(100vw - 16px);max-height:60dvh;overflow:auto}#orderNoteEmojiPicker button{display:grid;place-items:center;width:36px;height:36px;padding:0;border:0;border-radius:9px;background:transparent;cursor:pointer;font:24px/1 'Apple Color Emoji','Segoe UI Emoji','Noto Color Emoji',sans-serif}#orderNoteEmojiPicker button:hover,#orderNoteEmojiPicker button:focus-visible{background:var(--touch-theme-hover,#edf8fc);outline:2px solid #7cc8d6;outline-offset:-2px}
html[data-touch-theme] #mainOrderList .commentsChat .comment .dele{display:inline-flex!important;align-items:center!important;justify-content:center!important;box-sizing:border-box!important;width:26px!important;height:26px!important;padding:5px!important;border:1px solid #d19a9a66!important;border-radius:8px!important;background:#fff1f1!important;color:#bd5261!important;cursor:pointer!important;line-height:1!important;box-shadow:none!important;transition:background .14s,box-shadow .14s}html[data-touch-theme] #mainOrderList .commentsChat .comment .dele:hover{background:#ffe0e4!important;color:#a72f46!important;box-shadow:0 0 0 2px #db6b7c33!important}html[data-touch-theme] #mainOrderList .commentsChat .comment .dele svg{display:block;width:15px;height:15px;flex:none}html[data-touch-theme=dark] #mainOrderList .commentsChat .comment .dele{background:#4b3038!important;color:#ffb6c2!important;border-color:#9a5b6b!important}html[data-touch-theme=dark] #mainOrderList .commentsChat .comment .dele:hover{background:#663946!important;color:#ffd4dc!important}

/* Keep comment controls in normal flow, separate from metadata. */
html[data-touch-theme] #mainOrderList .commentsChat .admin.comment>.wrap{position:relative!important;padding-right:0!important}
html[data-touch-theme] #mainOrderList .commentsChat .admin.comment .info{display:flex!important;align-items:center!important;flex-wrap:wrap!important;gap:4px 8px!important;width:auto!important;max-width:100%!important;box-sizing:border-box!important;margin-right:0!important;padding-right:0!important}
html[data-touch-theme] #mainOrderList .commentsChat .admin.comment .info>.cell{display:inline!important;float:none!important;white-space:normal!important}
html[data-touch-theme] #mainOrderList .commentsChat .order-comment-actions{display:flex!important;align-items:center!important;justify-content:flex-end!important;clear:both!important;gap:6px!important;margin:7px 0 0!important;padding:0!important;width:100%!important;box-sizing:border-box!important}
html[data-touch-theme] #mainOrderList .commentsChat .order-comment-actions :is(.dele,.order-comment-edit-button){position:static!important;inset:auto!important;float:none!important;margin:0!important;transform:none!important;flex:0 0 28px!important;width:28px!important;height:28px!important;box-sizing:border-box!important;vertical-align:middle!important}

#orderNoteEmojiPicker{display:flex!important;flex-direction:column!important;width:300px;max-height:min(420px,70dvh);padding:10px!important;gap:8px!important}#orderNoteEmojiPicker[hidden]{display:none!important}#orderNoteEmojiPicker .emoji-toolbar{display:grid;gap:6px;flex:none}#orderNoteEmojiPicker .emoji-toolbar :is(input,select){width:100%!important;min-width:0!important;box-sizing:border-box!important;height:34px!important;padding:5px 8px!important;border:1px solid var(--touch-theme-border,#c4d6e1);border-radius:8px;background:var(--touch-theme-surface,#fff);color:var(--touch-theme-text,#263645);font:12px system-ui}#orderNoteEmojiPicker .emoji-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px;overflow:auto;min-height:70px;max-height:260px;overscroll-behavior:contain}#orderNoteEmojiPicker .emoji-grid button{width:100%!important;min-width:0!important;height:34px!important}#orderNoteEmojiPicker .emoji-more{width:100%!important;font:12px system-ui;height:30px}#orderNoteEmojiPicker .emoji-count{font:11px system-ui;color:var(--touch-theme-muted,#627685)}
html[data-touch-theme] body.menu-item-1 #body #content #mainOrderList#mainOrderList .commentsChat .admin.comment:not(.empty):not(.new){padding:8px 10px!important;margin-top:4px!important;margin-bottom:4px!important;min-height:0!important;height:auto!important;border-radius:12px!important;background:hsl(var(--comment-author-hue,200) 48% 94%)!important;border-color:hsl(var(--comment-author-hue,200) 42% 65%)!important;color:#263645!important}html[data-touch-theme=dark] body.menu-item-1 #body #content #mainOrderList#mainOrderList .commentsChat .admin.comment:not(.empty):not(.new){background:hsl(var(--comment-author-hue,200) 25% 24%)!important;border-color:hsl(var(--comment-author-hue,200) 32% 48%)!important;color:#e7edf2!important}
html[data-touch-theme] #mainOrderList .commentsChat .admin.comment .info{font-size:11px!important;gap:3px 7px!important;margin-top:3px!important}html[data-touch-theme] #mainOrderList .commentsChat .admin.comment .info .order-comment-actions{display:inline-flex!important;clear:none!important;width:auto!important;margin:0 0 0 auto!important;gap:4px!important;flex:0 0 auto!important}html[data-touch-theme] #mainOrderList .commentsChat .order-comment-actions :is(.dele,.order-comment-edit-button){width:24px!important;height:24px!important;flex-basis:24px!important;padding:4px!important}

#orderNoteEmojiPicker .emoji-more[hidden]{display:none!important}

/* Conversation bubbles grow to their text; only the available viewport limits width. */
html[data-touch-theme] body.menu-item-1 #body #content #mainOrderList#mainOrderList .commentsChat :is(.container,.center,.adminNotes){width:100%!important;max-width:none!important;min-width:0!important;box-sizing:border-box!important}
html[data-touch-theme] body.menu-item-1 #body #content #mainOrderList#mainOrderList .commentsChat .adminNotes{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:4px!important;clear:both!important}
html[data-touch-theme] body.menu-item-1 #body #content #mainOrderList#mainOrderList .commentsChat .admin.comment:not(.empty):not(.new){display:block!important;float:none!important;clear:none!important;width:max-content!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important;margin:0!important;align-self:flex-start!important}
html[data-touch-theme] body.menu-item-1 #body #content #mainOrderList#mainOrderList .commentsChat .admin.comment[data-chat-side=right]{align-self:flex-end!important}
html[data-touch-theme] body.menu-item-1 #body #content #mainOrderList#mainOrderList .commentsChat .admin.comment>.wrap{width:auto!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important}
html[data-touch-theme] body.menu-item-1 #body #content #mainOrderList#mainOrderList .commentsChat .admin.comment .message{display:block!important;float:none!important;white-space:normal!important;word-break:normal!important;overflow-wrap:anywhere!important;max-width:none!important;width:auto!important;font-size:13px!important;line-height:1.4!important}
@media(max-width:700px){html[data-touch-theme] body.menu-item-1 #body #content #mainOrderList#mainOrderList .commentsChat .admin.comment:not(.empty):not(.new){max-width:calc(100% - 12px)!important}}

/* Center the shared conversation column at the width of its widest bubble. */
html[data-touch-theme] body.menu-item-1 #body #content #mainOrderList#mainOrderList .commentsChat .adminNotes{width:max-content!important;max-width:100%!important;min-width:0!important;margin-left:auto!important;margin-right:auto!important;box-sizing:border-box!important}
html[data-touch-theme] body.menu-item-1 #body #content #mainOrderList#mainOrderList .commentsChat .admin.comment:not(.empty):not(.new){background:hsl(var(--comment-author-hue,200) 60% 94%)!important;border-color:hsl(var(--comment-author-hue,200) 58% 62%)!important}
html[data-touch-theme=dark] body.menu-item-1 #body #content #mainOrderList#mainOrderList .commentsChat .admin.comment:not(.empty):not(.new){background:hsl(var(--comment-author-hue,200) 35% 25%)!important;border-color:hsl(var(--comment-author-hue,200) 48% 50%)!important}

/* Compact rounded composer, centered in the same conversation area. */
html[data-touch-theme] body.menu-item-1 #body #content #mainOrderList#mainOrderList .commentsChat .new.comment{float:none!important;clear:both!important;width:min(680px,100%)!important;min-width:0!important;max-width:100%!important;box-sizing:border-box!important;margin:8px auto 4px!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;border-radius:14px!important;height:auto!important;min-height:0!important}
html[data-touch-theme] body.menu-item-1 #body #content #mainOrderList#mainOrderList .commentsChat .new.comment>span{display:flex!important;align-items:center!important;gap:6px!important;box-sizing:border-box!important;width:100%!important;max-width:100%!important;min-width:0!important;padding:5px 6px 5px 12px!important;border:1px solid var(--touch-theme-border,#accad5)!important;border-radius:14px!important;background:var(--touch-theme-surface,#fff)!important;box-shadow:0 2px 8px #102c3910!important}
html[data-touch-theme] body.menu-item-1 #body #content #mainOrderList#mainOrderList .commentsChat .new.comment>span:focus-within{border-color:#69becf!important;box-shadow:0 0 0 2px #63c8db33!important}
html[data-touch-theme] body.menu-item-1 #body #content #mainOrderList#mainOrderList .commentsChat .new.comment input[name=note]{display:block!important;flex:1 1 0!important;width:0!important;min-width:0!important;max-width:100%!important;box-sizing:border-box!important;height:36px!important;line-height:1.35!important;padding:5px 0!important;margin:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;outline:none!important;color:var(--touch-theme-text,#263645)!important;font:13px/1.35 system-ui!important}
html[data-touch-theme] body.menu-item-1 #body #content #mainOrderList#mainOrderList .commentsChat .new.comment .order-note-emoji-trigger{display:inline-flex!important;flex:0 0 34px!important;width:34px!important;min-width:34px!important;height:34px!important;margin:0!important;padding:6px!important;border:0!important;border-radius:10px!important;box-sizing:border-box!important;background:var(--touch-theme-hover,#edf8fc)!important}
html[data-touch-theme] body.menu-item-1 #body #content #mainOrderList#mainOrderList .commentsChat .new.comment input[type=hidden]{display:none!important}

/* Center both order notes and customer notes, 20261110. */
html[data-touch-theme] body.menu-item-1 #body #content #mainOrderList#mainOrderList .commentsChat .comment:is(.supplierNote,.clientNote):not(.empty):not(.new){display:block!important;float:none!important;clear:both!important;width:max-content!important;max-width:calc(100% - 16px)!important;min-width:0!important;box-sizing:border-box!important;margin:8px auto!important;white-space:normal!important;overflow-wrap:anywhere!important}