{% extends "base.html" %}
{% set active_nav = "my-organization" %}

{% block title %}Add User - My Organization - LSMC Atlas{% endblock %}

{% block content %}
<div class="page-header">
    <div>
        <h1 class="page-title">Invite User</h1>
        <p class="page-subtitle">{{ revision.name }}</p>
    </div>
    <a href="/my-organization/users" class="btn btn-ghost">← Back to Users</a>
</div>

{% if error %}
<div class="alert alert-danger mb-lg">{{ error }}</div>
{% endif %}

<div class="card">
    <form method="post" class="form">
        <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
        
        <div class="form-group">
            <label for="email" class="form-label required">Email</label>
            <input type="email" id="email" name="email" class="form-input" required
                   placeholder="user@example.com">
        </div>
        
        <div class="form-group">
            <label for="name" class="form-label">Name</label>
            <input type="text" id="name" name="name" class="form-input"
                   placeholder="Full Name">
        </div>
        
        <div class="form-group">
            <label for="cognito_group" class="form-label required">Cognito Group</label>
            <select id="cognito_group" name="cognito_group" class="form-input" required>
                <option value="">Select Cognito Group</option>
                {% for group in cognito_groups %}
                <option value="{{ group.name }}"
                        {% if current_cognito_group == group.name %}selected{% endif %}>
                    {{ group.name }} — {{ group.roles|join(', ') }}
                </option>
                {% endfor %}
            </select>
            <small class="form-hint">The selected group determines the user's Atlas roles via Cognito group membership.</small>
        </div>
        
        <div class="form-actions">
            <button type="submit" class="btn btn-primary">Invite User</button>
            <a href="/my-organization/users" class="btn btn-ghost">Cancel</a>
        </div>
    </form>
</div>
{% endblock %}