// app/pricing/page.tsx
import type { Metadata } from "next";
import Link from "next/link";
import { site } from "@/lib/site";
import JsonLd from "@/components/JsonLd";
import PricingConfigurator from "./PricingConfigurator";

export const metadata: Metadata = {
  title: "Plans, SLAs & Self-Service — Managed VPS, Websites & Minecraft | Van Hunen IT",
  description:
    "Choose Managed Hosting & Care, provision a VPS (managed or owned), or deploy a Minecraft server. SLAs, restore-tested backups, monitoring. Month-to-month.",
};

// ---- Server-safe plan data (also used for JSON-LD) ---- //
const carePlans = [
  {
    id: "essential",
    name: "Essential Managed Hosting",
    bestFor: "Websites & VPS that need reliable care",
    monthlyPrice: 149,
    yearlyDiscount: 0.1,
    outcomes: ["Reliable care & monitoring", "99.9% uptime target"],
    inclusions: [
      "DNS & email monitoring (SPF/DKIM/DMARC)",
      "Automated backups + quarterly restore test",
      "Managed updates (WordPress/Next.js)",
      "Uptime & SSL watch",
      "Incident credits",
      "Business-hours support (8×5)",
    ],
    sla: "Next-business-day first response (8×5)",
    cta: { label: "Start Essential", href: "/contact?type=website-care" },
    popular: false,
  },
  {
    id: "growth",
    name: "Growth Managed Hosting",
    bestFor: "Teams & growing sites",
    monthlyPrice: 299,
    yearlyDiscount: 0.1,
    outcomes: ["99.95% uptime target", "Faster performance"],
    inclusions: [
      "Everything in Essential",
      "Cloudflare WAF & bot tuning",
      "Monthly Web Vitals report",
      "Priority incident handling",
    ],
    sla: "4-hour first response (8×5)",
    cta: { label: "Start Growth", href: "/contact?type=website-care" },
    popular: true,
  },
  {
    id: "mission",
    name: "Mission-Critical Managed Hosting",
    bestFor: "High-traffic & 24/7 operations",
    monthlyPrice: 649,
    yearlyDiscount: 0.1,
    outcomes: ["99.99% uptime target", "24/7 on-call"],
    inclusions: ["Everything in Growth", "24/7 paging", "Weekly checks", "DR runbook & drills"],
    sla: "1-hour first response (24/7)",
    cta: { label: "Talk to Us", href: "/contact?type=website-care" },
    popular: false,
    contactOnly: true,
  },
] as const;

const vpsPlans = [
  {
    id: "solo",
    name: "Solo VPS",
    price: 24, // €/mo
    specs: "2 vCPU • 4 GB RAM • 50 GB NVMe",
    bestFor: "Small apps, staging, low-traffic services",
  },
  {
    id: "team",
    name: "Team VPS",
    price: 49,
    specs: "4 vCPU • 8 GB RAM • 100 GB NVMe",
    bestFor: "Production apps, WordPress/Next.js, APIs",
  },
  {
    id: "dedicated",
    name: "Dedicated / Custom",
    price: null, // custom
    specs: "Dedicated VPS/metal — tailored",
    bestFor: "High traffic, networks, or compliance",
  },
] as const;

const minecraftPlans = [
  {
    id: "starter",
    name: "Starter",
    price: 19,
    specs: "2 vCPU • 4 GB RAM • 40 GB SSD",
    typical: "Up to ~20 players (optimized)",
    features: ["Paper/Spigot or Bedrock", "Daily backups + restore test", "Basic tuning & monitoring"],
  },
  {
    id: "pro",
    name: "Pro",
    price: 39,
    specs: "3 vCPU • 8 GB RAM • 80 GB SSD",
    typical: "Up to ~60 players (optimized)",
    features: [
      "Paper/Velocity or Bedrock + Geyser",
      "Backups (2x/day) + restore test",
      "Advanced tuning & monitoring",
    ],
  },
  {
    id: "network",
    name: "Network",
    price: null,
    specs: "Dedicated VPS spec",
    typical: "Networks & modpacks",
    features: ["Velocity/Bungee multi-server", "Backups (hourly) + restore test", "Custom tuning & SLA"],
  },
] as const;

// ---- JSON-LD (Offers for three catalogs) ---- //
const pricingLd = {
  "@context": "https://schema.org",
  "@type": "OfferCatalog",
  name: "Van Hunen IT — Plans & Catalog",
  url: `${site.url}/pricing`,
  itemListElement: [
    {
      "@type": "OfferCatalog",
      name: "Managed Hosting & Care",
      itemListElement: carePlans.map((p) => ({
        "@type": "Offer",
        name: p.name,
        price: `€${p.monthlyPrice}/mo`,
        priceCurrency: "EUR",
        url: `${site.url}/pricing`,
        description: `${p.bestFor} — SLA: ${p.sla}`,
      })),
    },
    {
      "@type": "OfferCatalog",
      name: "VPS (Managed or Owned)",
      itemListElement: vpsPlans.map((p) => ({
        "@type": "Offer",
        name: p.name,
        price: p.price ? `€${p.price}/mo` : "Custom",
        priceCurrency: "EUR",
        url: `${site.url}/vps#deploy`,
        description: `${p.specs} — ${p.bestFor}`,
      })),
    },
    {
      "@type": "OfferCatalog",
      name: "Minecraft Hosting",
      itemListElement: minecraftPlans.map((p) => ({
        "@type": "Offer",
        name: p.name,
        price: p.price ? `€${p.price}/mo` : "Custom",
        priceCurrency: "EUR",
        url: `${site.url}/minecraft#deploy`,
        description: `${p.specs} — ${p.typical}`,
      })),
    },
  ],
};

export default function PricingPage() {
  return (
    <main className="relative isolate bg-gradient-to-b from-neutral-50 via-white to-neutral-100 dark:from-neutral-950 dark:via-neutral-900 dark:to-neutral-950">
      {/* HERO */}
      <header className="container mx-auto max-w-6xl px-6 pt-16 pb-10 text-center">
        <h1 className="text-4xl sm:text-5xl font-bold tracking-tight">
          Plans, SLAs & Self-Service
        </h1>
        <p className="mt-4 text-lg text-neutral-700 dark:text-neutral-300">
          Pick **Managed Hosting & Care**, provision a **VPS (managed or owned)**, or **deploy a Minecraft server**.
          Month-to-month, 30-day cancel, restore-tested backups, real SLAs.
        </p>
        <div className="mt-8 flex flex-col sm:flex-row gap-3 justify-center">
          <Link href="/vps#deploy" className="rounded-lg bg-neutral-900 dark:bg-white text-white dark:text-neutral-900 px-5 py-2 font-semibold hover:opacity-90 transition">
            Provision a VPS
          </Link>
          <Link href="/minecraft#deploy" className="rounded-lg border border-neutral-300 dark:border-neutral-700 px-5 py-2 font-semibold text-neutral-900 dark:text-white hover:bg-neutral-50 dark:hover:bg-neutral-800 transition">
            Deploy Minecraft
          </Link>
        </div>
      </header>

      {/* NEW PRICING EXPERIENCE */}
      <section className="container mx-auto max-w-6xl px-6 pb-20">
        <PricingConfigurator carePlans={carePlans} vpsPlans={vpsPlans} minecraftPlans={minecraftPlans} />

        <p className="mt-6 text-center text-sm text-neutral-500">
          Prices exclude VAT. Annual billing saves 10% on Managed Hosting & Care. VPS and Minecraft prices shown are base infrastructure fees; management is included on our platform. Owned VPS incurs provider charges in your account.
        </p>
      </section>

      {/* TRUST / GUARANTEE */}
      <section className="border-t border-neutral-200 dark:border-neutral-800 bg-white/60 dark:bg-neutral-900/60">
        <div className="container mx-auto max-w-6xl px-6 py-14 grid gap-6 sm:grid-cols-3">
          {[
            { t: "Restore-Tested Backups", s: "We time drills and keep notes." },
            { t: "SLA-Backed Response", s: "Credits per plan. 24/7 available." },
            { t: "Month-to-Month", s: "30-day cancel. No lock-in." },
          ].map((i) => (
            <div key={i.t} className="rounded-xl border border-neutral-200 dark:border-neutral-800 p-5">
              <div className="text-base font-semibold">{i.t}</div>
              <div className="text-sm text-neutral-600 dark:text-neutral-400">{i.s}</div>
            </div>
          ))}
        </div>
      </section>

      {/* FAQ */}
      <section className="container mx-auto max-w-5xl px-6 py-16">
        <h2 className="text-2xl sm:text-3xl font-bold tracking-tight text-center">FAQ</h2>
        <div className="mt-8 grid gap-6">
          {[
            {
              q: "What’s the difference between Managed and Owned VPS?",
              a: "Managed = we host & bill the VPS on our platform (backups, monitoring, SLAs included). Owned = we provision into your cloud account via a secure connect; you retain ownership. Both include management.",
            },
            {
              q: "Can I migrate my current site or server?",
              a: "Yes. We handle data transfer, DNS cutover, and rollback. We also tune performance and verify backups with a restore drill.",
            },
            {
              q: "Do you support modpacks and networks for Minecraft?",
              a: "Yes—Forge/Fabric and Velocity/Bungee networks are supported, sized to resources. Use the Network/Custom option or contact us.",
            },
            {
              q: "How do incident credits work?",
              a: "If we miss your SLA, we credit according to your plan’s policy. Details are included in your agreement.",
            },
            {
              q: "Do you offer NDAs and least-privilege access?",
              a: "Yes—mutual NDA available; we only request the credentials needed for the task.",
            },
          ].map((i) => (
            <article key={i.q} className="rounded-2xl border border-neutral-200 dark:border-neutral-800 bg-white/60 dark:bg-neutral-900/60 p-6">
              <h3 className="text-lg font-semibold">{i.q}</h3>
              <p className="mt-2 text-sm text-neutral-700 dark:text-neutral-300">{i.a}</p>
            </article>
          ))}
        </div>

        <div className="mt-10 text-center">
          <Link href="/contact?plan=recommendation" className="inline-flex items-center rounded-lg bg-gradient-to-r from-blue-600 via-purple-600 to-blue-600 text-white px-6 py-3 text-sm font-semibold hover:opacity-90 transition">
            Get My Recommendation
          </Link>
        </div>
      </section>

      <JsonLd data={pricingLd} />
    </main>
  );
}