/* What a reply answers, above its words (replies/_quote). The Reply that
   starts one on a comment is the comment's own (comments.css). */
@layer components {
  /* A quote's bar, the same for a reply's quote and for an older reply's
     blockquote in a chat line (messages.css keeps that one's margins): a
     thick start bar in the hairline's ink, so a quote reads as someone
     else's before a word of it is read. The words a step down, the air and
     the place are utilities in the markup (replies/_quote). */
  .reply-quote,
  .messages .message__content blockquote {
    padding-inline-start: 1.5ch;
    border-inline-start: var(--inline-space-half) solid var(--color-line);
  }

  /* Room for the × at the end of the head, which is the first line. */
  .reply-quote:has(.reply-quote__remove) {
    padding-inline-end: 2.65em;
  }

  /* Words picked are plain text: their breaks and a code line's indent are
     the writer's. */
  .reply-quote__words--picked {
    white-space: pre-wrap;
  }

  .reply-quote__remove {
    position: absolute;
    inset-block-start: 0;
    inset-inline-end: 0;
  }
}