{% extends "tenant/layouts/base.html" %}
{% block title %}Staff{% endblock %}
{% block content %}
<div class="d-flex justify-content-between align-items-center mb-4">
  <h4 class="fw-bold mb-0"><i class="bi bi-person-badge me-2"></i>Staff</h4>
  <a href="{{ url_for('staff.create') }}" class="btn btn-primary btn-sm">+ New Staff Member</a>
</div>
<div class="card shadow-sm">
  <div class="table-responsive">
    <table class="table table-hover mb-0">
      <thead class="table-light"><tr><th>Name</th><th>Phone</th><th>Type</th><th>Pay Type</th><th>Status</th><th>Actions</th></tr></thead>
      <tbody>
        {% for s in staff_list %}
        <tr class="{{ '' if s.is_active else 'text-muted' }}">
          <td class="fw-semibold">{{ s.name }}</td>
          <td class="small">{{ s.phone }}</td>
          <td class="small">{{ s.staff_type.replace('_',' ').title() }}</td>
          <td class="small">{{ s.pay_type.title() }}</td>
          <td><span class="badge {{ 'bg-success' if s.is_active else 'bg-secondary' }}">{{ 'Active' if s.is_active else 'Inactive' }}</span></td>
          <td>
            <a href="{{ url_for('staff.edit', staff_id=s.id) }}" class="btn btn-outline-secondary btn-sm">Edit</a>
            <a href="{{ url_for('staff.reset_passcode', staff_id=s.id) }}" class="btn btn-outline-warning btn-sm">Reset PIN</a>
          </td>
        </tr>
        {% else %}
        <tr><td colspan="6" class="text-center text-muted py-4">No staff members yet.</td></tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
</div>
{% endblock %}