"use client";

import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import PricingCardThree from "@/components/sections/pricing/PricingCardThree";
import FeatureCardNine from "@/components/sections/feature/FeatureCardNine";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
import { Leaf, Sparkles } from "lucide-react";

export default function GoldenSignaturesPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-magnetic"
      defaultTextAnimation="background-highlight"
      borderRadius="soft"
      contentWidth="small"
      sizing="largeSizeMediumTitles"
      background="blurBottom"
      cardStyle="inset"
      primaryButtonStyle="flat"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="extrabold"
    >
      {/* Navbar */}
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="BatchMind AI"
          navItems={[
            { name: "Features", id: "features" },
            { name: "How It Works", id: "how-it-works" },
            { name: "Demo", id: "demo" },
            { name: "Login", id: "login" },
          ]}
          button={{ text: "Launch Dashboard", href: "/dashboard" }}
          className="fixed top-4 left-4 right-4 z-50"
          buttonClassName="bg-[#00BFA5] text-[#0F172A] font-semibold rounded-lg px-6 py-2 hover:brightness-110 transition-all duration-200"
        />
      </div>

      {/* Golden Signatures Overview */}
      <div id="golden-signatures-detail" data-section="golden-signatures-detail">
        <PricingCardThree
          title="Golden Signature Optimization Modes"
          description="Pre-configured parameter sets optimized for different manufacturing priorities. Learn from your facility's patterns and adjust based on real-time performance."
          tag="Operating Modes"
          tagAnimation="slide-up"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          plans={[
            {
              id: "eco",
              badge: "Most Deployed",
              badgeIcon: Leaf,
              price: "312 kWh",
              name: "ECO Mode",
              buttons: [
                { text: "Activate", href: "#" },
                { text: "View History", href: "#" },
              ],
              features: [
                "Temperature: 183°C (optimized for energy)",
                "Belt Speed: 2.3 m/s",
                "Hold Time Ph.1: 12 min",
                "Energy: 312 kWh ↓",
                "CO₂: 145 kg ↓",
                "Quality: 91% ✓",
                "Best for: High-volume, sustainability-focused runs",
                "Updated 3 times | Last: 2 hours ago",
              ],
            },
            {
              id: "quality",
              price: "287 kWh",
              name: "QUALITY Mode",
              buttons: [
                { text: "Activate", href: "#" },
                { text: "View History", href: "#" },
              ],
              features: [
                "Temperature: 185°C (optimized for precision)",
                "Belt Speed: 2.1 m/s",
                "Hold Time Ph.1: 14 min",
                "Energy: 287 kWh",
                "CO₂: 138 kg",
                "Quality: 94% ↑",
                "Best for: Premium products, customer SLA requirements",
                "Updated 2 times | Last: 4 hours ago",
              ],
            },
            {
              id: "balanced",
              price: "299 kWh",
              name: "BALANCED Mode",
              buttons: [
                { text: "Activate", href: "#" },
                { text: "View History", href: "#" },
              ],
              features: [
                "Temperature: 184°C (balanced approach)",
                "Belt Speed: 2.2 m/s",
                "Hold Time Ph.1: 13 min",
                "Energy: 299 kWh",
                "CO₂: 142 kg",
                "Quality: 92% ✓",
                "Best for: Day-to-day operations, flexibility",
                "Updated 3 times | Last: 1 hour ago",
              ],
            },
          ]}
          ariaLabel="Golden Signature Modes"
        />
      </div>

      {/* How Golden Signatures Work */}
      <div id="golden-signature-mechanics" data-section="golden-signature-mechanics">
        <FeatureCardNine
          title="How Golden Signatures Learn and Improve"
          description="BatchMind AI continuously refines your facility's Golden Signatures based on historical batch data, market conditions, and your feedback through human-in-the-loop decisions."
          tag="Advanced Optimization"
          tagAnimation="slide-up"
          showStepNumbers={true}
          animationType="scale-rotate"
          textboxLayout="default"
          useInvertedBackground={false}
          features={[
            {
              id: 1,
              title: "Pattern Recognition from Historical Data",
              description: "The system analyzes past batches to identify optimal parameter combinations for energy efficiency, quality, and sustainability. Each signature evolves as your facility's equipment and processes change.",
              phoneOne: {
                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AP0AjJmV3m6mh1sukO97SYkjcn/golden-signature-engine-visualization-sh-1772479138733-b5593d65.png?_wi=2",
                imageAlt: "Pattern Recognition Visualization",
              },
              phoneTwo: {
                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AP0AjJmV3m6mh1sukO97SYkjcn/advanced-industrial-saas-dashboard-inter-1772479139028-807f53a6.png?_wi=4",
                imageAlt: "Historical Data Analysis",
              },
            },
            {
              id: 2,
              title: "Real-Time Performance Comparison",
              description: "Each active batch is continuously compared against the Golden Signature baseline. Deviations are detected in real-time, and corrective recommendations are generated immediately when performance drifts.",
              phoneOne: {
                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AP0AjJmV3m6mh1sukO97SYkjcn/real-time-batch-monitoring-interface-sho-1772479138124-2b115611.png?_wi=7",
                imageAlt: "Real-Time Comparison",
              },
              phoneTwo: {
                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AP0AjJmV3m6mh1sukO97SYkjcn/batch-monitoring-1772479137748-3d84082e.png",
                imageAlt: "Performance Deviation Detection",
              },
            },
            {
              id: 3,
              title: "Continuous Refinement Through Your Decisions",
              description: "When you accept, modify, or reject AI recommendations, the system learns your preferences and facility-specific constraints. This feedback improves future Golden Signature generation for your exact operational context.",
              phoneOne: {
                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AP0AjJmV3m6mh1sukO97SYkjcn/rag-powered-fault-guidance-system-visual-1772479138197-07d35feb.png?_wi=2",
                imageAlt: "Human-in-Loop Learning",
              },
              phoneTwo: {
                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AP0AjJmV3m6mh1sukO97SYkjcn/monthly-carbon-budget-tracker-showing-ho-1772479137486-8a27a3ff.png?_wi=5",
                imageAlt: "Feedback Integration",
              },
            },
          ]}
          ariaLabel="Golden Signature Learning Process"
        />
      </div>

      {/* Footer */}
      <div id="footer" data-section="footer">
        <FooterLogoReveal
          logoText="BatchMind AI"
          leftLink={{ text: "Privacy Policy", href: "/privacy" }}
          rightLink={{ text: "Terms of Service", href: "/terms" }}
          ariaLabel="Site footer"
        />
      </div>
    </ThemeProvider>
  );
}