.ui-icon { width: 18px; height: 18px; display: block; flex: 0 0 auto; }
.messages-layout .icon-btn,
.messages-layout .message-btn,
.messages-layout .chat-attach,
.messages-layout .chat-send-btn,
.messages-layout .empty-action { display: inline-flex; align-items: center; justify-content: center; gap: 7px; }
.messages-layout .icon-btn { width: 42px; min-height: 42px; padding: 0; }
.messages-layout .conversation-tools { display: flex; gap: 5px; }
.messages-layout .conversation-chevron { display: inline-flex; color: var(--muted); transform: rotate(180deg); }
.messages-layout .conversation-chevron .ui-icon { width: 15px; height: 15px; }
.messages-layout .chat-back { display: none; }
.messages-layout .chat-head-copy { min-width: 0; }
.messages-layout .chat-empty { margin: auto; color: var(--muted); text-align: center; }
.messages-layout .chat-empty strong { display: block; color: var(--text); }
.messages-layout .empty-chat-icon { display: grid; place-items: center; width: 56px; height: 56px; margin: 0 auto 14px; border: 1px solid var(--line); border-radius: 18px; color: var(--purple); background: rgba(112,67,220,.12); }
.messages-layout .empty-chat-icon .ui-icon { width: 27px; height: 27px; }
.messages-layout .picker-close { gap: 6px; }
.messages-layout .picker-close .ui-icon { width: 15px; height: 15px; }
.messages-layout .chat-attach { position: relative; padding: 0; }
.messages-layout .chat-attach .ui-icon { width: 19px; height: 19px; }
.messages-layout .chat-send-btn { min-width: 112px; }
.messages-layout .picker-person b { display: inline-flex; color: var(--purple); }
.messages-layout .picker-person b .ui-icon { width: 17px; height: 17px; }

@media (max-width: 760px) {
  .messages-layout { display: block; min-height: 640px; }
  .messages-layout.has-chat-list .conversations { display: block; border-right: 0; }
  .messages-layout.has-chat-list .chat,
  .messages-layout.has-chat-list .messages-empty-pane { display: none; }
  .messages-layout.has-active-chat .conversations,
  .messages-layout.has-active-chat .messages-empty-pane { display: none; }
  .messages-layout.has-active-chat .chat { display: flex; min-height: 640px; }
  .messages-layout.has-active-chat .chat-back { display: inline-flex; margin-right: 2px; }
  .messages-layout .conversation { width: calc(100% - 16px); min-height: 64px; margin: 6px 8px; padding: 10px 12px; }
  .messages-layout .conversation-title { min-height: 60px; padding: 9px 12px 9px 16px; }
  .messages-layout .chat-head { padding: 10px 12px; }
  .messages-layout .chat-messages { min-height: 420px; padding: 16px 12px; }
  .messages-layout .chat-form { padding: 10px; }
  .messages-layout .chat-send-btn { min-width: 96px; padding: 0 12px; }
  .messages-layout .message-picker { position: fixed; top: max(70px, env(safe-area-inset-top) + 64px); right: 12px; left: 12px; width: auto; }
}