<?php /** @var array $artists */ ?>
<div class="p-8 max-w-5xl">
  <div class="text-xs uppercase tracking-[0.3em] text-gold"><?= e(t('admin.artists.kicker')) ?></div>
  <h1 class="mt-2 text-3xl font-display"><?= e(t('admin.artists.title')) ?></h1>

  <section class="mt-8 bg-ink/40 border border-white/10 rounded-xl p-6">
    <h2 class="text-sm uppercase tracking-widest text-gold mb-4"><?= e(t('admin.artists.add_new')) ?></h2>
    <form method="POST" action="<?= url('/admin/artists') ?>" class="grid grid-cols-2 gap-4">
      <?= csrf_field() ?>
      <div><label class="label"><?= e(t('admin.artists.display_name')) ?></label><input name="display_name" required class="input"></div>
      <div><label class="label"><?= e(t('admin.artists.instagram')) ?></label><input name="instagram_handle" placeholder="lorenzodiazink" class="input"></div>
      <div class="col-span-2"><label class="label"><?= e(t('admin.artists.specialties')) ?></label><input name="specialties" placeholder="realism, lettering" class="input"></div>
      <div class="col-span-2"><label class="label"><?= e(t('admin.artists.bio')) ?></label><textarea name="bio" rows="3" class="input"></textarea></div>
      <div class="col-span-2"><button class="btn-gold"><?= e(t('admin.artists.create_btn')) ?></button></div>
    </form>
  </section>

  <section class="mt-8 grid md:grid-cols-2 lg:grid-cols-3 gap-4">
    <?php foreach ($artists as $a): ?>
      <div class="bg-ink/40 border border-white/10 rounded-xl p-5 flex gap-4">
        <div class="w-16 h-16 rounded-md bg-white/5 overflow-hidden shrink-0">
          <?php if (!empty($a['avatar_url'])): ?><img src="<?= e(url($a['avatar_url'])) ?>" class="w-full h-full object-cover"><?php endif; ?>
        </div>
        <div class="flex-1 min-w-0">
          <div class="text-lg font-display truncate"><?= e($a['display_name'] ?? '') ?></div>
          <div class="text-[10px] uppercase tracking-widest text-gold/70"><?= e(implode(' · ', (array)($a['specialties'] ?? []))) ?></div>
          <div class="mt-3 flex gap-3 text-xs">
            <a href="<?= url('/admin/artists/' . e($a['id'])) ?>" class="text-gold hover:underline"><?= e(t('common.edit')) ?></a>
            <a href="<?= url('/admin/artists/' . e($a['id']) . '/schedule') ?>" class="text-bone/60 hover:text-bone"><?= e(t('admin.artists.schedule')) ?></a>
          </div>
        </div>
      </div>
    <?php endforeach; ?>
  </section>
</div>
