{% extends "base.html" %}

{% block title %}{{ book }} - KJV Bible{% endblock %}

{% block description %}Study the book of {{ book }} from the King James Bible (KJV). {% if book_intro and book_intro.introduction %}{{ book_intro.introduction[:110]|striptags }}...{% elif introduction %}{{ introduction[:110]|striptags }}...{% else %}Complete KJV text with chapters, commentary, and study resources.{% endif %}{% endblock %}

{% block og_image %}https://kjvstudy.org/og/book/{{ book | urlencode }}.png{% endblock %}
{% block twitter_image %}https://kjvstudy.org/og/book/{{ book | urlencode }}.png{% endblock %}

{% block structured_data %}
<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Book",
  "name": {{ book | tojson }},
  "url": "https://kjvstudy.org/book/{{ book | urlencode }}",
  "inLanguage": "en",
  "author": {
    "@type": "Organization",
    "name": "Authorized Version Translators"
  },
  "publisher": {
    "@type": "Organization",
    "name": "KJV Study",
    "url": "https://kjvstudy.org"
  },
  "isPartOf": {
    "@type": "Book",
    "name": "King James Version Bible",
    "url": "https://kjvstudy.org/books"
  },
  "numberOfPages": {{ chapters|length }}
}
</script>
<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [
    {
      "@type": "ListItem",
      "position": 1,
      "name": "Home",
      "item": "https://kjvstudy.org"
    },
    {
      "@type": "ListItem",
      "position": 2,
      "name": "Books",
      "item": "https://kjvstudy.org/books"
    },
    {
      "@type": "ListItem",
      "position": 3,
      "name": {{ book | tojson }}
    }
  ]
}
</script>
{% endblock %}

{% block head %}
<style>
/* Chapter grid layout */
.chapter-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(3rem, 1fr));
    gap: 0.5rem;
    margin-top: 0.5rem;
    max-width: 500px;
}

.chapter-grid a {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    font-size: 1.2rem;
    font-weight: 500;
    text-decoration: none;
    border: 1px solid var(--border-color, #ddd);
    border-radius: 4px;
    transition: all 0.15s ease;
}

.chapter-grid a:hover {
    background: rgba(74, 124, 89, 0.1);
    border-color: #4a7c59;
}

.chapter-grid a.selected {
    background: rgba(74, 124, 89, 0.15);
    color: #4a7c59;
    border-color: #4a7c59;
    outline: 2px solid rgba(74, 124, 89, 0.4);
    outline-offset: 1px;
}

[data-theme="dark"] .chapter-grid a.selected {
    background: rgba(107, 155, 122, 0.2);
    color: #6b9b7a;
    border-color: #6b9b7a;
    outline-color: rgba(107, 155, 122, 0.4);
}

.chapter-grid a.popular-chapter {
    font-weight: bold;
}

/* Selected chapter section (green box) */
.chapters-section.selected {
    outline: 3px solid #4a7c59;
    outline-offset: 4px;
    background: rgba(74, 124, 89, 0.05);
    padding: 1rem;
    margin-left: -1rem;
    margin-right: -1rem;
    border-radius: 4px;
    transition: all 0.15s ease;
}

[data-theme="dark"] .chapters-section.selected {
    outline-color: #6b9b7a;
    background: rgba(107, 155, 122, 0.1);
}

/* Selected content paragraphs (green box) */
section:not(.chapters-section) p.selected,
section:not(.chapters-section) li.selected,
section:not(.chapters-section) blockquote.selected {
    outline: 3px solid #4a7c59;
    outline-offset: 4px;
    background: rgba(74, 124, 89, 0.05);
    padding: 1rem;
    margin-left: -1rem;
    margin-right: -1rem;
    border-radius: 4px;
    transition: all 0.15s ease;
}

[data-theme="dark"] section:not(.chapters-section) p.selected,
[data-theme="dark"] section:not(.chapters-section) li.selected,
[data-theme="dark"] section:not(.chapters-section) blockquote.selected {
    outline-color: #6b9b7a;
    background: rgba(107, 155, 122, 0.1);
}

.popular-chapter {
    font-weight: bold;
}

.nav-hint {
    font-size: 0.85rem;
    color: var(--text-secondary);
    font-style: italic;
    margin-top: 0.5rem;
}

.book-meta {
    color: var(--text-secondary, #666);
    font-size: 0.95rem;
    margin-top: -0.5rem;
    margin-bottom: 1.5rem;
}

section blockquote {
    margin: 1rem 0 1.5rem;
    padding-left: 1rem;
    border-left: 3px solid var(--border-color, #ddd);
}

section blockquote p {
    font-style: italic;
    margin-bottom: 0.5rem;
}

section blockquote footer {
    font-size: 0.9rem;
    color: var(--text-secondary, #666);
}

section blockquote footer em {
    display: block;
    margin-top: 0.25rem;
    font-size: 0.85rem;
}

section ul li {
    margin-bottom: 0.75rem;
}

section ul li strong {
    color: var(--text-color, #111);
}

.book-actions {
    margin: 1.5rem 0 1.5rem;
}

.print-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    font-size: 0.95rem;
    color: var(--text-secondary, #666);
    background: var(--code-bg, #f8f8f8);
    border: 1px solid var(--border-color, #ddd);
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s;
    text-decoration: none;
}

.print-btn:hover {
    background: var(--bg-color, #fff);
    border-color: var(--link-color);
    color: var(--link-color);
    text-decoration: none;
}

.print-btn svg {
    width: 16px;
    height: 16px;
}

@media print {
    .book-actions,
    .print-btn {
        display: none;
    }
}

/* Mobile optimizations */
@media (max-width: 768px) {
    .chapter-grid {
        grid-template-columns: repeat(auto-fill, minmax(2.5rem, 1fr));
        gap: 0.4rem;
        max-width: none;
    }

    .chapter-grid a {
        padding: 0.6rem 0.4rem;
        font-size: 1.1rem;
        min-height: 44px;
    }

    .book-meta {
        font-size: 0.9rem;
    }

    section blockquote {
        margin: 0.75rem 0 1rem;
        padding-left: 0.75rem;
    }

    .print-btn {
        padding: 0.75rem 1rem;
        min-height: 44px;
    }

    .nav-hint {
        display: none;
    }
}
</style>
<script>
document.addEventListener('DOMContentLoaded', function() {
    const bookName = "{{ book }}";

    // Known Bible book names and abbreviations for cross-references
    const bibleBooks = [
        'Genesis', 'Exodus', 'Leviticus', 'Numbers', 'Deuteronomy',
        'Joshua', 'Judges', 'Ruth', '1 Samuel', '2 Samuel', '1 Kings', '2 Kings',
        '1 Chronicles', '2 Chronicles', 'Ezra', 'Nehemiah', 'Esther',
        'Job', 'Psalms', 'Psalm', 'Proverbs', 'Ecclesiastes', 'Song of Solomon',
        'Isaiah', 'Jeremiah', 'Lamentations', 'Ezekiel', 'Daniel',
        'Hosea', 'Joel', 'Amos', 'Obadiah', 'Jonah', 'Micah', 'Nahum',
        'Habakkuk', 'Zephaniah', 'Haggai', 'Zechariah', 'Malachi',
        'Matthew', 'Mark', 'Luke', 'John', 'Acts', 'Romans',
        '1 Corinthians', '2 Corinthians', 'Galatians', 'Ephesians', 'Philippians',
        'Colossians', '1 Thessalonians', '2 Thessalonians', '1 Timothy', '2 Timothy',
        'Titus', 'Philemon', 'Hebrews', 'James', '1 Peter', '2 Peter',
        '1 John', '2 John', '3 John', 'Jude', 'Revelation'
    ];

    // Build regex pattern for book names (escaped and sorted by length desc to match longer names first)
    const bookPattern = bibleBooks
        .sort((a, b) => b.length - a.length)
        .map(b => b.replace(/\s+/g, '\\s+'))
        .join('|');

    // Function to create a link for a verse reference
    // Single verses use /verse/ path (for tooltip support), ranges use #verse- anchor
    function createVerseLink(book, chapter, verseStart, verseEnd, linkText) {
        const normalizedBook = book.replace(/\s+/g, ' ');
        if (verseEnd && verseEnd !== verseStart) {
            return '<a href="/book/' + encodeURIComponent(normalizedBook) + '/chapter/' + chapter + '#verse-' + verseStart + '-' + verseEnd + '">' + linkText + '</a>';
        } else {
            return '<a href="/book/' + encodeURIComponent(normalizedBook) + '/chapter/' + chapter + '/verse/' + verseStart + '">' + linkText + '</a>';
        }
    }

    // Create a link for cross-chapter ranges (e.g., 2:17-3:5).
    function createCrossChapterRangeLink(book, startChapter, startVerse, endChapter, endVerse, linkText) {
        const normalizedBook = book.replace(/\s+/g, ' ');
        return '<a href="/book/' + encodeURIComponent(normalizedBook) + '/chapter/' + startChapter + '#verse-' + startVerse + '" data-end-chapter="' + endChapter + '" data-end-verse="' + endVerse + '">' + linkText + '</a>';
    }

    // Function to link verse references in text
    function linkVerseReferences(element) {
        if (!element) return;

        // Get all text nodes
        const walker = document.createTreeWalker(element, NodeFilter.SHOW_TEXT, null, false);
        const textNodes = [];
        let node;
        while (node = walker.nextNode()) {
            textNodes.push(node);
        }

        textNodes.forEach(function(textNode) {
            let text = textNode.textContent;
            let changed = false;

            // Match chapter ranges in parentheses like "(chapters 1-11)", but NOT verse references
            // Only match if there's no colon (which would indicate verses)
            text = text.replace(/\((?:chapters?\s+)?(\d+)(?:-(\d+))?\)(?![^(]*:)/gi, function(match, chapterStart, chapterEnd) {
                // Check if this looks like a verse reference context - skip if so
                if (/\d+:\d+/.test(text.substring(Math.max(0, text.indexOf(match) - 20), text.indexOf(match) + match.length + 20))) {
                    return match;
                }
                changed = true;
                if (chapterEnd) {
                    const hasChapterWord = /chapters?\s+/i.test(match);
                    const prefix = hasChapterWord ? match.match(/chapters?\s+/i)[0] : '';
                    return '(<a href="/book/' + bookName + '/chapter/' + chapterStart + '">' + prefix + chapterStart + '-' + chapterEnd + '</a>)';
                } else {
                    const hasChapterWord = /chapters?\s+/i.test(match);
                    const prefix = hasChapterWord ? match.match(/chapters?\s+/i)[0] : '';
                    return '(<a href="/book/' + bookName + '/chapter/' + chapterStart + '">' + prefix + chapterStart + '</a>)';
                }
            });

            // Build cross-book regex for use in parenthetical processing
            const crossBookRangeRegex = new RegExp('^(' + bookPattern + ')\\s+(\\d+):(\\d+)-(\\d+):(\\d+)$', 'i');
            const crossBookRegex = new RegExp('^(' + bookPattern + ')\\s+(\\d+):(\\d+)(?:-(\\d+))?$', 'i');

            // Process parenthetical groups containing verse references
            // This handles patterns like "(Romans 5:12-21; 1 Corinthians 15:21-22, 45-49)"
            // and "(27:27-29, 39-40; 48:15-16; 49:1-27)"
            text = text.replace(/\(([^)]+)\)/g, function(match, inner) {
                // Skip if already has anchor tags (already processed)
                if (inner.includes('<a ')) return match;

                // Check if this contains verse references (has colons with numbers)
                if (!/\d+:\d+/.test(inner)) return match;

                let currentBook = bookName;
                let currentChapter = null;
                let localChanged = false;

                // Split by semicolons and commas, preserving delimiters
                const parts = inner.split(/([;,])/);
                let newParts = [];

                for (let i = 0; i < parts.length; i++) {
                    const part = parts[i].trim();

                    // If it's a delimiter, keep it
                    if (part === ';' || part === ',') {
                        newParts.push(parts[i]); // Keep original spacing
                        continue;
                    }

                    if (!part) {
                        newParts.push(parts[i]);
                        continue;
                    }

                    // Check for cross-book cross-chapter range like "Malachi 2:17-3:5"
                    const crossBookRangeMatch = part.match(crossBookRangeRegex);
                    if (crossBookRangeMatch) {
                        currentBook = crossBookRangeMatch[1].replace(/\s+/g, ' ');
                        currentChapter = crossBookRangeMatch[4];
                        localChanged = true;
                        newParts.push(createCrossChapterRangeLink(currentBook, crossBookRangeMatch[2], crossBookRangeMatch[3], crossBookRangeMatch[4], crossBookRangeMatch[5], part));
                        continue;
                    }

                    // Check for cross-book reference like "Romans 5:12-21" or "1 Corinthians 15:21-22"
                    const crossBookMatch = part.match(crossBookRegex);
                    if (crossBookMatch) {
                        currentBook = crossBookMatch[1].replace(/\s+/g, ' ');
                        currentChapter = crossBookMatch[2];
                        localChanged = true;
                        newParts.push(createVerseLink(currentBook, currentChapter, crossBookMatch[3], crossBookMatch[4], part));
                        continue;
                    }

                    // Check for cross-chapter range within the current book like "2:17-3:5"
                    const crossChapterRangeMatch = part.match(/^(\d+):(\d+)-(\d+):(\d+)$/);
                    if (crossChapterRangeMatch) {
                        currentBook = bookName;
                        currentChapter = crossChapterRangeMatch[3];
                        localChanged = true;
                        newParts.push(createCrossChapterRangeLink(currentBook, crossChapterRangeMatch[1], crossChapterRangeMatch[2], crossChapterRangeMatch[3], crossChapterRangeMatch[4], part));
                        continue;
                    }

                    // Check for full chapter:verse-verse pattern (current book)
                    const fullRangeMatch = part.match(/^(\d+):(\d+)-(\d+)$/);
                    if (fullRangeMatch) {
                        currentBook = bookName;
                        currentChapter = fullRangeMatch[1];
                        localChanged = true;
                        newParts.push(createVerseLink(currentBook, currentChapter, fullRangeMatch[2], fullRangeMatch[3], part));
                        continue;
                    }

                    // Check for full chapter:verse pattern (single verse, current book)
                    const fullSingleMatch = part.match(/^(\d+):(\d+)$/);
                    if (fullSingleMatch) {
                        currentBook = bookName;
                        currentChapter = fullSingleMatch[1];
                        localChanged = true;
                        newParts.push(createVerseLink(currentBook, currentChapter, fullSingleMatch[2], null, part));
                        continue;
                    }

                    // Check for abbreviated verse-verse pattern (inherits book and chapter)
                    const abbrevRangeMatch = part.match(/^(\d+)-(\d+)$/);
                    if (abbrevRangeMatch && currentChapter) {
                        localChanged = true;
                        newParts.push(createVerseLink(currentBook, currentChapter, abbrevRangeMatch[1], abbrevRangeMatch[2], part));
                        continue;
                    }

                    // Check for abbreviated single verse (inherits book and chapter)
                    const abbrevSingleMatch = part.match(/^(\d+)$/);
                    if (abbrevSingleMatch && currentChapter && parts[i-1] && parts[i-1].trim() === ',') {
                        localChanged = true;
                        newParts.push(createVerseLink(currentBook, currentChapter, abbrevSingleMatch[1], null, part));
                        continue;
                    }

                    // Not a verse reference, keep as-is
                    newParts.push(parts[i]);
                }

                if (localChanged) {
                    changed = true;
                    return '(' + newParts.join('') + ')';
                }
                return match;
            });

            // Match standalone cross-book cross-chapter ranges outside parentheses
            const standaloneCrossBookRangeRegex = new RegExp('(' + bookPattern + ')\\s+(\\d+):(\\d+)-(\\d+):(\\d+)', 'gi');
            text = text.replace(standaloneCrossBookRangeRegex, function(match, book, startChapter, startVerse, endChapter, endVerse) {
                changed = true;
                return createCrossChapterRangeLink(book, startChapter, startVerse, endChapter, endVerse, match);
            });

            // Match standalone cross-book verse references outside parentheses (with colon)
            const standaloneCrossBookRegex = new RegExp('(' + bookPattern + ')\\s+(\\d+):(\\d+)(?:-(\\d+))?', 'gi');
            text = text.replace(standaloneCrossBookRegex, function(match, book, chapter, verseStart, verseEnd) {
                changed = true;
                return createVerseLink(book, chapter, verseStart, verseEnd, match);
            });

            // Match cross-book chapter ranges like "Hebrews 5-7" (no colon = chapters, not verses)
            const crossBookChapterRangeRegex = new RegExp('(' + bookPattern + ')\\s+(\\d+)-(\\d+)(?!:)', 'gi');
            text = text.replace(crossBookChapterRangeRegex, function(match, book, chapterStart, chapterEnd) {
                changed = true;
                const normalizedBook = book.replace(/\s+/g, ' ');
                return '<a href="/book/' + encodeURIComponent(normalizedBook) + '/chapter/' + chapterStart + '">' + match + '</a>';
            });

            // Match cross-book single chapter like "Hebrews 11" (no colon)
            const crossBookChapterRegex = new RegExp('(' + bookPattern + ')\\s+(\\d+)(?![:\\d-])', 'gi');
            text = text.replace(crossBookChapterRegex, function(match, book, chapter) {
                changed = true;
                const normalizedBook = book.replace(/\s+/g, ' ');
                return '<a href="/book/' + encodeURIComponent(normalizedBook) + '/chapter/' + chapter + '">' + match + '</a>';
            });

            // Match remaining standalone cross-chapter ranges like "2:17-3:5"
            text = text.replace(/(?<![>\d])(\d+):(\d+)-(\d+):(\d+)(?![<\d])/g, function(match, startChapter, startVerse, endChapter, endVerse) {
                changed = true;
                return createCrossChapterRangeLink(bookName, startChapter, startVerse, endChapter, endVerse, match);
            });

            // Match remaining standalone verse ranges like "1:1-5" not in parentheses
            text = text.replace(/(?<![>\d])(\d+):(\d+)-(\d+)(?![<\d])/g, function(match, chapter, verseStart, verseEnd) {
                changed = true;
                return createVerseLink(bookName, chapter, verseStart, verseEnd, match);
            });

            // Match remaining standalone single verses like "1:1" not in parentheses
            text = text.replace(/(?<![>\d])(\d+):(\d+)(?![-<\d])/g, function(match, chapter, verse) {
                changed = true;
                return createVerseLink(bookName, chapter, verse, null, match);
            });

            if (changed) {
                const span = document.createElement('span');
                span.innerHTML = text;
                textNode.parentNode.replaceChild(span, textNode);
                // Replace the span's children with its contents
                while (span.firstChild) {
                    span.parentNode.insertBefore(span.firstChild, span);
                }
                span.parentNode.removeChild(span);
            }
        });
    }

    // Link verse references in all sections
    document.querySelectorAll('section').forEach(function(section) {
        linkVerseReferences(section);
    });

    // Navigation with chapter grid
    const chapterSection = document.querySelector('.chapters-section');
    const chapterGrid = document.querySelector('.chapter-grid');
    const chapterLinks = document.querySelectorAll('.chapter-grid a[data-chapter]');
    // Select paragraphs, list items, and blockquotes, but exclude paragraphs inside blockquotes
    const contentParagraphs = document.querySelectorAll('section:not(.chapters-section) > p, section:not(.chapters-section) li, section:not(.chapters-section) blockquote');

    let selectedChapterIndex = -1;
    let selectedParagraphIndex = -1;
    let chapterSectionSelected = false;
    let inChapterDrilldown = false; // Are we drilling down into individual chapters?

    // Get current book index for left/right navigation
    const currentBookIndex = bibleBooks.findIndex(b => b.toLowerCase() === bookName.toLowerCase());

    // Calculate the number of columns in the grid dynamically
    function getGridColumns() {
        if (!chapterGrid || chapterLinks.length === 0) return 1;
        const gridRect = chapterGrid.getBoundingClientRect();
        const firstItemRect = chapterLinks[0].getBoundingClientRect();
        // Calculate columns based on grid width and item width (including gap)
        const itemWidth = firstItemRect.width;
        const gap = parseFloat(getComputedStyle(chapterGrid).gap) || 8;
        const cols = Math.floor((gridRect.width + gap) / (itemWidth + gap));
        return Math.max(1, cols);
    }

    function clearAllSelections() {
        if (chapterSection) {
            chapterSection.classList.remove('selected');
        }
        if (selectedChapterIndex >= 0 && selectedChapterIndex < chapterLinks.length) {
            chapterLinks[selectedChapterIndex].classList.remove('selected');
        }
        if (selectedParagraphIndex >= 0 && selectedParagraphIndex < contentParagraphs.length) {
            contentParagraphs[selectedParagraphIndex].classList.remove('selected');
        }
    }

    function selectChapterSection() {
        clearAllSelections();
        chapterSectionSelected = true;
        inChapterDrilldown = false;
        selectedChapterIndex = -1;
        selectedParagraphIndex = -1;

        if (chapterSection) {
            chapterSection.classList.add('selected');
            chapterSection.scrollIntoView({
                behavior: 'auto',
                block: 'center'
            });
        }
    }

    function selectChapter(index) {
        clearAllSelections();
        chapterSectionSelected = false;
        inChapterDrilldown = true;
        selectedParagraphIndex = -1;

        // Update index with bounds checking
        selectedChapterIndex = Math.max(0, Math.min(index, chapterLinks.length - 1));

        // Add selection to new chapter
        chapterLinks[selectedChapterIndex].classList.add('selected');

        // Scroll into view if needed
        chapterLinks[selectedChapterIndex].scrollIntoView({
            behavior: 'auto',
            block: 'nearest'
        });
    }

    function selectParagraph(index) {
        clearAllSelections();
        chapterSectionSelected = false;
        inChapterDrilldown = false;
        selectedChapterIndex = -1;

        // Update index with bounds checking
        selectedParagraphIndex = Math.max(0, Math.min(index, contentParagraphs.length - 1));

        // Add selection to new paragraph
        contentParagraphs[selectedParagraphIndex].classList.add('selected');

        // Scroll into view if needed
        contentParagraphs[selectedParagraphIndex].scrollIntoView({
            behavior: 'auto',
            block: 'center'
        });
    }

    document.addEventListener('keydown', function(e) {
        // Don't trigger if user is typing
        if (e.target.tagName === 'INPUT' || e.target.tagName === 'TEXTAREA' || e.target.tagName === 'SELECT') {
            return;
        }
        // Don't handle if sidebar navigation is active
        if (KJVNav.sidebarActive) return;

        const cols = getGridColumns();

        // Up arrow or k: Previous row in grid, or previous item
        if (e.key === 'ArrowUp' || e.key === 'k') {
            e.preventDefault();
            if (inChapterDrilldown) {
                // In grid: move up one row
                const newIndex = selectedChapterIndex - cols;
                if (newIndex >= 0) {
                    selectChapter(newIndex);
                } else {
                    // Exit drilldown, go back to chapter section
                    selectChapterSection();
                }
            } else if (chapterSectionSelected) {
                // At chapter section, can't go up (it's the first item)
            } else if (selectedParagraphIndex >= 0) {
                if (selectedParagraphIndex === 0) {
                    selectChapterSection();
                } else {
                    selectParagraph(selectedParagraphIndex - 1);
                }
            } else {
                // No selection - start with first visible item
                if (chapterSection && KJVNav.isInViewport(chapterSection)) {
                    selectChapterSection();
                } else if (contentParagraphs.length > 0) {
                    const visibleIndex = KJVNav.findFirstVisibleIndex(Array.from(contentParagraphs));
                    selectParagraph(visibleIndex);
                } else {
                    selectChapterSection();
                }
            }
        }

        // Down arrow or j: Next row in grid, or next item
        if (e.key === 'ArrowDown' || e.key === 'j') {
            e.preventDefault();
            if (inChapterDrilldown) {
                // In grid: move down one row
                const newIndex = selectedChapterIndex + cols;
                if (newIndex < chapterLinks.length) {
                    selectChapter(newIndex);
                } else {
                    // Exit drilldown to first paragraph
                    if (contentParagraphs.length > 0) {
                        selectParagraph(0);
                    } else {
                        selectChapterSection();
                    }
                }
            } else if (chapterSectionSelected) {
                if (contentParagraphs.length > 0) {
                    selectParagraph(0);
                }
            } else if (selectedParagraphIndex >= 0) {
                if (selectedParagraphIndex < contentParagraphs.length - 1) {
                    selectParagraph(selectedParagraphIndex + 1);
                }
            } else {
                if (chapterSection && KJVNav.isInViewport(chapterSection)) {
                    selectChapterSection();
                } else if (contentParagraphs.length > 0) {
                    const visibleIndex = KJVNav.findFirstVisibleIndex(Array.from(contentParagraphs));
                    selectParagraph(visibleIndex);
                } else {
                    selectChapterSection();
                }
            }
        }

        // Left arrow or h: Previous chapter in grid, otherwise previous book
        if (e.key === 'ArrowLeft' || e.key === 'h') {
            e.preventDefault();
            if (inChapterDrilldown) {
                if (selectedChapterIndex > 0) {
                    selectChapter(selectedChapterIndex - 1);
                }
            } else if (currentBookIndex > 0) {
                window.location.href = '/book/' + encodeURIComponent(bibleBooks[currentBookIndex - 1]);
            }
        }

        // Right arrow or l: Next chapter in grid, otherwise next book
        if (e.key === 'ArrowRight' || e.key === 'l') {
            e.preventDefault();
            if (inChapterDrilldown) {
                if (selectedChapterIndex < chapterLinks.length - 1) {
                    selectChapter(selectedChapterIndex + 1);
                }
            } else if (currentBookIndex < bibleBooks.length - 1) {
                window.location.href = '/book/' + encodeURIComponent(bibleBooks[currentBookIndex + 1]);
            }
        }

        // Enter: Drill into chapter section or navigate to chapter
        if (e.key === 'Enter') {
            e.preventDefault();
            if (chapterSectionSelected) {
                // Drill down into first chapter
                selectChapter(0);
            } else if (inChapterDrilldown && selectedChapterIndex >= 0) {
                // Navigate to selected chapter
                window.location.href = chapterLinks[selectedChapterIndex].href;
            }
        }

        // Escape: Exit drilldown mode
        if (e.key === 'Escape') {
            e.preventDefault();
            if (inChapterDrilldown) {
                selectChapterSection();
            } else {
                clearAllSelections();
                chapterSectionSelected = false;
                inChapterDrilldown = false;
                selectedChapterIndex = -1;
                selectedParagraphIndex = -1;
            }
        }

        // p: Download PDF
        if (e.key === 'p') {
            e.preventDefault();
            var pdfBtn = document.querySelector('.print-btn');
            if (pdfBtn) window.location.href = pdfBtn.href;
        }

        // [ : Previous book
        if (e.key === '[' && currentBookIndex > 0) {
            e.preventDefault();
            window.location.href = '/book/' + encodeURIComponent(bibleBooks[currentBookIndex - 1]);
        }

        // ] : Next book
        if (e.key === ']' && currentBookIndex < bibleBooks.length - 1) {
            e.preventDefault();
            window.location.href = '/book/' + encodeURIComponent(bibleBooks[currentBookIndex + 1]);
        }
    });

    // Clicking on chapter links should just navigate normally
    // Keyboard navigation is separate - no click-to-select behavior needed
});
</script>
{% endblock %}

{% block content %}
<h1>{{ book }}</h1>
<p class="subtitle"><a href="/books">Authorized King James Version</a></p>

{% if book_intro %}
<p class="book-meta">
    {% if book_intro.author %}<strong>Author:</strong> {{ book_intro.author }}{% endif %}
    {% if book_intro.date_written %} · <strong>Written:</strong> {{ book_intro.date_written }}{% endif %}
    {% if book_intro.category %} · <strong>Category:</strong> {{ book_intro.category }}{% endif %}
</p>
{% endif %}

{% if pdf_available %}
<div class="book-actions">
    <a href="/book/{{ book }}/pdf" class="print-btn">
        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
        </svg>
        Download Book PDF
    </a>
</div>
{% endif %}

<section class="chapters-section">
    <h2>Chapters</h2>
    <div class="chapter-grid" role="grid" aria-label="Chapter selection">
        {% for chapter in chapters %}
        <a href="/book/{{ book }}/chapter/{{ chapter }}" {% if chapter_popularity[chapter] >= 7 %}class="popular-chapter"{% endif %} data-chapter="{{ chapter }}" role="gridcell">{{ chapter }}</a>
        {% endfor %}
    </div>
    <p class="nav-hint">Tip: Arrow keys to navigate grid • Enter to select • Esc to exit • [ / ] for adjacent books</p>
</section>

{% if book_intro and book_intro.introduction %}
<section>
    <h2>Introduction</h2>
    {{ book_intro.introduction|md|safe }}
</section>
{% elif introduction %}
<section>
    <h2>Introduction</h2>
    {{ introduction|safe }}
</section>
{% endif %}

{% if book_intro and book_intro.outline %}
<section>
    <h2>Book Outline</h2>
    <ul>
        {% for item in book_intro.outline %}
        <li><strong>{{ item.section }}</strong> ({{ item.chapters }}) — {{ item.description|mdi|safe }}</li>
        {% endfor %}
    </ul>
</section>
{% endif %}

{% if book_intro and book_intro.key_themes %}
<section>
    <h2>Key Themes</h2>
    <ul>
        {% for theme in book_intro.key_themes %}
        {% if theme is mapping %}
        <li><strong>{{ theme.theme }}</strong>: {{ theme.description|mdi|safe }}</li>
        {% else %}
        <li>{{ theme }}</li>
        {% endif %}
        {% endfor %}
    </ul>
</section>
{% elif themes %}
<section>
    <h2>Major Themes</h2>
    {{ themes|safe }}
</section>
{% endif %}

{% if book_intro and book_intro.key_verses %}
<section>
    <h2>Key Verses</h2>
    {% for verse in book_intro.key_verses %}
    <blockquote>
        <p>{{ verse.text|mdi|safe }}</p>
        <footer>— {{ verse.reference }}{% if verse.significance %} <em>({{ verse.significance|mdi|safe }})</em>{% endif %}</footer>
    </blockquote>
    {% endfor %}
</section>
{% elif key_passages %}
<section>
    <h2>Key Passages</h2>
    <ul>
        {% for passage in key_passages %}
        <li><a href="{{ passage.url }}">{{ passage.reference }}</a> — {{ passage.description }}</li>
        {% endfor %}
    </ul>
</section>
{% endif %}

{% if book_intro and book_intro.historical_context %}
<section>
    <h2>Historical Context</h2>
    {{ book_intro.historical_context|md|safe }}
</section>
{% elif historical_context %}
<section>
    <h2>Historical Context</h2>
    {{ historical_context|safe }}
</section>
{% endif %}

{% if book_intro and book_intro.literary_style %}
<section>
    <h2>Literary Style</h2>
    {{ book_intro.literary_style|md|safe }}
</section>
{% endif %}

{% if book_intro and book_intro.theological_significance %}
<section>
    <h2>Theological Significance</h2>
    {{ book_intro.theological_significance|md|safe }}
</section>
{% endif %}

{% if book_intro and book_intro.christ_in_book %}
<section>
    <h2>Christ in {{ book }}</h2>
    {{ book_intro.christ_in_book|md|safe }}
</section>
{% endif %}

{% if book_intro and book_intro.relationship_to_new_testament %}
<section>
    <h2>Relationship to the New Testament</h2>
    {{ book_intro.relationship_to_new_testament|md|safe }}
</section>
{% endif %}

{% if book_intro and book_intro.practical_application %}
<section>
    <h2>Practical Application</h2>
    {{ book_intro.practical_application|md|safe }}
</section>
{% endif %}

<nav>
    <p><a href="/">← All Books</a></p>
</nav>
{% endblock %}