{# templates/barrier/container-search.html #}
{% extends "barrier/barrier-base.html" %}
{% block content %}
<div class="barrier-container">
    <form method="post" class="w-full">
        {% csrf_token %}
        <input type="hidden" name="search_type" value="{{ search_type }}">
        
        <div class="p-6">
            <label for="id_number" class="block text-2xl mb-4">
                {% if search_type == 'container_receive' %}
                    Enter Booking Number
                {% else %}
                    Enter Container Number
                {% endif %}
            </label>
            
            <div class="flex flex-col gap-4">
                <input type="text" 
                       id="id_number" 
                       name="number" 
                       class="px-4 py-3 text-xl border-2 rounded-lg"
                       required
                       autocomplete="off"
                       autofocus>
                
                <button type="submit" 
                        class="barrier-button">
                    Search
                </button>
                
                {% if error %}
                <div class="text-red-600 text-xl text-center">
                    {{ error }}
                </div>
                {% endif %}
                
                <a href="{% url 'barrier_dashboard' %}" 
                   class="barrier-button" 
                   style="background-color: #f5f5f5;">
                    Back
                </a>
            </div>
        </div>
    </form>
</div>
{% endblock %}