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

{% block title %}{{ material.title }}{% endblock %}

{% block content %}
<div class="container mx-auto px-4 py-6 max-w-4xl">
    <div class="mb-4">
        <a href="{% url 'material_list' %}" class="text-[#4395AB] hover:text-[#2d6b7c]">
            ← Назад к материалам
        </a>
    </div>

    <div class="bg-white rounded-xl shadow-sm overflow-hidden">
        <div class="p-6">
            <div class="flex items-center gap-2 mb-4">
                <span class="text-xs px-2 py-1 rounded-full bg-gray-100 text-gray-600">
                    {{ material.get_material_type_display }}
                </span>
                <span class="text-xs text-gray-400">{{ material.created_at|date:"d.m.Y" }}</span>
            </div>
            
            <h1 class="text-2xl font-bold text-gray-800 mb-4">{{ material.title }}</h1>
            
            {% if material.author %}
            <p class="text-sm text-gray-500 mb-4">Автор: {{ material.author.last_name }} {{ material.author.first_name }}</p>
            {% endif %}
            
            <div class="prose max-w-none">
                {{ material.content|linebreaks }}
            </div>
            
            {% if material.file %}
            <div class="mt-6 p-4 bg-gray-50 rounded-lg">
                <a href="{{ material.file.url }}" class="text-[#4395AB] hover:text-[#2d6b7c]" download>
                    <i class="fas fa-download mr-2"></i>Скачать файл
                </a>
            </div>
            {% endif %}
            
            {% if material.link %}
            <div class="mt-4 p-4 bg-gray-50 rounded-lg">
                <a href="{{ material.link }}" target="_blank" class="text-[#4395AB] hover:text-[#2d6b7c]">
                    <i class="fas fa-external-link-alt mr-2"></i>Перейти по ссылке
                </a>
            </div>
            {% endif %}
        </div>
    </div>
</div>
{% endblock %}