<%= messages_tag(card) do %>
  <% if card.published? %>
    <%= render partial: "cards/comments/comment", collection: card.comments.chronologically, cached: true %>
    <%= render "cards/comments/new", card: card %>

    <div class="comments__subscribers flex flex-column margin-block-start txt-align-start full-width">
      <strong class="txt-uppercase">Subscribers</strong>

      <p class="margin-none-block-start margin-block-end-half">
        <%= pluralize(@card.watchers.without(User.system).count, "person") %> will be notified when someone comments on this.
      </p>

      <div class="flex align-center flex-wrap gap-half max-width txt-normal">
        <% prepend_current_user_to(@card.watchers.without(User.system).alphabetically).each do |watcher| %>
          <%= avatar_tag watcher %>
        <% end %>
      </div>
    </div>
  <% end %>

  <div class="txt-align-center full-width flex flex-column margin-block-start-double">
    <hr class="separator--horizontal full-width margin-block" style="--border-color: var(--color-ink-lighter)">
    <%= button_to_delete_card(@card) %>
  </div>
<% end %>
