{% extends "base.html" %}
{% block title %}Личный кабинет — EvoSync{% endblock %}

{% block content %}
<div class="row justify-content-center">
    <div class="col-sm-10 col-md-7 col-lg-6">
        <div class="card shadow-sm mt-4">
            <div class="card-header">
                <h1 class="h5 mb-0"><i class="bi bi-person-circle me-2"></i>Личный кабинет</h1>
            </div>
            <ul class="list-group list-group-flush">
                <li class="list-group-item d-flex justify-content-between">
                    <span class="text-muted small">Имя</span>
                    <span>{{ user.first_name }}</span>
                </li>
                <li class="list-group-item d-flex justify-content-between">
                    <span class="text-muted small">Фамилия</span>
                    <span>{{ user.last_name }}</span>
                </li>
                <li class="list-group-item d-flex justify-content-between">
                    <span class="text-muted small">Email</span>
                    <span>{{ user.email }}</span>
                </li>
                <li class="list-group-item d-flex justify-content-between">
                    <span class="text-muted small">Телефон</span>
                    <span>{{ user.phone }}</span>
                </li>
            </ul>
            <div class="card-body d-grid gap-2">
                <a href="/profile/edit" class="btn btn-primary">
                    <i class="bi bi-pencil me-1"></i>Редактировать профиль
                </a>
                <a href="/profile/change-password" class="btn btn-secondary">
                    <i class="bi bi-key me-1"></i>Изменить пароль
                </a>
                <a href="/logout" class="btn btn-outline-secondary">
                    <i class="bi bi-box-arrow-right me-1"></i>Выход
                </a>
                <a href="/profile/delete" class="btn btn-outline-danger btn-sm mt-2">
                    <i class="bi bi-trash me-1"></i>Удалить аккаунт
                </a>
            </div>
        </div>
    </div>
</div>
{% endblock %}