"use client";

import { useTranslation } from "@turbostarter/i18n";
import { cn } from "@turbostarter/ui";
import { buttonVariants } from "@turbostarter/ui-web/button";

import { pathsConfig } from "~/config/paths";
import { TurboLink } from "~/modules/common/turbo-link";
import ReputationBlueprint from "~/modules/marketing/demo/report/ReputationBlueprint";
import { demoSynthesis } from "~/modules/marketing/demo/demo-synthesis";

export default function DemoPage() {
  const { t } = useTranslation("marketing");

  return (
    <div className="relative">
      <ReputationBlueprint report={demoSynthesis} />

      {/* Sticky CTA bar */}
      <div className="bg-background/95 fixed inset-x-0 bottom-0 z-50 border-t backdrop-blur-sm">
        <div className="container flex items-center justify-between px-6 py-3">
          <p className="text-muted-foreground text-sm font-medium">
            {t("demoPage.ctaText")}
          </p>
          <TurboLink
            href={pathsConfig.auth.login}
            className={cn(buttonVariants({ size: "sm" }))}
          >
            {t("demoPage.ctaButton")} &rarr;
          </TurboLink>
        </div>
      </div>
    </div>
  );
}
