<?= $this->extend('layouts/main') ?>

<?= $this->section('title') ?>Tambah grup admin<?= $this->endSection() ?>

<?= $this->section('content') ?>
<div class="space-y-6">
    <div class="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
        <div>
            <h1 class="text-2xl font-semibold text-gray-900">Tambah grup</h1>
            <p class="mt-1 text-sm text-gray-500">Nama unik, huruf/angka/garis bawah, maks. 20 karakter (disimpan huruf kecil). Untuk pembatasan satu cabang, gunakan nama <code class="rounded bg-gray-100 px-1 text-xs">supervisor</code> dan pastikan pengguna punya assign pegawai dengan <code class="rounded bg-gray-100 px-1 text-xs">kantor</code> benar.</p>
        </div>
        <a href="<?= site_url('admin/panel/groups') ?>" class="inline-flex items-center rounded-lg border border-gray-200 bg-white px-4 py-2 text-sm font-medium text-gray-800 shadow-sm hover:bg-gray-50">
            <i class="fa-solid fa-arrow-left mr-2 text-gray-500"></i> Kembali
        </a>
    </div>

    <?= view('layouts/partials/admin_alert', ['errors' => $errors ?? []]) ?>

    <section class="rounded-2xl border border-gray-200 bg-white p-6 shadow-sm">
        <form method="post" action="<?= site_url('admin/panel/groups/store') ?>" class="grid max-w-xl gap-4">
            <?= csrf_field() ?>
            <div>
                <label class="mb-1 block text-xs font-medium text-gray-600">Nama grup *</label>
                <input name="name" value="<?= esc(old('name', '')) ?>" required maxlength="20" pattern="[a-zA-Z0-9_]+" autocomplete="off" class="w-full rounded-lg border border-gray-300 px-3 py-2 text-sm shadow-sm" placeholder="supervisor">
                <p class="mt-1 text-xs text-gray-500">Hanya a-z, 0-9, underscore. Tidak boleh <code class="rounded bg-gray-100 px-1">webmaster</code>.</p>
            </div>
            <div>
                <label class="mb-1 block text-xs font-medium text-gray-600">Deskripsi *</label>
                <input name="description" value="<?= esc(old('description', '')) ?>" required maxlength="100" class="w-full rounded-lg border border-gray-300 px-3 py-2 text-sm shadow-sm" placeholder="Supervisor cabang">
            </div>
            <div class="flex flex-wrap gap-3 pt-2">
                <button type="submit" class="rounded-lg bg-blue-600 px-5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-blue-700">Simpan</button>
                <a href="<?= site_url('admin/panel/groups') ?>" class="inline-flex items-center rounded-lg border border-gray-200 px-5 py-2.5 text-sm font-medium text-gray-800 hover:bg-gray-50">Batal</a>
            </div>
        </form>
    </section>
</div>
<?= $this->endSection() ?>
