{% extends "base.html" %}

{% block title %}PairCoder Setup Wizard{% endblock %}

{% block content %}
<section class="welcome">
    <h2>Welcome to PairCoder</h2>
    <p>This wizard will help you configure your PairCoder installation.</p>
</section>

<section class="steps">
    {% for step in steps %}
    <div class="step {% if step.locked %}locked{% endif %}"
         data-step="{{ step.number }}"
         {% if step.locked %}onclick="showUpgradeModal()"{% endif %}>
        <div class="step-number">
            {% if step.locked %}
            <span class="lock-icon">🔒</span>
            {% else %}
            {{ step.number }}
            {% endif %}
        </div>
        <div class="step-content">
            <h3>{{ step.name }}</h3>
            <p>{{ step.description }}</p>
            {% if step.locked %}
            <span class="pro-badge">Pro</span>
            {% endif %}
        </div>
    </div>
    {% endfor %}
</section>

<div class="actions">
    <a href="/welcome" class="btn btn-primary">Get Started</a>
</div>
{% endblock %}