{% extends "base.html" %}
{% block title %}{{ producto.nombre }}{% endblock %}
{% block page_title %}{{ producto.nombre }}{% endblock %}

{% block topbar_actions %}
<a href="{{ url_for('productos.editar', id=producto.id) }}" class="btn btn-outline-secondary btn-sm">
  <i class="bi bi-pencil me-1"></i>Editar ficha
</a>
<a href="{{ url_for('productos.lista') }}" class="btn btn-outline-secondary btn-sm">
  <i class="bi bi-arrow-left me-1"></i>Volver
</a>
{% endblock %}

{% block content %}

<!-- Resumen estadístico -->
<div class="row g-3 mb-4">
  <div class="col-6 col-md-3">
    <div class="card text-center p-3">
      <div class="text-muted small mb-1">Unidades compradas</div>
      <div class="fs-2 fw-bold text-primary">
        {{ "%.0f"|format(stats.total_unidades or 0) if not stats.total_unidades or stats.total_unidades % 1 == 0
           else "%.2f"|format(stats.total_unidades) }}
      </div>
      <div class="text-muted small">{{ producto.unidad or 'ud' }}</div>
    </div>
  </div>
  <div class="col-6 col-md-3">
    <div class="card text-center p-3">
      <div class="text-muted small mb-1">Precio medio</div>
      <div class="fs-2 fw-bold">
        {% if stats.precio_medio %}{{ "%.2f"|format(stats.precio_medio) }} €{% else %}—{% endif %}
      </div>
      {% if stats.precio_min and stats.precio_max and stats.precio_min != stats.precio_max %}
      <div class="text-muted small">
        {{ "%.2f"|format(stats.precio_min) }} – {{ "%.2f"|format(stats.precio_max) }} €
      </div>
      {% endif %}
    </div>
  </div>
  <div class="col-6 col-md-3">
    <div class="card text-center p-3">
      <div class="text-muted small mb-1">Total gastado</div>
      <div class="fs-2 fw-bold text-danger">
        {{ "%.2f"|format(stats.total_gastado or 0) }} €
      </div>
      <div class="text-muted small">{{ stats.num_facturas or 0 }} factura(s)</div>
    </div>
  </div>
  <div class="col-6 col-md-3">
    <div class="card text-center p-3">
      <div class="text-muted small mb-1">Proveedores</div>
      <div class="fs-2 fw-bold">{{ stats.num_proveedores or 0 }}</div>
      <div class="text-muted small">distintos</div>
    </div>
  </div>
</div>

<!-- Info del producto -->
{% if producto.descripcion or producto.notas or producto.precio_ref %}
<div class="card mb-4">
  <div class="card-body">
    <div class="row g-3">
      {% if producto.descripcion %}
      <div class="col-md-6">
        <div class="text-muted small fw-semibold mb-1">DESCRIPCIÓN</div>
        <p class="mb-0">{{ producto.descripcion }}</p>
      </div>
      {% endif %}
      {% if producto.precio_ref %}
      <div class="col-md-3">
        <div class="text-muted small fw-semibold mb-1">PRECIO DE REFERENCIA</div>
        <p class="mb-0 fw-semibold">{{ "%.2f"|format(producto.precio_ref) }} €</p>
      </div>
      {% endif %}
      {% if producto.notas %}
      <div class="col-12">
        <div class="text-muted small fw-semibold mb-1">NOTAS</div>
        <p class="mb-0 text-muted">{{ producto.notas }}</p>
      </div>
      {% endif %}
    </div>
  </div>
</div>
{% endif %}

<!-- Datos del catálogo de venta -->
{% if cat_entry %}
{% set margen = ((cat_entry.precio - cat_entry.coste) / cat_entry.coste * 100) if cat_entry.coste and cat_entry.coste > 0 and cat_entry.precio else none %}
<div class="card mb-4 border-success-subtle">
  <div class="card-header py-2 bg-success-subtle text-success-emphasis d-flex align-items-center gap-2">
    <i class="bi bi-tags"></i>
    <span class="fw-semibold">Datos de venta (catálogo)</span>
    <a href="{{ url_for('catalogo.editar', id=cat_entry.id) }}"
       class="ms-auto btn btn-sm btn-outline-success">
      <i class="bi bi-pencil me-1"></i>Editar catálogo
    </a>
  </div>
  <div class="card-body py-2">
    <div class="row g-3 text-center">
      <div class="col-6 col-sm-3">
        <div class="text-muted small">Precio venta</div>
        <div class="fw-bold fs-5">
          {% if cat_entry.precio %}{{ "%.2f"|format(cat_entry.precio) }} €{% else %}<span class="text-muted">—</span>{% endif %}
        </div>
      </div>
      <div class="col-6 col-sm-3">
        <div class="text-muted small">Precio coste</div>
        <div class="fw-bold fs-5">
          {% if cat_entry.coste %}{{ "%.2f"|format(cat_entry.coste) }} €{% else %}<span class="text-muted">—</span>{% endif %}
        </div>
      </div>
      <div class="col-6 col-sm-3">
        <div class="text-muted small">Margen</div>
        <div class="fw-bold fs-5
          {% if margen is not none %}{% if margen >= 0 %}text-success{% else %}text-danger{% endif %}{% endif %}">
          {% if margen is not none %}{{ "%.1f"|format(margen) }}%{% else %}<span class="text-muted">—</span>{% endif %}
        </div>
      </div>
      <div class="col-6 col-sm-3">
        <div class="text-muted small">Proveedor principal</div>
        <div class="fw-semibold small">{{ cat_entry.proveedor_nombre or '—' }}</div>
      </div>
    </div>
  </div>
</div>
{% else %}
<div class="alert alert-secondary d-flex align-items-center gap-3 mb-4 py-2">
  <i class="bi bi-tags text-muted"></i>
  <span class="small text-muted">Este producto no tiene entrada en el catálogo de venta todavía.</span>
</div>
{% endif %}

<!-- Historial de compras -->
<div class="card">
  <div class="card-header d-flex align-items-center gap-2">
    <i class="bi bi-clock-history"></i> Historial de compras
    <span class="badge bg-secondary ms-auto">{{ compras|length }}</span>
  </div>
  {% if compras %}
  <div class="table-responsive">
    <table class="table table-hover mb-0">
      <thead>
        <tr>
          <th>Factura</th>
          <th>Fecha</th>
          <th>Proveedor</th>
          <th class="text-center">Cantidad</th>
          <th class="text-end">P. unit.</th>
          <th class="text-end">Dto.</th>
          <th class="text-end">Subtotal</th>
        </tr>
      </thead>
      <tbody>
        {% for c in compras %}
        <tr>
          <td>
            <a href="{{ url_for('facturas.detalle_recibida', id=c.factura_id) }}"
               class="fw-semibold text-decoration-none">{{ c.factura_numero }}</a>
          </td>
          <td>{{ c.fecha }}</td>
          <td>
            {% if c.proveedor_id %}
            <a href="{{ url_for('proveedores.detalle', id=c.proveedor_id) }}"
               class="text-muted text-decoration-none">{{ c.proveedor_nombre }}</a>
            {% else %}—{% endif %}
          </td>
          <td class="text-center">
            {{ "%.0f"|format(c.cantidad) if c.cantidad % 1 == 0 else "%.2f"|format(c.cantidad) }}
          </td>
          <td class="text-end">{{ "%.2f"|format(c.precio_unitario) }} €</td>
          <td class="text-end text-muted">
            {% if c.descuento_pct %}{{ c.descuento_pct }}%{% else %}—{% endif %}
          </td>
          <td class="text-end fw-semibold">{{ "%.2f"|format(c.subtotal) }} €</td>
        </tr>
        {% endfor %}
      </tbody>
      <tfoot class="table-light fw-bold">
        <tr>
          <td colspan="3">TOTAL</td>
          <td class="text-center">
            {{ "%.0f"|format(stats.total_unidades or 0) if not stats.total_unidades or stats.total_unidades % 1 == 0
               else "%.2f"|format(stats.total_unidades) }}
          </td>
          <td class="text-end text-muted small">avg {{ "%.2f"|format(stats.precio_medio or 0) }} €</td>
          <td></td>
          <td class="text-end">{{ "%.2f"|format(stats.total_gastado or 0) }} €</td>
        </tr>
      </tfoot>
    </table>
  </div>
  {% else %}
  <div class="text-center py-4 text-muted">
    <i class="bi bi-inbox me-2"></i>No hay compras registradas para este producto todavía.
  </div>
  {% endif %}
</div>
{% endblock %}