/* ------------------------------------------------------------------
   Messages enhancements
   - WhatsApp-style: unread conversations in bold
   - Read receipts: single grey tick = sent, double green tick = read
   Applies to both the header Messages dropdown and the /messages page,
   since both render __feeds_conversation.tpl (.feeds-item).
------------------------------------------------------------------ */

/* Unread conversation -> bold name + preview (like WhatsApp) */
.feeds-item.unread .name {
  font-weight: 700;
}

.feeds-item.unread .text {
  font-weight: 600;
  color: #1c1e21;
}

body.night-mode .feeds-item.unread .text {
  color: var(--text-night, #e4e6eb);
}

/* Read conversation keeps the normal (lighter) weight */
.feeds-item .name {
  font-weight: 500;
}

/* Read receipt ticks shown on messages the viewer sent */
.feeds-item .msg-receipt {
  display: inline-flex;
  align-items: center;
  margin-right: 4px;
  font-size: 12px;
  line-height: 1;
  vertical-align: middle;
}

.feeds-item .msg-receipt.sent {
  color: #8a8d91;
}

.feeds-item .msg-receipt.read {
  color: #1aa539;
}

/* RTL: ticks sit on the other side of the preview */
html[dir="rtl"] .feeds-item .msg-receipt,
body.rtl .feeds-item .msg-receipt {
  margin-right: 0;
  margin-left: 4px;
}

/* ------------------------------------------------------------------
   Inside an open chat: read receipts on the messages you sent.
   Ticks are rendered for every "right" (mine) message but only shown
   in 1:1 conversations (container gets .is-direct). In group chats the
   ticks stay hidden and the textual "Seen by" line is used instead.
------------------------------------------------------------------ */

/* hide ticks everywhere by default; reveal only in 1:1 conversations */
.conversation .msg-receipt {
  display: none;
}

/* The bubble's .time is absolutely positioned below the bubble (top:100%),
   so the tick is placed on that same row, just to the right of the time. */
.is-direct .conversation.right .conversation-body .time {
  padding-right: 18px;
}

.is-direct .conversation.right .msg-receipt {
  display: inline-block;
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: 3px;
  font-size: 11px;
  line-height: 1;
}

.is-direct .conversation.right .msg-receipt.sent {
  color: #8a8d91;
}

.is-direct .conversation.right .msg-receipt.read {
  color: #1aa539;
}

/* in 1:1 the ticks replace the textual "Seen by" line */
.is-direct .conversation .seen {
  display: none;
}
