{% extends 'base.html' %}
{% block title %}{{ t.title_accept_policies }} — PickkerMarket{% endblock %}
{% block content %}
<section class="content-section">
    <div class="content-inner" style="max-width: 720px;">
        <h1>{{ t.accept_policies_heading }}</h1>
        <p style="color: var(--muted); margin-bottom: 20px;">{{ t.accept_policies_intro }}</p>

        {% for policy in outdated_policies %}
            <div class="panel" style="margin-bottom: 18px; padding: 18px;">
                <h3 style="margin-top: 0;">{{ policy.title }}</h3>
                <div style="max-height: 260px; overflow-y: auto; color: var(--muted); line-height: 1.7; white-space: pre-line; font-size: 0.92rem;">{{ policy.content }}</div>
            </div>
        {% endfor %}

        <form method="post">
            {% csrf_token %}
            <input type="hidden" name="next" value="{{ next }}">
            <div style="display: flex; align-items: flex-start; gap: 8px; margin: 14px 0;">
                <input type="checkbox" id="accept-policies-agree" name="agree" required>
                <label for="accept-policies-agree" style="font-weight: normal;">{{ t.accept_policies_checkbox }}</label>
            </div>
            <button type="submit" class="btn-cta">{{ t.accept_policies_submit }}</button>
        </form>
    </div>
</section>
{% endblock %}