{% extends "base.html" %}

{% block title %}{{ plan.name }} - KJV Study{% endblock %}
{% block description %}{{ plan.description }}{% endblock %}

{% block head %}
<style>
.plan-overview {
    max-width: 60%;
    font-size: 1.2rem;
    line-height: 1.9;
    margin: 1.5rem 0;
    padding: 1rem;
    border-left: 3px solid var(--border-color-darker);
    background: var(--code-bg);
}

.sample-days {
    max-width: 70%;
    margin: 2rem 0;
}

.day-entry {
    padding: 1rem;
    margin: 1rem 0;
    border: 1px solid var(--border-color);
    border-radius: 4px;
}

.day-number {
    font-weight: 600;
    color: var(--link-color);
    font-size: 1.1rem;
}

.day-readings {
    margin: 0.5rem 0;
}

.reading-ref {
    display: inline-block;
    margin: 0.25rem 0.5rem 0.25rem 0;
    padding: 0.25rem 0.5rem;
    background: var(--code-bg);
    border-radius: 3px;
    font-size: 0.95rem;
}

.day-theme {
    font-style: italic;
    color: var(--text-secondary);
    margin-top: 0.5rem;
}

.plan-stats {
    display: flex;
    gap: 2rem;
    margin: 1.5rem 0;
    max-width: 60%;
}

.stat-item {
    padding: 1rem;
    border: 1px solid var(--border-color);
    border-radius: 4px;
    flex: 1;
}

.stat-value {
    font-size: 2rem;
    font-weight: 600;
    color: var(--link-color);
}

.stat-label {
    font-size: 0.9rem;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.intro-text {
    max-width: 60%;
    font-size: 1.2rem;
    line-height: 1.9;
    margin: 1rem 0;
}

.plan-actions {
    margin: 1rem 0 1.5rem;
}

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

.print-btn:hover {
    background: var(--bg-color);
    border-color: var(--link-color);
    color: var(--link-color);
}

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

@media print {
    .plan-actions,
    .print-btn {
        display: none;
    }
}
</style>
{% endblock %}

{% block content %}
<h1>{{ plan.name }}</h1>
<p class="subtitle">{{ plan.description }}</p>

{% if pdf_available and pdf_url %}
<div class="plan-actions">
    <a href="{{ pdf_url }}" 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 Plan (PDF)
    </a>
</div>
{% endif %}

<section>
    <div class="plan-stats">
        <div class="stat-item">
            <div class="stat-value">{{ plan.duration_days }}</div>
            <div class="stat-label">Days</div>
        </div>
        <div class="stat-item">
            <div class="stat-value">{{ (plan.duration_days / 7) | round | int }}</div>
            <div class="stat-label">Weeks</div>
        </div>
    </div>

    <div class="plan-overview">
        {{ plan.overview }}
    </div>
</section>

<section>
    <h2>Complete Reading Schedule</h2>
    <p class="intro-text">All {{ plan.duration_days }} days of readings for this plan.</p>

    <div class="sample-days">
        {% set all_days = plan.days if plan.days else plan.sample_days %}
        {% for day in all_days %}
        <div class="day-entry">
            <div class="day-number">Day {{ day.day }}</div>
            <div class="day-readings">
                {% for reading in day.readings %}
                <span class="reading-ref">
                    {% set ref_parts = reading.split(' ') %}
                    {% if ref_parts|length >= 2 %}
                        {% set chapter_verse = ref_parts[-1] %}
                        {% if ':' in chapter_verse %}
                            {# Format: "Book Chapter:Verse" or "Book Chapter:Verse-Verse" #}
                            {% set chapter = chapter_verse.split(':')[0] %}
                            {% set verse_part = chapter_verse.split(':')[1] %}
                            {% if '-' in verse_part %}
                                {% set verse_num = verse_part.split('-')[0] %}
                            {% else %}
                                {% set verse_num = verse_part %}
                            {% endif %}
                            {% set book = ' '.join(ref_parts[:-1]) %}
                            <a href="/book/{{ book }}/chapter/{{ chapter }}/verse/{{ verse_num }}">{{ reading }}</a>
                        {% elif '-' in chapter_verse %}
                            {# Format: "Book Chapter-Chapter" (e.g., "Psalm 1-3") #}
                            {% set first_chapter = chapter_verse.split('-')[0] %}
                            {% set book = ' '.join(ref_parts[:-1]) %}
                            <a href="/book/{{ book }}/chapter/{{ first_chapter }}">{{ reading }}</a>
                        {% else %}
                            {# Format: "Book Chapter" (single chapter) #}
                            {% set chapter = ref_parts[-1] %}
                            {% set book = ' '.join(ref_parts[:-1]) %}
                            <a href="/book/{{ book }}/chapter/{{ chapter }}">{{ reading }}</a>
                        {% endif %}
                    {% else %}
                        {# Fallback: just display as text #}
                        {{ reading }}
                    {% endif %}
                </span>
                {% endfor %}
            </div>
            <div class="day-theme">Theme: {{ day.theme }}</div>
        </div>
        {% endfor %}
    </div>
</section>

<section>
    <h2>How to Use This Plan</h2>
    <p class="intro-text"><span class="newthought">Consistency matters more</span> than perfection. If you miss a day, simply continue where you left off rather than attempting to catch up through extended readings. The goal is sustainable Scripture engagement, not merely completing a schedule.</p>

    <p class="intro-text">Consider maintaining a journal to record insights, questions, and applications. Many find morning reading sets a godly tone for the day, though evening reflection suits others better. Discover what timing best facilitates your consistent engagement with God's Word.</p>

    <p class="intro-text">Prayer should accompany reading. Ask the Holy Spirit for illumination, understanding, and application. Scripture study transforms when approached not merely as information gathering but as communion with the living God who speaks through His Word.</p>
</section>

<section>
    <p><a href="/reading-plans">← Back to all reading plans</a></p>
</section>
{% endblock %}