@extends('layouts.vendor')

@section('title', 'Shop Profile')
@section('page-title', 'Shop Profile')

@section('content')
<div class="max-w-2xl bg-white rounded-xl shadow-sm p-6">
    <form action="{{ route('vendor.profile.update') }}" method="POST" enctype="multipart/form-data">
        @csrf @method('PUT')

        <h3 class="font-semibold text-gray-700 mb-4 border-b pb-2">Shop Information</h3>
        <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6">
            <div class="md:col-span-2">
                <label class="block text-sm font-medium text-gray-700 mb-1">Shop Name *</label>
                <input type="text" name="shop_name" value="{{ old('shop_name', $vendor->shop_name) }}" required class="w-full border border-gray-300 rounded-lg px-3 py-2">
            </div>
            <div class="md:col-span-2">
                <label class="block text-sm font-medium text-gray-700 mb-1">Description</label>
                <textarea name="description" rows="3" class="w-full border border-gray-300 rounded-lg px-3 py-2">{{ old('description', $vendor->description) }}</textarea>
            </div>
            <div>
                <label class="block text-sm font-medium text-gray-700 mb-1">Phone</label>
                <input type="text" name="phone" value="{{ old('phone', $vendor->phone) }}" class="w-full border border-gray-300 rounded-lg px-3 py-2">
            </div>
            <div>
                <label class="block text-sm font-medium text-gray-700 mb-1">Website</label>
                <input type="url" name="website" value="{{ old('website', $vendor->website) }}" class="w-full border border-gray-300 rounded-lg px-3 py-2">
            </div>
            <div>
                <label class="block text-sm font-medium text-gray-700 mb-1">City</label>
                <input type="text" name="city" value="{{ old('city', $vendor->city) }}" class="w-full border border-gray-300 rounded-lg px-3 py-2">
            </div>
            <div>
                <label class="block text-sm font-medium text-gray-700 mb-1">Country</label>
                <input type="text" name="country" value="{{ old('country', $vendor->country) }}" class="w-full border border-gray-300 rounded-lg px-3 py-2">
            </div>
            <div>
                <label class="block text-sm font-medium text-gray-700 mb-1">Shop Logo</label>
                @if($vendor->logo)
                <img src="{{ $vendor->logo_url }}" class="w-16 h-16 object-cover rounded mb-2">
                @endif
                <input type="file" name="logo" accept="image/*" class="w-full border border-gray-300 rounded-lg px-3 py-2">
            </div>
            <div>
                <label class="block text-sm font-medium text-gray-700 mb-1">Banner Image</label>
                <input type="file" name="banner" accept="image/*" class="w-full border border-gray-300 rounded-lg px-3 py-2">
            </div>
        </div>

        <div class="flex gap-4">
            <button type="submit" class="bg-blue-600 text-white px-6 py-2 rounded-lg hover:bg-blue-700">Save Changes</button>
        </div>
    </form>
</div>
@endsection