@extends('layouts.app') {{-- Use your main layout file --}}

@section('title', 'Add New Conventional Product')

@section('content')
    {{-- Back Navigation & Title --}}
    <div class="mb-6">
        {{-- Link back to product index or dashboard --}}
        <a href="{{ route('admin.products.index') }}" class="text-sm text-indigo-400 hover:text-indigo-800 hover:underline">
            &larr; Back to Products List
        </a>
        <h1 class="text-2xl md:text-3xl font-semibold text-gray-800 mt-2">
            Add New Conventional Product
        </h1>
    </div>


    {{-- Form Container --}}
    <div class="max-w-xl mx-auto bg-white shadow-md rounded-lg p-6 md:p-8 border border-gray-200">

        {{-- Form points to admin.products.store (no campaign parameter needed in route) --}}
        <form method="POST" action="{{ route('admin.products.store') }}" class="space-y-6">
            @csrf

            {{-- Campaign Selection Dropdown --}}
            <div>
                <label for="campaign_id" class="block text-sm font-medium text-gray-700 mb-1">
                    Assign to Campaign <span class="text-red-500">*</span>
                </label>
                <select name="campaign_id" id="campaign_id" required
                    class="block w-full px-3 py-2 border border-gray-300 bg-white rounded-md shadow-sm
                               focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm appearance-none
                               @error('campaign_id') border-red-500 ring-1 ring-red-500 @enderror">
                    <option value="" disabled @selected(old('campaign_id') == '')>Select a campaign...</option>
                    {{-- Loop through campaigns passed from controller --}}
                    @foreach ($campaigns as $campaignOption)
                        <option value="{{ $campaignOption->id }}" @selected(old('campaign_id') == $campaignOption->id)>
                            {{ $campaignOption->title }}
                        </option>
                    @endforeach
                </select>
                @error('campaign_id')
                    <p class="mt-1 text-xs text-red-600">{{ $message }}</p>
                @enderror
            </div>


            {{-- Product Name --}}
            <div>
                <label for="name" class="block text-sm font-medium text-gray-700 mb-1">
                    Product Name <span class="text-red-500">*</span>
                </label>
                <input type="text" name="name" id="name" value="{{ old('name') }}" required
                    class="block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm placeholder-gray-400
                              focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm
                              @error('name') border-red-500 ring-1 ring-red-500 @enderror">
                @error('name')
                    <p class="mt-1 text-xs text-red-600">{{ $message }}</p>
                @enderror
            </div>

            {{-- Product Type --}}
            <div>
                <label for="type" class="block text-sm font-medium text-gray-700 mb-1">
                    Product Type <span class="text-red-500">*</span>
                </label>
                <select name="type" id="type" required
                    class="block w-full px-3 py-2 border border-gray-300 bg-white rounded-md shadow-sm
                           focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm appearance-none
                           @error('type') border-red-500 ring-1 ring-red-500 @enderror">
                    <option value="" disabled @selected(old('type') == '')>Select a type...</option>
                    {{-- Set 'inhouse' as default maybe? --}}
                    <option value="abproduct" @selected(old('type') == 'abproduct')>Product from Amazon Business</option>
                    <option value="inhouse" @selected(old('type', 'inhouse') == 'inhouse')>In-house</option> {{-- Example default --}}
                </select>
                @error('type')
                    <p class="mt-1 text-xs text-red-600">{{ $message }}</p>
                @enderror
            </div>

            {{-- Product Description --}}
            <div>
                <label for="description" class="block text-sm font-medium text-gray-700 mb-1">
                    Product Description
                </label>
                <textarea name="description" id="description" rows="5"
                    class="block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm placeholder-gray-400
                                 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm
                                 @error('description') border-red-500 ring-1 ring-red-500 @enderror">{{ old('description') }}</textarea>
                @error('description')
                    <p class="mt-1 text-xs text-red-600">{{ $message }}</p>
                @enderror
            </div>

            {{-- Price Field Example --}}
            <div>
                <label for="price" class="block text-sm font-medium text-gray-700 mb-1">
                    Price ($) {{-- Add asterisk if required --}}
                </label>
                <input type="number" step="0.01" min="0" name="price" id="price"
                    value="{{ old('price') }}"
                    class="block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm @error('price') border-red-500 ring-1 ring-red-500 @enderror">
                @error('price')
                    <p class="mt-1 text-xs text-red-600">{{ $message }}</p>
                @enderror
            </div>


            {{-- Submit Button --}}
            <div class="flex justify-end pt-2">
                <button type="submit"
                    class="inline-flex justify-center py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 transition duration-150 ease-in-out">
                    Add Product
                </button>
            </div>
        </form>
    </div> {{-- End Form Container --}}

@endsection