{% extends "base.html" %}
{% set active_nav = "shipments" %}

{% block title %}Add Bloom Tube - Shipment {{ shipment.shipment_number }}{% endblock %}

{% block content %}
<div class="page-header">
    <div>
        <h1 class="page-title">Add Bloom Tube To Shipment</h1>
        <p class="page-subtitle">
            Shipment <code>{{ shipment.shipment_number }}</code>
            {% if revision and revision.status %}({{ revision.status|replace('_', ' ') }}){% endif %}
        </p>
    </div>
    <div class="flex gap-md">
        <a href="/shipments/{{ shipment.shipment_number }}" class="btn btn-ghost">← Back to Shipment</a>
    </div>
</div>

<div class="card" style="max-width: 860px;">
    <div class="card-header">
        <h2 class="card-title">Create Tube With Optional Specimen</h2>
    </div>
    <div class="card-body">
        <p class="text-sm text-muted mb-md">
            This flow always links the tube to the current shipment. You can also add a direct test kit or site link. Leave patient empty to create a tube only.
        </p>
        <form method="POST" action="/shipments/{{ shipment.shipment_number }}/add-specimen">
            <input type="hidden" name="csrf_token" value="{{ csrf_token }}">

            <div class="form-group">
                <label class="form-label" for="test-euid">Test *</label>
                <select id="test-euid" name="test_euid" class="form-control" required>
                    <option value="">-- Select Test --</option>
                    {% for test in test_options %}
                    <option value="{{ test.id }}">{{ test.label }}</option>
                    {% endfor %}
                </select>
            </div>

            <div class="form-group">
                <label class="form-label" for="patient-euid">Patient (optional)</label>
                <select id="patient-euid" name="patient_euid" class="form-control">
                    <option value="">-- Tube only (no specimen) --</option>
                    {% for patient in available_patients %}
                    <option value="{{ patient.id }}">{{ patient.name }}</option>
                    {% endfor %}
                </select>
            </div>

            <div class="form-group">
                <label class="form-label" for="testkit-euid">Test Kit (optional)</label>
                <select id="testkit-euid" name="testkit_euid" class="form-control">
                    <option value="">-- None --</option>
                    {% for kit in available_testkits %}
                    <option value="{{ kit.id }}">{{ kit.label }}</option>
                    {% endfor %}
                </select>
                <p class="form-hint">Optional additional direct kit link for this tube.</p>
            </div>

            <div class="form-group">
                <label class="form-label" for="tube-site">Tube Site (optional)</label>
                <select id="tube-site" name="site_euid" class="form-control">
                    <option value="">-- None --</option>
                    {% for site in site_options %}
                    <option value="{{ site.id }}" {% if selected_origin_site_id and selected_origin_site_id == site.id %}selected{% endif %}>
                        {{ site.name }}{% if site.site_code %} ({{ site.site_code }}){% endif %}
                    </option>
                    {% endfor %}
                </select>
            </div>

            <div class="form-group">
                <label class="form-label" for="collection-site">Collection Site (required when filled)</label>
                <select id="collection-site" name="collection_site_euid" class="form-control">
                    <option value="">-- Required when patient is selected --</option>
                    {% for site in site_options %}
                    <option value="{{ site.id }}" {% if selected_origin_site_id and selected_origin_site_id == site.id %}selected{% endif %}>
                        {{ site.name }}{% if site.site_code %} ({{ site.site_code }}){% endif %}
                    </option>
                    {% endfor %}
                </select>
            </div>

            <div class="form-group">
                <label class="form-label" for="origin-site">Fallback Site Resolution (optional)</label>
                <select id="origin-site" name="origin_site_id" class="form-control">
                    <option value="">Use shipment/test kit defaults</option>
                    {% for site in site_options %}
                    <option value="{{ site.id }}" {% if selected_origin_site_id and selected_origin_site_id == site.id %}selected{% endif %}>
                        {{ site.name }}{% if site.site_code %} ({{ site.site_code }}){% endif %}
                    </option>
                    {% endfor %}
                </select>
            </div>

            <div class="form-group">
                <label class="form-label" for="collected-at">Collected At</label>
                <input id="collected-at" type="datetime-local" name="collected_at" class="form-input">
            </div>

            <div class="form-group">
                <label class="form-label" for="collection-type">Collection Type</label>
                <input id="collection-type" type="text" name="collection_type" class="form-input">
            </div>

            <div class="form-group">
                <label class="form-label" for="collected-by">Collected By</label>
                <input id="collected-by" type="text" name="collected_by" class="form-input">
            </div>

            <div class="form-group">
                <label class="form-label" for="expected-mrn">Expected MRN</label>
                <input id="expected-mrn" type="text" name="expected_mrn" class="form-input">
            </div>

            <div class="form-group">
                <label class="form-label" for="expected-dob">Expected DOB</label>
                <input id="expected-dob" type="text" name="expected_dob" class="form-input">
            </div>

            <div class="form-group">
                <label class="form-label" for="expected-name">Expected Name</label>
                <input id="expected-name" type="text" name="expected_name" class="form-input">
            </div>

            <div class="form-group">
                <label class="form-label" for="expected-label-text">Expected Label Text</label>
                <input id="expected-label-text" type="text" name="expected_label_text" class="form-input">
            </div>

            <div class="form-actions">
                <button type="submit" class="btn btn-primary">Create Bloom Tube</button>
                <a href="/shipments/{{ shipment.shipment_number }}" class="btn btn-secondary">Cancel</a>
            </div>
        </form>
    </div>
</div>
{% endblock %}