<div class="card">
  <div class="card-body">
    <!-- Content Preview -->
    <div class="bg-neutral-100 rounded-lg mb-4 flex justify-center min-h-[160px] max-h-[240px] overflow-hidden">
      <%= render partial: to_grid_partial_path(submission.content), locals: { content: submission.content } %>
    </div>

    <!-- Content Info -->
    <div class="space-y-3">
      <div>
        <h3 class="text-h4 text-neutral-900 truncate">
          <%= link_to submission.content.name.presence || "Untitled Content", submission.content, class: "hover:text-brand transition-colors" %>
        </h3>
        <p class="text-caption text-neutral-500 mt-1">
          <span class="capitalize"><%= submission.content.type&.downcase || "content" %></span>
          &middot;
          <%= time_ago_in_words(submission.created_at) %> ago
        </p>
      </div>

      <div class="text-sm text-neutral-600 space-y-1">
        <p>
          <span class="font-medium text-neutral-700">Feed:</span>
          <%= link_to submission.feed.name, submission.feed, class: "text-brand hover:text-brand-600" %>
          (<%= submission.feed.group.name %>)
        </p>
        <p>
          <span class="font-medium text-neutral-700">By:</span>
          <% if submission.content.user %>
            <%= link_to submission.content.user.display_name, submission.content.user, class: "text-brand hover:text-brand-600" %>
          <% else %>
            Unknown
          <% end %>
        </p>
        <p>
          <span class="font-medium text-neutral-700">Duration:</span>
          <%= submission.content.duration ? "#{submission.content.duration}s" : "Default" %>
        </p>
        <p>
          <span class="font-medium text-neutral-700">Schedule:</span>
          <%= schedule_summary(submission.content) %>
        </p>
      </div>
    </div>

    <% if submission.pending? %>
      <div class="mt-4 pt-4 border-t border-neutral-200">
        <%= render "submissions/moderation_actions", submission: submission %>
      </div>
    <% elsif submission.rejected? && submission.moderation_reason.present? %>
      <div class="mt-4 pt-4 border-t border-neutral-200">
        <p class="text-sm text-neutral-600">
          <span class="font-medium text-neutral-700">Rejection reason:</span>
          <%= submission.moderation_reason %>
        </p>
      </div>
    <% end %>
  </div>
</div>
