{% extends "base.html" %}
{% block title %}Ticket #{{ ticket.id }}{% endblock %}

{% block content %}
<div class="page-header">
    <div>
        <a href="{{ url_for('index') }}" class="back-link">&larr; Back to tickets</a>
        <h1>#{{ ticket.id }} &mdash; {{ ticket.title }}</h1>
    </div>
    <div class="action-buttons">
        <a href="{{ url_for('edit_ticket', ticket_id=ticket.id) }}" class="btn btn-secondary">Edit</a>
        <form method="post" action="{{ url_for('delete_ticket', ticket_id=ticket.id) }}"
              onsubmit="return confirm('Delete this ticket?');" style="display:inline;">
            <button type="submit" class="btn btn-danger">Delete</button>
        </form>
    </div>
</div>

<div class="ticket-detail-grid">
    <div class="ticket-main">
        <div class="ticket-section">
            <h3>Description</h3>
            <div class="ticket-description">
                {% if ticket.description %}
                <p>{{ ticket.description }}</p>
                {% else %}
                <p class="muted">No description provided.</p>
                {% endif %}
            </div>
        </div>
    </div>

    <aside class="ticket-sidebar">
        <div class="ticket-meta-card">
            <div class="meta-row">
                <span class="meta-label">Status</span>
                <span class="badge badge-{{ ticket.status.value }}">{{ ticket.status.value.replace('_', ' ') | title }}</span>
            </div>
            <div class="meta-row">
                <span class="meta-label">Priority</span>
                <span class="badge badge-priority badge-p-{{ ticket.priority.value }}">{{ ticket.priority.value | upper }}</span>
            </div>
            <div class="meta-row">
                <span class="meta-label">Assignee</span>
                <span>{% if ticket.assignee %}{{ ticket.assignee }}{% else %}<span class="muted">Unassigned</span>{% endif %}</span>
            </div>
            {% if ticket.project %}
            <div class="meta-row">
                <span class="meta-label">Project</span>
                <span class="badge badge-project">{{ ticket.project }}</span>
            </div>
            {% endif %}
            <hr>
            <div class="meta-row">
                <span class="meta-label">Created</span>
                <span class="date">{{ ticket.created_at[:19] }}</span>
            </div>
            <div class="meta-row">
                <span class="meta-label">Updated</span>
                <span class="date">{{ ticket.updated_at[:19] }}</span>
            </div>
        </div>
    </aside>
</div>
{% endblock %}