{% extends "base.html" %}

{% block title %}Profile & Settings | TrustForge{% endblock %}
{% block meta_description %}Manage your TrustForge profile, workspace memberships, and account settings.{% endblock %}

{% block content %}
<section class="py-5">
  <div class="container">
    <div class="d-flex justify-content-between align-items-start flex-wrap gap-3 mb-4">
      <div>
        <div class="tf-eyebrow">Profile settings</div>
        <h1 class="tf-page-title">Your account identity</h1>
        <p class="tf-page-subtitle">Update your login profile and review which TrustForge workspaces you belong to.</p>
      </div>
      {% if current_membership and current_membership.can_manage_workspace %}
      <a class="btn tf-btn tf-btn-secondary" href="{% url 'workspace_settings' %}">Workspace settings</a>
      {% elif not current_membership %}
      <a class="btn tf-btn tf-btn-primary" href="{% url 'business_onboarding' %}">Create workspace</a>
      {% endif %}
    </div>

    <div class="row g-4">
      <div class="col-lg-7">
        <div class="tf-panel h-100">
          <h2 class="h4 mb-3">Account details</h2>
          <form method="post" class="row g-3">
            {% csrf_token %}
            <div class="col-md-6">
              <label class="form-label">First name</label>
              {{ form.first_name }}
            </div>
            <div class="col-md-6">
              <label class="form-label">Last name</label>
              {{ form.last_name }}
            </div>
            <div class="col-12">
              <label class="form-label">Email</label>
              {{ form.email }}
              <div class="small text-secondary-emphasis mt-2">This email is also your login and password reset destination.</div>
            </div>
            <div class="col-12 pt-2">
              <button type="submit" class="btn tf-btn tf-btn-primary">Save profile</button>
            </div>
          </form>
        </div>
      </div>
      <div class="col-lg-5">
        <div class="tf-panel h-100">
          <h2 class="h4 mb-3">Workspace access</h2>
          <div class="d-grid gap-3">
            {% for membership in memberships %}
            <div class="tf-team-member{% if current_membership and membership.business_id == current_membership.business_id %} tf-team-member-active{% endif %}">
              <div>
                <strong>{{ membership.business.name }}</strong>
                <div class="small text-secondary-emphasis">{{ membership.business.primary_city }}, {{ membership.business.primary_state }}</div>
              </div>
              <div class="text-end">
                <span class="tf-status-pill tf-role-pill">{{ membership.get_role_display }}</span>
                {% if current_membership and membership.business_id == current_membership.business_id %}
                <div class="small text-secondary-emphasis mt-1">Current workspace</div>
                {% endif %}
              </div>
            </div>
            {% empty %}
            <div class="tf-empty-state text-start">
              <h3 class="h5 mb-2">No workspace yet</h3>
              <p class="text-secondary-emphasis mb-4">Create your first business workspace to turn TrustForge into a real tenant-scoped SaaS account.</p>
              <a class="btn tf-btn tf-btn-primary" href="{% url 'business_onboarding' %}">Create workspace</a>
            </div>
            {% endfor %}
          </div>
        </div>
      </div>
    </div>
  </div>
</section>
{% endblock %}