<?php if (isset($component)) { $__componentOriginal9ac128a9029c0e4701924bd2d73d7f54 = $component; } ?>
<?php if (isset($attributes)) { $__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54 = $attributes; } ?>
<?php $component = App\View\Components\AppLayout::resolve([] + (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag ? $attributes->all() : [])); ?>
<?php $component->withName('app-layout'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php if (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag): ?>
<?php $attributes = $attributes->except(\App\View\Components\AppLayout::ignoredParameterNames()); ?>
<?php endif; ?>
<?php $component->withAttributes([]); ?>
     <?php $__env->slot('header', null, []); ?> 
        <div class="flex items-center justify-between w-full">
            <div>
                <h1 class="text-lg font-semibold text-gray-800">Edit Business</h1>
                <p class="text-xs text-gray-400 mt-0.5"><?php echo e($business->name); ?></p>
            </div>
            <a href="<?php echo e(route('businesses.show', $business)); ?>" class="inline-flex items-center gap-1.5 text-sm text-gray-500 hover:text-indigo-600 transition">
                <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"/></svg>
                Back to Business
            </a>
        </div>
     <?php $__env->endSlot(); ?>

    <div class="max-w-3xl mx-auto py-6" x-data="businessForm()">
        <div class="lg:hidden mb-4">
            <h1 class="text-xl font-bold text-gray-900">Edit Business</h1>
            <p class="text-sm text-gray-500"><?php echo e($business->name); ?></p>
        </div>

        <form @submit.prevent="submit" class="bg-white rounded-2xl border border-gray-100 shadow-sm overflow-hidden space-y-6">
            
            <div class="p-6 space-y-5 border-b border-gray-100">
                <h2 class="text-sm font-semibold text-gray-800 uppercase tracking-wider">General Information</h2>

                <div class="grid grid-cols-1 sm:grid-cols-2 gap-5">
                    <div class="sm:col-span-2">
                        <label class="block text-sm font-medium text-gray-700 mb-1.5">Name <span class="text-red-500">*</span></label>
                        <input type="text" x-model="form.name" placeholder="Enter Business Name"
                               class="w-full rounded-lg border-gray-200 text-sm focus:border-indigo-400 focus:ring-indigo-400"
                               :class="errors.name && 'border-red-300'">
                        <p class="text-xs text-red-500 mt-1" x-show="errors.name" x-text="errors.name?.[0]"></p>
                    </div>

                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1.5">Business / Trade Name</label>
                        <input type="text" x-model="form.business_name" placeholder="Legal / trade name"
                               class="w-full rounded-lg border-gray-200 text-sm focus:border-indigo-400 focus:ring-indigo-400"
                               :class="errors.business_name && 'border-red-300'">
                        <p class="text-xs text-red-500 mt-1" x-show="errors.business_name" x-text="errors.business_name?.[0]"></p>
                    </div>

                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1.5">NTN / CNIC</label>
                        <input type="text" x-model="form.ntn_cnic" placeholder="1234567-8"
                               class="w-full rounded-lg border-gray-200 text-sm focus:border-indigo-400 focus:ring-indigo-400"
                               :class="errors.ntn_cnic && 'border-red-300'">
                        <p class="text-xs text-red-500 mt-1" x-show="errors.ntn_cnic" x-text="errors.ntn_cnic?.[0]"></p>
                    </div>

                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1.5">Email Address</label>
                        <input type="email" x-model="form.email" placeholder="info@business.com"
                               class="w-full rounded-lg border-gray-200 text-sm focus:border-indigo-400 focus:ring-indigo-400"
                               :class="errors.email && 'border-red-300'">
                        <p class="text-xs text-red-500 mt-1" x-show="errors.email" x-text="errors.email?.[0]"></p>
                    </div>

                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1.5">Phone Number</label>
                        <input type="text" x-model="form.phone" placeholder="+92 300 1234567"
                               class="w-full rounded-lg border-gray-200 text-sm focus:border-indigo-400 focus:ring-indigo-400"
                               :class="errors.phone && 'border-red-300'">
                        <p class="text-xs text-red-500 mt-1" x-show="errors.phone" x-text="errors.phone?.[0]"></p>
                    </div>

                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1.5">Province</label>
                        <select x-model="form.province" class="w-full rounded-lg border-gray-200 text-sm focus:border-indigo-400 focus:ring-indigo-400">
                            <option value="">Select province</option>
                            <option>Punjab</option>
                            <option>Sindh</option>
                            <option>Khyber Pakhtunkhwa</option>
                            <option>Balochistan</option>
                            <option>Islamabad Capital Territory</option>
                            <option>Gilgit-Baltistan</option>
                            <option>Azad Jammu & Kashmir</option>
                        </select>
                    </div>

                    <div class="sm:col-span-2">
                        <label class="block text-sm font-medium text-gray-700 mb-1.5">Address</label>
                        <textarea x-model="form.address" rows="2" placeholder="Street, city, postal code"
                                  class="w-full rounded-lg border-gray-200 text-sm focus:border-indigo-400 focus:ring-indigo-400"></textarea>
                        <p class="text-xs text-red-500 mt-1" x-show="errors.address" x-text="errors.address?.[0]"></p>
                    </div>
                </div>
            </div>

            
            <div class="p-6 space-y-5 border-b border-gray-100">
                <h2 class="text-sm font-semibold text-gray-800 uppercase tracking-wider">Branding & Theme Settings</h2>

                <div class="grid grid-cols-1 sm:grid-cols-2 gap-5">
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1.5">PDF Design Template</label>
                        <select x-model="form.invoice_layout_template" class="w-full rounded-lg border-gray-200 text-sm focus:border-indigo-400 focus:ring-indigo-400">
                            <option value="classic">Classic (Slanted Header)</option>
                            <option value="elegant">Elegant (Clean/Modern)</option>
                            <option value="slim">FBR Standard Tax Invoice</option>
                        </select>
                    </div>

                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1.5">Business Logo</label>
                        <div class="flex items-center gap-4">
                            <?php if($logoUrl): ?>
                                <img src="<?php echo e($logoUrl); ?>" class="w-12 h-12 object-contain border border-gray-100 rounded-lg" alt="Current Logo">
                            <?php endif; ?>
                            <input type="file" id="invoice_logo" class="text-xs text-gray-500 file:mr-4 file:py-2 file:px-4 file:rounded-lg file:border-0 file:text-xs file:font-semibold file:bg-indigo-50 file:text-indigo-700 hover:file:bg-indigo-100 cursor-pointer">
                        </div>
                        <p class="text-[10px] text-gray-400 mt-1.5">Supported formats: PNG, JPG, JPEG (Max 2MB)</p>
                        <p class="text-xs text-red-500 mt-1" x-show="errors.invoice_logo" x-text="errors.invoice_logo?.[0]"></p>
                    </div>
                </div>
            </div>

            
            <div class="p-6 space-y-5 border-b border-gray-100">
                <div class="flex items-center justify-between">
                    <h2 class="text-sm font-semibold text-gray-800 uppercase tracking-wider">FBR Credentials</h2>
                    <label class="inline-flex items-center gap-3 cursor-pointer select-none">
                        <span class="text-xs font-semibold" :class="form.is_sandbox ? 'text-amber-600' : 'text-gray-400'">Sandbox</span>
                        <button type="button" @click="form.is_sandbox = !form.is_sandbox"
                                class="relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none"
                                :class="form.is_sandbox ? 'bg-amber-500' : 'bg-green-500'">
                            <span class="pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out"
                                  :class="!form.is_sandbox ? 'translate-x-5' : 'translate-x-0'"></span>
                        </button>
                        <span class="text-xs font-semibold" :class="!form.is_sandbox ? 'text-green-600' : 'text-gray-400'">Production</span>
                    </label>
                </div>

                <p class="text-xs text-gray-400 -mt-2">Leave a token field blank to keep the currently saved value.</p>

                <div class="grid grid-cols-1 gap-5">
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1.5">Sandbox Token</label>
                        <input type="password" x-model="form.sandbox_token" placeholder="Leave blank to keep existing"
                               class="w-full rounded-lg border-gray-200 text-sm font-mono focus:border-indigo-400 focus:ring-indigo-400">
                        <p class="text-xs text-red-500 mt-1" x-show="errors.sandbox_token" x-text="errors.sandbox_token?.[0]"></p>
                    </div>

                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1.5">Production Token</label>
                        <input type="password" x-model="form.production_token" placeholder="Leave blank to keep existing"
                               class="w-full rounded-lg border-gray-200 text-sm font-mono focus:border-indigo-400 focus:ring-indigo-400">
                        <p class="text-xs text-red-500 mt-1" x-show="errors.production_token" x-text="errors.production_token?.[0]"></p>
                    </div>
                </div>
            </div>

            
            <div class="p-6 space-y-4 border-b border-gray-100">
                <h2 class="text-sm font-semibold text-gray-800 uppercase tracking-wider">Options</h2>

                <label class="flex items-center justify-between py-1 cursor-pointer">
                    <div>
                        <p class="text-sm font-medium text-gray-700">Auto Sync</p>
                        <p class="text-xs text-gray-400 mt-0.5">Automatically push invoices to FBR</p>
                    </div>
                    <button type="button" @click="form.auto_sync_enabled = !form.auto_sync_enabled"
                            class="relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none"
                            :class="form.auto_sync_enabled ? 'bg-indigo-600' : 'bg-gray-200'">
                        <span class="pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out"
                              :class="form.auto_sync_enabled ? 'translate-x-5' : 'translate-x-0'"></span>
                    </button>
                </label>

                <div x-show="form.auto_sync_enabled" x-transition class="pl-4 py-2 border-l-2 border-indigo-100 space-y-2">
                    <label class="block text-xs font-semibold text-gray-500 uppercase tracking-wider">Sync Interval</label>
                    <select x-model="form.auto_sync_interval" class="w-full max-w-xs rounded-xl border-gray-200 text-sm focus:border-indigo-400 focus:ring-indigo-400">
                        <option value="5">Every 5 minutes</option>
                        <option value="15">Every 15 minutes</option>
                        <option value="30">Every 30 minutes</option>
                        <option value="60">Every hour</option>
                        <option value="720">Twice daily (12 hours)</option>
                        <option value="1440">Daily (24 hours)</option>
                    </select>
                </div>

                <label class="flex items-center justify-between py-1 cursor-pointer">
                    <div>
                        <p class="text-sm font-medium text-gray-700">Active</p>
                        <p class="text-xs text-gray-400 mt-0.5">Inactive businesses are hidden from invoicing</p>
                    </div>
                    <button type="button" @click="form.is_active = !form.is_active"
                            class="relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none"
                            :class="form.is_active ? 'bg-indigo-600' : 'bg-gray-200'">
                        <span class="pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out"
                              :class="form.is_active ? 'translate-x-5' : 'translate-x-0'"></span>
                    </button>
                </label>
            </div>

            
            <div class="p-6 flex items-center justify-between">
                <p class="text-xs text-red-500" x-show="generalError" x-text="generalError"></p>
                <div class="flex items-center gap-3 ml-auto">
                    <a href="<?php echo e(route('businesses.show', $business)); ?>" class="px-4 py-2 text-sm font-medium text-gray-600 hover:text-gray-800 transition">Cancel</a>
                    <button type="submit" :disabled="saving"
                            class="inline-flex items-center gap-2 px-4 py-2.5 rounded-xl bg-indigo-600 text-white text-sm font-medium hover:bg-indigo-700 disabled:opacity-60 transition shadow-sm">
                        <svg x-show="saving" class="w-4 h-4 animate-spin" fill="none" viewBox="0 0 24 24">
                            <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
                            <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8v8z"></path>
                        </svg>
                        <span x-text="saving ? 'Saving...' : 'Save Changes'"></span>
                    </button>
                </div>
            </div>
        </form>
    </div>

    <script>
        function businessForm() {
            return {
                saving: false,
                errors: {},
                generalError: '',
                form: {
                    name: <?php echo json_encode($business->name, 15, 512) ?>,
                    business_name: <?php echo json_encode($business->business_name, 15, 512) ?>,
                    ntn_cnic: <?php echo json_encode($business->ntn_cnic, 15, 512) ?>,
                    province: <?php echo json_encode($business->province, 15, 512) ?>,
                    address: <?php echo json_encode($business->address, 15, 512) ?>,
                    email: <?php echo json_encode($business->email, 15, 512) ?>,
                    phone: <?php echo json_encode($business->phone, 15, 512) ?>,
                    is_sandbox: <?php echo json_encode((bool) $business->is_sandbox, 15, 512) ?>,
                    sandbox_token: '',
                    production_token: '',
                    auto_sync_enabled: <?php echo json_encode((bool) $business->auto_sync_enabled, 15, 512) ?>,
                    auto_sync_interval: <?php echo json_encode($business->auto_sync_interval ?: 15, 15, 512) ?>,
                    is_active: <?php echo json_encode((bool) $business->is_active, 15, 512) ?>,
                    invoice_layout_template: <?php echo json_encode($layoutTemplate ?? 'classic', 15, 512) ?>,
                },

                async submit() {
                    this.saving = true;
                    this.errors = {};
                    this.generalError = '';

                    const formData = new FormData();
                    formData.append('_method', 'PUT');

                    for (const key in this.form) {
                        if (this.form[key] !== null && this.form[key] !== undefined) {
                            // Don't append empty tokens
                            if ((key === 'sandbox_token' || key === 'production_token') && this.form[key] === '') {
                                continue;
                            }

                            if (typeof this.form[key] === 'boolean') {
                                formData.append(key, this.form[key] ? '1' : '0');
                            } else {
                                formData.append(key, this.form[key]);
                            }
                        }
                    }

                    const fileInput = document.getElementById('invoice_logo');
                    if (fileInput && fileInput.files[0]) {
                        formData.append('invoice_logo', fileInput.files[0]);
                    }

                    try {
                        const res = await fetch('<?php echo e(route('businesses.update', $business)); ?>', {
                            method: 'POST',
                            headers: {
                                'Accept': 'application/json',
                                'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').content,
                            },
                            body: formData,
                        });

                        if (res.status === 422) {
                            const data = await res.json();
                            this.errors = data.errors ?? {};
                            this.generalError = data.message ?? 'Please fix the errors below.';
                            window.showToast('error', this.generalError);
                            return;
                        }

                        if (!res.ok) {
                            this.generalError = 'Something went wrong. Please try again.';
                            window.showToast('error', this.generalError);
                            return;
                        }

                        window.showToast('success', 'Business details saved successfully.');
                        setTimeout(() => {
                            window.location.href = '<?php echo e(route('businesses.show', $business)); ?>';
                        }, 1000);
                    } catch (e) {
                        this.generalError = 'Could not reach the server.';
                        window.showToast('error', this.generalError);
                    } finally {
                        this.saving = false;
                    }
                },
            }
        }
    </script>
 <?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54)): ?>
<?php $attributes = $__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54; ?>
<?php unset($__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54); ?>
<?php endif; ?>
<?php if (isset($__componentOriginal9ac128a9029c0e4701924bd2d73d7f54)): ?>
<?php $component = $__componentOriginal9ac128a9029c0e4701924bd2d73d7f54; ?>
<?php unset($__componentOriginal9ac128a9029c0e4701924bd2d73d7f54); ?>
<?php endif; ?><?php /**PATH /www/wwwroot/lifeelements.shiningerp.com/resources/views/businesses/edit.blade.php ENDPATH**/ ?>