/* Reply under an inbound text or email on the lead's timeline, and the message
   being answered, quoted at the top of the composer above the From line.
   public/js/timeline-reply.js. */

/* In line with the words of the entry above it: the same 46px .tl-shots uses,
   which is the icon plus the gap beside it, and dropped at the same width. */
.tl-reply { padding: 0 0 10px 46px; }
@media (max-width: 700px) { .tl-reply { padding-left: 0; } }

.reply-quote {
  border: 1px solid var(--border);
  border-left: 3px solid var(--blue);
  border-radius: 8px;
  background: #f8fafc;
  padding: 8px 10px;
  margin-bottom: 10px;
}
.reply-quote .rq-head { display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; }
.reply-quote .rq-head svg { width: 14px; height: 14px; vertical-align: -2px; }
.reply-quote .rq-label { flex: 1; min-width: 0; }
.reply-quote .rq-when { font-weight: 400; color: var(--muted); margin-left: 4px; }
.reply-quote .rq-subj { font-weight: 600; font-size: 13px; margin-top: 4px; }
/* A long email scrolls inside its own box rather than pushing the message being
   written below the fold, which would defeat seeing both on one screen. */
.reply-quote .rq-body {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font-size: 13px;
  margin-top: 4px;
  max-height: 9.5em;
  overflow: auto;
}