{% extends 'base.html' %}
{% block title %}Przesuń środki - {{ zbiorka.nazwa }}{% endblock %}
{% block content %}

<div class="container my-5">
    <!-- Nagłówek -->
    <div class="mb-4">
        <h1 class="mb-2">
            <i class="bi bi-arrow-left-right text-primary"></i> Przesuń środki z: {{ zbiorka.nazwa }}
        </h1>
        <p class="text-muted">Dostępne środki: <strong class="text-success">{{ zbiorka.stan|round(2) }} PLN</strong></p>
    </div>

    <!-- Formularz -->
    <form method="POST">
        <div class="card shadow-sm mb-3">
            <div class="card-header bg-transparent">
                <h5 class="mb-0">
                    <i class="bi bi-box-arrow-in-down text-success"></i> Cel przesunięcia
                </h5>
            </div>
            <div class="card-body">
                <div class="mb-3">
                    <label for="zbiorka_cel_id" class="form-label fw-semibold">
                        Docelowa zbiórka <span class="text-danger">*</span>
                    </label>
                    <select class="form-select" id="zbiorka_cel_id" name="zbiorka_cel_id" required>
                        <option value="">-- Wybierz zbiórkę docelową --</option>
                        {% for zb in dostepne_zbiorki %}
                        <option value="{{ zb.id }}">
                            {% if zb.typ_zbiorki == 'rezerwa' %}
                            {{ zb.nazwa }} (Rezerwa)
                            {% else %}
                            {{ zb.nazwa }}
                            {% endif %}
                            · Stan: {{ zb.stan|round(2) }} PLN
                        </option>
                        {% endfor %}
                    </select>
                </div>

                <div class="mb-3">
                    <label for="kwota" class="form-label fw-semibold">
                        Kwota (PLN) <span class="text-danger">*</span>
                    </label>
                    <div class="input-group">
                        <input type="text" class="form-control" id="kwota" name="kwota" 
                               placeholder="np. 100.00" required>
                        <span class="input-group-text">PLN</span>
                    </div>
                    <small class="text-muted">
                        <i class="bi bi-info-circle"></i> Można użyć przecinka lub kropki
                    </small>
                </div>

                <div class="mb-0">
                    <label for="opis" class="form-label fw-semibold">
                        Opis <span class="text-muted">(opcjonalny)</span>
                    </label>
                    <textarea class="form-control" id="opis" name="opis" rows="3" 
                              placeholder="Dodatkowe informacje o przesunięciu"></textarea>
                </div>
            </div>
        </div>

        <!-- Alert informacyjny -->
        <div class="alert alert-info d-flex align-items-start mb-3">
            <i class="bi bi-lightbulb fs-5 me-2"></i>
            <div class="small">
                <strong>Jak to działa:</strong> Kwota zostanie odjęta ze źródłowej zbiórki i dodana do docelowej. 
                W obu zbiórkach pojawi się wpis o przesunięciu w historii transakcji.
            </div>
        </div>

        <div class="d-flex gap-2">
            <button type="submit" class="btn btn-primary">
                <i class="bi bi-arrow-left-right"></i> Przesuń środki
            </button>
            <a href="{{ url_for('transakcje_zbiorki', zbiorka_id=zbiorka.id) }}" 
               class="btn btn-secondary">Anuluj</a>
        </div>
    </form>
</div>

{% endblock %}