{% extends 'base.html' %}

{% block content %}
<div class="container mt-5">
    <div class="row">
        <div class="col-md-8 offset-md-2">
            <div class="card shadow-sm">
                <div class="card-header bg-primary text-white">
                    <h4 class="mb-0">Data Simulation Control</h4>
                </div>
                <div class="card-body">
                    <p class="card-text">Use the controls below to start or stop the real-time data simulation. When running, unit locations and statuses will be updated automatically.</p>
                    <form method="post" class="mt-4">
                        {% csrf_token %}
                        {% if simulation_running %}
                            <button type="submit" name="stop" class="btn btn-danger btn-lg">Stop Simulation</button>
                            <span class="ms-3 text-success">Simulation is running.</span>
                        {% else %}
                            <button type="submit" name="start" class="btn btn-success btn-lg">Start Simulation</button>
                             <span class="ms-3 text-muted">Simulation is stopped.</span>
                        {% endif %}
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}
