<div class="card flex cursor-pointer border-2 px-4 items-end relative">
  <div class="max-w-[160px] absolute bottom-0">
    <%= image_tag bot.image_url, class: "object-fit -ml-8" %>
  </div>
  <div class="flex flex-col gap-1 p-2 h-full w-64 ml-[130px]">
    <div class="text-gray-800 font-bold">
      <a href="/admin/bots/<%= bot.id.presence || 'new' %>" class="region-link">
        <%= bot.name %>
      </a>
    </div>
    <div class="text-sm text-gray-700">
      <%= truncate bot.intro, length: 100 %>
    </div>
    <div class="text-xs italic text-gray-700">
      <%= truncate bot.directive, length: 200 %>
    </div>
    <div class="text-xs text-gray-700">
      <% if bot.published_at %>
        <span class="text-green-500">Published</span>
        <%= time_ago_in_words bot.published_at %> ago
      <% else %>
        <span class="text-red-500">Draft</span>
      <% end %>
    </div>
  </div>
</div>
