{% extends "base.html" %}
{% block title %}Service Details{% endblock %}
{% block content %}
<div class="container mt-4">
    <h2>Service Details</h2>
    <table class="table table-bordered">
        <tr><th>ID</th><td>{{ service.id }}</td></tr>
        <tr><th>Service Name</th><td>{{ service.service_name }}</td></tr>
        <tr><th>Description</th><td>{{ service.description|safe }}</td></tr>
        <tr><th>Conditions</th>
            <td>
                {% if service.conditions %}
                    <ul class="mb-0 ps-3">
                    {% for cond in service.conditions %}
                        <li><b>{{ cond.key }}</b>: {{ cond.value }}</li>
                    {% endfor %}
                    </ul>
                {% endif %}
            </td>
        <tr><th>Status</th><td>{{ service.status }}</td></tr>
        <tr><th>Image</th><td>{% if service.image %}<img src="{{ service.image.url }}" width="120">{% endif %}</td></tr>
        <tr><th>Created</th><td>{{ service.created_at }}</td></tr>
        <tr><th>Updated</th><td>{{ service.updated_at }}</td></tr>
    </table>
    <a href="{% url 'service-management' %}" class="btn btn-secondary">Back</a>
    <a href="{% url 'service-edit' service.id %}" class="btn btn-warning">Edit</a>
</div>
{% endblock %}
