@extends('layouts.app')

@section('title', 'Add New Product')
@section('page_title', 'Create New Product')

@section('content')
<div class="container-fluid p-0" style="max-width: 900px;">
    <div class="card border-0 shadow-sm">
        <div class="card-header bg-white py-3">
            <h5 class="mb-0 fw-bold"><i class="bi bi-box-seam text-primary me-2"></i> Product Information & GST Rates</h5>
        </div>
        <div class="card-body p-4">
            <form action="{{ route('products.store') }}" method="POST">
                @csrf

                <div class="row g-3">
                    <div class="col-md-8">
                        <label class="form-label fw-semibold">Product / Item Name <span class="text-danger">*</span></label>
                        <input type="text" name="name" class="form-control @error('name') is-invalid @enderror" value="{{ old('name') }}" placeholder="e.g. Dell Latitude Laptop 3540" required>
                    </div>

                    <div class="col-md-4">
                        <label class="form-label fw-semibold">SKU / Item Code <span class="text-danger">*</span></label>
                        <input type="text" name="sku" class="form-control @error('sku') is-invalid @enderror" value="{{ old('sku') }}" placeholder="e.g. LAP-DELL-3540" required>
                    </div>

                    <div class="col-md-6">
                        <label class="form-label fw-semibold">Category</label>
                        <select name="category_id" class="form-select">
                            <option value="">Select Category (Optional)</option>
                            @foreach($categories as $cat)
                                <option value="{{ $cat->id }}" {{ old('category_id') == $cat->id ? 'selected' : '' }}>
                                    {{ $cat->name }}
                                </option>
                            @endforeach
                        </select>
                    </div>

                    <div class="col-md-6">
                        <label class="form-label fw-semibold">Unit of Measurement (UOM)</label>
                        <select name="unit_id" class="form-select">
                            <option value="">Select Unit</option>
                            @foreach($units as $u)
                                <option value="{{ $u->id }}" {{ old('unit_id') == $u->id ? 'selected' : '' }}>
                                    {{ $u->name }} ({{ $u->short_code }})
                                </option>
                            @endforeach
                        </select>
                    </div>

                    <div class="col-md-6">
                        <label class="form-label fw-semibold">HSN / SAC Code <span class="text-danger">*</span></label>
                        <input type="text" name="hsn_code" class="form-control @error('hsn_code') is-invalid @enderror" value="{{ old('hsn_code') }}" placeholder="e.g. 84713010" required>
                        <small class="text-muted">Mandatory for GST invoice compliance (4 to 8 digits).</small>
                    </div>

                    <div class="col-md-6">
                        <label class="form-label fw-semibold">GST Tax Rate (%) <span class="text-danger">*</span></label>
                        <select name="gst_rate" class="form-select" required>
                            @foreach($gstRates as $rate)
                                <option value="{{ $rate }}" {{ old('gst_rate', 18) == $rate ? 'selected' : '' }}>
                                    {{ $rate }}% GST {{ $rate == 18 ? '(Standard Tech & Services)' : '' }}
                                </option>
                            @endforeach
                        </select>
                    </div>

                    <div class="col-md-6">
                        <label class="form-label fw-semibold">Purchase Cost Price (₹) <span class="text-danger">*</span></label>
                        <div class="input-group">
                            <span class="input-group-text">₹</span>
                            <input type="number" step="0.01" name="purchase_price" class="form-control @error('purchase_price') is-invalid @enderror" value="{{ old('purchase_price', 0) }}" required>
                        </div>
                    </div>

                    <div class="col-md-6">
                        <label class="form-label fw-semibold">Selling Price (Base Price) (₹) <span class="text-danger">*</span></label>
                        <div class="input-group">
                            <span class="input-group-text">₹</span>
                            <input type="number" step="0.01" name="selling_price" class="form-control @error('selling_price') is-invalid @enderror" value="{{ old('selling_price', 0) }}" required>
                        </div>
                    </div>

                    <div class="col-md-6">
                        <label class="form-label fw-semibold">Initial Opening Stock</label>
                        <input type="number" step="0.01" name="initial_stock" class="form-control" value="{{ old('initial_stock', 0) }}">
                        <small class="text-muted">Automatically logged in the stock movement ledger.</small>
                    </div>

                    <div class="col-md-6">
                        <label class="form-label fw-semibold">Reorder Alert Level <span class="text-danger">*</span></label>
                        <input type="number" step="0.01" name="reorder_level" class="form-control @error('reorder_level') is-invalid @enderror" value="{{ old('reorder_level', 5) }}" required>
                        <small class="text-muted">Triggers low stock alert when inventory reaches this level.</small>
                    </div>

                    <div class="col-12">
                        <label class="form-label fw-semibold">Description / Notes</label>
                        <textarea name="description" rows="3" class="form-control" placeholder="Specifications, warranty, details...">{{ old('description') }}</textarea>
                    </div>
                </div>

                <hr class="my-4">

                <div class="d-flex justify-content-between">
                    <a href="{{ route('products.index') }}" class="btn btn-outline-secondary">Cancel</a>
                    <button type="submit" class="btn btn-primary px-4 fw-semibold">
                        <i class="bi bi-check2-circle me-1"></i> Save Product
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>
@endsection