/* A conversation's drawn paper, as WhatsApp's: a tile of line drawings used as a mask over the ink token, so the stroke takes the theme. */
.ds-wallpaper {
  position: absolute;
  inset: 0;
  background-color: var(--ds-wallpaper-ink);
  mask-repeat: repeat;
  mask-position: left bottom;
  pointer-events: none;
}

.ds-wallpaper--chat { mask-image: url("/assets/wallpapers/chat-999c5568.svg"); }
.ds-wallpaper--customer-support { mask-image: url("/assets/wallpapers/customer-support-8afed6d0.svg"); }
.ds-wallpaper--top { mask-position: left top; }

/* Any other list of messages hangs the same paper: the host opens its own layer and the paper sits under everything in it, so nothing inside needs a position. */
.ds-wallpaper-host { position: relative; isolation: isolate; }
.ds-wallpaper-host > .ds-wallpaper { z-index: -1; }

/* The module's own drawing, large, in the tile's line: the mark of an empty pane laid on the paper. */
.ds-wallpaper-mark {
  inline-size: 96px;
  block-size: 96px;
  background-color: var(--ds-text-muted);
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
}

.ds-wallpaper-mark--customer-support { mask-image: url("/assets/wallpapers/customer-support-mark-d1786371.svg"); }