{% comment %}
Reusable camera capture input for garment photos (before/after cleaning).
Usage: {% include "partials/camera_photo_input.html" with field_id="photo-front" field_name="photo_front" label="Front View" required=False %}
{% endcomment %}
<div class="camera-upload-field">
    <label for="{{ field_id|default:'garment-photo' }}" class="camera-upload-label">
        {{ label|default:"Garment Photo" }}
        {% if required %}<span class="text-red-600">*</span>{% endif %}
    </label>
    <div class="camera-upload-control">
        <input
            type="file"
            id="{{ field_id|default:'garment-photo' }}"
            name="{{ field_name|default:'photo' }}"
            accept="image/*"
            capture="environment"
            class="camera-file-input"
            {% if required %}required{% endif %}
            {% if multiple %}multiple{% endif %}
        >
        <label for="{{ field_id|default:'garment-photo' }}" class="camera-upload-btn" aria-hidden="true">
            <svg class="camera-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 9a2 2 0 012-2h.93a2 2 0 001.664-.89l.812-1.22A2 2 0 0110.07 4h3.86a2 2 0 011.664.89l.812 1.22A2 2 0 0018.07 7H19a2 2 0 012 2v9a2 2 0 01-2 2H5a2 2 0 01-2-2V9z"/>
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 13a3 3 0 11-6 0 3 3 0 016 0z"/>
            </svg>
            <span>Tap to capture or choose photo</span>
        </label>
        <p class="camera-upload-hint">Uses tablet camera when available</p>
        <p class="camera-filename text-sm text-slate-500 mt-2" data-for="{{ field_id|default:'garment-photo' }}" hidden></p>
    </div>
</div>