{% extends "base.html" %}
{% block title %}Presets{% endblock %}

{% block content %}
<div class="page-header">
                <h1 class="page-title">Presets</h1>
                <p class="page-subtitle">Create reusable defaults for additional fields.</p>
            </div>

        <div class="card">
            <h2 class="card-title">{% if editing %}Edit preset{% else %}Create preset{% endif %}</h2>

            <form method="post" action="{% if editing %}/presets/{{ editing.id }}/update{% else %}/presets/create{% endif %}">
                <div class="form-grid">
                    <div class="form-field">
                        <label>Preset name</label>
                        <input type="text" name="name" value="{{ form_values.name }}" required>
                    </div>
                    <div class="form-field">
                        <label>Primary owner</label>
                        <input type="text" name="owner_primary" value="{{ form_values.owner_primary }}">
                    </div>
                    <div class="form-field">
                        <label>Secondary owner</label>
                        <input type="text" name="owner_secondary" value="{{ form_values.owner_secondary }}">
                    </div>
                    <div class="form-field">
                        <label>Paid by person</label>
                        <input type="text" name="paid_by_person" value="{{ form_values.paid_by_person }}">
                    </div>
                    <div class="form-field full">
                        <label>Covered people</label>
                        <input type="text" name="covered_people" value="{{ form_values.covered_people }}" placeholder="Full Name, Full Name">
                    </div>
                    <div class="form-field full">
                        <label>Attendees</label>
                        <input type="text" name="attendees" value="{{ form_values.attendees }}" placeholder="Full Name, Full Name">
                    </div>
                    <div class="form-field full">
                        <label>Occasion note</label>
                        <input type="text" name="occasion_note" value="{{ form_values.occasion_note }}">
                    </div>
                    <div class="form-field">
                        <label><input type="checkbox" name="is_shared_expense" value="1" {% if form_values.is_shared_expense %}checked{% endif %}> Shared expense</label>
                    </div>
                    <div class="form-field full">
                        <label>Reimbursement expected from</label>
                        <input type="text" name="reimbursement_expected_from" value="{{ form_values.reimbursement_expected_from }}" placeholder="Full Name, Full Name">
                    </div>
                    <div class="form-field">
                        <label>Reimbursement paid by</label>
                        <input type="text" name="reimbursement_paid_by" value="{{ form_values.reimbursement_paid_by }}">
                    </div>
                    <div class="form-field">
                        <label>Reimbursement paid to</label>
                        <input type="text" name="reimbursement_paid_to" value="{{ form_values.reimbursement_paid_to }}">
                    </div>
                    <div class="form-field full">
                        <label>Reimbursement note</label>
                        <textarea name="reimbursement_note" rows="3">{{ form_values.reimbursement_note }}</textarea>
                    </div>
                </div>

                <div class="button-row" style="margin-top: 1rem;">
                    <button class="primary" type="submit">{% if editing %}Save preset{% else %}Create preset{% endif %}</button>
                    {% if editing %}
                        <a class="button-link" href="/presets/">Cancel</a>
                    {% endif %}
                </div>
            </form>
        </div>

        <div class="card">
            <h2 class="card-title">Existing presets</h2>

            {% if presets %}
                <div class="table-wrap">
                    <table>
                        <thead>
                            <tr>
                                <th>Name</th>
                                <th>Primary owner</th>
                                <th>Secondary owner</th>
                                <th>Paid by</th>
                                <th>Covered people</th>
                                <th>Attendees</th>
                                <th>Shared</th>
                                <th>Actions</th>
                            </tr>
                        </thead>
                        <tbody>
                            {% for preset in presets %}
                            <tr>
                                <td>{{ preset.name }}</td>
                                <td>{{ preset.owner_primary or "" }}</td>
                                <td>{{ preset.owner_secondary or "" }}</td>
                                <td>{{ preset.paid_by_person or "" }}</td>
                                <td>{{ preset.covered_people or [] }}</td>
                                <td>{{ preset.attendees or [] }}</td>
                                <td>{{ "Yes" if preset.is_shared_expense else "No" }}</td>
                                <td>
                                    <div class="button-row">
                                        <a class="button-link" href="/presets/?edit_id={{ preset.id }}">Edit</a>
                                        <form method="post" action="/presets/{{ preset.id }}/delete">
                                            <button class="danger" type="submit">Delete</button>
                                        </form>
                                    </div>
                                </td>
                            </tr>
                            {% endfor %}
                        </tbody>
                    </table>
                </div>
            {% else %}
                <p class="empty-state">No presets yet.</p>
            {% endif %}
        </div>

{% endblock %}