{% extends 'base.html' %}
{% load i18n static %}

{% block content %}
<div class="container mt-4">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h2>{% trans "Session Details" %} #{{ session.id }}</h2>
        <a href="{% url 'cashier_session_list' %}" class="btn btn-secondary">{% trans "Back to List" %}</a>
    </div>

    <div class="row">
        <div class="col-md-6">
            <div class="card shadow-sm mb-4">
                <div class="card-header">{% trans "Information" %}</div>
                <div class="card-body">
                    <table class="table table-borderless">
                        <tr>
                            <th>{% trans "Cashier:" %}</th>
                            <td>{{ session.user.username }}</td>
                        </tr>
                        <tr>
                            <th>{% trans "Counter:" %}</th>
                            <td>{{ session.counter.name }}</td>
                        </tr>
                        <tr>
                            <th>{% trans "Status:" %}</th>
                            <td>
                                <span class="badge bg-{% if session.status == 'active' %}success{% else %}secondary{% endif %}">
                                    {{ session.get_status_display }}
                                </span>
                            </td>
                        </tr>
                        <tr>
                            <th>{% trans "Start Time:" %}</th>
                            <td>{{ session.start_time }}</td>
                        </tr>
                        <tr>
                            <th>{% trans "End Time:" %}</th>
                            <td>{{ session.end_time|default:"-" }}</td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
        
        <div class="col-md-6">
            <div class="card shadow-sm mb-4">
                <div class="card-header">{% trans "Financials" %}</div>
                <div class="card-body">
                    <table class="table table-bordered">
                        <tr>
                            <th>{% trans "Opening Balance" %}</th>
                            <td class="text-end">{{ session.opening_balance|floatformat:3 }}</td>
                        </tr>
                        <tr>
                            <th>{% trans "Total Sales (System)" %}</th>
                            <td class="text-end">{{ total_sales|floatformat:3 }}</td>
                        </tr>
                        {% for pm in payments %}
                        <tr>
                            <td class="ps-4 text-muted">{{ pm.payment_method_name }}</td>
                            <td class="text-end text-muted">{{ pm.total|floatformat:3 }}</td>
                        </tr>
                        {% endfor %}
                        
                        {% if session.closing_balance %}
                        <tr class="table-info">
                            <th>{% trans "Closing Balance (Actual)" %}</th>
                            <td class="text-end fw-bold">{{ session.closing_balance|floatformat:3 }}</td>
                        </tr>
                        
                        {# Calculate discrepancy for Cash if possible #}
                        {% endif %}
                    </table>
                </div>
            </div>
        </div>
    </div>
    
    {% if session.notes %}
    <div class="card shadow-sm">
        <div class="card-header">{% trans "Notes" %}</div>
        <div class="card-body">
            {{ session.notes|linebreaks }}
        </div>
    </div>
    {% endif %}
</div>
{% endblock %}
