{% extends "sundae/base.html" %}
{% load sundae_tags %}

{% block title %}{{ object }} - {{ object_verbose_name|capfirst }}{% endblock %}

{% block content %}
<div class="container-admin">
    <!-- Breadcrumb -->
    <nav class="mb-6" aria-label="Breadcrumb">
        <ol class="flex items-center space-x-2 text-sm text-gray-500">
            <li>
                <a href="{{ list_view_url }}" class="hover:text-gray-700">{{ object_verbose_name_plural|capfirst }}</a>
            </li>
            <li class="flex items-center">
                <svg class="h-5 w-5 text-gray-400" fill="currentColor" viewBox="0 0 20 20">
                    <path fill-rule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clip-rule="evenodd"/>
                </svg>
                <span class="ml-2 text-gray-900 font-medium">{{ object }}</span>
            </li>
        </ol>
    </nav>

    <!-- Header with actions -->
    <div class="mb-6 flex items-center justify-between">
        <h1 class="text-2xl font-bold text-gray-900">{{ object }}</h1>
        <div class="flex items-center space-x-3">
            {% if update_view_url %}
            <a href="{{ update_view_url }}" class="btn-primary-admin">
                <svg class="h-4 w-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"/>
                </svg>
                Edit
            </a>
            {% endif %}
            {% if delete_view_url %}
            <a href="{{ delete_view_url }}" class="btn-danger-admin">
                <svg class="h-4 w-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"/>
                </svg>
                Delete
            </a>
            {% endif %}
            <a href="{{ list_view_url }}" class="btn-secondary-admin">
                <svg class="h-4 w-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 19l-7-7m0 0l7-7m-7 7h18"/>
                </svg>
                Back to List
            </a>
        </div>
    </div>

    <!-- Detail Card -->
    <div class="bg-white shadow-sm rounded-lg border border-gray-200">
        <div class="px-6 py-5">
            <dl class="grid grid-cols-1 gap-6 sm:grid-cols-2">
                {% include "sundae/partial/detail.html" %}
            </dl>
        </div>
    </div>

    <!-- Custom actions -->
    {% if custom_actions %}
    <div class="mt-6">
        <h2 class="text-lg font-semibold text-gray-900 mb-3">Actions</h2>
        <div class="flex flex-wrap gap-2">
            {% for action in custom_actions %}
            <a href="{{ action.url }}" class="btn-secondary-admin">
                {{ action.display_name|capfirst }}
            </a>
            {% endfor %}
        </div>
    </div>
    {% endif %}
</div>
{% endblock %}