{% extends "base.html" %}
{% import 'components/macros.html' as ui %}

{% block title %}Edit Admin Details{% endblock %}
{% block head_extra %}
<link rel="stylesheet" href="/static/hil-pages/edit_admin.css">
{% endblock %}
{% block content %}
<div class="header">
    <h1 class="brand">Gvelo Enterprise Platform — Edit Admin Details</h1>
</div>

<div class="container">
    <div class="card">
        <h2>Edit Your Details</h2>

        {% if error %}
        <div class="error">{{ error }}</div>
        {% endif %}

        <form method="POST" action="/admin/edit">
            <div class="form-group">
                <label>Username</label>
                <input type="text" name="username" value="{{ user[1] }}" required>
            </div>

            <div class="form-group">
                <label>Email</label>
                <input type="email" name="email" value="{{ user[2] or '' }}" placeholder="Enter email address">
            </div>

            <div class="form-group">
                <label>Role</label>
                <input type="text" class="readonly-field" value="{{ user[3] }}" readonly>
            </div>

            <div class="form-group">
                <label>Shop ID</label>
                <input type="text" class="readonly-field" value="{{ user[4] }}" readonly>
            </div>

            <button type="submit" class="btn">Save Changes</button>
            {{ ui.button('Cancel', '/admin', 'secondary') }}
        </form>
    </div>
</div>
{% endblock %}