/* Conversation view (threads.js): list rows, the folded reader and nudges. */

/* List rows: "Ana, me, Bo 3". */
.msg .from .name .who-name { font-weight: inherit; }
.msg .from .name b.who-name { font-weight: 700; }
.msg:not(.unread) .from .name b.who-name { font-weight: 700; }
.conv-count { margin-left: 4px; font-size: 12px; font-weight: 400; color: var(--text-3); }

/* Nudges. */
.nudge {
  display: inline-flex; align-items: center; gap: 2px; margin-right: 8px; font-weight: 500;
  color: #9A4E00; font-size: 13px;
}
:root[data-scheme="dark"] .nudge { color: #F2B36B; }
.nudge-x {
  border: 0; background: none; color: inherit; cursor: pointer; font-size: 15px; line-height: 1;
  padding: 0 4px; border-radius: 50%; opacity: .7;
}
.nudge-x:hover { background: var(--hover); opacity: 1; }

/* The reader: one card per message. */
.reader .mcard { border-bottom: 1px solid var(--line); padding: 12px 0; margin-left: -56px; padding-left: 56px; }
.reader .mcard.only { border-bottom: 0; }
.reader .mcard .hdr { margin-left: -56px; }
.reader .mcard .hdr.foldable { cursor: pointer; }
.reader .mcard .body { margin: 16px 0 8px; }
.reader .msg-tools { display: flex; align-items: center; gap: 2px; margin-top: -6px; }
.reader .fold-row {
  display: flex; align-items: center; gap: 12px; cursor: pointer; margin-left: -56px; min-height: 40px;
  border-radius: 8px; padding-right: 8px;
}
.reader .fold-row:hover, .reader .fold-row:focus-visible { background: var(--hover); outline: none; }
.reader .fold-row .avatar { flex: none; }
.reader .fold-who { flex: none; font-weight: 600; max-width: 30%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.reader .mcard.folded:not(.unread) .fold-who { font-weight: 500; }
.reader .fold-snippet { flex: 1; min-width: 0; color: var(--text-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.reader .fold-date { flex: none; font-size: 12px; color: var(--text-3); }
.reader .fold-more {
  display: flex; align-items: center; gap: 12px; width: calc(100% + 56px); margin-left: -56px; padding: 8px 0;
  border: 0; border-bottom: 1px solid var(--line); background: none; color: var(--accent-ink); font: inherit; cursor: pointer; text-align: left;
}
.reader .fold-more:hover { background: var(--hover); }
.reader .fold-more-n {
  display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 50%;
  border: 1px solid var(--line); background: var(--surface); color: var(--text-2); font-weight: 600;
}
.reader h1 .expand-all { vertical-align: middle; float: right; }

/* Trimmed quotes. */
.quote-toggle {
  display: inline-block; margin: 4px 0; padding: 0 8px; height: 16px; line-height: 12px; border-radius: 8px;
  border: 1px solid var(--line); background: var(--surface-2); color: var(--text-2); cursor: pointer; font-size: 12px; letter-spacing: 1px;
}
.quote-toggle:hover { background: var(--hover); }
.reader pre.text.quoted { color: var(--text-3); margin-top: 8px; }

/* Settings > General. */
.conv-radios { display: flex; flex-direction: column; gap: 4px; }

@media (max-width: 860px) {
  .reader .mcard, .reader .mcard .hdr, .reader .fold-row, .reader .fold-more { margin-left: 0; padding-left: 0; }
  .reader .fold-more { width: 100%; }
}