{% extends "layout.html" %}

{% block content %}
{% if event %}
<section class="section-2025">
  <div class="container-2025">
    <div class="card-2025 scroll-reveal">
      <h1 class="section-title">{{ event.title }}</h1>
      <p><i class="fas fa-clock"></i> {{ event.start_time }} - {{ event.end_time }}</p>
      <p><i class="fas fa-map-marker-alt"></i> {{ event.location }}</p>
      {% if event.description %}
        <div style="margin-top: 2rem;">{{ event.description }}</div>
      {% endif %}
    </div>
  </div>
</section>
{% else %}
<section class="section-2025">
  <div class="container-2025">
    <div class="card-2025 scroll-reveal" style="text-align: center;">
      <h1>Event Not Found</h1>
      <p>The event you're looking for doesn't exist.</p>
      <a href="/events" class="btn-2025 btn-primary">View All Events</a>
    </div>
  </div>
</section>
{% endif %}
{% endblock %}