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

{% block title %}
    {% block wiki_pagetitle %}{% endblock %} - ThrillWiki
{% endblock %}

{% block extra_head %}
    {% render_block "css" %}
    <!-- Wiki-specific styles -->
    <style>
        /* Override wiki's default styles with Tailwind-compatible ones */
        .wiki-article img {
            @apply max-w-full h-auto;
        }
        .wiki-article pre {
            @apply bg-gray-50 p-4 rounded-lg overflow-x-auto;
        }
        .wiki-article blockquote {
            @apply border-l-4 border-gray-300 pl-4 italic my-4;
        }
        .wiki-article ul {
            @apply list-disc list-inside;
        }
        .wiki-article ol {
            @apply list-decimal list-inside;
        }
        .wiki-article table {
            @apply min-w-full divide-y divide-gray-200;
        }
        .wiki-article th {
            @apply px-6 py-3 bg-gray-50 text-left text-xs font-medium text-gray-500 uppercase tracking-wider;
        }
        .wiki-article td {
            @apply px-6 py-4 whitespace-nowrap text-sm text-gray-900;
        }
    </style>
{% endblock %}

{% block content %}
<div class="min-h-screen bg-gray-50">
    <!-- Wiki Navigation -->
    <nav class="bg-white shadow-sm border-b border-gray-200">
        <div class="container mx-auto px-4">
            <div class="flex justify-between items-center py-3">
                <div class="flex items-center space-x-4">
                    <a href="{% url 'wiki:root' %}" class="text-gray-900 hover:text-blue-600">
                        Wiki Home
                    </a>
                    {% if article and not article.current_revision.deleted %}
                        <span class="text-gray-400">/</span>
                        <a href="{% url 'wiki:get' path=article.get_absolute_url %}" class="text-gray-900 hover:text-blue-600">
                            {{ article.current_revision.title }}
                        </a>
                    {% endif %}
                </div>
                <div class="flex items-center space-x-4">
                    {% if user.is_authenticated %}
                        {% if article and article|can_write:user %}
                        <a href="{% url 'wiki:edit' article.id %}" 
                           class="text-sm text-gray-700 hover:text-blue-600">
                            Edit
                        </a>
                        {% endif %}
                        {% if article %}
                        <a href="{% url 'wiki:history' article.id %}" 
                           class="text-sm text-gray-700 hover:text-blue-600">
                            History
                        </a>
                        {% endif %}
                    {% endif %}
                </div>
            </div>
        </div>
    </nav>

    <!-- Main Content -->
    {% block wiki_body %}
    {% endblock %}
</div>
{% endblock %}

{% block extra_scripts %}
    {% render_block "js" %}
    <!-- Any additional wiki-specific scripts -->
{% endblock %}