{% extends "base.html" %}
{% block title %}{{ 'Edit' if user else 'Add' }} User · WageWise Neo{% endblock %}
{% block content %}

<div class="page-header">
    <div>
        <div class="eyebrow">Users</div>
        <h1>{{ 'Edit User' if user else 'Add User' }}</h1>
    </div>
</div>

<div class="panel" style="max-width:480px;">
    {% if error %}
    <div style="background:var(--color-due-bg);color:var(--color-due);border:1px solid var(--color-due);border-radius:var(--radius-sm);padding:8px 12px;margin-bottom:16px;font-size:13px;">
        {{ error }}
    </div>
    {% endif %}

    <form method="post">
        <div class="form-grid">
            <div class="field" style="grid-column:1/-1;">
                <label>Full Name *</label>
                <input type="text" name="full_name" required value="{{ user.full_name if user else '' }}">
            </div>
            {% if not user %}
            <div class="field" style="grid-column:1/-1;">
                <label>Username *</label>
                <input type="text" name="username" required placeholder="e.g. priya.hr" autocomplete="off">
                <span class="field-hint">Lowercase letters and dots only. Cannot be changed later.</span>
            </div>
            {% endif %}
            <div class="field">
                <label>Role *</label>
                <select name="role">
                    {% for r in ['admin','hr','accountant','viewer'] %}
                    <option value="{{ r }}" {{ 'selected' if user and user.role == r }}>
                        {{ r | title }}
                    </option>
                    {% endfor %}
                </select>
            </div>
            {% if user %}
            <div class="field">
                <label>Status</label>
                <select name="active">
                    <option value="1" {{ 'selected' if user.active }}>Active</option>
                    <option value="0" {{ 'selected' if not user.active }}>Inactive</option>
                </select>
            </div>
            {% endif %}
            <div class="field" style="grid-column:1/-1;">
                <label>{{ 'New Password (leave blank to keep current)' if user else 'Password *' }}</label>
                <input type="password" name="password" {{ 'required' if not user }} autocomplete="new-password" minlength="6">
                <span class="field-hint">Minimum 6 characters.</span>
            </div>
        </div>
        <div class="actions-row">
            <button type="submit" class="btn btn-primary">{{ 'Save Changes' if user else 'Create User' }}</button>
            <a href="{{ url_for('users_list') }}" class="btn btn-secondary">Cancel</a>
        </div>
    </form>
</div>

{% endblock %}