import type { Metadata } from "next";
import Link from "next/link";
import {
  Building2,
  Cpu,
  Factory,
  LineChart,
  Package,
  ShoppingCart,
  UtensilsCrossed,
  Warehouse,
  Zap,
  Home as HomeIcon,
} from "lucide-react";
import {
  Accordion,
  AccordionContent,
  AccordionItem,
  AccordionTrigger,
} from "@/components/ui/accordion";
import { Button } from "@/components/ui/button";
import { WhatsAppIcon, buildWhatsAppApiHref } from "@/components/shop/whatsapp-shared";
import { getServiceBySlug } from "@/lib/services-data";
import { DEFAULT_OG_IMAGE } from "@/lib/site-og-image";

const SITE_URL = (process.env.NEXT_PUBLIC_SITE_URL || "https://nizamify.com").replace(/\/$/, "");
const CANONICAL = "/services/custom-software-solutions";
const SERVICE = getServiceBySlug("custom-software-solutions")!;

export const metadata: Metadata = {
  title: "Custom Software Development Company in Rawalpindi & Islamabad",
  description:
    "Custom software & business automation company based in Rawalpindi & Islamabad. We build home, business, manufacturing & sales automation software — serving all of Pakistan.",
  alternates: { canonical: CANONICAL },
  keywords: [
    "custom software development company Rawalpindi",
    "custom software development company Islamabad",
    "business automation company Rawalpindi Islamabad",
    "software house Rawalpindi",
    "software house Islamabad",
    "custom software development Pakistan",
    "business automation software Pakistan",
    "manufacturing automation software Pakistan",
    "sales automation software Pakistan",
    "home automation software development",
    "process automation company Pakistan",
  ],
  openGraph: {
    title: "Custom Software Development Company in Rawalpindi & Islamabad | Nizamify",
    description:
      "Custom software & business automation company based in Rawalpindi & Islamabad, serving all of Pakistan — designed and built by Nizamify.",
    url: `${SITE_URL}${CANONICAL}`,
    type: "website",
    images: [{ url: DEFAULT_OG_IMAGE }],
  },
  twitter: {
    card: "summary_large_image",
    title: "Custom Software Development Company in Rawalpindi & Islamabad | Nizamify",
    description:
      "Custom software & business automation company based in Rawalpindi & Islamabad, serving all of Pakistan — designed and built by Nizamify.",
    images: [DEFAULT_OG_IMAGE],
  },
};

const AUTOMATIONS = [
  {
    icon: HomeIcon,
    title: "Home Automation Software",
    body: "Control apps and dashboards for smart plugs, switches, cameras, and sensors — scheduling, voice control, and energy monitoring in one place.",
  },
  {
    icon: Building2,
    title: "Business Process Automation",
    body: "Approval workflows, HR & attendance automation, document automation, and task assignment systems that cut manual admin work.",
  },
  {
    icon: Factory,
    title: "Manufacturing & Factory Automation",
    body: "Production line monitoring, IoT sensor integration, predictive maintenance alerts, and quality-control dashboards for factory floors.",
  },
  {
    icon: LineChart,
    title: "Sales & CRM Automation",
    body: "Lead tracking, automated quotations, WhatsApp order bots, and order-to-delivery workflows that keep your sales team moving faster.",
  },
  {
    icon: ShoppingCart,
    title: "Retail & POS Automation",
    body: "Point-of-sale systems with live inventory sync, barcode scanning, and stock-level automation for shops and showrooms.",
  },
  {
    icon: Warehouse,
    title: "Warehouse & Inventory Automation",
    body: "Stock alerts, automatic reorder triggers, and barcode/RFID tracking so you always know what's actually on the shelf.",
  },
  {
    icon: Zap,
    title: "Energy & Load-Shedding Automation",
    body: "Smart load management, automated generator/UPS switching, and energy-usage dashboards built for Pakistan's power realities.",
  },
  {
    icon: Package,
    title: "Office & Building Automation",
    body: "Access control, security monitoring, and automated lighting/HVAC schedules for offices and commercial buildings.",
  },
  {
    icon: UtensilsCrossed,
    title: "Hospitality & Restaurant Automation",
    body: "Order management, kitchen display systems, and table/reservation automation for restaurants and hospitality businesses.",
  },
  {
    icon: Cpu,
    title: "Custom Dashboards & Reporting",
    body: "Real-time business-intelligence dashboards built around the metrics that actually matter to your operation.",
  },
];

const PROCESS = [
  { step: "1. Discover", body: "We learn how your home, shop, or factory actually operates before proposing anything." },
  { step: "2. Design", body: "A clear scope and workflow design you can review and adjust before development starts." },
  { step: "3. Develop", body: "We build the software — and, where needed, integrate it with the hardware we install." },
  { step: "4. Deploy", body: "Rollout with training for your team, so the system gets used, not shelved." },
  { step: "5. Support", body: "Ongoing support after launch, reachable directly over WhatsApp." },
];

const FAQS = [
  {
    question: "How much does custom software cost in Pakistan?",
    answer:
      "It depends entirely on scope — a simple automation dashboard costs far less than a full manufacturing monitoring system. Share your requirement on WhatsApp and we'll give you a clear quote before any work starts.",
  },
  {
    question: "How long does a custom automation project take?",
    answer:
      "Small automations can ship in a few weeks; larger business or manufacturing systems typically take longer. We'll give you a realistic timeline during the discovery step, before development begins.",
  },
  {
    question: "Do you build both the hardware and the software?",
    answer:
      "Yes — Nizamify sells the smart devices (plugs, switches, sensors, cameras) and builds the software that controls and automates them, so you're not stuck coordinating between two separate vendors.",
  },
  {
    question: "Can you automate a factory, or only homes?",
    answer:
      "Both. Custom Software Solutions covers home automation as well as business, manufacturing, sales, retail, and office automation — whatever process you want to automate.",
  },
  {
    question: "Do you offer support after the software launches?",
    answer:
      "Yes, ongoing support is included as part of every project, reachable directly on WhatsApp — not a ticket queue.",
  },
  {
    question: "Are you based in Rawalpindi or Islamabad?",
    answer:
      "Yes — Nizamify is physically based in the twin cities of Rawalpindi and Islamabad. Local businesses can meet with us in person for discovery and demos; clients elsewhere in Pakistan are supported remotely over WhatsApp and video calls.",
  },
];

const faqSchema = {
  "@context": "https://schema.org",
  "@type": "FAQPage",
  mainEntity: FAQS.map((f) => ({
    "@type": "Question",
    name: f.question,
    acceptedAnswer: { "@type": "Answer", text: f.answer },
  })),
};

const serviceSchema = {
  "@context": "https://schema.org",
  "@type": "Service",
  name: SERVICE.name,
  description: SERVICE.shortDescription,
  url: `${SITE_URL}${CANONICAL}`,
  serviceType: "Custom Software Development",
  provider: { "@type": "Organization", name: "Nizamify", url: SITE_URL },
  areaServed: [
    { "@type": "City", name: "Rawalpindi" },
    { "@type": "City", name: "Islamabad" },
    { "@type": "Country", name: "Pakistan" },
  ],
};

const breadcrumbSchema = {
  "@context": "https://schema.org",
  "@type": "BreadcrumbList",
  itemListElement: [
    { "@type": "ListItem", position: 1, name: "Home", item: `${SITE_URL}/` },
    { "@type": "ListItem", position: 2, name: "Services", item: `${SITE_URL}/services` },
    { "@type": "ListItem", position: 3, name: SERVICE.name, item: `${SITE_URL}${CANONICAL}` },
  ],
};

export default function CustomSoftwareSolutionsPage() {
  return (
    <div className="bg-white">
      <script
        type="application/ld+json"
        dangerouslySetInnerHTML={{ __html: JSON.stringify(serviceSchema) }}
      />
      <script
        type="application/ld+json"
        dangerouslySetInnerHTML={{ __html: JSON.stringify(faqSchema) }}
      />
      <script
        type="application/ld+json"
        dangerouslySetInnerHTML={{ __html: JSON.stringify(breadcrumbSchema) }}
      />

      <section className="bg-slate-50 py-12 md:py-16">
        <div className="container max-w-4xl">
          <p className="text-sm text-slate-500">
            <Link href="/services" className="hover:text-primary hover:underline">
              Services
            </Link>{" "}
            / {SERVICE.name}
          </p>
          <h1 className="mt-3 text-3xl font-bold text-slate-900 md:text-4xl">
            Custom Software Development Company in Rawalpindi &amp; Islamabad
          </h1>
          <p className="mt-4 max-w-3xl text-sm leading-relaxed text-slate-600 md:text-base">
            Nizamify is a custom software development company based in the twin cities of{" "}
            <Link href="/smart-home-automation/rawalpindi" className="text-primary hover:underline">
              Rawalpindi
            </Link>{" "}
            and{" "}
            <Link href="/smart-home-automation/islamabad" className="text-primary hover:underline">
              Islamabad
            </Link>
            . We design and develop software for home and business process automation —
            manufacturing, sales, retail, and more — built specifically around how your operation
            actually works, not a generic template. Whether it's a control app for your smart
            devices or a monitoring dashboard for a factory floor, we build it locally, for
            clients across Pakistan.
          </p>
          <div className="mt-6">
            <Button
              asChild
              type="button"
              variant="outline"
              className="border-[#25D366] bg-white text-[#075E54] hover:bg-[#25D366]/10 hover:text-[#075E54]"
            >
              <a
                href={buildWhatsAppApiHref(
                  "Hi, I'd like a quote for a custom software / automation project.",
                )}
                target="_blank"
                rel="noopener noreferrer"
                aria-label="Contact Nizamify on WhatsApp about custom software"
              >
                <span className="mr-2 inline-flex size-6 items-center justify-center rounded-full bg-[#25D366] text-white">
                  <WhatsAppIcon className="size-4" />
                </span>
                Contact Us on WhatsApp
              </a>
            </Button>
          </div>
        </div>
      </section>

      <section className="container max-w-5xl py-12 md:py-16">
        <h2 className="text-2xl font-bold text-primary md:text-3xl">What We Automate</h2>
        <p className="mt-2 max-w-2xl text-sm text-slate-600">
          If a process repeats, it can probably be automated. Here's the range of automation
          software we build across Pakistan:
        </p>
        <div className="mt-8 grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
          {AUTOMATIONS.map(({ icon: Icon, title, body }) => (
            <div key={title} className="rounded-xl border border-slate-200 p-5">
              <div className="flex size-10 items-center justify-center rounded-full bg-primary/10">
                <Icon className="size-5 text-primary" strokeWidth={1.75} aria-hidden />
              </div>
              <h3 className="mt-3 font-bold text-slate-900">{title}</h3>
              <p className="mt-1 text-sm leading-relaxed text-slate-600">{body}</p>
            </div>
          ))}
        </div>
      </section>

      <section className="bg-slate-50 py-12 md:py-16">
        <div className="container max-w-5xl">
          <h2 className="text-2xl font-bold text-primary md:text-3xl">Our Process</h2>
          <div className="mt-8 grid gap-6 sm:grid-cols-2 lg:grid-cols-5">
            {PROCESS.map(({ step, body }) => (
              <div key={step}>
                <p className="font-bold text-slate-900">{step}</p>
                <p className="mt-1 text-sm leading-relaxed text-slate-600">{body}</p>
              </div>
            ))}
          </div>
        </div>
      </section>

      <section className="container max-w-5xl py-12 md:py-16">
        <h2 className="text-2xl font-bold text-primary md:text-3xl">
          A Local Software Company for Rawalpindi &amp; Islamabad Businesses
        </h2>
        <p className="mt-2 max-w-2xl text-sm text-slate-600">
          Nizamify's development team is based right here in the twin cities — not outsourced,
          not remote-only.
        </p>
        <div className="mt-8 grid gap-6 md:grid-cols-2">
          <div className="rounded-lg border border-slate-200 p-5">
            <h3 className="font-semibold text-slate-900">In-person discovery &amp; demos</h3>
            <p className="mt-1 text-sm leading-relaxed text-slate-600">
              Businesses in Rawalpindi and Islamabad can meet with us directly to scope a project
              and see the software in action before committing.
            </p>
          </div>
          <div className="rounded-lg border border-slate-200 p-5">
            <h3 className="font-semibold text-slate-900">
              Same team behind our smart-home business
            </h3>
            <p className="mt-1 text-sm leading-relaxed text-slate-600">
              We build the hardware-side control apps and dashboards we sell across Pakistan, so
              we understand automation from both the software and device side.
            </p>
          </div>
          <div className="rounded-lg border border-slate-200 p-5">
            <h3 className="font-semibold text-slate-900">Serving Rawalpindi, Islamabad &amp; beyond</h3>
            <p className="mt-1 text-sm leading-relaxed text-slate-600">
              Local clients get on-site visits where useful; clients across the rest of Pakistan
              are supported remotely over WhatsApp and video calls.
            </p>
          </div>
          <div className="rounded-lg border border-slate-200 p-5">
            <h3 className="font-semibold text-slate-900">Also automating smart homes locally</h3>
            <p className="mt-1 text-sm leading-relaxed text-slate-600">
              See how we bring automation to homes in{" "}
              <Link href="/smart-home-automation/rawalpindi" className="text-primary hover:underline">
                Rawalpindi
              </Link>{" "}
              and{" "}
              <Link href="/smart-home-automation/islamabad" className="text-primary hover:underline">
                Islamabad
              </Link>
              .
            </p>
          </div>
        </div>
      </section>

      <section className="container max-w-3xl py-16 md:py-20">
        <h2 className="text-2xl font-bold text-primary md:text-3xl">Frequently Asked Questions</h2>
        <div className="mt-8">
          <Accordion type="single" collapsible className="w-full">
            {FAQS.map((faq, i) => (
              <AccordionItem key={i} value={`csw-faq-${i}`} className="border-b border-slate-200">
                <AccordionTrigger className="text-left text-base font-semibold text-slate-900 hover:no-underline">
                  {faq.question}
                </AccordionTrigger>
                <AccordionContent className="text-sm leading-relaxed text-slate-600">
                  {faq.answer}
                </AccordionContent>
              </AccordionItem>
            ))}
          </Accordion>
        </div>
        <div className="mt-10 text-center">
          <Button
            asChild
            type="button"
            variant="outline"
            className="border-[#25D366] bg-white text-[#075E54] hover:bg-[#25D366]/10 hover:text-[#075E54]"
          >
            <a
              href={buildWhatsAppApiHref(
                "Hi, I'd like a quote for a custom software / automation project.",
              )}
              target="_blank"
              rel="noopener noreferrer"
              aria-label="Chat with Nizamify on WhatsApp about custom software"
            >
              <span className="mr-2 inline-flex size-6 items-center justify-center rounded-full bg-[#25D366] text-white">
                <WhatsAppIcon className="size-4" />
              </span>
              Get a Quote on WhatsApp
            </a>
          </Button>
        </div>
      </section>
    </div>
  );
}