@extends('layouts.app')

@section('title', 'Create Order - MiMSMS Voter System')

@section('content')
<div style="max-width: 700px; margin: 0 auto;">
    <h1 style="color: var(--primary-orange); margin-bottom: 2rem;">Create New Order</h1>

    <div class="card">
        <form action="{{ route('order.store') }}" method="POST">
            @csrf

            <div class="form-group">
                <label for="electoral_area_id">Electoral Area *</label>
                <select id="electoral_area_id" name="electoral_area_id" required>
                    <option value="">-- Select Electoral Area --</option>
                    @foreach(\App\Models\District::with('thanas.electoralAreas')->get() as $district)
                        @foreach($district->thanas as $thana)
                            @foreach($thana->electoralAreas as $area)
                                <option value="{{ $area->id }}">
                                    {{ $district->name }} > {{ $thana->name }} > {{ $area->name }}
                                </option>
                            @endforeach
                        @endforeach
                    @endforeach
                </select>
                @error('electoral_area_id')
                    <span style="color: var(--danger);">{{ $message }}</span>
                @enderror
            </div>

            <h3 style="color: var(--primary-orange); margin-top: 2rem; margin-bottom: 1rem;">Customer Details</h3>

            <div class="form-group">
                <label for="customer_name">Full Name *</label>
                <input type="text" id="customer_name" name="customer_name" value="{{ old('customer_name') }}" required>
                @error('customer_name')
                    <span style="color: var(--danger);">{{ $message }}</span>
                @enderror
            </div>

            <div class="form-group">
                <label for="customer_email">Email Address *</label>
                <input type="email" id="customer_email" name="customer_email" value="{{ old('customer_email') }}" required>
                @error('customer_email')
                    <span style="color: var(--danger);">{{ $message }}</span>
                @enderror
            </div>

            <div class="form-group">
                <label for="customer_phone">Phone Number *</label>
                <input type="tel" id="customer_phone" name="customer_phone" value="{{ old('customer_phone') }}" required>
                @error('customer_phone')
                    <span style="color: var(--danger);">{{ $message }}</span>
                @enderror
            </div>

            <h3 style="color: var(--primary-orange); margin-top: 2rem; margin-bottom: 1rem;">Order Details</h3>

            <div class="form-group">
                <label for="package_type">Package Type *</label>
                <select id="package_type" name="package_type" required>
                    <option value="">-- Select Package --</option>
                    <option value="sms_bulk">SMS Bulk (Bulk messaging)</option>
                    <option value="sms_standard">SMS Standard (Standard messaging)</option>
                    <option value="sms_premium">SMS Premium (Premium messaging)</option>
                </select>
                @error('package_type')
                    <span style="color: var(--danger);">{{ $message }}</span>
                @enderror
            </div>

            <div class="form-group">
                <label for="quantity">Quantity (Number of SMS) *</label>
                <input type="number" id="quantity" name="quantity" value="{{ old('quantity') }}" min="1" required>
                @error('quantity')
                    <span style="color: var(--danger);">{{ $message }}</span>
                @enderror
            </div>

            <div class="form-group">
                <label for="additional_notes">Additional Notes</label>
                <textarea id="additional_notes" name="additional_notes" rows="4" placeholder="Any special requests or notes...">{{ old('additional_notes') }}</textarea>
                @error('additional_notes')
                    <span style="color: var(--danger);">{{ $message }}</span>
                @enderror
            </div>

            <div style="display: flex; gap: 1rem; margin-top: 2rem;">
                <button type="submit" class="btn" style="flex: 1;">Submit Order</button>
                <a href="{{ route('home') }}" class="btn btn-secondary" style="flex: 1; text-align: center; text-decoration: none;">Cancel</a>
            </div>
        </form>
    </div>
</div>
@endsection