{% extends "admin_base.html" %}
{% import "macros/workspace_ui.html" as ui %}
{% block page_title %}Care members{% endblock %}
{% block extra_head %}
<link rel="stylesheet" href="/plugins/care-circle/assets/css/care-circle.ui.css?v={{ asset_version | default(value='1') }}">
{% endblock %}
{% block admin_content %}
<section class="blocks-workspace mx-auto w-full max-w-6xl px-4 py-6 md:px-6" aria-label="Care members">
<div data-care-page-notice>{{ ui::notice() }}</div>
<p class="blocks-workspace-help">Manage care members and their support relationships. Open a person to review their particulars. Relatives and caretakers join through enrollment invitations.</p>
{{ ui::fetch_list(config_url="/plugins/care-circle/assets/admin/members_list.json", mount_id="care-members", label="Care members; scroll horizontally if needed", colspan=8, custom_mount=true, loading="Loading members…") }}
<div id="care-person-modal" class="crud-modal" aria-hidden="true" role="dialog" aria-modal="true" aria-labelledby="care-person-modal-title">
  <div class="modal-content">
    <div class="modal-header"><h2 id="care-person-modal-title">Add person</h2><button type="button" class="close-modal" aria-label="Close">&times;</button></div>
    <div class="modal-body">{{ ui::notice() }}<div id="care-person-form-fields"></div></div>
  </div>
</div>
</section>
{% endblock %}