{% extends "base.html" %}{% block title %}Détail Série{% endblock %}{% block content %}
<a href="javascript:history.back()" class="text-sm text-indigo-600 dark:text-indigo-400 hover:underline">← Retour</a>
<div class="bg-white dark:bg-gray-800 rounded-2xl shadow p-6 mt-3 border">
  <div class="flex gap-6">
    <div>{% if s.poster %}<img src="{{ s.poster }}" alt="poster" class="w-40 object-cover rounded-xl shadow">{% else %}<div class="w-40 h-60 bg-gray-200 dark:bg-gray-700 rounded-xl"></div>{% endif %}</div>
    <div class="flex-1">
      <h1 class="text-2xl font-bold mb-2">{{ s.titre }}</h1>
      <div class="text-gray-600 dark:text-gray-300 mb-4">{% if s.year %}<span class="mr-2">{{ s.year }}</span>{% endif %}{% if s.diffuseur %}<span class="mr-2">• {{ s.diffuseur }}</span>{% endif %}{% if s.date %}<span class="mr-2">• {{ s.date }}</span>{% endif %}</div>
      {% if s.original %}<div class="mb-2"><span class="font-medium">Titre original :</span> {{ s.original }}</div>{% endif %}
      {% if s.genre %}<div class="mb-2"><span class="font-medium">Genre :</span> {{ s.genre }}</div>{% endif %}
      {% if s.desc %}<div class="mt-4"><h2 class="font-semibold mb-1">Résumé</h2><p class="whitespace-pre-wrap">{{ s.desc }}</p></div>{% endif %}
    </div>
  </div>
</div>
{% endblock %}