.person-row .avatar i{background:#a9b0ac}.person-row .avatar i.online{background:#38a169}.chat-header small i{background:#a9b0ac}.chat-header small i.online{background:#35a368}.message-bubble footer span{font-size:8px}.message-bubble footer .receipt.delivered{color:rgba(255,255,255,.62)}.message-bubble footer .receipt.read{color:#71e0b8;font-weight:700}

/* Keep the composer pinned while only message history scrolls. */
.messages-drawer {
  height: 100vh;
  height: 100dvh;
  max-height: 100dvh;
  overflow: hidden;
}

.messages-drawer .message-layout {
  flex: 1 1 auto;
  height: 0;
  min-height: 0;
  overflow: hidden;
}

.messages-drawer .chat {
  height: 100%;
  min-height: 0;
  overflow: hidden;
}

.messages-drawer .chat-header,
.messages-drawer .message-form {
  flex: 0 0 auto;
}

.messages-drawer .chat-messages {
  flex: 1 1 0;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.messages-drawer .people-list {
  min-height: 0;
  overflow-y: auto;
}