<div id="itemsRoot" data-guild-id="<%= selectedGuildId ? selectedGuildId : '' %>" class="p-4 bg-gray-800/50 rounded">
  <div class="flex items-center justify-between mb-4">
    <h2 class="text-white text-lg font-semibold">Items</h2>
    <div>
  <a id="createItemBtn" href="/items/lab?guild=<%= selectedGuildId %>" class="inline-flex items-center gap-2 px-3 py-1 bg-indigo-600 rounded text-white">Crear item</a>
    </div>
  </div>

  <div id="pageAlert" class="hidden mb-3"></div>
  <div id="itemsList" class="space-y-3">
    <!-- items will be rendered here by /assets/js/dashboard_items.js -->
  </div>

  <% if (!selectedGuildId) { %>
    <div id="itemsHint" class="mt-3 text-yellow-300">Selecciona un servidor en la barra lateral o inicia sesión para administrar items.</div>
  <% } %>

  <!-- Modal / form skeleton (minimal) -->
  <div id="itemModal" class="hidden fixed inset-0 items-center justify-center bg-black/60">
    <div class="bg-[#061427] p-4 rounded w-11/12 max-w-3xl">
      <div class="flex items-center justify-between mb-2">
        <h3 id="modalTitle" class="text-white text-lg">Crear item</h3>
        <button id="cancelItemBtn" class="text-white">✕</button>
      </div>
      <div id="modalError" class="hidden text-red-400 mb-2"></div>
      <form id="itemForm">
        <input id="itemId" type="hidden" />
        <div class="grid grid-cols-2 gap-2">
          <label class="text-white/80">Key <input id="fieldKey" class="w-full" /></label>
          <label class="text-white/80">Name <input id="fieldName" class="w-full" /></label>
          <label class="text-white/80">Category <input id="fieldCategory" class="w-full" /></label>
          <label class="text-white/80">Icon <input id="fieldIcon" class="w-full" /></label>
          <label class="text-white/80">Description <input id="fieldDescription" class="w-full" /></label>
          <label class="text-white/80">Tags <input id="fieldTags" class="w-full" /></label>
        </div>
        <div class="mt-3 flex justify-end gap-2">
          <button type="button" id="cancelItemBtnBottom" class="px-3 py-1 bg-gray-600 rounded text-white">Cancelar</button>
          <button type="submit" class="px-3 py-1 bg-indigo-600 rounded text-white">Guardar</button>
        </div>
      </form>
    </div>
  </div>

  <script src="/assets/js/dashboard_items.js" defer></script>
</div>
