<div class="rounded-3xl border border-slate-200 bg-white p-5 shadow-soft">
  <h2 class="text-lg font-bold text-slate-900">Firm Admin Wizards & Setup Shortcuts</h2>
  <p class="mt-1 text-sm text-slate-500">These cards link to existing setup screens and focused Firm Admin onboarding flows. They do not remove the existing system settings screens.</p>
  <div class="mt-5 grid gap-4 md:grid-cols-2 xl:grid-cols-3">
    <a href="/firm-admin/users/new?role=partner" class="rounded-2xl border border-brand-200 bg-brand-50 p-4 hover:bg-brand-100"><div class="font-semibold text-brand-900">Add Partner</div><p class="mt-1 text-sm text-brand-700">Create partner user, link employee master and generate invite.</p><div class="mt-3 text-xs font-semibold text-brand-700">Open</div></a>
    <a href="/firm-admin/users/new?role=manager" class="rounded-2xl border border-brand-200 bg-brand-50 p-4 hover:bg-brand-100"><div class="font-semibold text-brand-900">Add Manager</div><p class="mt-1 text-sm text-brand-700">Creates user with Branch Manager role.</p><div class="mt-3 text-xs font-semibold text-brand-700">Open</div></a>
    <a href="/firm-admin/users/new?role=staff" class="rounded-2xl border border-brand-200 bg-brand-50 p-4 hover:bg-brand-100"><div class="font-semibold text-brand-900">Add Staff</div><p class="mt-1 text-sm text-brand-700">Create staff user, employee master and invite link.</p><div class="mt-3 text-xs font-semibold text-brand-700">Open</div></a>
    <a href="/firm-admin/users/new?role=consultant" class="rounded-2xl border border-violet-200 bg-violet-50 p-4 hover:bg-violet-100"><div class="font-semibold text-violet-900">Add Consultant</div><p class="mt-1 text-sm text-violet-700">Create consultant login, consultant profile and invite link without creating an employee record.</p><div class="mt-3 text-xs font-semibold text-violet-700">Open</div></a>
    {% for wizard in wizards %}
    <a href="{{ wizard.href }}" class="rounded-2xl border border-slate-200 p-4 hover:border-brand-200 hover:bg-brand-50/40"><div class="font-semibold text-slate-900">{{ wizard.title }}</div><p class="mt-1 text-sm text-slate-500">{{ wizard.desc }}</p><div class="mt-3 text-xs font-semibold text-brand-700">Open</div></a>
    {% endfor %}
  </div>
</div>
