"use client";

import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
import FaqDouble from "@/components/sections/faq/FaqDouble";
import { HelpCircle } from "lucide-react";

export default function ContactPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="bounce-effect"
      defaultTextAnimation="entrance-slide"
      borderRadius="rounded"
      contentWidth="mediumSmall"
      sizing="large"
      background="circleGradient"
      cardStyle="solid"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="solid"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="OpusClip"
          navItems={[
            { name: "Home", id: "home" },
            { name: "Features", id: "features" },
            { name: "Pricing", id: "pricing" },
            { name: "About", id: "about" },
            { name: "Contact", id: "contact" },
          ]}
          button={{
            text: "Start Free",
            href: "/",
          }}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqDouble
          title="Frequently Asked Questions"
          description="Everything you need to know about OpusClip and how it can transform your video content workflow."
          tag="Help & Support"
          tagIcon={HelpCircle}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          faqsAnimation="slide-up"
          faqs={[
            {
              id: "faq-1",
              title: "Is OpusClip really free forever?",
              content: "Yes, absolutely. OpusClip is 100% free with no hidden fees, paywalls, or premium tiers. We believe powerful video editing tools should be accessible to everyone, regardless of their budget. All features are available to every user at no cost.",
            },
            {
              id: "faq-2",
              title: "How accurate is the AI highlight detection?",
              content: "Our AI is trained on millions of hours of video content and uses advanced machine learning to identify engaging moments based on audio dynamics, visual transitions, text overlays, and viewer engagement patterns. Accuracy typically ranges from 85-95%, and you can always manually adjust clips.",
            },
            {
              id: "faq-3",
              title: "What video formats are supported?",
              content: "OpusClip supports all major video formats including MP4, WebM, AVI, MOV, MKV, FLV, and WMV. You can upload files up to 10GB in size, and the platform automatically converts them for optimal processing.",
            },
            {
              id: "faq-4",
              title: "Can I schedule posts to YouTube and Instagram?",
              content: "Yes! You can schedule posts up to 30 days in advance or post immediately. Simply connect your YouTube and Instagram accounts through OAuth authentication, customize your clip settings, add captions and metadata, and select your preferred posting time.",
            },
            {
              id: "faq-5",
              title: "How many languages does OpusClip support for captions?",
              content: "We support 50+ languages including English, Spanish, French, German, Mandarin, Japanese, Korean, Arabic, Portuguese, Hindi, and many more. The AI automatically detects the language in your video and generates captions accordingly.",
            },
            {
              id: "faq-6",
              title: "Is my content secure and private?",
              content: "Absolutely. All content is encrypted end-to-end using industry-standard protocols. We comply with GDPR, CCPA, and international privacy standards. Your videos are stored securely and you maintain complete ownership. We never sell or share user data.",
            },
          ]}
        />
      </div>

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