{% extends "base.html" %}

{% block title %}Select Environment - ASF TestArena{% endblock %}

{% block content %}
<div class="submit-container">
    <h2 style="margin-bottom: 30px; color: var(--dark);">Select Environment</h2>
    
    <div class="step-indicator">
        <div class="step completed">
            <div class="step-number">✓</div>
            <div class="step-label">Branch</div>
        </div>
        <div class="step completed">
            <div class="step-number">✓</div>
            <div class="step-label">Scenarios</div>
        </div>
        <div class="step active">
            <div class="step-number">3</div>
            <div class="step-label">Environment</div>
        </div>
        <div class="step">
            <div class="step-number">4</div>
            <div class="step-label">Test Mode</div>
        </div>
        <div class="step">
            <div class="step-number">5</div>
            <div class="step-label">Review</div>
        </div>
    </div>
    
    <form method="POST" action="{{ url_for('jobs.submit_step3') }}">
        <input type="hidden" name="branch_name" value="{{ branch_name }}">
        <input type="hidden" name="scenarios" value="{{ scenarios|tojson }}">
        
        <div class="radio-group">
            <label class="radio-item">
                <input type="radio" name="environment" value="sensor_hub" required>
                <div>
                    <strong>Sensor Hub</strong>
                    <p style="font-size: 12px; color: #6b7280; margin-top: 4px;">Test on sensor hub hardware/simulator</p>
                </div>
            </label>
            
            <label class="radio-item">
                <input type="radio" name="environment" value="main_board" required>
                <div>
                    <strong>Main Board</strong>
                    <p style="font-size: 12px; color: #6b7280; margin-top: 4px;">Test on main board hardware/simulator</p>
                </div>
            </label>
        </div>
        
        <div class="form-actions">
            <button type="button" class="btn" style="background: #6b7280; color: white;" onclick="history.back()">Back</button>
            <button type="submit" class="btn btn-primary">Next</button>
        </div>
    </form>
</div>
{% endblock %}