{% extends "base.html" %}
{% block title %}Carrito — GhostRace{% endblock %}
{% block content %}
<h2 class="section-title">Tu carrito</h2>

{% if not items %}
<p class="muted">Tu carrito está vacío. <a href="{{ url_for('catalogo') }}">Ir al catálogo</a>.</p>
{% else %}
<table class="simple-table">
  <thead>
    <tr><th>Producto</th><th>Cantidad</th><th>Subtotal</th></tr>
  </thead>
  <tbody>
    {% for it in items %}
    <tr>
      <td>{{ it.product.emoji }} {{ it.product.nombre }}</td>
      <td>{{ it.cantidad }}</td>
      <td>{{ "%.2f"|format(it.subtotal) }} €</td>
    </tr>
    {% endfor %}
  </tbody>
</table>

<div class="info-row">
  <span class="k">Total</span>
  <span class="v">{{ "%.2f"|format(total) }} €</span>
</div>

<button id="tramitar-btn" class="btn">Tramitar pedido</button>
<div id="carrito-status" class="status-line"></div>
{% endif %}
{% endblock %}