@extends('layouts.app')

@section('content')

<div class="">
    <main>
        <div class="w-full px-4 pb-60">
            <div
                class="grid items-start max-w-2xl grid-cols-1 grid-rows-1 gap-4 mx-auto lg:mx-0 lg:max-w-none lg:grid-cols-2">
                <!-- SOL KOLON -->
                <div class="grid gap-4 lg:col-span-1">
                    <!-- CHATBOT -->
                    <div x-data="{
                            aiBusy: false,
                            aiDone: false,
                            aiError: '',
                            aiResult: null,
                            aiExtract: null,
                            aiDuplicate: null,
                            selectedCompanyId: '',
                            companyName: '',
                            confirmBusy: false,
                            activeStep: 0,
                            csrfToken: '{{ csrf_token() }}',
                            aiExtractRoute: '{{ route('invoices.ai-extract') }}',
                            aiConfirmRoute: '{{ route('invoices.ai-create-draft') }}',

                            // CARİ HESAP (kartvizit/kaşe) akışı durumu
                            cariExtract: null,
                            cariDone: false,
                            cariError: '',
                            cariResult: null,
                            cariType: 'client',
                            confirmCariBusy: false,
                            cariExtractRoute: '{{ route('companies.ai-extract') }}',
                            cariStoreRoute: '{{ route('companies.ai-store') }}',

                            // BAKİYESİ OLAN İŞLETMELER akışı durumu
                            balanceCompanies: [],
                            balanceRoute: '{{ route('companies.ai-balances') }}',

                            say(message, options) {
                                // Adım bildirimleri e-Filiz bileşeninde daktilo ile gösterilir ve kaydedilir
                                if (window.eFilizSay) window.eFilizSay(message, options || {});
                            },

                            preprocessAiImage(file) {
                                return new Promise((resolve, reject) => {
                                    const url = URL.createObjectURL(file);
                                    const img = new Image();
                                    img.onload = () => {
                                        // Fatura OCR'ı için 1600px yeterlidir; daha küçüğü
                                        // AI token maliyetini ve işlem süresini düşürür
                                        const MAX = 1600;
                                        let width = img.width;
                                        let height = img.height;
                                        if (width > MAX || height > MAX) {
                                            const ratio = Math.min(MAX / width, MAX / height);
                                            width = Math.round(width * ratio);
                                            height = Math.round(height * ratio);
                                        }
                                        const canvas = document.createElement('canvas');
                                        canvas.width = width;
                                        canvas.height = height;
                                        canvas.getContext('2d').drawImage(img, 0, 0, width, height);
                                        URL.revokeObjectURL(url);
                                        canvas.toBlob((b) => b ? resolve(b) : reject(new Error('blob')), 'image/jpeg', 0.80);
                                    };
                                    img.onerror = () => {
                                        URL.revokeObjectURL(url);
                                        reject(new Error('load'));
                                    };
                                    img.src = url;
                                });
                            },

                            startAiInvoice(event) {
                                const file = event.target.files[0];
                                event.target.value = '';
                                if (!file || this.aiBusy) return;

                                this.aiError = '';
                                this.aiDone = false;
                                this.aiResult = null;
                                this.aiExtract = null;
                                this.aiDuplicate = null;
                                this.selectedCompanyId = '';
                                this.companyName = '';
                                this.activeStep = 0;
                                this.balanceCompanies = [];
                                this.aiBusy = true;

                                // Yeni konuşma açılır ve dosya yüklemesi kullanıcı aksiyonu olarak kaydedilir
                                if (window.eFilizStart) window.eFilizStart({ file_name: file.name });
                                if (window.eFilizUser) window.eFilizUser('Dosya yüklendi: ' + file.name, { file_name: file.name });
                                this.say('Dosyanı aldım, hemen incelemeye başlıyorum…');
                                this.processAiInvoice(file);
                            },

                            async processAiInvoice(file) {
                                try {
                                    // PDF olduğu gibi yüklenir; görseller mobil formatlar (HEIC vb.)
                                    // için JPEG'e çevrilip makul boyuta indirilir
                                    const isPdf = file.type === 'application/pdf' || /\.pdf$/i.test(file.name || '');
                                    const blob = isPdf ? file : await this.preprocessAiImage(file).catch(() => file);
                                    const formData = new FormData();
                                    formData.append('invoice_image', blob, isPdf ? (file.name || 'invoice.pdf') : 'invoice.jpg');

                                    // Görsel hazırlandı, fatura içeriği okunuyor
                                    this.activeStep = 1;
                                    this.say('Şimdi faturanın içeriğini okuyorum, bu biraz sürebilir…');

                                    const response = await fetch(this.aiExtractRoute, {
                                        method: 'POST',
                                        headers: { 'X-CSRF-TOKEN': this.csrfToken, 'Accept': 'application/json' },
                                        body: formData,
                                    });

                                    let data = {};
                                    try { data = await response.json(); } catch (e) { data = {}; }

                                    if (!response.ok) {
                                        let msg = data.message || '';
                                        if (!msg && data.errors) {
                                            const first = Object.values(data.errors)[0];
                                            msg = Array.isArray(first) ? (first[0] || '') : (first || '');
                                        }
                                        this.aiError = msg || ('Görsel işlenemedi (HTTP ' + response.status + ').');
                                        this.say('Üzgünüm, dosyanı okurken bir sorun yaşadım: ' + this.aiError + ' Başka bir dosya ile tekrar deneyebilirsin.', { conversation_status: 'error' });
                                        return;
                                    }

                                    // İçerik alındı: işletme seçimi bekleniyor
                                    this.aiExtract = data;
                                    this.aiDuplicate = data.duplicate_invoice || null;
                                    this.companyName = data.supplier_name || '';
                                    this.selectedCompanyId = (data.similar_companies && data.similar_companies.length > 0) ? data.similar_companies[0].id : '';
                                    this.activeStep = 2;
                                    this.say('Fatura içeriğini başarıyla okudum. Şimdi işletmeyi onaylaman için seçenekleri hazırlıyorum…');
                                } catch (error) {
                                    this.aiError = 'Görsel işlenirken bir hata oluştu.';
                                    this.say('Üzgünüm, dosyanı işlerken beklenmedik bir hata oluştu. Başka bir dosya ile tekrar denemek ister misin?', { conversation_status: 'error' });
                                } finally {
                                    this.aiBusy = false;
                                }
                            },

                            async confirmAiInvoice() {
                                if (this.confirmBusy || !this.aiExtract) return;

                                const name = (this.companyName || '').trim();
                                if (!this.selectedCompanyId && name === '') {
                                    this.aiError = 'Lütfen bir işletme seçin veya işletme adı girin.';
                                    return;
                                }

                                this.aiError = '';
                                this.confirmBusy = true;
                                this.aiBusy = true;
                                this.activeStep = 3;

                                const chosenCompany = (this.aiExtract.similar_companies || []).find(c => c.id == this.selectedCompanyId);
                                if (chosenCompany) {
                                    if (window.eFilizUser) window.eFilizUser('İşletme onaylandı: ' + chosenCompany.name, { company_id: chosenCompany.id });
                                } else {
                                    if (window.eFilizUser) window.eFilizUser('Yeni işletme oluşturulacak: ' + name, { new_company_name: name });
                                }

                                this.say('Harika! Şimdi taslak faturanı oluşturuyorum…');

                                try {
                                    const response = await fetch(this.aiConfirmRoute, {
                                        method: 'POST',
                                        headers: {
                                            'X-CSRF-TOKEN': this.csrfToken,
                                            'Accept': 'application/json',
                                            'Content-Type': 'application/json',
                                        },
                                        body: JSON.stringify({
                                            token: this.aiExtract.token,
                                            company_id: this.selectedCompanyId || '',
                                            company_name: this.selectedCompanyId ? '' : name,
                                        }),
                                    });

                                    let data = {};
                                    try { data = await response.json(); } catch (e) { data = {}; }

                                    if (!response.ok) {
                                        if (data.duplicate_invoice) {
                                            this.aiDuplicate = data.duplicate_invoice;
                                        }
                                        let msg = data.message || '';
                                        if (!msg && data.errors) {
                                            const first = Object.values(data.errors)[0];
                                            msg = Array.isArray(first) ? (first[0] || '') : (first || '');
                                        }
                                        this.aiError = msg || ('Taslak fatura oluşturulamadı (HTTP ' + response.status + ').');
                                        this.say('Üzgünüm, faturanı oluştururken bir pürüz çıktı: ' + this.aiError);
                                        this.activeStep = 2;
                                        return;
                                    }

                                    this.aiResult = data;
                                    this.aiDone = true;
                                    this.say('Taslak faturanı hazırladım! Dilersen şimdi açıp kontrol edebilirsin.', {
                                        conversation_status: 'completed',
                                        metadata: {
                                            invoice_number: data.number || null,
                                            company_name: data.company_name || null,
                                            edit_url: data.edit_url || null,
                                        },
                                    });
                                } catch (error) {
                                    this.aiError = 'Taslak fatura oluşturulamadı. Lütfen tekrar deneyin.';
                                    this.say('Üzgünüm, faturanı oluştururken beklenmedik bir hata oluştu. Tekrar denemek ister misin?');
                                    this.activeStep = 2;
                                } finally {
                                    this.confirmBusy = false;
                                    this.aiBusy = false;
                                }
                            },

                            resetAi(message) {
                                if (this.aiBusy) return;

                                if (message) {
                                    // Vazgeçme: kullanıcı aksiyonu kaydedilir ve konuşma kapatılır
                                    if (window.eFilizUser) window.eFilizUser('Vazgeçildi');
                                    this.say(message, { conversation_status: 'cancelled' });
                                }

                                this.aiDone = false;
                                this.aiError = '';
                                this.aiResult = null;
                                this.aiExtract = null;
                                this.aiDuplicate = null;
                                this.selectedCompanyId = '';
                                this.companyName = '';
                                this.confirmBusy = false;
                                this.activeStep = 0;
                            },

                            startAiCompany(event) {
                                const file = event.target.files[0];
                                event.target.value = '';
                                if (!file || this.aiBusy) return;

                                this.cariError = '';
                                this.cariDone = false;
                                this.cariResult = null;
                                this.cariExtract = null;
                                this.cariType = 'client';
                                this.confirmCariBusy = false;
                                this.balanceCompanies = [];
                                this.aiBusy = true;

                                // Cari hesap akışı kendi konuşma tipinde açılır
                                if (window.eFilizStart) window.eFilizStart({ file_name: file.name }, 'company_creation');
                                if (window.eFilizUser) window.eFilizUser('Kartvizit yüklendi: ' + file.name, { file_name: file.name });
                                this.say('Kartviziti aldım, işletme bilgilerini çıkarıyorum…');
                                this.processAiCompany(file);
                            },

                            async processAiCompany(file) {
                                try {
                                    // Mobil formatlar (HEIC vb.) JPEG'e çevrilir ve makul boyuta indirilir
                                    const blob = await this.preprocessAiImage(file).catch(() => file);
                                    const formData = new FormData();
                                    formData.append('card_image', blob, 'company-card.jpg');

                                    this.say('Görseli inceliyorum, bu birkaç saniye sürebilir…');

                                    const response = await fetch(this.cariExtractRoute, {
                                        method: 'POST',
                                        headers: { 'X-CSRF-TOKEN': this.csrfToken, 'Accept': 'application/json' },
                                        body: formData,
                                    });

                                    let data = {};
                                    try { data = await response.json(); } catch (e) { data = {}; }

                                    if (!response.ok) {
                                        let msg = data.message || '';
                                        if (!msg && data.errors) {
                                            const first = Object.values(data.errors)[0];
                                            msg = Array.isArray(first) ? (first[0] || '') : (first || '');
                                        }
                                        this.cariError = msg || ('Görsel işlenemedi (HTTP ' + response.status + ').');
                                        this.say('Üzgünüm, görseli okurken bir sorun yaşadım: ' + this.cariError + ' Başka bir görsel ile tekrar deneyebilirsin.', { conversation_status: 'error' });
                                        return;
                                    }

                                    this.cariExtract = data;
                                    this.say('İşletme bilgilerini buldum! Kontrol edip onaylayabilirsin.');
                                } catch (error) {
                                    this.cariError = 'Görsel işlenirken bir hata oluştu.';
                                    this.say('Üzgünüm, görseli işlerken beklenmedik bir hata oluştu. Başka bir görsel ile tekrar denemek ister misin?', { conversation_status: 'error' });
                                } finally {
                                    this.aiBusy = false;
                                }
                            },

                            async confirmAiCompany() {
                                if (this.confirmCariBusy || !this.cariExtract) return;

                                const company = this.cariExtract.company || {};
                                const name = (company.name || '').trim();
                                if (name === '') {
                                    this.cariError = 'Lütfen işletme adını doldurun.';
                                    return;
                                }

                                this.cariError = '';
                                this.confirmCariBusy = true;
                                this.aiBusy = true;

                                if (window.eFilizUser) window.eFilizUser('Cari hesap onaylandı: ' + name, { company_name: name, type: this.cariType });
                                this.say('Harika! Şimdi cari hesabı oluşturuyorum…');

                                try {
                                    const response = await fetch(this.cariStoreRoute, {
                                        method: 'POST',
                                        headers: {
                                            'X-CSRF-TOKEN': this.csrfToken,
                                            'Accept': 'application/json',
                                            'Content-Type': 'application/json',
                                        },
                                        body: JSON.stringify({
                                            token: this.cariExtract.token,
                                            name: name,
                                            type: this.cariType,
                                            phone: company.phone || '',
                                            email: company.email || '',
                                            website: company.website || '',
                                            tax_office: company.tax_office || '',
                                            vat_number: company.vat_number || '',
                                            address_line: company.address_line || '',
                                            district: company.district || '',
                                            city: company.city || '',
                                            country: company.country || '',
                                            zip: company.zip || '',
                                        }),
                                    });

                                    let data = {};
                                    try { data = await response.json(); } catch (e) { data = {}; }

                                    if (!response.ok) {
                                        let msg = data.message || '';
                                        if (!msg && data.errors) {
                                            const first = Object.values(data.errors)[0];
                                            msg = Array.isArray(first) ? (first[0] || '') : (first || '');
                                        }
                                        this.cariError = msg || ('Cari hesap oluşturulamadı (HTTP ' + response.status + ').');
                                        this.say('Üzgünüm, cari hesabı oluştururken bir pürüz çıktı: ' + this.cariError);
                                        return;
                                    }

                                    this.cariResult = data;
                                    this.cariDone = true;
                                    this.say((data.address_created ? 'Cari hesabı ve fatura adresini oluşturdum!' : 'Cari hesabı oluşturdum!') + ' Dilersen şimdi açıp kontrol edebilirsin.', {
                                        conversation_status: 'completed',
                                        metadata: {
                                            company_id: data.id || null,
                                            company_name: data.name || null,
                                            show_url: data.show_url || null,
                                        },
                                    });
                                } catch (error) {
                                    this.cariError = 'Cari hesap oluşturulamadı. Lütfen tekrar deneyin.';
                                    this.say('Üzgünüm, cari hesabı oluştururken beklenmedik bir hata oluştu. Tekrar denemek ister misin?');
                                } finally {
                                    this.confirmCariBusy = false;
                                    this.aiBusy = false;
                                }
                            },

                            resetCari(message) {
                                if (this.aiBusy) return;

                                if (message) {
                                    // Vazgeçme: kullanıcı aksiyonu kaydedilir ve konuşma kapatılır
                                    if (window.eFilizUser) window.eFilizUser('Vazgeçildi');
                                    this.say(message, { conversation_status: 'cancelled' });
                                }

                                this.cariDone = false;
                                this.cariError = '';
                                this.cariResult = null;
                                this.cariExtract = null;
                                this.cariType = 'client';
                                this.confirmCariBusy = false;
                            },

                            formatBalance(value) {
                                const number = Number(value) || 0;
                                return new Intl.NumberFormat('tr-TR', { maximumFractionDigits: 2 }).format(number) + ' TL';
                            },

                            async loadBalances() {
                                if (this.aiBusy) return;
                                this.aiBusy = true;
                                this.balanceCompanies = [];

                                // Balon tek akış gösterir; diğer akışların arayüzü temizlenir
                                this.aiDone = false;
                                this.aiError = '';
                                this.aiResult = null;
                                this.aiExtract = null;
                                this.aiDuplicate = null;
                                this.activeStep = 0;
                                this.cariDone = false;
                                this.cariError = '';
                                this.cariResult = null;
                                this.cariExtract = null;

                                if (window.eFilizStart) window.eFilizStart({}, 'balance_inquiry');
                                if (window.eFilizUser) window.eFilizUser('Bakiyesi olan işletmeler listelendi');
                                this.say('Hemen hesaplıyorum, bakiyesi olan işletmeleri çıkarıyorum…');

                                try {
                                    const response = await fetch(this.balanceRoute, {
                                        method: 'POST',
                                        headers: { 'X-CSRF-TOKEN': this.csrfToken, 'Accept': 'application/json' },
                                    });

                                    let data = {};
                                    try { data = await response.json(); } catch (e) { data = {}; }

                                    if (!response.ok) {
                                        this.say('Üzgünüm, bakiye listesini hazırlarken bir sorun yaşadım. Tekrar deneyebilirsin.', { conversation_status: 'error' });
                                        return;
                                    }

                                    this.balanceCompanies = data.companies || [];
                                    const total = data.total ?? this.balanceCompanies.length;
                                    if (this.balanceCompanies.length === 0) {
                                        this.say('Şu anda bakiyesi olan işletme görünmüyor. Fatura, tahsilat ya da ödeme kaydettikçe burada listelerim.', { conversation_status: 'completed' });
                                    } else {
                                        const intro = total > this.balanceCompanies.length
                                            ? 'Bakiyesi olan ' + total + ' işletme var. En yüksek bakiyeli ' + this.balanceCompanies.length + ' tanesini listeledim; birine tıklarsan sayfası açılır.'
                                            : 'Bakiyesi olan ' + total + ' işletmeyi listeledim; birine tıklarsan sayfası açılır.';
                                        this.say(intro, {
                                            conversation_status: 'completed',
                                            metadata: { balance_company_count: total },
                                        });
                                    }
                                } catch (error) {
                                    this.say('Üzgünüm, bakiye listesini hazırlarken beklenmedik bir hata oluştu. Tekrar denemek ister misin?', { conversation_status: 'error' });
                                } finally {
                                    this.aiBusy = false;
                                }
                            }
                        }">
                        <div class="grid px-4 py-5 bg-white border border-teal-600/50 gap-y-4 rounded-xl sm:p-6">

                            <!-- CHAT -->
                            <livewire:ai-chat :greeting="$greeting_message" :mode="$chat_mode"
                                :insight="$insight_message" :action="$insight_action" :details="$insight_details"
                                conversation-type="invoice_creation">
                                <div x-show="aiExtract && !aiDone && !cariExtract" class="mt-3" style="display: none;">
                                    {{-- Çıkarılan fatura özeti --}}
                                    <div class="p-3 mb-3 text-xs rounded-md bg-stone-100 text-stone-500">
                                        <p>
                                            Fatura No: <span class="font-medium"
                                                x-text="aiExtract.invoice_number || '—'"></span>
                                            · Tarih: <span class="font-medium"
                                                x-text="aiExtract.invoice_date || '—'"></span>
                                        </p>
                                        <p class="mt-0.5">
                                            <span class="font-medium" x-text="aiExtract.lines_count"></span>
                                            satır
                                            ·
                                            Toplam: <span class="font-medium" x-text="aiExtract.total_amount"></span>
                                            <span x-text="aiExtract.currency"></span>
                                        </p>
                                    </div>

                                    {{-- Mükerrer fatura uyarısı --}}
                                    <div x-show="aiDuplicate" class="p-3 mb-3 rounded-md bg-amber-50 text-amber-700"
                                        style="display: none;">
                                        <p class="text-xs font-semibold">Bu fatura zaten
                                            kayıtlı görünüyor.</p>
                                        <p class="mt-0.5 text-xs">Aynı fatura numarası,
                                            tarih ve içeriğe sahip bir fatura mevcut.
                                            Mükerrer giriş engellenmiştir.</p>
                                        <a x-show="aiDuplicate && aiDuplicate.edit_url"
                                            :href="aiDuplicate ? aiDuplicate.edit_url : '#'"
                                            class="inline-block px-3 py-1.5 mt-2 text-xs font-semibold text-white rounded-md bg-amber-600 hover:bg-amber-700">Mevcut
                                            Faturaya Git</a>
                                    </div>

                                    <p class="mb-2 text-xs font-semibold text-stone-500">
                                        İŞLETME SEÇİMİ</p>

                                    {{-- Benzer cariler --}}
                                    <div x-show="aiExtract.similar_companies.length > 0" class="space-y-2">
                                        <template x-for="company in aiExtract.similar_companies" :key="company.id">
                                            <label class="flex items-center gap-2 p-2 border rounded-md cursor-pointer"
                                                :class="selectedCompanyId == company.id ? 'border-stone-400 bg-stone-50' :
                                                        'border-stone-200 hover:bg-stone-50'">
                                                <input type="radio" name="ai_company" :value="company.id"
                                                    x-model="selectedCompanyId"
                                                    class="text-stone-600 focus:ring-stone-500">
                                                <span class="flex-1 text-sm text-stone-700"
                                                    x-text="company.name"></span>
                                                <span
                                                    class="px-1.5 py-0.5 text-[10px] rounded bg-emerald-100 text-emerald-700"
                                                    x-text="'%' + company.score"></span>
                                            </label>
                                        </template>
                                    </div>
                                    <p x-show="aiExtract.similar_companies.length === 0"
                                        class="mb-2 text-xs text-stone-500">
                                        Benzer işletme bulunamadı. Adı kontrol edip yeni
                                        işletme oluşturabilirsiniz.
                                    </p>

                                    {{-- Yeni işletme + düzenlenebilir ad --}}
                                    <label class="flex items-start gap-2 p-2 mt-2 border rounded-md cursor-pointer"
                                        :class="selectedCompanyId === '' ? 'border-stone-400 bg-stone-50' :
                                                'border-stone-200 hover:bg-stone-50'">
                                        <input type="radio" name="ai_company" value="" x-model="selectedCompanyId"
                                            class="mt-1 text-stone-600 focus:ring-stone-500">
                                        <span class="flex-1">
                                            <span class="block text-sm text-stone-700">YENİ İŞLETME OLUŞTUR</span>
                                            <input type="text" x-model="companyName" @input="selectedCompanyId = ''"
                                                placeholder="İşletme adı"
                                                class="block w-full px-2 py-1.5 mt-1 text-sm bg-white border-0 rounded-md ring-1 ring-inset ring-stone-300 focus:ring-2 focus:ring-stone-500">
                                        </span>
                                    </label>

                                    <div class="flex gap-2 mt-4">
                                        <button type="button"
                                            @click="resetAi('Tamam, vazgeçtik. İstediğin zaman tekrar beklerim.')"
                                            :disabled="confirmBusy"
                                            class="flex-1 px-4 py-2 text-sm font-medium rounded-md text-stone-700 bg-stone-100 hover:bg-stone-200 disabled:opacity-50">VAZGEÇ</button>
                                        <button type="button" @click="confirmAiInvoice()" :disabled="confirmBusy || aiDuplicate || (selectedCompanyId === '' &&
                                                    companyName.trim() === '')"
                                            class="flex-1 px-4 py-2 text-sm font-semibold text-center text-white rounded-md bg-stone-600 hover:bg-stone-700 disabled:opacity-50 disabled:pointer-events-none">ONAYLA</button>
                                    </div>
                                </div>

                                {{-- CARİ HESAP: çıkarılan işletme bilgileri (düzenlenebilir) --}}
                                <div x-show="cariExtract && !cariDone" class="mt-3" style="display: none;">
                                    <p class="mb-2 text-xs font-semibold text-stone-500">İŞLETME BİLGİLERİ</p>
                                    <div class="grid gap-2">
                                        <div>
                                            <label class="block text-xs text-stone-500">Firma adı *</label>
                                            <input type="text" x-model="cariExtract.company.name"
                                                placeholder="İşletme adı"
                                                class="block w-full px-2 py-1.5 mt-0.5 text-sm bg-white border-0 rounded-md ring-1 ring-inset ring-stone-300 focus:ring-2 focus:ring-stone-500">
                                        </div>
                                        <div class="grid grid-cols-2 gap-2">
                                            <div>
                                                <label class="block text-xs text-stone-500">Telefon</label>
                                                <input type="text" x-model="cariExtract.company.phone"
                                                    class="block w-full px-2 py-1.5 mt-0.5 text-sm bg-white border-0 rounded-md ring-1 ring-inset ring-stone-300 focus:ring-2 focus:ring-stone-500">
                                            </div>
                                            <div>
                                                <label class="block text-xs text-stone-500">E-posta</label>
                                                <input type="email" x-model="cariExtract.company.email"
                                                    class="block w-full px-2 py-1.5 mt-0.5 text-sm bg-white border-0 rounded-md ring-1 ring-inset ring-stone-300 focus:ring-2 focus:ring-stone-500">
                                            </div>
                                        </div>
                                        <div class="grid grid-cols-2 gap-2">
                                            <div>
                                                <label class="block text-xs text-stone-500">Vergi dairesi</label>
                                                <input type="text" x-model="cariExtract.company.tax_office"
                                                    class="block w-full px-2 py-1.5 mt-0.5 text-sm bg-white border-0 rounded-md ring-1 ring-inset ring-stone-300 focus:ring-2 focus:ring-stone-500">
                                            </div>
                                            <div>
                                                <label class="block text-xs text-stone-500">VKN</label>
                                                <input type="text" x-model="cariExtract.company.vat_number"
                                                    class="block w-full px-2 py-1.5 mt-0.5 text-sm bg-white border-0 rounded-md ring-1 ring-inset ring-stone-300 focus:ring-2 focus:ring-stone-500">
                                            </div>
                                        </div>
                                        <div>
                                            <label class="block text-xs text-stone-500">Web sitesi</label>
                                            <input type="text" x-model="cariExtract.company.website"
                                                class="block w-full px-2 py-1.5 mt-0.5 text-sm bg-white border-0 rounded-md ring-1 ring-inset ring-stone-300 focus:ring-2 focus:ring-stone-500">
                                        </div>
                                    </div>

                                    {{-- Fatura adresi --}}
                                    <p class="mt-3 mb-2 text-xs font-semibold text-stone-500">FATURA ADRESİ</p>
                                    <div x-show="cariExtract && !(cariExtract.company.address_line || cariExtract.company.city)"
                                        class="p-2 mb-2 text-xs rounded-md bg-stone-100 text-stone-500"
                                        style="display: none;">
                                        Görselde adres bilgisi bulunamadı; dilerseniz elle ekleyebilirsiniz.
                                    </div>
                                    <div class="grid gap-2">
                                        <div>
                                            <label class="block text-xs text-stone-500">Adres</label>
                                            <input type="text" x-model="cariExtract.company.address_line"
                                                class="block w-full px-2 py-1.5 mt-0.5 text-sm bg-white border-0 rounded-md ring-1 ring-inset ring-stone-300 focus:ring-2 focus:ring-stone-500">
                                        </div>
                                        <div class="grid grid-cols-4 gap-2">
                                            <div>
                                                <label class="block text-xs text-stone-500">İlçe</label>
                                                <input type="text" x-model="cariExtract.company.district"
                                                    class="block w-full px-2 py-1.5 mt-0.5 text-sm bg-white border-0 rounded-md ring-1 ring-inset ring-stone-300 focus:ring-2 focus:ring-stone-500">
                                            </div>
                                            <div>
                                                <label class="block text-xs text-stone-500">İl</label>
                                                <input type="text" x-model="cariExtract.company.city"
                                                    class="block w-full px-2 py-1.5 mt-0.5 text-sm bg-white border-0 rounded-md ring-1 ring-inset ring-stone-300 focus:ring-2 focus:ring-stone-500">
                                            </div>
                                            <div>
                                                <label class="block text-xs text-stone-500">Ülke</label>
                                                <input type="text" x-model="cariExtract.company.country"
                                                    class="block w-full px-2 py-1.5 mt-0.5 text-sm bg-white border-0 rounded-md ring-1 ring-inset ring-stone-300 focus:ring-2 focus:ring-stone-500">
                                            </div>
                                            <div>
                                                <label class="block text-xs text-stone-500">P. Kodu</label>
                                                <input type="text" x-model="cariExtract.company.zip"
                                                    class="block w-full px-2 py-1.5 mt-0.5 text-sm bg-white border-0 rounded-md ring-1 ring-inset ring-stone-300 focus:ring-2 focus:ring-stone-500">
                                            </div>
                                        </div>
                                    </div>

                                    {{-- Benzer cari uyarısı --}}
                                    <div x-show="cariExtract && cariExtract.similar_companies && cariExtract.similar_companies.length > 0"
                                        class="p-3 mt-3 rounded-md bg-amber-50 text-amber-700" style="display: none;">
                                        <p class="text-xs font-semibold">Benzer işletmeler zaten kayıtlı görünüyor.</p>
                                        <p class="mt-0.5 text-xs">Mükerrer kayıt olmaması için adları kontrol edin.</p>
                                        <ul class="mt-1.5 space-y-0.5">
                                            <template x-for="similar in cariExtract.similar_companies"
                                                :key="similar.id">
                                                <li class="flex items-center gap-1.5 text-xs">
                                                    <span class="truncate" x-text="similar.name"></span>
                                                    <span
                                                        class="px-1.5 py-0.5 text-[10px] rounded bg-emerald-100 text-emerald-700"
                                                        x-text="'%' + similar.score"></span>
                                                </li>
                                            </template>
                                        </ul>
                                    </div>

                                    {{-- İşletme tipi --}}
                                    <p class="mt-3 mb-2 text-xs font-semibold text-stone-500">İŞLETME TİPİ</p>
                                    <div class="flex gap-2">
                                        <label
                                            class="flex items-center flex-1 gap-2 p-2 border rounded-md cursor-pointer"
                                            :class="cariType === 'client' ? 'border-stone-400 bg-stone-50' :
                                                    'border-stone-200 hover:bg-stone-50'">
                                            <input type="radio" name="cari_type" value="client" x-model="cariType"
                                                class="text-stone-600 focus:ring-stone-500">
                                            <span class="text-sm text-stone-700">MÜŞTERİ</span>
                                        </label>
                                        <label
                                            class="flex items-center flex-1 gap-2 p-2 border rounded-md cursor-pointer"
                                            :class="cariType === 'supplier' ? 'border-stone-400 bg-stone-50' :
                                                    'border-stone-200 hover:bg-stone-50'">
                                            <input type="radio" name="cari_type" value="supplier" x-model="cariType"
                                                class="text-stone-600 focus:ring-stone-500">
                                            <span class="text-sm text-stone-700">TEDARİKÇİ</span>
                                        </label>
                                    </div>

                                    <div class="flex gap-2 mt-4">
                                        <button type="button"
                                            @click="resetCari('Tamam, vazgeçtik. İstediğin zaman tekrar beklerim.')"
                                            :disabled="confirmCariBusy"
                                            class="flex-1 px-4 py-2 text-sm font-medium rounded-md text-stone-700 bg-stone-100 hover:bg-stone-200 disabled:opacity-50">VAZGEÇ</button>
                                        <button type="button" @click="confirmAiCompany()" :disabled="confirmCariBusy || !cariExtract.company.name || cariExtract.company.name
                                                    .trim() === ''"
                                            class="flex-1 px-4 py-2 text-sm font-semibold text-center text-white rounded-md bg-stone-600 hover:bg-stone-700 disabled:opacity-50 disabled:pointer-events-none">ONAYLA</button>
                                    </div>
                                </div>

                                {{-- Hata durumu --}}
                                <div x-show="aiError" class="p-3 mt-3 text-xs rounded-md bg-rose-50 text-rose-600"
                                    x-text="aiError" style="display: none;"></div>
                                <div x-show="aiError && !aiExtract" class="mt-3" style="display: none;">
                                    <button type="button" @click="resetAi()"
                                        class="px-4 py-2 text-xs font-medium rounded-md text-stone-700 bg-stone-100 hover:bg-stone-200">Tamam</button>
                                </div>

                                {{-- Başarılı: taslak faturaya git --}}
                                <div x-show="aiDone" class="mt-3" style="display: none;">
                                    <div class="p-3 rounded-md bg-emerald-50">
                                        <p class="text-sm font-semibold text-emerald-700">
                                            Fatura hazır!</p>
                                        <p class="mt-1 text-xs text-emerald-600" x-show="aiResult"
                                            x-text="aiResult ? ((aiResult.company_name || '') + ' · ' + aiResult.lines_count + ' satır · ' + aiResult.number) : ''">
                                        </p>
                                    </div>
                                    <a :href="aiResult ? aiResult.edit_url : '#'"
                                        class="inline-block px-4 py-2 mt-3 text-sm font-semibold text-center text-white rounded-md bg-stone-600 hover:bg-stone-700">
                                        Faturayı Aç
                                    </a>
                                    <button type="button" @click="resetAi()"
                                        class="px-4 py-2 ml-2 text-sm font-medium rounded-md text-stone-700 bg-stone-100 hover:bg-stone-200">Tamam</button>
                                </div>

                                {{-- CARİ HESAP: hata durumu --}}
                                <div x-show="cariError" class="p-3 mt-3 text-xs rounded-md bg-rose-50 text-rose-600"
                                    x-text="cariError" style="display: none;"></div>
                                <div x-show="cariError && !cariExtract" class="mt-3" style="display: none;">
                                    <button type="button" @click="resetCari()"
                                        class="px-4 py-2 text-xs font-medium rounded-md text-stone-700 bg-stone-100 hover:bg-stone-200">Tamam</button>
                                </div>

                                {{-- CARİ HESAP: başarılı, işletmeye git --}}
                                <div x-show="cariDone" class="mt-3" style="display: none;">
                                    <div class="p-3 rounded-md bg-emerald-50">
                                        <p class="text-sm font-semibold text-emerald-700">
                                            Cari hesap hazır!</p>
                                        <p class="mt-1 text-xs text-emerald-600" x-show="cariResult"
                                            x-text="cariResult ? (cariResult.name || '') : ''">
                                        </p>
                                    </div>
                                    <a :href="cariResult ? cariResult.show_url : '#'"
                                        class="inline-block px-4 py-2 mt-3 text-sm font-semibold text-center text-white rounded-md bg-stone-600 hover:bg-stone-700">
                                        İşletmeyi Aç
                                    </a>
                                    <button type="button" @click="resetCari()"
                                        class="px-4 py-2 ml-2 text-sm font-medium rounded-md text-stone-700 bg-stone-100 hover:bg-stone-200">Tamam</button>
                                </div>

                                {{-- BAKİYESİ OLAN İŞLETMELER: satıra tıklanınca işletme sayfası açılır --}}
                                <div x-show="balanceCompanies.length > 0" class="grid gap-0.5 mt-3"
                                    style="display: none;">
                                    <template x-for="company in balanceCompanies" :key="company.show_url">
                                        <a :href="company.show_url"
                                            class="flex items-baseline gap-1.5 px-2 py-1 -mx-2 text-sm text-stone-700 rounded-md hover:bg-stone-200 hover:text-stone-900">
                                            <span class="text-stone-400">•</span>
                                            <span class="min-w-0 truncate" x-text="company.name"></span>
                                            <span class="text-xs shrink-0 text-stone-500"
                                                x-text="company.note ? '(' + company.note + ')' : ''"></span>
                                            <span class="ml-auto font-semibold whitespace-nowrap"
                                                x-text="formatBalance(company.balance)"></span>
                                        </a>
                                    </template>
                                </div>
                            </livewire:ai-chat>
                            <!-- CAPABILITIES -->
                            <div class="p-2 border rounded-xl border-stone-300">
                                <h4 class="text-base pb-1.5 pl-1 font-semibold text-stone-400">Yetenekler</h3>
                                    <div class="flex flex-wrap gap-2">
                                        {{-- Gizli dosya seçici --}}
                                        <input type="file"
                                            accept="image/jpeg,image/jpg,image/png,image/webp,application/pdf,.pdf"
                                            class="hidden" x-ref="aiInvoiceFile" @change="startAiInvoice($event)">

                                        {{-- Gizli kartvizit/kaşe seçici --}}
                                        <input type="file" accept="image/jpeg,image/jpg,image/png,image/webp"
                                            class="hidden" x-ref="aiCompanyFile" @change="startAiCompany($event)">

                                        {{-- GÖRSEL -> ALIŞ FATURASI --}}
                                        <button type="button" @click="$refs.aiInvoiceFile.click()" :disabled="aiBusy"
                                            class="inline-flex gap-3 px-3 py-2 text-xs text-left border rounded-lg shadow-xs text-stone-700 border-stone-300 items-top w-72 bg-stone-50 hover:bg-stone-100 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-stone-600 disabled:opacity-50 disabled:pointer-events-none">
                                            <span
                                                class="flex-shrink-0 text-lg font-normal tracking-tight text-stone-600 material-symbols-rounded">auto_awesome</span>
                                            <div class="grid">
                                                <p class="text-sm font-bold">ALIŞ FATURASI</p>
                                                Bir görsel ya da pdf dosyası kullanarak fatura oluşturmayı dene
                                            </div>
                                        </button>

                                        {{-- GÖRSEL -> CARİ HESAP --}}
                                        <button type="button" @click="$refs.aiCompanyFile.click()" :disabled="aiBusy"
                                            class="inline-flex gap-3 px-3 py-2 text-xs text-left border rounded-lg shadow-xs text-stone-700 border-stone-300 items-top w-72 bg-stone-50 hover:bg-stone-100 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-stone-600 disabled:opacity-50 disabled:pointer-events-none">
                                            <span
                                                class="flex-shrink-0 text-lg font-normal tracking-tight text-stone-600 material-symbols-rounded">badge</span>
                                            <div class="grid">
                                                <p class="text-sm font-bold">CARİ HESAP</p>
                                                Bir kartvizit ya da kaşe görselinden cari hesap oluşturmayı dene
                                            </div>
                                        </button>

                                        {{-- BAKİYESİ OLAN İŞLETMELER --}}
                                        <button type="button" @click="loadBalances()" :disabled="aiBusy"
                                            class="inline-flex gap-3 px-3 py-2 text-xs text-left border rounded-lg shadow-xs text-stone-700 border-stone-300 items-top w-72 bg-stone-50 hover:bg-stone-100 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-stone-600 disabled:opacity-50 disabled:pointer-events-none">
                                            <span
                                                class="flex-shrink-0 text-lg font-normal tracking-tight text-stone-600 material-symbols-rounded">account_balance_wallet</span>
                                            <div class="grid">
                                                <p class="text-sm font-bold">BAKİYESİ OLAN İŞLETMELER</p>
                                                Bakiyesi olan işletmeleri listele, birine tıklayıp sayfasına git
                                            </div>
                                        </button>
                                    </div>
                            </div>
                            <!-- NOTIF -->
                            <div class="px-2 py-1 border-l-4 rounded-r-lg border-stone-400 bg-stone-50">
                                <div class="flex items-center">
                                    <div class="shrink-0">
                                        <svg class="size-5 text-stone-500" fill="currentColor"
                                            xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640">
                                            <path
                                                d="M385.5 132.8C393.1 119.9 406.9 112 421.8 112L424 112C446.1 112 464 129.9 464 152C464 174.1 446.1 192 424 192L350.7 192L385.5 132.8zM254.5 132.8L289.3 192L216 192C193.9 192 176 174.1 176 152C176 129.9 193.9 112 216 112L218.2 112C233.1 112 247 119.9 254.5 132.8zM344.1 108.5L320 149.5L295.9 108.5C279.7 80.9 250.1 64 218.2 64L216 64C167.4 64 128 103.4 128 152C128 166.4 131.5 180 137.6 192L96 192C78.3 192 64 206.3 64 224L64 256C64 273.7 78.3 288 96 288L544 288C561.7 288 576 273.7 576 256L576 224C576 206.3 561.7 192 544 192L502.4 192C508.5 180 512 166.4 512 152C512 103.4 472.6 64 424 64L421.8 64C389.9 64 360.3 80.9 344.1 108.4zM544 336L344 336L344 544L480 544C515.3 544 544 515.3 544 480L544 336zM296 336L96 336L96 480C96 515.3 124.7 544 160 544L296 544L296 336z" />
                                        </svg>
                                    </div>
                                    <div class="ml-2">
                                        <p class="text-[10px] text-stone-700">
                                            1 Ekim 2026 tarihine kadar yapay zeka özelliklerini ücretsiz
                                            deneyebilirsiniz.
                                        </p>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>
                    <!-- İŞLEVLER -->
                    <div class="grid gap-4 p-4 bg-white rounded-lg shadow ring-1 ring-stone-300">
                        <div>
                            <div class="grid grid-cols-2 gap-2 sm:flex sm:flex-wrap">
                                <x-small-main-button name="FATURA & FİŞLER" count="{{ $count_invoices }}"
                                    route="{{ route('invoices', ['filter' => 'all']) }}" icon="swap_vert" color="stone"
                                    w='60' class='' />
                                <!-- SATIŞLAR -->
                                <x-small-main-button name="SATIŞLAR" count="{{ $count_sale }}"
                                    route="{{ route('invoices', ['filter' => 'sales']) }}" icon="receipt_long"
                                    color="sky" w='60' class='' />
                                <!-- ALIŞLAR -->
                                <x-small-main-button name="ALIŞLAR" count="{{ $count_purchase }}"
                                    route="{{ route('invoices', ['filter' => 'purchase']) }}" icon="receipt_long"
                                    color="amber" w='60' class='' />
                            </div>
                        </div>

                        <div>
                            <div class="grid grid-cols-2 gap-2 sm:flex sm:flex-wrap">
                                <!-- FİNANSAL DURUM -->
                                <x-small-main-button name="FİN.HAREKETLER" count=""
                                    route="{{ route('transactions', ['filter' => 'all']) }}" icon="query_stats"
                                    color="stone" unit="GÖZ AT" data="TÜM FİNANSAL HAREKETLERİ LİSTELEYİN" w='60'
                                    class='' />
                                <!-- TAHSİLATLAR -->
                                <x-small-main-button name="TAHSİLATLAR" count="{{ $count_received }}"
                                    route="{{ route('transactions', ['filter' => 'received']) }}" icon="south_west"
                                    color="teal" unit="KAYIT" data="{{ $last_receiveds }}" w='60' class='' />
                                <!-- ÖDEMELER -->
                                <x-small-main-button name="ÖDEMELER" count="{{ $count_paid }}"
                                    route="{{ route('transactions', ['filter' => 'paid']) }}" icon="north_east"
                                    color="rose" unit="KAYIT" data="{{ $last_paids }}" w='60' class='' />
                                <!-- ÇEKLER -->
                                <x-small-main-button name="ÇEKLER" count="{{ $count_checks }}"
                                    route="{{ route('checks', ['filter' => 'all']) }}" icon="checkbook" color="stone"
                                    unit="KAYIT" data="{{ $last_checks }}" w='60' class='' />
                                <!-- TEKRAR EDEN ÖDEMELER -->
                                <x-small-main-button name="TEKRARLAYAN ÖDEMELER" count=""
                                    route="{{ route('recurring-movements.index') }}" icon="event_repeat" color="stone"
                                    unit="TEKRAR EDEN" data="KİRA, MAAŞ, ABONELİK GİBİ TEKRAR EDEN ÖDEMELERİ YÖNETİN"
                                    w='60' class='' />
                                <!-- KREDİLER -->
                                {{--
                                <x-small-main-button name="KREDİLER" count="3" route="" icon="search_activity"
                                    color="stone" unit="KAYIT" data="YAPIM AŞAMASINDA" w='60'
                                    class='opacity-50 cursor-not-allowed' /> --}}
                            </div>
                        </div>

                        <div>
                            <div class="grid grid-cols-2 gap-2 sm:flex sm:flex-wrap">
                                <!-- HESAPLAR -->
                                <x-small-main-button name="CARİ HESAPLAR" count="{{ $count_all_companies }}"
                                    route="{!! route('companies', ['filter' => 'all', 'balance' => 'yes']) !!}"
                                    icon="apartment" color="stone" unit="KAYIT"
                                    data="MÜŞTERİLER, TEDARİKÇİLER ve KİŞİLERİ LİSTELEYİN" w='60' class='' />
                                <!-- MÜŞTERİLER -->
                                <x-small-main-button name="MÜŞTERİLER" count="{{ $count_all_clients }}"
                                    route="{!! route('companies', ['filter' => 'client', 'balance' => 'yes']) !!}"
                                    icon="store" color="stone" unit="KAYIT" data="{{ $last_clients }}" w='60'
                                    class='' />
                                <!-- TEDARİKÇİLER -->
                                <x-small-main-button name="TEDARİKÇİLER" count="{{ $count_all_suppliers }}"
                                    route="{!! route('companies', ['filter' => 'supplier', 'balance' => 'yes']) !!}"
                                    icon="help_clinic" color="stone" unit="KAYIT" data="{{ $last_suppliers }}" w='60'
                                    class='' />
                                <!-- KİŞİLER -->
                                <x-small-main-button name="KİŞİLER" count="{{ $count_all_people }}"
                                    route="{{ route('people.index') }}" icon="person" color="stone" unit="KAYIT"
                                    data="{{ $last_people }}" w='60' class='' />
                            </div>
                        </div>

                        <div>
                            <div class="grid grid-cols-2 gap-2 sm:flex sm:flex-wrap">
                                <!-- VARLIKLAR -->
                                <x-small-main-button name="VARLIKLAR" count="{{ $count_cash_vaults }}"
                                    route="{{ route('bank-accounts', ['filter' => 'all']) }}" icon="scatter_plot"
                                    color="stone" unit="KAYIT" data="" w='60' class='' />
                                <!-- NAKİT KASALARI -->
                                <x-small-main-button name="NAKİT KASALARI" count="{{ $count_cash_vaults }}"
                                    route="{{ route('bank-accounts', ['filter' => 'cash_vault']) }}"
                                    icon="currency_lira" color="stone" unit="KAYIT" data="" w='60' class='' />
                                <!-- BANKA HESAPLARI -->
                                <x-small-main-button name="BANKA HESAPLARI" count="{{ $count_bank_accounts }}"
                                    route="{{ route('bank-accounts', ['filter' => 'bank_account']) }}"
                                    icon="account_balance" color="stone" unit="KAYIT" data="" w='60' class='' />
                                <!-- KREDİ KARTLARI -->
                                <x-small-main-button name="KREDİ KARTLARI" count="{{ $count_credit_cards }}"
                                    route="{{ route('bank-accounts', ['filter' => 'credit_card']) }}" icon="credit_card"
                                    color="stone" unit="KAYIT" data="" w='60' class='' />
                            </div>
                        </div>

                        {{-- @if ($bulutadisyon_integrations->count() > 0 || $efiles_integration == 1)
                        <div>
                            <div class="grid grid-cols-2 gap-2 sm:flex sm:flex-wrap">
                                <!-- DAĞITIMLAR -->
                                @if ($bulutadisyon_integrations->count() > 0)
                                <x-small-main-button name="DAĞITIMLAR" count=""
                                    route="{{ route('stock-allocations.index') }}" icon="call_split" color="stone"
                                    unit="POSMANAGER" data="BULUT ADİSYON HESAPLARINIZA YAPILAN DAĞITIMLARI YÖNETİN"
                                    w='60' class='' />
                                @endif
                                <!-- E-BELGELER -->
                                @if ($efiles_integration == 1)
                                @foreach ($integrations as $item)
                                <x-main-button name="{{ $item->title }}" count="" @if ($item->slug != 'beko-x30tr')
                                    route="{{ route('integrations.' . $item->slug . '.index', $item->relation_id) }}"
                                    @else route="#" @endif
                                    icon="{{ $item->icon }}" color="{{ $item->color }}"
                                    unit="{{ $item->description }}" data="{{ $item->description }}"
                                    w='60' class='' />
                                    @endforeach
                                    @endif
                            </div>
                        </div>
                        @endif --}}

                        <div>
                            <div class="grid grid-cols-2 gap-2 sm:flex sm:flex-wrap">
                                <!-- FİRMA VE FATURALAR -->
                                <x-small-main-button name="FATURA RAPORU" count=""
                                    route="{!! route('reports.company-and-invoice', ['filter' => 'all']) !!}"
                                    icon="source_environment" color="stone" unit="FİRMA BAZLI"
                                    data="FİRMA BAZLI FİŞ/FATURA RAPORU" w='60' class='' />
                                <!-- TEKRAR EDEN ÖDEMELER -->
                                <x-small-main-button name="MALİYET RAPORU" count=""
                                    route="{{ route('recurring-movements.report') }}" icon="event_repeat" color="stone"
                                    unit="TEKRAR EDEN" data="TEKRAR EDEN ÖDEMELERİN PERİYODİK MALİYET RAPORU" w='60'
                                    class='' />
                            </div>
                        </div>

                        <div>
                            <div class="grid grid-cols-2 gap-2 sm:flex sm:flex-wrap">
                                <!-- AYARLAR -->
                                <x-small-main-button name="AYARLAR" count="" route="{{ route('settings.index') }}"
                                    icon="tune" color="stone" unit="GÖZ AT" data="AYARLAR" w='60' class='' />
                                <!-- DAĞITIMLAR -->
                            </div>
                        </div>

                    </div>
                </div>
                {{-- SAĞ KOLON --}}
                <div class="grid gap-4 lg:col-span-1">
                    {{-- DÖVİZ KURLARI --}}
                    <div class="p-4 bg-white rounded-lg shadow ring-1 ring-stone-300">
                        <div class="flex gap-x-1">
                            @foreach ($ex_rate as $item)
                            <span class="pr-1 text-xs text-stone-500">{{ $item->currency }}</span><span
                                class="font-semibold tracking-tight">{{ number_format($item->rate, 2, ',', '.')
                                }}</span>{{ $loop->last ? '' : ' | ' }}
                            @endforeach
                            @if (count($ex_rate) > 0)
                            <span class="flex items-center pl-3 text-xs font-light gap-x-1 text-stone-400">
                                <span class="text-sm material-symbols-rounded">
                                    cached
                                </span>
                                {{ date('d.m.Y', strtotime($ex_rate['USD']->date ?? now())) }}
                            </span>
                            @endif
                        </div>
                    </div>
                    @if (isset($efiles_integration) && $efiles_integration)
                    {{-- SİSTEM DURUMU & KONTÖR --}}
                    <div class="bg-white rounded-lg shadow">
                        <div class="rounded-lg ring-1 ring-stone-300 sm:mx-0">
                            <div class="grid grid-cols-2">
                                {{-- SİSTEM DURUMU --}}
                                <div class="bg-white rounded-l-lg">
                                    <div
                                        class="grid items-center h-full px-3 py-2 bg-gradient-to-b {{ isset($efiles_integration) && $efiles_integration ? ' from-emerald-300/40 to-emerald-100/30' : 'from-rose-300/40 to-rose-100/30' }} lg:rounded-l-lg">
                                        <div class="flex items-center">
                                            <div class="flex-shrink-0">
                                                <span
                                                    class="text-3xl material-symbols-rounded {{ isset($efiles_integration) && $efiles_integration ? 'text-emerald-600' : 'text-rose-600' }}">
                                                    {{ isset($efiles_integration) && $efiles_integration ? 'check' :
                                                    'close' }}
                                                </span>
                                            </div>
                                            <div class="flex-1 w-0 ml-3 tracking-tight">
                                                <dl>
                                                    <dd>
                                                        <div
                                                            class="text-sm font-bold {{ isset($efiles_integration) && $efiles_integration ? 'text-emerald-600' : 'text-rose-600' }}">
                                                            {{ isset($efiles_integration) && $efiles_integration ?
                                                            'SERVİSLER ÇALIŞIYOR' : 'BAĞLANTI KURULAMADI' }}
                                                        </div>
                                                    </dd>
                                                    @if (isset($efiles_integration) && $efiles_integration)
                                                    <dt class="text-xs font-light truncate text-emerald-600">
                                                        {{ $efiles_integration->description }}</dt>
                                                    @else
                                                    <dt class="text-xs font-light text-rose-600">E-BELGE
                                                        SERVİSLERİNE BAĞLI DEĞİLSİNİZ</dt>
                                                    @endif
                                                </dl>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                {{-- BAKİYE DURUMU --}}
                                @livewire('credit-balance')
                            </div>
                        </div>
                    </div>
                    @if ($is_admin > 0)
                    <!-- E-BELGE GELEN KUTUSU -->
                    <div class="px-6 py-4 bg-white rounded-lg shadow ring-1 ring-stone-300">
                        <div class="">
                            <div class="sm:flex sm:items-center">
                                <div class="sm:flex-auto gap-y-1.5">
                                    <h1 class="text-lg font-semibold text-stone-900">Gelen E-Belgeler</h1>
                                    <p class="text-xs text-stone-500">Burada son 1 hafta içinde gelen belgeler
                                        listelenir</p>
                                </div>
                                <div class="mt-4 sm:ml-16 sm:mt-0 sm:flex-none">
                                    <button type="button"
                                        class="block px-3 py-2 text-sm font-semibold text-center text-white rounded-md shadow-sm bg-stone-600 hover:bg-stone-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-stone-600">GELEN
                                        KUTUSU</button>
                                </div>
                            </div>
                            <div class="flow-root mt-8">
                                <div class="overflow-x-auto">
                                    <div class="inline-block min-w-full py-2 align-middle">
                                        <table class="relative min-w-full divide-y divide-stone-300">
                                            <thead>
                                                <tr>
                                                    <th scope="col"
                                                        class="py-2 pl-4 pr-3 text-xs font-semibold text-left whitespace-nowrap text-stone-500 sm:pl-0">
                                                        TARİH</th>
                                                    <th scope="col"
                                                        class="py-2 pl-4 pr-3 text-xs font-semibold text-left whitespace-nowrap text-stone-500 sm:pl-0">
                                                        FATURA NO</th>
                                                    <th scope="col"
                                                        class="px-2 py-2 text-xs font-semibold text-left whitespace-nowrap text-stone-500">
                                                        GÖNDEREN</th>
                                                    <th scope="col"
                                                        class="px-2 py-2 text-xs font-semibold whitespace-nowrap text-end text-stone-500">
                                                        TUTAR</th>
                                                </tr>
                                            </thead>
                                            <tbody class="bg-white divide-y divide-stone-200">
                                                @forelse ($inboxInvoices as $invoice)
                                                <tr class="transition-all cursor-pointer hover:bg-stone-50"
                                                    onclick="window.location='{{ route('incoming-invoice.show', ['ettn' => $invoice['invoiceETTN'] ?? ($invoice['ettn'] ?? '')]) }}'">
                                                    <td
                                                        class="py-2 pr-2 text-xs whitespace-nowrap text-stone-500 sm:pl-0">
                                                        {{ isset($invoice['docDate']) ?
                                                        \Carbon\Carbon::parse($invoice['docDate'])->format('d.m.Y') :
                                                        '-' }}
                                                    </td>
                                                    <td
                                                        class="px-2 py-2 text-xs whitespace-nowrap text-stone-500 sm:pl-0">
                                                        {{ $invoice['docNo'] ?? '-' }}</td>
                                                    <td
                                                        class="px-2 py-2 text-sm font-medium whitespace-nowrap text-stone-800">
                                                        {{ $invoice['accountName'] ?? ($invoice['senderAccountName'] ??
                                                        '-') }}
                                                    </td>
                                                    <td
                                                        class="py-2 pr-2 text-sm whitespace-nowrap text-end text-stone-500">
                                                        {{ number_format(floatval($invoice['payableAmount'] ??
                                                        ($invoice['taxInclusiveAmount'] ?? 0)), 2, ',', '.') }}
                                                    </td>
                                                </tr>
                                                @empty
                                                <tr>
                                                    <td colspan="4" class="py-4 text-xs text-center text-stone-400">
                                                        Gelen belge bulunamadı
                                                    </td>
                                                </tr>
                                                @endforelse
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    @endif
                    @endif
                    {{-- SON EKLENEN İŞLETMELER --}}
                    <div class="p-4 bg-white shadow ring-1 ring-stone-400/20 sm:mx-0 sm:rounded-lg">
                        <h2 class="flex items-center mb-3 text-lg leading-6 font-jbmono-bold text-stone-700">
                            <span class="mr-1 material-symbols-rounded">
                                history_2
                            </span>
                            Son Eklenen İşletmeler
                        </h2>
                        <div class="grid grid-cols-1">
                            <ul class="flex flex-wrap gap-2">
                                @foreach ($last_companies as $company)
                                <li
                                    class="text-xs tracking-tight transition-all rounded-lg bg-stone-100/40 max-w-48 hover:bg-stone-100 ring-1 ring-stone-200">
                                    <a href="{{ route('companies.show', $company->slug) }}"
                                        class="flex items-center justify-between flex-1 px-2 truncate">
                                        <div class="flex-1 truncate py-1.5">
                                            <p class="font-medium uppercase truncate text-stone-900">
                                                {{ $company->name }}</p>
                                            <p class="text-stone-500">{{ $company->note }}</p>
                                        </div>
                                    </a>
                                </li>
                                @endforeach
                            </ul>
                        </div>
                    </div>
                    {{-- YAKLAŞAN TEKRAR EDEN ÖDEMELER --}}
                    <div class="p-4 bg-white rounded-lg shadow ring-1 ring-stone-300">
                        <div class="flex items-center justify-between mb-2">
                            <div class="flex items-center text-sm leading-6 gap-x-1 text-stone-700">
                                <span class="text-base material-symbols-rounded text-stone-400">
                                    event_repeat
                                </span>
                                Yaklaşan Tekrar Eden Ödemeler
                            </div>
                            <a href="{{ route('recurring-movements.report', ['date' => 'next_12_months']) }}"
                                class="text-xs transition-all text-stone-400 hover:text-stone-600">Rapor →</a>
                        </div>
                        <p class="mb-2 text-xs text-stone-400">Önümüzdeki 10 gün içinde gerçekleşecek tekrarlar
                        </p>
                        <ul role="list" class="divide-y divide-stone-100">
                            @forelse ($upcoming_recurring->take(8) as $item)
                            <li class="flex items-center justify-between py-1.5">
                                <div class="min-w-0">
                                    <p class="text-sm font-medium truncate text-stone-700">
                                        {{ $item['movement']->title }}</p>
                                    <p class="text-xs text-stone-400">
                                        {{ $item['date']->format('d.m.Y') }} ·
                                        {{ $item['movement']->period_label }}
                                    </p>
                                </div>
                                <p class="text-sm font-semibold whitespace-nowrap text-stone-600">
                                    {{ number_format($item['movement']->amount, 2, ',', '.') }}
                                    <span class="text-xs font-normal text-stone-400">{{ $item['movement']->currency
                                        }}</span>
                                </p>
                            </li>
                            @empty
                            <li class="py-2 text-xs text-stone-400">Önümüzdeki 10 günde tekrar eden ödeme
                                bulunmuyor.</li>
                            @endforelse
                        </ul>
                    </div>
                    @if ($count_deals > 0)
                    {{-- ANLAŞMALAR --}}
                    <div
                        class="items-center p-2 py-4 bg-white shadow sm:p-4 ring-1 ring-rose-400 sm:mx-0 sm:rounded-lg">
                        <h2 class="flex items-center mb-2 text-lg leading-6 font-jbmono-bold text-stone-700">
                            <span class="mr-1 material-symbols-rounded">
                                stylus_note
                            </span>
                            Anlaşmalar
                        </h2>
                        <div class="flex">
                            <div class="shrink-0">
                                <svg class="size-4 text-stone-400" viewBox="0 0 20 20" fill="currentColor"
                                    aria-hidden="true" data-slot="icon">
                                    <path fill-rule="evenodd"
                                        d="M18 10a8 8 0 1 1-16 0 8 8 0 0 1 16 0Zm-7-4a1 1 0 1 1-2 0 1 1 0 0 1 2 0ZM9 9a.75.75 0 0 0 0 1.5h.253a.25.25 0 0 1 .244.304l-.459 2.066A1.75 1.75 0 0 0 10.747 15H11a.75.75 0 0 0 0-1.5h-.253a.25.25 0 0 1-.244-.304l.459-2.066A1.75 1.75 0 0 0 9.253 9H9Z"
                                        clip-rule="evenodd" />
                                </svg>
                            </div>
                            <div class="flex-1 ml-2 md:flex md:justify-between">
                                <p class="text-xs tracking-tighter text-stone-400">Burada anlaşmaya dönüşmüş
                                    teklifler
                                    listelenir. Anlaşmalardan fatura
                                    oluşturabilirsiniz.</p>
                            </div>
                        </div>
                        <div class="grid gap-6 mt-4">
                            <livewire:deals />
                        </div>
                    </div>
                    @endif
                    @if (count($invoices) > 0)
                    {{-- FATURA & FİŞLER --}}
                    <div class="p-2 py-4 bg-white rounded-lg shadow sm:p-4 ring-1 ring-stone-300">
                        <h2 class="flex items-center mb-4 text-lg leading-6 font-jbmono-bold text-stone-700">
                            <span class="mr-1 material-symbols-rounded">
                                swap_vert
                            </span>
                            Son Fatura & Fişler
                        </h2>
                        <div class="grid grid-cols-1">
                            <ul role="list" class="divide-y divide-stone-100">

                                @foreach ($invoices as $item)
                                <div
                                    class="flex items-center justify-start px-1 py-1 transition-all sm:px-4 sm:py-2 hover:bg-stone-50 hover:ring-1 hover:ring-stone-200 hover:shadow hover:rounded-xl">
                                    <div class="grid min-w-0 gap-y-1 grow">
                                        <div class="font-semibold gap-x-3">
                                            @if ($item->type == 'sales_invoice')
                                            <a href="{{ route('invoices.show', $item->id) }}"
                                                class="flex items-center text-xs sm:text-sm text-sky-700 gap-x-3">SATIŞ
                                                FATURASI<span class="text-xs truncate text-stone-600">#{{
                                                    $item->company->name }}</span>
                                                @if (!is_null($item->gonderim_durumu))
                                                @switch($item->gonderim_durumu)
                                                @case(-2)
                                                <span
                                                    class="inline-flex items-center rounded-md bg-rose-50 px-1.5 py-0.5 text-xs font-medium text-rose-700 ring-1 ring-inset ring-rose-600/20">İptal</span>
                                                @break

                                                @case(-1)
                                                <span
                                                    class="inline-flex items-center rounded-md bg-amber-50 px-1.5 py-0.5 text-xs font-medium text-amber-700 ring-1 ring-inset ring-amber-600/20">Sırada
                                                    Bekliyor</span>
                                                @break

                                                @case(0)
                                                <span
                                                    class="inline-flex items-center rounded-md bg-rose-50 px-1.5 py-0.5 text-xs font-medium text-rose-700 ring-1 ring-inset ring-rose-600/20">Hata</span>
                                                @break

                                                @case(1)
                                                <span
                                                    class="inline-flex items-center rounded-md bg-blue-50 px-1.5 py-0.5 text-xs font-medium text-blue-700 ring-1 ring-inset ring-blue-600/20">Gönderilecek</span>
                                                @break

                                                @case(2)
                                                <span
                                                    class="inline-flex items-center rounded-md bg-green-50 px-1.5 py-0.5 text-xs font-medium text-green-700 ring-1 ring-inset ring-green-600/20">Gönderildi</span>
                                                @break

                                                @case(3)
                                                <span
                                                    class="inline-flex items-center rounded-md bg-indigo-50 px-1.5 py-0.5 text-xs font-medium text-indigo-700 ring-1 ring-inset ring-indigo-600/20">GİB
                                                    Yanıtı</span>
                                                @break

                                                @case(4)
                                                <span
                                                    class="inline-flex items-center rounded-md bg-teal-50 px-1.5 py-0.5 text-xs font-medium text-teal-700 ring-1 ring-inset ring-teal-600/20">Alıcıya
                                                    Ulaştı</span>
                                                @break
                                                @endswitch
                                                @endif
                                            </a>
                                            @elseif($item->type == 'purchase_invoice')
                                            <a href="{{ route('invoices.show', $item->id) }}"
                                                class="flex items-center text-xs text-orange-700 sm:text-sm gap-x-3">ALIŞ
                                                FATURASI<span class="text-xs truncate text-stone-600">#{{
                                                    $item->company->name }}</span>
                                            </a>
                                            @elseif($item->type == 'sales_receipt')
                                            <a href="{{ route('receipts.show', $item->id) }}"
                                                class="flex items-center text-xs sm:text-sm gap-x-3 text-sky-700">SATIŞ
                                                FİŞİ<span class="text-xs truncate text-stone-600">#{{
                                                    $item->company->name }}</span>
                                            </a>
                                            @elseif($item->type == 'purchase_receipt')
                                            <a href="{{ route('receipts.show', $item->id) }}"
                                                class="flex items-center text-xs text-orange-700 sm:text-sm gap-x-3">ALIŞ
                                                FİŞİ<span class="text-xs truncate text-stone-600">#{{
                                                    $item->company->name }}</span>
                                            </a>
                                            @endif
                                        </div>
                                        <div class="text-xs text-stone-500">
                                            <p class="overflow-hidden text-xs uppercase truncate max-w-96 whitespace-nowrap text-stone-500"
                                                title="{{ $item->lines->pluck('product.name')->join(', ') }}">
                                                @if ($item->type == 'sales_invoice' || $item->type ==
                                                'purchase_invoice')
                                                {{ $item->lines->pluck('product.name')->join(', ') }}
                                                @else
                                                {{ $item->note }}
                                                @endif
                                            </p>
                                        </div>
                                        <div class="text-xs text-stone-400">
                                            <date class="flex items-center gap-x-1">
                                                {{ date('d.m.Y', strtotime($item->date)) }}
                                                {{ $item->number }}
                                                @if ($item->stockAllocations()->exists())
                                                <span class="relative inline-flex items-center group">
                                                    <span
                                                        class="text-lg text-amber-500 material-symbols-rounded">call_split</span>
                                                    <span
                                                        class="absolute invisible px-2 py-1 text-xs text-white transition-all -translate-x-1/2 rounded-lg opacity-0 bg-stone-800 left-1/2 -top-8 group-hover:visible group-hover:opacity-100 whitespace-nowrap">
                                                        Bu faturaya ait stok dağıtımı var
                                                        <span
                                                            class="absolute w-2 h-2 rotate-45 -translate-x-1/2 bg-stone-800 left-1/2 -bottom-1"></span>
                                                    </span>
                                                </span>
                                                @endif
                                            </date>
                                        </div>
                                    </div>
                                    <div class="items-center flex-none text-right gap-x-2">
                                        @if ($item->type == 'paid')
                                        <p class="font-semibold text-rose-600 sm:block">
                                            <span
                                                class="text-xs sm:text-sm material-symbols-rounded text-rose-600">north_east</span>
                                            {{ number_format($item->total_amount, 2, ',', '.') }}<span
                                                class="pl-0.5 font-normal text-xs">TRL</span>
                                        </p>
                                        @elseif($item->type == 'received')
                                        <p class="font-semibold text-emerald-600 sm:block">
                                            <span
                                                class="text-xs sm:text-sm material-symbols-rounded text-emerald-600">south_west</span>
                                            {{ number_format($item->total_amount, 2, ',', '.') }}<span
                                                class="pl-0.5 font-normal text-xs">TRL</span>
                                        </p>
                                        @else
                                        <p class="font-semibold text-stone-600 sm:block">
                                            {{ number_format($item->total_amount, 2, ',', '.') }}<span
                                                class="pl-0.5 font-normal text-xs">TRL</span>
                                            @if ($item->currency != 'TRL')
                                            <br>
                                            <span class="text-xs font-normal text-stone-400">{{
                                                number_format($item->ex_amount, 2, ',', '.') }}<span class="pl-0.5">{{
                                                    $item->currency }}</span></span>
                                            @endif
                                        </p>
                                        @endif
                                    </div>
                                </div>
                                @endforeach

                            </ul>
                        </div>
                    </div>
                    @endif
                    @if (count($transactions) > 0)
                    {{-- FİNANSAL HAREKETLKER --}}
                    <div class="px-2 py-4 bg-white rounded-lg shadow sm:p-4 ring-1 ring-stone-300">
                        <h2 class="flex items-center mb-4 text-lg leading-6 font-jbmono-bold text-stone-700">
                            <span class="mr-1 material-symbols-rounded">
                                currency_lira
                            </span>
                            Son Finansal Hareketler
                        </h2>
                        <div class="grid grid-cols-1">
                            <ul role="list" class="divide-y divide-stone-100">

                                @foreach ($transactions as $item)
                                <a href="{{ route('transactions.show', $item->id) }}"
                                    class="flex items-center justify-start px-1 py-1 transition-all sm:px-4 sm:py-2 hover:bg-stone-50 hover:ring-1 hover:ring-stone-200 hover:shadow hover:rounded-xl">
                                    <div class="grid min-w-0 gap-y-1 grow">
                                        <div class="flex items-center gap-x-3">
                                            @if ($item->type == 'paid')
                                            <p
                                                class="flex items-center text-xs font-semibold sm:text-sm gap-x-2 text-rose-600">
                                                ÖDEME<span class="text-xs text-stone-600">#{{ $item->company->name
                                                    }}</span>
                                            </p>
                                            @elseif($item->type == 'received')
                                            <p
                                                class="flex items-center text-xs font-semibold text-teal-600 sm:text-sm gap-x-2">
                                                TAHSİLAT<span class="text-xs text-stone-600">#{{ $item->company->name
                                                    }}</span>
                                            </p>
                                            @endif
                                        </div>
                                        <div class="text-xs text-stone-500">
                                            <p
                                                class="overflow-hidden text-xs uppercase truncate max-w-96 whitespace-nowrap text-stone-500">
                                                {{ $item->name }}</p>
                                        </div>
                                        <div class="text-xs text-stone-400">
                                            <date>
                                                {{ date('d.m.Y', strtotime($item->date)) }}
                                                {{ $item->number }}</date>
                                        </div>
                                    </div>
                                    <div class="items-center flex-none text-right gap-x-2">
                                        @if ($item->type == 'paid')
                                        <p class="font-semibold text-rose-600 sm:block">
                                            <span
                                                class="text-xs sm:text-sm material-symbols-rounded text-rose-600">north_east</span>
                                            {{ number_format($item->amount, 2, ',', '.') }}<span
                                                class="pl-0.5 font-normal text-xs">TRL</span>
                                        </p>
                                        @elseif($item->type == 'received')
                                        <p class="font-semibold text-emerald-600 sm:block">
                                            <span
                                                class="text-xs sm:text-sm material-symbols-rounded text-emerald-600">south_west</span>
                                            {{ number_format($item->amount, 2, ',', '.') }}<span
                                                class="pl-0.5 font-normal text-xs">TRL</span>
                                        </p>
                                        @endif
                                    </div>
                                </a>
                                @endforeach

                            </ul>
                        </div>

                    </div>
                    @else
                    <div class="">
                        <x-alert-standard color="stone">
                            Bu aya ait belge bulunmuyor.
                        </x-alert-standard>
                    </div>
                    @endif
                </div>
            </div>
    </main>
</div>

@endsection

@section('scripts')
<script>
    function generateContent() {
            const MISTRAL_API_KEY = '{{ config('services.mistral.api_key') }}';

            async function sendMessage() {
                const url = 'https://api.mistral.ai/v1/chat/completions';
                const data = {
                    "model": "open-mistral-nemo",
                    "messages": [{
                        "role": "user",
                        "content": `Girilen metnin imla ve argo söz kontrollerini yapalım. Daha okunaklı ve anlaşılır bir hale gelmesi için düzenlemeler yapalım. Hiç bir açıklama eklemeyelim.
                                        Girilen metin: ${document.querySelector('textarea[name="content"]').value}`
                    }],
                    "temperature": 0.0,
                    "top_p": 1,
                    "max_tokens": 512,
                    "stream": false,
                    "safe_prompt": false,
                    "random_seed": 42
                };

                try {
                    const response = await fetch(url, {
                        method: 'POST',
                        headers: {
                            'Authorization': `Bearer ${MISTRAL_API_KEY}`,
                            'Content-Type': 'application/json'
                        },
                        body: JSON.stringify(data)
                    });

                    if (!response.ok) {
                        throw new Error(`HTTP error! status: ${response.status}`);
                    }

                    const result = await response.json();
                    document.querySelector('textarea[name="content"]').value = result.choices[0].message.content;
                } catch (error) {
                    console.error('There was a problem with the fetch operation:', error);
                }
            }

            sendMessage();
        }
</script>
@endsection