/* Module detail router + page layouts */

const MODULES = {
  "beyanname-takibi": {
    title: "Beyanname Takibi",
    tagline: "GİB e-Beyanname her gece otomatik çekilir",
    intro: "Mükelleflerinizin tüm beyannameleri — KDV1, MUHSGK, GGECICI, GVK_94 ve diğerleri — her gece otomatik olarak GİB e-Beyanname'den otomatik olarak çekilir. Tahakkuk bilgileri ve PDF'ler güvenli bulut depolama'ye yüklenir. Sabah çayınızı yudumlarken hangi mükellef hazır, hangisi hatalı tek bakışta görürsünüz.",
    accent: "#1e3a8a",
    Mock: () => <MockBeyanname />,
    steps: [
      { t: "Mükellef şifresi şifrelenir", d: "GİB e-Beyanname kullanıcı adı/şifre şifrelenip sistemde tutulur. Her mükellef için ayrı kayıt." },
      { t: "yapay zekâ CAPTCHA çözer", d: "sistem otomatik tetiklenir, yapay zekâ GİB CAPTCHA görselini saniyeler içinde çözer." },
      { t: "Beyanname listesi çekilir", d: "Login sonrası mükellefin tüm beyanname listesi, tahakkuk tutarları, durum bilgileri ve PDF'leri akıllı yeniden deneme ile indirilir." },
      { t: "arşive + sisteme yazılır", d: "PDF'ler güvenli bulut depolama'ye, metadata veritabanımız 'beyannameler' tablosuna upsert edilir. erişim kontrolü ile sadece ofisiniz görür." },
      { t: "Vade uyarısı + ntfy bildirim", d: "Vadesi yaklaşan beyannameler için anlık bildirim kanalınıza push bildirim gider. Hatalı tahakkuk olursa anında bilgi alırsınız." },
    ],
    features: [
      "Her gece otomatik tarama (TR saati 08:00, 12:00, 16:00, 20:00)",
      "KDV1, MUHSGK, GGECICI, GVK_94, BDR, MGYO_GVK_94, KDV2 destekli",
      "PDF arşiv — geçmiş dönemler arşivde 7 yıl saklanır",
      "Tahakkuk tutarı ve gönderim durumu canlı senkron",
      "Self-healing — eksik PDF'leri sonraki çalıştırmada otomatik tamir",
      "Realtime progress modal — toplu kontrol sırasında ne aşamadayız görün",
    ],
    cta: "Beyanname takibimizi 14 gün ücretsiz deneyin",
  },

  "e-tebligat-sorgu": {
    title: "E-Tebligat Sorgu",
    tagline: "DVD üzerinden özel her gün otomatik tarama",
    intro: "GİB Dijital Vergi Dairesi (DVD) oturum tokenini IP'ye bağlar. Bulut sağlayıcılarının değişken IP'leri reddediliyor — bu yüzden Türkiye'de özel bir altyapımız'imiz var (Türkiye). Tüm mükelleflerinizin e-tebligat kutusu her gün otomatik, istediğinizde manuel taranır. Yeni tebligat varsa PDF'i alınır, panele düşer.",
    accent: "#3558d4",
    Mock: () => <MockTebligat />,
    steps: [
      { t: "Tek HTTP çağrı — tek sorgu", d: "altyapımız API'i tek seferde login + e-tebligat + vergi borcu çeker. Aynı oturum, aynı IP, aynı token." },
      { t: "Mükellef şifresi decrypt", d: "sistemden şifreli mükellef parolası okunur, güvenlik anahtarı ile decrypt edilir, GİB'e gönderilir." },
      { t: "CAPTCHA", d: "DVD'nin CAPTCHA'sı yapay zekâ ile çözülür. Login token alınır. Her mükellef arası 1-2sn rate limit korunur." },
      { t: "Tebligat PDF'i indirilir", d: "Yeni tebligat tespit edilirse PDF güvenli format olarak altyapımızdan sunucumuz'a iletilir, sunucumuz arşive yükler. altyapımız diske yazmaz — gizlilik korumalı." },
      { t: "Bildirim + arşiv", d: "Yeni tebligat geldiyse müşaviri bilgilendirmek için ntfy + WhatsApp mesajı gider, tebligatlar tablosunda kayıt altına alınır." },
    ],
    features: [
      "her gün otomatik (arka plan otomasyonu) + istediğin an manuel sorgu",
      "Türkiye özel altyapımız — GİB reddetmez",
      "Tebligat PDF'leri arşivde güvenle saklanır",
      "oturum hataları çözüldü",
      "Mükellef bazlı bireysel veya toplu tarama",
      "Açılmamış tebligat 5 günü aşıyorsa kritik uyarı",
    ],
    cta: "E-Tebligat sorgu hizmetimizi denemek için iletişime geçin",
  },

  "vergi-borcu-sorgu": {
    title: "Vergi Borcu Sorgu",
    tagline: "Tüm mükelleflerin güncel vergi borcu — anlık panelde",
    intro: "E-Tebligat sorgusu ile aynı oturumda, aynı altyapımız üzerinden mükelleflerin vergi borcu detayları çekilir. Vadesi geçmiş, vadesinde ve borçsuz mükellefler ayrı renklerde gruplandırılır. Müşterinizi aradığınızda hangi borç var, ne zaman vade, anında söyleyebilirsiniz.",
    accent: "#0ba5ec",
    Mock: () => <MockVergi />,
    steps: [
      { t: "DVD login (özel altyapımız)", d: "Aynı oturum tek HTTP çağrısıyla — login + borç + tebligat birlikte çekilir. Her mükellef için sadece 1 GİB isteği." },
      { t: "Borç detayı kalem kalem", d: "KDV, MUHSGK, ÖTV, gelir vergisi — hepsi ayrı kalem olarak çekilir. Vade tarihleri, gecikme zammı dahil." },
      { t: "veritabanımız kaydı (zaman damgalı)", d: "Her sorgu zaman damgalı kaydedilir — tarihsel borç trendlerini grafiğe çevirebilirsiniz." },
      { t: "Renkli durum gruplandırma", d: "Vadesi geçmiş (kırmızı), vadesinde (mavi), borçsuz (yeşil) — panelde tek bakışta hangi mükellefe odaklanmanız gerektiğini görürsünüz." },
      { t: "WhatsApp ile mükellefe bildirim", d: "Vadesi yaklaşan borçlar için tek tıkla mükellefe WhatsApp mesajı gönderebilir, ödeme hatırlatabilirsiniz." },
    ],
    features: [
      "her gün otomatik + tek tıkla manuel sorgu",
      "Vergi türü bazlı detay (KDV, MUHSGK, ÖTV, gelir vergisi)",
      "Tarihsel borç değişimi grafiği",
      "Vade öncesi hatırlatma (7 / 3 / 1 gün)",
      "Toplu borç raporu Excel/PDF ihracı",
      "Tahsilat takibi — ödendi/ödenmedi durumu",
    ],
    cta: "Mükellef borç takibinizi otomatikleştirin",
  },

  "sgk-vizite": {
    title: "SGK Vizite",
    tagline: "SGK Vizite Web Servisi — SOAP entegrasyonu",
    intro: "SGK Vizite Web Servisi'ne doğrudan SOAP üzerinden bağlanıyoruz — tarayıcıyı açıp el ile rapor sorgulamak yok. Personel raporlarını listele, onayla veya iptal et — hepsi panelden. İstirahat, iş kazası ve hastalık raporları aynı yerde.",
    accent: "#f59e0b",
    Mock: () => <MockSgk />,
    steps: [
      { t: "İşveren kodu + SGK web servis kullanıcısı", d: "İşveren bilgileri ayarlardan kaydedilir, SGK Vizite Web Servisi kullanıcı bilgileri encrypt'le saklanır." },
      { t: "Toplu personel sorgusu", d: "Aktif personel listesi SGK'dan çekilir, her birinin son 30 gün rapor durumu tek seferde gelir." },
      { t: "Onay / iptal — tek tıkla", d: "Onay bekleyen raporları onaylayabilir, hatalı bir rapor varsa iptal işlemini gerçekleştirebilirsiniz." },
      { t: "Bordro entegrasyonu (yakında)", d: "Onaylanmış raporlar bordro modülüne aktarılır, eksik gün hesaplaması otomatik yapılır." },
    ],
    features: [
      "SGK Web Servisi — direkt SGK bağlantısı",
      "Personel raporu sorgu / onay / iptal",
      "İstirahat, iş kazası, meslek hastalığı türleri",
      "Tarih aralığı filtreleme",
      "Eksik gün otomatik hesaplama (yakında)",
      "Geçmiş 12 ay arşivi",
    ],
    cta: "SGK rapor yönetimini panelimizden yapın",
  },

  "karsit-inceleme": {
    title: "Karşıt İnceleme Tarayıcı",
    tagline: "DVD'de talep var mı saatlik kontrol — gelirse SMS",
    intro: "Vergi Denetim Kurulu (VDK) ya da bağlı vergi dairesi, mükellef adına karşıt inceleme talebi gönderdiğinde — DVD bildirim kutusuna düşer. Eskiden bunu siz mi takip ediyordunuz? Artık her saat başı otomatik taranır, talep tespit edildiği anda WhatsApp ve SMS ile haberiniz olur.",
    accent: "#6d59ff",
    Mock: () => <MockKarsi />,
    steps: [
      { t: "Saatlik DVD bildirim taraması", d: "arka plan otomasyonu job her saat başı tüm mükelleflerin DVD bildirim kutusunu kontrol eder. Yeni mesaj/talep varsa metni parse eder." },
      { t: "Karşıt inceleme talebi kalıbı", d: "Talep mesajı belirli bir kalıba uyar (Vergi Dairesi, dönem, VDK kodu). Bu kalıp tespit edilirse 'yeni talep' olarak işaretlenir." },
      { t: "Anında bildirim", d: "Talep tespit edildiğinde anlık bildirim + mükellefe veya size WhatsApp mesajı gider. Hangi mükellefte hangi dönem için talep geldi netçe yazar." },
      { t: "Geçmiş kayıt", d: "Tüm karşıt inceleme talepleri tarihçe ile kayıt altında. Hangi dönem hangi mükellefte ne zaman geldi, tamamlandı mı — denetim hazırlığı için kritik." },
    ],
    features: [
      "Saatlik otomatik DVD bildirim taraması",
      "Talep tespitinde anında WhatsApp + SMS",
      "Geçmiş 24 ay arşivi",
      "Mükellef bazlı geçmiş talepleri görüntüleme",
      "Excel ihracı (denetim raporları için)",
      "Müşaviriniz tatildeyken bile arkadan çalışmaya devam",
    ],
    cta: "Karşıt inceleme talebini hiç kaçırmayın",
  },

  "mukellef-yonetimi": {
    title: "Mükellef Yönetimi",
    tagline: "Tüm mükellef dosyaları, atamalar ve roller tek panelde",
    intro: "Mükellef yönetimi ofisinizin merkezi — VKN, ad, vergi dairesi, sektör, telefon, e-posta, sözleşme tarihi. Her mükellef bir veya birden fazla kullanıcıya atanır (mükellefe atanmış müşavir). Personel sadece kendi mükelleflerini görür, super admin hepsini.",
    accent: "#22c55e",
    Mock: () => <MockMukellef />,
    steps: [
      { t: "Zirve veya Luca'dan içe aktarım", d: "Zirve veritabanı tarayıcısı veya Luca XML aktarımı — tüm mükellef listesi VKN bazında 2 dakikada panele yüklenir." },
      { t: "Detaylı kayıt", d: "VKN, MERSIS no, vergi dairesi, sektör, mükellef tipi (şahıs/Ltd/AŞ), SGK işyeri kodu, KDV beyan dönemi, telefon — hepsi tek formda." },
      { t: "Kullanıcıya atama", d: "Her mükellef bir veya birden fazla kullanıcıya atanır. Yetki rolleri: super admin / admin / uzman / personel — her birinin görme/yazma yetkisi farklı." },
      { t: "Sözleşme + faturalandırma", d: "Mükellef sözleşmesi panelde tutulur, aylık ücretlendirme takvimi bir sonraki sürümde gelecek." },
      { t: "Silme onayı", d: "Personel bir mükellefi silmek isterse silme talebi oluşur — admin onayı gerekir. Veri güvenliği için temel kontrol." },
    ],
    features: [
      "Zirve / Luca tek tıkla içe aktarım",
      "Rol bazlı yetki: super admin / admin / uzman / personel",
      "Mükellefe atanmış müşavir sistemi",
      "Detaylı mükellef formu (12+ alan)",
      "Sözleşme & faturalandırma takibi",
      "Silme onayı akışı (denetim için)",
    ],
    cta: "Mükellef ofisinizi tek panelden yönetin",
  },

  /* ────── Üretim & Otomasyon Modülleri ────── */

  "al-ai-fatura": {
    title: "AL · AI Fatura Parse",
    tagline: "WhatsApp'a düşen mesaj 3 saniyede e-Fatura taslağı",
    intro: "Mükellef WhatsApp'tan fatura kesilmesini istiyor mu? Mesajı, fotoğrafı veya PDF'i AL'a gönderin. yapay zekâ Türkçe LLM ile kalemleri, KDV oranlarını ve hesap kodlarını otomatik çıkarır. Siz yalnızca onaylar, e-Arşiv ya da Mikro ePortal üzerinden tek tıkla kesime gönderirsiniz.",
    accent: "#ed7c3a",
    Mock: () => <MockAl />,
    steps: [
      { t: "WhatsApp / fotoğraf / PDF girdisi", d: "Mükellef herhangi bir formatta gönderiyor — el yazısı, mesaj, fatura fotoğrafı, kasa fişi resmi, PDF — hepsi kabul." },
      { t: "yapay zekâ Türkçe parse", d: "yapay zekâ modeli görseli/metni okur, kalem isimlerini, adetleri, fiyatları, KDV oranını çıkarır. Ortalama 2.6 sn." },
      { t: "Hesap kodu eşleştirme", d: "Mükellefin sektörüne ve geçmiş kayıtlarına bakarak doğru hesap kodu önerilir (153, 760, 770 vb.). Onaylanır veya değiştirilir." },
      { t: "Taslak inceleme", d: "Tüm kalemler, KDV oranları, toplam tutar — düzenlenebilir taslak şeklinde gelir. Hata varsa hemen müdahale." },
      { t: "Tek tıkla kes", d: "Mükellef sistemine göre e-Arşiv Portal, Mikro ePortal veya Zirve'ye fatura otomatik yönlendirilir, kesim yapılır." },
    ],
    features: [
      "WhatsApp mesaj / fotoğraf / PDF / kasa fişi destekli",
      "yapay zekâ 2.0 Flash Türkçe LLM",
      "%98+ doğruluk oranı, ortalama 2.6 sn",
      "KDV %1/%10/%20 + ÖTV otomatik tanıma",
      "Hesap kodu önerisi (sektör + geçmiş bazlı)",
      "Düzenlenebilir taslak — siz onaylamadan kesilmez",
    ],
    cta: "AL ile fatura kesmeyi 14 gün ücretsiz deneyin",
  },

  "e-arsiv-fatura": {
    title: "e-Arşiv Fatura Kesme",
    tagline: "GİB e-Arşiv Portal entegrasyonu — panelden çıkmadan",
    intro: "GİB e-Arşiv Portal'a (earsivportal.efatura.gov.tr) doğrudan bağlanıyoruz. Fatura kesmek için ayrı sekme açmak yok — OfisimNet panelinden alıcı seçin, kalemleri ekleyin, tek tıkla kesim. AL ile entegre çalışır: WhatsApp'tan gelen mesajı taslağa çevir, onayla, kes.",
    accent: "#1e3a8a",
    Mock: () => <MockEarsiv />,
    steps: [
      { t: "GİB e-Arşiv giriş bilgileri", d: "GİB e-Arşiv kullanıcı bilgileriniz şifreli olarak sistemde tutulur. sunucu tarafı /api/earsiv/* API'i üzerinden proxylenir." },
      { t: "Mükellef + kalem", d: "Alıcı listesi, ürün/hizmet kalemleri, KDV oranları seçilir veya AL taslağından doğrudan gelir." },
      { t: "GİB'e gönderim", d: "sistem fatura XML'ini hazırlar, GİB e-Arşiv API'sine gönderir, ETTN alır. Birkaç saniyede onay döner." },
      { t: "PDF + bulut", d: "GİB'den dönen fatura PDF'i güvenli bulut depolama'ye yüklenir, mükellefe e-posta ile gönderilebilir." },
      { t: "fatura kaydı", d: "Tüm faturalar sistemde kayıt altında — fatura no, alıcı, tutar, KDV, durum, ETTN bilgisi." },
    ],
    features: [
      "GİB e-Arşiv Portal direkt entegrasyon (sunucumuz proxy)",
      "AL ile entegre — WhatsApp → fatura tek akışta",
      "Toplu fatura oluşturma",
      "PDF arşivi arşivde 7 yıl",
      "Fatura iptal / itiraz işlemleri",
      "Excel export · KDV beyanına hazır",
    ],
    cta: "e-Arşiv faturalarınızı OfisimNet'ten kesin",
  },

  "mikro-eportal": {
    title: "Çoklu Portal · Mikro ePortal",
    tagline: "GİB, Mikro, Zirve — akıllı yönlendirme tek tıkla",
    intro: "Her mükellef aynı sistemi kullanmıyor — bazısı GİB e-Arşiv, bazısı Mikro ePortal, bazısı Zirve. OfisimNet mükellefin sistemini biliyor, fatura kesilirken otomatik doğru portala yönlendirir. Üç portalı tek panelden yönetin.",
    accent: "#0ba5ec",
    Mock: () => <MockMikro />,
    steps: [
      { t: "Mükellef tarafında sistem işareti", d: "Her mükellef için 'fatura sistemi' alanı: GİB e-Arşiv / Mikro ePortal / Zirve. Bir kere ayarlanır, sonra otomatik çalışır." },
      { t: "Mikro ePortal API entegrasyonu", d: "Mikro'nun eportal.mikro.com.tr API'sine sunucumuz üzerinden bağlanır. Login, fatura kesme, sorgu hepsi panelden." },
      { t: "Birleşik fatura API/kes", d: "Tek bir API — mükellef sistemine göre arka planda doğru portala yönlendirilir. Frontend ayrım yok." },
      { t: "Tüm faturalar tek listede", d: "GİB, Mikro, Zirve — hangi portaldan kesilse hepsi 'Fatura Geçmişi' ekranında, ortak filtre + arama." },
    ],
    features: [
      "GİB e-Arşiv + Mikro ePortal + Zirve",
      "Mükellef bazlı akıllı yönlendirme",
      "Tek API · tek arayüz — portal farkı şeffaf",
      "AL ile entegre kesim",
      "Birleşik geçmiş / arama / filtre",
      "Portal başına bağlantı durumu izleme",
    ],
    cta: "Tüm portallarınızı OfisimNet'te birleştirin",
  },

  "zirve-aktarim": {
    title: "Zirve / Luca İçe Aktarım",
    tagline: "Mevcut mükellef listenizi 2 dakikada panele yükleyin",
    intro: "Zaten Zirve veya Luca kullanıyor musunuz? Mükellef listenizi sıfırdan yazmaya gerek yok. Zirve veritabanı tarayıcısı veya Luca XML aktarımı ile tüm mükellefleriniz VKN bazında eşleştirilerek toplu içe alınır. Mevcut kayıtlar güncellenir, yeniler eklenir.",
    accent: "#0ba5ec",
    Mock: () => <MockZirve />,
    steps: [
      { t: "Aktarım yöntemi seçin", d: "Zirve veritabanı tarayıcısı (PC üzerinde çalışır) veya Luca'dan export edilmiş XML dosyası — ikisi de destekli." },
      { t: "Zirve veritabanı tarama", d: "içe aktarım aracımız scripti Zirve'nin yerel veritabanını tarar, tüm mükellef kayıtlarını JSON olarak çıkarır." },
      { t: "VKN eşleştirme", d: "Sistem mevcut mükelleflerinizi VKN üzerinden eşleştirir. Yeni mi? Mevcut mu? Yanlış mı? Açık bir liste sunar." },
      { t: "Toplu kayıt", d: "Onayladığınız mükellefler tek seferde sisteme yazılır. içe aktarım aracımız çalışır." },
      { t: "Hatalar raporlanır", d: "Hatalı VKN, eksik vergi dairesi gibi sorunlar ayrı bir liste olarak gelir — düzeltirsiniz, tekrar denersiniz." },
    ],
    features: [
      "Zirve veritabanı tarayıcısı",
      "Luca XML aktarımı",
      "VKN bazlı akıllı eşleştirme",
      "Yeni / Mevcut / Hatalı ayrımı önizleme",
      "2 dakikada 200+ mükellef",
      "Geri alma (rollback) opsiyonu",
    ],
    cta: "Mevcut mükellef listenizi OfisimNet'e taşıyın",
  },

  "gorev-ekip": {
    title: "Görev & Ekip",
    tagline: "Kanban tarzı görev panosu — mükellefle bağlı",
    intro: "Mali müşavir ofisinde işler havada uçar — bir müşterinin KDV1'ini Ali yaptı mı? Sezer geçici vergiyi başlatmış mıydı? Bunu Excel'de izlemek zor. OfisimNet'te her görev mükellefe ve kullanıcıya bağlı, Kanban panosunda akar.",
    accent: "#3558d4",
    Mock: () => <MockGorev />,
    steps: [
      { t: "Görev oluşturma", d: "Mükellef seçin, görev adı yazın, atanan kişiyi belirleyin, son tarih + öncelik koyun. Mobil veya web fark etmez." },
      { t: "Kanban panosu", d: "4 sütun: Atanacak → Devam Ediyor → İnceleme → Tamamlandı. Drag&drop ile taşıyın." },
      { t: "Mükellef-Beyanname bağı", d: "Görev bir beyannameye bağlanırsa, beyanname durumu değiştikçe görev otomatik güncellenir." },
      { t: "Bildirim ve hatırlatma", d: "Son tarih yaklaşan görevler için push + e-posta + WhatsApp uyarısı." },
    ],
    features: [
      "Kanban görev panosu (4 sütun)",
      "Mükellef + kullanıcı atama",
      "Öncelik (yüksek/orta/düşük)",
      "Son tarih + hatırlatma",
      "Beyanname ile otomatik bağ",
      "Filtre: kullanıcı, mükellef, tarih, durum",
    ],
    cta: "Ekibinizi tek panoda toplayın",
  },

  "whatsapp-tahakkuk": {
    title: "WhatsApp Tahakkuk",
    tagline: "Tahakkuk mesajı ve PDF tek tıkla mükellefe",
    intro: "Beyanname tahakkuk etti — şimdi mükellefe haber verme zamanı. PDF'i indir, telefonu aç, WhatsApp'a yapıştır, gönder — 5 mükellef için 10 dakika. OfisimNet'te tek tıkla. Şablon mesaj + tahakkuk PDF'i otomatik eklenir.",
    accent: "#16a34a",
    Mock: () => <MockWhatsapp />,
    steps: [
      { t: "Şablon mesaj", d: "Profesyonel tahakkuk mesajınızı bir kere yazın. Mükellef adı, beyanname türü, dönem, tutar, vade — hepsi parametrik." },
      { t: "Mükellef listesi", d: "Bu dönem tahakkuk eden tüm beyannameler otomatik listelenir. Kimi göndereceğinizi checkbox ile seçin." },
      { t: "PDF eklenir", d: "Her mükellefin kendi tahakkuk PDF'i otomatik mesaja eklenir. arşivden çekilir." },
      { t: "WhatsApp", d: "sistem üzerinden WhatsApp masaüstü veya web açılır, mesaj hazır gelir. Send'e basarsınız." },
      { t: "WhatsApp logları", d: "Hangi mükellefe ne zaman ne mesaj gittiğinin kaydı tutulur. Sorulduğunda gösterilebilir." },
    ],
    features: [
      "Parametrik şablon mesaj",
      "Otomatik PDF ekleme",
      "Toplu seçim + tek tıkla gönder",
      "WhatsApp bağlantısı (WhatsApp Web/Native)",
      "Gönderim logları",
      "Mükellef telefonu otomatik çekilir",
    ],
    cta: "WhatsApp tahakkuklarınızı hızlandırın",
  },

  "realtime-kontrol": {
    title: "Realtime Kontrol",
    tagline: "Toplu işlem ilerleyişi — canlı, anlık, görünür",
    intro: "127 mükellefin beyannamesini topluca kontrol ediyorsanız, ne kadar süreceğini ve nerede takılı kaldığını görmek istersiniz. OfisimNet gerçek zamanlı bağlantı üzerinden anlık ilerleyişi panele yansıtır — her satır tamamlandıkça progress + log akar.",
    accent: "#6d59ff",
    Mock: () => <MockRealtime />,
    steps: [
      { t: "Toplu kontrol başlat", d: "Beyannameler ekranından 'Toplu Kontrol' butonu — dönem + mükellef filtresi seçilir." },
      { t: "sistem otomasyonu tetiklenir", d: "Backend cron job çalışır, her mükellef için ayrı işlem başlatılır. Adaptive backoff + retry ile GİB rate limit korunur." },
      { t: "gerçek zamanlı bağlantı", d: "sistem kayıtlarına yazılan her satır anında panele yansır. WebSocket bağlantısı kopmaz." },
      { t: "Progress bar + log akışı", d: "Yüzde ilerleme, her mükellefin durumu, hata mesajları — saniye saniye canlı." },
      { t: "Hata yönetimi", d: "Bir mükellef hata verirse diğerleri etkilenmez, hatalılar ayrı listede gösterilir, tek tıkla yeniden denenebilir." },
    ],
    features: [
      "gerçek zamanlı bağlantı tabanlı",
      "Anlık progress bar",
      "Mükellef bazlı durum görünümü",
      "Canlı log akışı (timestamps)",
      "Hata ayıklama: hatalıları izole et",
      "Tek tıkla yeniden dene",
    ],
    cta: "Toplu kontrolü canlı izleyin",
  },

  "arsiv-raporlar": {
    title: "Arşiv & Raporlar",
    tagline: "Geçmiş dönem beyannameleri — 7 yıl güvenle saklanır",
    intro: "Yasa beyanname PDF'lerini 7 yıl saklamayı şart koşar. OfisimNet tüm geçmiş PDF'leri güvenli bulut depolama'de tutar — günlük yedek, KVKK uyumlu, Türkiye'den erişim için sunucumuz proxy ile (r2.dev Türkiye'de engelli, biz çözmüşüz).",
    accent: "#f59e0b",
    Mock: () => <MockArsiv />,
    steps: [
      { t: "PDF güvenli bulut depolama'ye yüklenir", d: "Her beyanname kontrolünde indirilen PDF doğrudan arşive upload edilir. 30sn timeout, retry ile güvenli." },
      { t: "TR uyumlu görüntüleme", d: "bulut'nin r2.dev subdomain'i Türkiye'de engelli — bu yüzden sunucumuz'da /pdf/* proxy API'i var. Sorunsuz görüntüleme." },
      { t: "Filtre + arama", d: "Dönem, mükellef, beyanname türü, tahakkuk durumu — istediğiniz kombinasyonla geçmişi tarayın." },
      { t: "Excel / PDF ihrac", d: "Filtrelenmiş liste tek tıkla Excel veya PDF olarak indirilir — denetim hazırlığı için kritik." },
      { t: "7 yıl saklama + günlük yedek", d: "sürüm geçmişi tutulur, günlük yedek, KVKK ve VERBİS uyumlu veri saklama politikası." },
    ],
    features: [
      "güvenli bulut depolama — sınırsız depolama",
      "7 yıl yasal saklama",
      "Günlük otomatik yedek",
      "TR uyumlu görüntüleme (TR erişim)",
      "Excel / PDF ihrac",
      "Detaylı filtre + arama",
    ],
    cta: "Arşivinizi güvenle bulutta tutun",
  },
};

/* ─────────── Page chrome (promo + nav + footer) ─────────── */
function PromoBar() {
  return (
    <div className="promo-bar">
      <div className="container-kolaybi" style={{ display: "flex", justifyContent: "space-between", alignItems: "center", padding: "8px 24px", gap: 12, flexWrap: "wrap" }}>
        <div style={{ display: "flex", alignItems: "center", gap: 8 }}>
          <span style={{ color: "#fcd34d" }}>✦</span>
          <span><strong>AL · Yapay Zekâ</strong> — WhatsApp'tan gelen faturayı 3 saniyede e-Faturaya çevir. <a href="/#al" style={{ textDecoration: "underline" }}>Demoyu izle →</a></span>
        </div>
        <div style={{ display: "flex", alignItems: "center", gap: 16, opacity: .9 }}>
          <a href="tel:+905325600346" style={{ color: "#fff", display: "inline-flex", alignItems: "center", gap: 6 }}>☎ 0532 560 03 46</a>
          <a href="mailto:iletisim@ofisimnet.com" style={{ color: "#fff", display: "inline-flex", alignItems: "center", gap: 6 }}>✉ iletisim@ofisimnet.com</a>
        </div>
      </div>
    </div>
  );
}

function Navbar({ activeKey }) {
  return (
    <header style={{ position: "sticky", top: 0, zIndex: 100, background: "rgba(255,255,255,.92)", backdropFilter: "saturate(180%) blur(8px)", borderBottom: "1px solid var(--border-light)" }}>
      <div className="container-kolaybi" style={{ display: "flex", height: 56, alignItems: "center", justifyContent: "space-between", gap: 16 }}>
        <a href="/" style={{ display: "flex", alignItems: "center" }}>
          <img src="assets/logo.png" alt="OfisimNet" style={{ height: 30 }} />
        </a>
        <nav style={{ display: "flex", alignItems: "center", gap: 2 }} className="navnav">
          <a className="nav-link" href="/">Anasayfa</a>
          <a className="nav-link active" href="#">Takip Modülleri</a>
          <a className="nav-link" href="Fiyatlar.html">Fiyatlar</a>
          <a className="nav-link" href="Hakkimizda.html">Hakkımızda</a>
          <a className="nav-link" href="SSS.html">SSS</a>
          <a className="nav-link" href="Iletisim.html">İletişim</a>
        </nav>
        <div style={{ display: "flex", gap: 8 }}>
          <a href="/login" className="nav-link">Giriş</a>
          <a href="/kayit" className="kb-btn-primary" style={{ height: 34, padding: "0 14px" }}>14 gün ücretsiz dene →</a>
        </div>
      </div>
      <style>{`
        @media (max-width: 1100px) { .navnav { display: none !important; } }
      `}</style>
    </header>
  );
}

function Footer() {
  return (
    <footer style={{ background: "var(--brand-900)", color: "#fff", padding: "32px 0", marginTop: 60 }}>
      <div className="container-kolaybi" style={{ display: "flex", justifyContent: "space-between", flexWrap: "wrap", gap: 20, alignItems: "center" }}>
        <div style={{ fontSize: 13, opacity: .8 }}>© {new Date().getFullYear()} OfisimNet — Mali Müşavirin Yardımcı Asistanı</div>
        <div style={{ display: "flex", gap: 20, fontSize: 13 }}>
          <a href="tel:+905325600346" style={{ color: "rgba(255,255,255,.85)" }}>☎ 0532 560 03 46</a>
          <a href="mailto:iletisim@ofisimnet.com" style={{ color: "rgba(255,255,255,.85)" }}>✉ iletisim@ofisimnet.com</a>
          <a href="/" style={{ color: "rgba(255,255,255,.85)" }}>← Anasayfaya dön</a>
        </div>
      </div>
    </footer>
  );
}

/* ─────────── Module page ─────────── */
function ModulePage({ moduleKey, onChangeModule }) {
  const m = MODULES[moduleKey];
  if (!m) return <div style={{ padding: 80, textAlign: "center" }}>Modül bulunamadı</div>;

  return (
    <div>
      {/* Hero */}
      <section style={{ background: `linear-gradient(180deg, color-mix(in oklch, ${m.accent} 8%, white), white 70%)`, position: "relative", overflow: "hidden" }}>
        <div className="container-kolaybi" style={{ paddingTop: 56, paddingBottom: 40, position: "relative" }}>
          {/* breadcrumb */}
          <div style={{ display: "flex", alignItems: "center", gap: 8, fontSize: 12, color: "var(--text-muted)", marginBottom: 18 }}>
            <a href="/" style={{ color: "var(--text-muted)" }}>Anasayfa</a>
            <span>/</span>
            <span style={{ color: "var(--brand-500)" }}>Takip Modülleri</span>
            <span>/</span>
            <span style={{ color: "var(--brand-700)", fontWeight: 700 }}>{m.title}</span>
          </div>

          <div style={{ display: "grid", gridTemplateColumns: "1fr", gap: 36, alignItems: "center" }} className="hero-grid">
            <div style={{ maxWidth: 760 }}>
              <span className="section-eyebrow" style={{ background: `color-mix(in oklch, ${m.accent} 12%, white)`, color: m.accent }}>Takip Modülü</span>
              <h1 className="h-section" style={{ marginTop: 16, fontSize: 56, lineHeight: 1.05, letterSpacing: "-2px" }}>
                {m.title.split(" ").slice(0, -1).join(" ")} <span className="ink-bar"><span style={{ color: m.accent }}>{m.title.split(" ").slice(-1)[0]}</span></span>
              </h1>
              <p style={{ marginTop: 16, fontSize: 20, fontWeight: 600, color: m.accent, lineHeight: 1.4 }}>{m.tagline}</p>
              <p className="body-lg" style={{ marginTop: 14, color: "var(--text-body)" }}>{m.intro}</p>
              <div style={{ marginTop: 24, display: "flex", flexWrap: "wrap", gap: 12 }}>
                <a href="https://ofisimnet.com/kayit" className="kb-btn-primary" style={{ background: m.accent }}>14 gün ücretsiz dene →</a>
                <a href="#mock" className="kb-btn-secondary">Ekran görünümü ↓</a>
              </div>
            </div>
          </div>
        </div>
      </section>

      {/* Mockup */}
      <section id="mock" style={{ padding: "40px 0 64px", background: "#fff" }}>
        <div className="container-kolaybi">
          <div style={{ maxWidth: 1120, margin: "0 auto" }}>
            <m.Mock />
            <p style={{ marginTop: 16, fontSize: 12, color: "var(--text-muted)", textAlign: "center" }}>
              Ekran görüntüsü — mükellef bilgileri örnek amaçlıdır.
            </p>
          </div>
        </div>
      </section>

      {/* Steps + Features */}
      <section style={{ padding: "64px 0", background: "var(--bg-muted)" }}>
        <div className="container-kolaybi">
          <div className="steps-grid" style={{ display: "grid", gridTemplateColumns: "1fr 1fr", gap: 56 }}>

          {/* Steps */}
          <div>
            <span className="section-eyebrow" style={{ background: `color-mix(in oklch, ${m.accent} 12%, white)`, color: m.accent }}>Nasıl Çalışır</span>
            <h2 style={{ fontSize: 30, fontWeight: 800, marginTop: 14, letterSpacing: "-1px", color: "var(--brand-700)" }}>Arka planda neler oluyor?</h2>
            <div style={{ marginTop: 24, display: "flex", flexDirection: "column", gap: 14 }}>
              {m.steps.map((s, i) => (
                <div key={i} className="card-pop" style={{ padding: 16, display: "flex", gap: 14 }}>
                  <div className="step-num" style={{ background: m.accent, flexShrink: 0 }}>{i + 1}</div>
                  <div>
                    <div style={{ fontSize: 15, fontWeight: 700, color: "var(--brand-700)" }}>{s.t}</div>
                    <div style={{ marginTop: 4, fontSize: 13.5, lineHeight: "20px", color: "var(--text-muted)" }}>{s.d}</div>
                  </div>
                </div>
              ))}
            </div>
          </div>

          {/* Features */}
          <div>
            <span className="section-eyebrow" style={{ background: `color-mix(in oklch, ${m.accent} 12%, white)`, color: m.accent }}>Özellikler</span>
            <h2 style={{ fontSize: 30, fontWeight: 800, marginTop: 14, letterSpacing: "-1px", color: "var(--brand-700)" }}>Neler dahil?</h2>
            <ul style={{ marginTop: 24, listStyle: "none", padding: 0, display: "flex", flexDirection: "column", gap: 12 }}>
              {m.features.map((f, i) => (
                <li key={i} style={{ display: "flex", gap: 12, alignItems: "flex-start" }}>
                  <span style={{ flexShrink: 0, width: 24, height: 24, borderRadius: 999, background: `color-mix(in oklch, ${m.accent} 12%, white)`, color: m.accent, display: "inline-flex", alignItems: "center", justifyContent: "center", marginTop: 2 }}>
                    <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="3" strokeLinecap="round" strokeLinejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
                  </span>
                  <span style={{ fontSize: 14.5, lineHeight: "22px", color: "var(--text-body)" }}>{f}</span>
                </li>
              ))}
            </ul>
          </div>
          </div>
        </div>
        <style>{`
          @media (max-width: 900px) {
            .steps-grid { grid-template-columns: 1fr !important; gap: 36px !important; }
          }
        `}</style>
      </section>

      {/* CTA + Other Modules */}
      <section style={{ padding: "64px 0", background: "#fff" }}>
        <div className="container-kolaybi">
          <div style={{ background: `linear-gradient(135deg, ${m.accent}, color-mix(in oklch, ${m.accent} 60%, black))`, color: "#fff", padding: "44px 32px", borderRadius: 18, textAlign: "center" }}>
            <h2 style={{ color: "#fff", fontSize: 32, fontWeight: 800, letterSpacing: "-1px", maxWidth: 640, margin: "0 auto" }}>
              {m.cta}
            </h2>
            <p style={{ marginTop: 12, opacity: .9, fontSize: 16 }}>
              Kredi kartı sorulmaz · 150 mükellefe kadar tek lisans
            </p>
            <div style={{ marginTop: 22, display: "inline-flex", gap: 12, flexWrap: "wrap", justifyContent: "center" }}>
              <a href="https://ofisimnet.com/kayit" style={{ padding: "14px 24px", borderRadius: 10, background: "#fff", color: m.accent, fontWeight: 700, fontSize: 15 }}>14 gün ücretsiz dene →</a>
              <a href="mailto:satis@ofisimnet.com" style={{ padding: "14px 24px", borderRadius: 10, border: "1px solid rgba(255,255,255,.3)", color: "#fff", fontSize: 15, fontWeight: 600 }}>Bilgi al</a>
            </div>
          </div>

          <div style={{ marginTop: 56 }}>
            <h3 style={{ fontSize: 20, fontWeight: 800, color: "var(--brand-700)", marginBottom: 18 }}>Diğer Takip Modülleri</h3>
            <div style={{ display: "grid", gridTemplateColumns: "repeat(3, 1fr)", gap: 14 }} className="other-grid">
              {Object.entries(MODULES).filter(([k]) => k !== moduleKey).map(([k, om]) => (
                <a
                  key={k}
                  href={`#${k}`}
                  onClick={(e) => { e.preventDefault(); onChangeModule(k); window.scrollTo({ top: 0, behavior: "smooth" }); }}
                  className="module-card"
                >
                  <span style={{ width: 36, height: 36, borderRadius: 8, background: om.accent, color: "#fff", display: "inline-flex", alignItems: "center", justifyContent: "center", fontWeight: 800, fontSize: 13 }}>{om.title[0]}</span>
                  <div style={{ fontSize: 14.5, fontWeight: 700, color: "var(--brand-700)" }}>{om.title}</div>
                  <div style={{ fontSize: 12, color: "var(--text-muted)", lineHeight: 1.4 }}>{om.tagline}</div>
                </a>
              ))}
            </div>
          </div>
        </div>
        <style>{`
          @media (max-width: 800px) { .other-grid { grid-template-columns: 1fr 1fr !important; } }
          @media (max-width: 520px) { .other-grid { grid-template-columns: 1fr !important; } }
        `}</style>
      </section>
    </div>
  );
}

/* ─────────── Router ─────────── */
function App() {
  const getKey = () => {
    const h = window.location.hash.replace(/^#/, "");
    return MODULES[h] ? h : "beyanname-takibi";
  };
  const [moduleKey, setModuleKey] = React.useState(getKey);

  React.useEffect(() => {
    const onHash = () => setModuleKey(getKey());
    window.addEventListener("hashchange", onHash);
    return () => window.removeEventListener("hashchange", onHash);
  }, []);

  const changeModule = (k) => {
    window.history.pushState(null, "", `#${k}`);
    setModuleKey(k);
  };

  return (
    <>
      <PromoBar />
      <Navbar activeKey={moduleKey} />
      <main>
        <ModulePage moduleKey={moduleKey} onChangeModule={changeModule} />
      </main>
      <Footer />
    </>
  );
}

ReactDOM.createRoot(document.getElementById("root")).render(<App />);