{% extends "base.html" %}

{% block title %}Export Customers | Customer Log & Sign Off{% endblock %}

{% block content %}
<section class="page-hero">
    <div>
        <h2>Password-protected customer export</h2>
        <p>Filter the customer list, then enter the export password to download a CSV file.</p>
    </div>
    <a href="{{ app_url('/customers') }}" class="secondary-btn link-btn">Back to Customer Log</a>
</section>

<section class="card export-card">
    <form method="post" action="{{ app_url('/customers/export') }}" class="stacked-form">
        <div class="form-panel">
            <div class="panel-title">Export filters</div>
            <div class="field-grid three-up">
                <div class="field">
                    <label for="q">Search</label>
                    <input id="q" name="q" type="text" value="{{ search_text }}" placeholder="Company, contact, phone, email, address, machine">
                </div>
                <div class="field">
                    <label for="status">Status</label>
                    <select id="status" name="status">
                        <option value="">All statuses</option>
                        {% for option in status_options %}
                        <option value="{{ option }}" {% if status_filter == option %}selected{% endif %}>{{ option }}</option>
                        {% endfor %}
                    </select>
                </div>
                <div class="field">
                    <label for="machine_interest">Machine interest</label>
                    <select id="machine_interest" name="machine_interest">
                        <option value="">All machines</option>
                        {% for machine in machine_options %}
                        <option value="{{ machine }}" {% if machine_filter == machine %}selected{% endif %}>{{ machine }}</option>
                        {% endfor %}
                    </select>
                </div>
            </div>
            <div class="export-count">Matching customers now: <strong>{{ matching_count }}</strong></div>
        </div>

        <div class="form-panel warning-panel">
            <div class="panel-title">Confirm export</div>
            <div class="field">
                <label for="export_password">Export password</label>
                <input id="export_password" name="export_password" type="password" autocomplete="current-password" placeholder="Enter export password" required>
            </div>
            <p class="help-text">The CSV file will include company details, address, contacts, statuses, machine interests, notes, and next contact date.</p>
        </div>

        <div class="button-row">
            <button type="submit" class="primary-btn big-btn">Download CSV export</button>
            <a href="{{ app_url('/customers') }}" class="secondary-btn link-btn">Cancel</a>
        </div>
    </form>
</section>
{% endblock %}