{% extends "base.html" %}
{% block title %}Plantillas de abono{% endblock %}
{% block page_title %}Plantillas de correo — Abonos a proveedores{% endblock %}

{% block content %}
{% with msgs = get_flashed_messages(with_categories=true) %}
  {% for cat, msg in msgs %}
  <div class="alert alert-{{ cat }} alert-dismissible fade show">{{ msg }}<button type="button" class="btn-close" data-bs-dismiss="alert"></button></div>
  {% endfor %}
{% endwith %}

<div class="d-flex justify-content-between align-items-center mb-4">
  <a href="{{ url_for('abonos_prov.index') }}" class="btn btn-sm btn-outline-secondary">
    <i class="bi bi-arrow-left me-1"></i>Volver a abonos
  </a>
  <a href="{{ url_for('abonos_prov.plantilla_nueva') }}" class="btn btn-primary btn-sm">
    <i class="bi bi-plus-lg me-1"></i>Nueva plantilla
  </a>
</div>

<div class="card border-0 shadow-sm">
  <div class="card-header fw-semibold small">
    <i class="bi bi-envelope-paper me-2"></i>Plantillas disponibles
  </div>
  <div class="table-responsive">
    <table class="table table-hover align-middle mb-0">
      <thead class="table-dark">
        <tr>
          <th>Nombre</th>
          <th>Proveedor</th>
          <th>Asunto</th>
          <th>Tipo</th>
          <th></th>
        </tr>
      </thead>
      <tbody>
        {% for pt in plantillas %}
        <tr>
          <td class="fw-semibold">{{ pt.nombre }}</td>
          <td class="text-muted small">{{ pt.prov_nombre or 'General (todos)' }}</td>
          <td class="text-muted small">{{ pt.asunto or '—' }}</td>
          <td>
            {% if pt.es_sistema %}
            <span class="badge bg-secondary">Base</span>
            {% else %}
            <span class="badge bg-primary">Personalizada</span>
            {% endif %}
          </td>
          <td class="text-end">
            <div class="btn-group btn-group-sm">
              <a href="{{ url_for('abonos_prov.plantilla_editar', pid=pt.id) }}"
                 class="btn btn-outline-secondary">
                <i class="bi bi-pencil"></i>
              </a>
              {% if not pt.es_sistema %}
              <button type="button" class="btn btn-outline-danger"
                      data-bs-toggle="modal" data-bs-target="#modalDel{{ pt.id }}">
                <i class="bi bi-trash"></i>
              </button>
              {% endif %}
            </div>
          </td>
        </tr>
        {% else %}
        <tr>
          <td colspan="5" class="text-center text-muted py-4">No hay plantillas.</td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
</div>

<div class="alert alert-info mt-4 small">
  <i class="bi bi-info-circle me-2"></i>
  Las plantillas base no pueden eliminarse, pero sí editarse. Puedes usar los marcadores
  <code>{numero}</code>, <code>{fecha}</code>, <code>{total}</code>, <code>{concepto}</code>,
  <code>{factura_ref}</code> y <code>{empresa}</code> en el asunto y el cuerpo del mensaje.
</div>

<!-- Modales eliminar -->
{% for pt in plantillas %}
{% if not pt.es_sistema %}
<div class="modal fade" id="modalDel{{ pt.id }}" tabindex="-1">
  <div class="modal-dialog modal-sm">
    <div class="modal-content">
      <div class="modal-header">
        <h6 class="modal-title">Eliminar plantilla</h6>
        <button class="btn-close" data-bs-dismiss="modal"></button>
      </div>
      <div class="modal-body small">
        ¿Eliminar la plantilla <strong>{{ pt.nombre }}</strong>?
      </div>
      <div class="modal-footer">
        <button class="btn btn-sm btn-secondary" data-bs-dismiss="modal">Cancelar</button>
        <form method="post" action="{{ url_for('abonos_prov.plantilla_eliminar', pid=pt.id) }}">
          <button class="btn btn-sm btn-danger">Eliminar</button>
        </form>
      </div>
    </div>
  </div>
</div>
{% endif %}
{% endfor %}
{% endblock %}