import Link from 'next/link'

import { PublicLayout } from '@/components/layout/public-layout'
import { Button } from '@/components/ui/button'
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
import { getPortalUrl } from '@/lib/platform-urls'
import { FileCheck, Globe, Lock, ShieldCheck } from 'lucide-react'

export default function SovereigntyPage() {
  const portalUrl = getPortalUrl('/')

  return (
    <PublicLayout
      breadcrumbs={[
        { label: 'Solutions', href: '/solutions/enterprise' },
        { label: 'Sovereignty & Compliance', href: '/solutions/sovereignty' },
      ]}
    >
      <div className="min-h-screen bg-studio-black">
        <section className="border-b border-studio-medium bg-gradient-to-br from-phoenix-fire/10 via-transparent to-neon-cyan/10 px-4 py-24">
          <div className="mx-auto max-w-4xl text-center">
            <h1 className="mb-6 text-5xl font-bold text-white md:text-6xl">
              Sovereignty & Compliance
            </h1>
            <p className="mb-8 text-xl text-gray-300">
              Phoenix is designed around clear trust boundaries, identity ownership, and
              procurement-aware service delivery for regulated organizations.
            </p>
            <div className="flex flex-col gap-4 sm:flex-row sm:justify-center">
              <Button variant="phoenix" size="lg" asChild>
                <Link href={portalUrl}>Open Client Portal</Link>
              </Button>
              <Button variant="outline" size="lg" asChild>
                <Link href="/company/trust">Trust & Compliance</Link>
              </Button>
            </div>
          </div>
        </section>

        <section className="px-4 py-20">
          <div className="mx-auto grid max-w-6xl gap-8 md:grid-cols-2">
            <Card>
              <CardHeader>
                <ShieldCheck className="mb-3 h-8 w-8 text-phoenix-fire" />
                <CardTitle>Identity Boundary</CardTitle>
                <CardDescription>
                  Tenants own domains, identity, RBAC, and security controls.
                </CardDescription>
              </CardHeader>
              <CardContent className="space-y-2 text-sm text-gray-300">
                <p>Separate client billing from tenant security boundaries.</p>
                <p>Use Keycloak-backed SSO for client-facing workspace access.</p>
                <p>Maintain operator-only controls on the systems tier.</p>
              </CardContent>
            </Card>

            <Card>
              <CardHeader>
                <Globe className="mb-3 h-8 w-8 text-sankofa-gold" />
                <CardTitle>Data Residency</CardTitle>
                <CardDescription>
                  Support regional deployment and sovereignty-aware operating models.
                </CardDescription>
              </CardHeader>
              <CardContent className="space-y-2 text-sm text-gray-300">
                <p>Separate public, client, and operator hostnames by trust boundary.</p>
                <p>Use environment and deployment planes to map workloads to approved regions.</p>
                <p>Keep procurement, entitlement, and operations records auditable.</p>
              </CardContent>
            </Card>

            <Card>
              <CardHeader>
                <Lock className="mb-3 h-8 w-8 text-neon-cyan" />
                <CardTitle>Controlled Access</CardTitle>
                <CardDescription>
                  Client administration and operator administration are intentionally distinct.
                </CardDescription>
              </CardHeader>
              <CardContent className="space-y-2 text-sm text-gray-300">
                <p>`portal.sankofa.nexus` is the client workspace.</p>
                <p>`admin.sankofa.nexus` is reserved for client administration capabilities.</p>
                <p>`dash.sankofa.nexus` remains operator-only with stronger access controls.</p>
              </CardContent>
            </Card>

            <Card>
              <CardHeader>
                <FileCheck className="mb-3 h-8 w-8 text-phoenix-fire" />
                <CardTitle>Commercial Model Clarity</CardTitle>
                <CardDescription>
                  Marketplace discovery is separate from the commercial model of each offer.
                </CardDescription>
              </CardHeader>
              <CardContent className="space-y-2 text-sm text-gray-300">
                <p>Native and partner offers can both appear in the same discovery surface.</p>
                <p>IRU, SaaS, and managed service remain commercial-model choices.</p>
                <p>Request-based offers should never be presented as instant self-service if they are not.</p>
              </CardContent>
            </Card>
          </div>
        </section>
      </div>
    </PublicLayout>
  )
}
