{% extends "base.html" %}
{% load static %}

{% block body_class %}{% endblock %}

{% block content %}
<div class="container">

  <div class="entry-header">
    <h1 class="subject-title">{{ entry.title }}</h1>
    <p class="muted">{{ entry.subtitle }}</p>
  </div>

  {# Your existing entry content goes here… #}

  <div class="nav-row" style="display:flex;gap:10px;align-items:center;margin-top:16px;">
    <form id="navPrevForm" method="post" action="{% url 'nav_prev' %}" class="inline">
      {% csrf_token %}
      <input type="hidden" name="q" value="{{ request.GET.q|default:'' }}">
      <input type="hidden" name="i" value="{{ request.GET.i|default:'0' }}">
      <button class="btn btn-lg">‹ Prev</button>
    </form>

    <form id="navNextForm" method="post" action="{% url 'nav_next' %}" class="inline">
      {% csrf_token %}
      <input type="hidden" name="q" value="{{ request.GET.q|default:'' }}">
      <input type="hidden" name="i" value="{{ request.GET.i|default:'0' }}">
      <button class="btn btn-lg">Next ›</button>
    </form>
  </div>

</div>
{% endblock %}

{% block extra_body %}
  <script src="{% static 'js/swipe-nav.js' %}"></script>
{% endblock %}