@extends('layouts.app') {{-- আপনার লেআউট অনুযায়ী পরিবর্তন করুন --}}

@section('content')
<div class="max-w-7xl mx-auto bg-white p-6 rounded-xl shadow-md space-y-6">
    <h2 class="text-xl font-semibold text-gray-800 mb-4">কোম্পানি তথ্য</h2>

    {{-- Success message --}}
    @if(session('success'))
        <div class="p-3 rounded-md bg-green-50 text-green-700 border border-green-200">
            {{ session('success') }}
        </div>
    @endif

    {{-- Validation errors --}}
    @if ($errors->any())
        <div class="p-3 rounded-md bg-red-50 text-red-700 border border-red-200">
            <ul class="list-disc ml-5">
                @foreach ($errors->all() as $err)
                    <li>{{ $err }}</li>
                @endforeach
            </ul>
        </div>
    @endif

    {{-- ⚠️ Form tag + action + method + csrf + enctype অবশ্যই থাকতে হবে --}}
    <form action="{{ route('company.update') }}" method="POST" enctype="multipart/form-data" class="space-y-6">
        @csrf

        {{-- Company Name --}}
        <div>
            <label class="block text-sm font-medium text-gray-700">কোম্পানি নাম</label>
            <input type="text" name="name" value="{{ old('name', $company->name ?? '') }}"
                class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring focus:ring-blue-200 sm:text-sm" required>
        </div>

        {{-- Address --}}
        <div>
            <label class="block text-sm font-medium text-gray-700">ঠিকানা</label>
            <textarea name="address" rows="2"
                class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring focus:ring-blue-200 sm:text-sm"
                required>{{ old('address', $company->address ?? '') }}</textarea>
        </div>

        <div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
            {{-- Phone --}}
            <div>
                <label class="block text-sm font-medium text-gray-700">ফোন</label>
                <input type="text" name="phone" value="{{ old('phone', $company->phone ?? '') }}"
                    class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring focus:ring-blue-200 sm:text-sm">
            </div>

            {{-- Email --}}
            <div>
                <label class="block text-sm font-medium text-gray-700">ইমেইল</label>
                <input type="email" name="email" value="{{ old('email', $company->email ?? '') }}"
                    class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring focus:ring-blue-200 sm:text-sm">
            </div>
        </div>

        {{-- Website --}}
        <div>
            <label class="block text-sm font-medium text-gray-700">ওয়েবসাইট</label>
            <input type="text" name="website" value="{{ old('website', $company->website ?? '') }}"
                class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring focus:ring-blue-200 sm:text-sm">
        </div>

        {{-- Logo Upload --}}
        <div>
            <label class="block text-sm font-medium text-gray-700">কোম্পানি লোগো</label>
            <input type="file" name="logo" accept="image/*"
                class="mt-1 block w-full text-sm text-gray-600 file:mr-4 file:py-2 file:px-4
                      file:rounded-md file:border-0 file:text-sm file:font-semibold
                      file:bg-blue-50 file:text-blue-700 hover:file:bg-blue-100"
                onchange="previewLogo(event)">

            <div class="mt-3">
                @php
                    $logoPath = old('logo') ? old('logo') : ($company->logo ?? null);
                @endphp
                @if(!empty($logoPath))
                    <img id="logoPreview" src="{{ asset('storage/'.ltrim($logoPath,'/')) }}" class="h-16 rounded-md border" alt="Company Logo">
                @else
                    <img id="logoPreview" class="h-16 rounded-md border hidden" alt="Company Logo Preview">
                @endif
            </div>
        </div>

        {{-- Submit --}}
        <div class="pt-4 flex justify-end">
            <button type="submit"
                class="px-5 py-2 bg-blue-600 text-white rounded-md shadow hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500">
                Save
            </button>
        </div>
    </form>
</div>

{{-- Simple live preview for logo --}}
<script>
function previewLogo(e){
    const file = e.target.files && e.target.files[0];
    const img = document.getElementById('logoPreview');
    if(!file){ return; }
    img.src = URL.createObjectURL(file);
    img.classList.remove('hidden');
}
</script>
@endsection