{% extends "base.html" %}
{% block content %}
    <div class="wizard-step mx-auto">
        <h2 class="mb-4">Step&nbsp;2 — Lifestyle details</h2>
        <form method="post">
            <input type="hidden" name="sid" value="{{ sid }}" />
            <div class="mb-3">
                <label for="diet" class="form-label">Diet pattern</label>
                <input type="text"
                       class="form-control"
                       id="diet"
                       name="diet"
                       placeholder="e.g. balanced, keto, vegetarian"
                       required />
            </div>
            <div class="row mb-3">
                <div class="col">
                    <label for="sleep_hours" class="form-label">Sleep per night (h)</label>
                    <input type="number"
                           step="0.1"
                           class="form-control"
                           id="sleep_hours"
                           name="sleep_hours"
                           required />
                </div>
                <div class="col">
                    <label for="physical_activity" class="form-label">Physical exercise</label>
                    <input type="text"
                           class="form-control"
                           id="physical_activity"
                           name="physical_activity"
                           placeholder="type &amp; frequency"
                           required />
                </div>
            </div>
            <div class="mb-3">
                <label for="mental_exercises" class="form-label">Mental activities</label>
                <input type="text"
                       class="form-control"
                       id="mental_exercises"
                       name="mental_exercises"
                       placeholder="e.g. meditation, reading"
                       required />
            </div>
            <button class="btn btn-primary">Next</button>
        </form>
    </div>
{% endblock %}