{{ block styles }}
<link rel="stylesheet" href="{{ static 'global/experiment.css' }}">

<style>
    .alert-danger {
        display: none;
    }
</style>

{{ endblock }}

{{ block content }}
<div class="platform-shell narrow-shell">
    <section class="panel hero-panel">
        <div class="title-row">
            <div>
                <h1 class="page-heading">Demographics</h1>
                <p class="lead">Please answer the following questions about yourself.</p>
            </div>
        </div>
    </section>

    <section class="panel">
        {{if form.errors }}
        <div style="background:#fde8e8; color:#c41e1e; padding:12px 16px; border-radius:8px; margin-bottom:16px; font-weight:600;">
            Please answer all questions before proceeding.
        </div>
        {{ endif }}
        {{ formfields }}
    </section>

    <div class="action-row">
        <button type="submit" class="btn btn-primary">Complete Study</button>
    </div>
</div>
{{ endblock }}