import Navbar from "@/components/Navbar";
import Footer from "@/components/Footer";

const SECTIONS = [
  { id: "description", title: "Service Description" },
  { id: "accounts", title: "Account Responsibilities" },
  { id: "acceptable-use", title: "Acceptable Use" },
  { id: "ip", title: "Intellectual Property" },
  { id: "availability", title: "Service Availability & SLA" },
  { id: "payment", title: "Payment Terms and Billing" },
  { id: "cancellation", title: "Cancellation and Termination" },
  { id: "liability", title: "Limitation of Liability" },
  { id: "governing-law", title: "Governing Law" },
  { id: "contact", title: "Contact" },
];

const Terms = () => (
  <div className="min-h-screen bg-background">
    <Navbar />
    <main className="pt-24 pb-0">
      {/* Header */}
      <section className="max-w-3xl mx-auto px-4 sm:px-6 lg:px-8 py-10 border-b border-border">
        <div className="text-xs font-semibold text-primary uppercase tracking-widest mb-3">Legal</div>
        <h1 className="font-display font-bold text-4xl text-foreground mb-3">Terms of Service</h1>
        <p className="text-muted-foreground">Last updated: February 20, 2026</p>
        <p className="text-muted-foreground mt-3 leading-relaxed">
          These Terms of Service govern your use of the ChatSKU platform. By creating an account or using our services, you agree to these terms.
        </p>
      </section>

      <div className="max-w-3xl mx-auto px-4 sm:px-6 lg:px-8 py-10 flex gap-12">
        {/* TOC */}
        <aside className="hidden lg:block w-52 flex-shrink-0">
          <div className="sticky top-24">
            <div className="text-xs font-semibold text-muted-foreground uppercase tracking-widest mb-3">Contents</div>
            <nav className="space-y-1">
              {SECTIONS.map((s) => (
                <a
                  key={s.id}
                  href={`#${s.id}`}
                  className="block text-sm text-muted-foreground hover:text-primary transition-colors py-1"
                >
                  {s.title}
                </a>
              ))}
            </nav>
          </div>
        </aside>

        {/* Content */}
        <article className="flex-1 space-y-10 text-sm leading-relaxed text-muted-foreground">

          <section id="description">
            <h2 className="font-display font-bold text-xl text-foreground mb-3">1. Service Description</h2>
            <p>ChatSKU is a B2B ChatCommerce platform that enables businesses to add AI-powered chat commerce functionality to their websites. The service allows businesses to upload product catalogs, configure AI-powered chat widgets, manage quote requests, and facilitate B2B sales workflows. ChatSKU is provided as a software-as-a-service (SaaS) platform accessible via web browser and embeddable widget.</p>
          </section>

          <section id="accounts">
            <h2 className="font-display font-bold text-xl text-foreground mb-3">2. Account Responsibilities</h2>
            <p className="mb-3">As an account holder, you are responsible for:</p>
            <ul className="space-y-2 list-none pl-0">
              {[
                "Maintaining the security and confidentiality of your account credentials",
                "All activity that occurs under your account",
                "Ensuring that all information provided during registration is accurate and up-to-date",
                "Promptly notifying us of any unauthorised access to your account",
                "Ensuring that your authorised users comply with these Terms",
              ].map((item) => (
                <li key={item} className="flex gap-3">
                  <div className="w-1.5 h-1.5 rounded-full bg-primary mt-2 flex-shrink-0" />
                  <span>{item}</span>
                </li>
              ))}
            </ul>
            <p className="mt-3">You must be at least 18 years old and have the legal authority to enter into this agreement on behalf of your organisation.</p>
          </section>

          <section id="acceptable-use">
            <h2 className="font-display font-bold text-xl text-foreground mb-3">3. Acceptable Use</h2>
            <p className="mb-3">You agree not to use ChatSKU to:</p>
            <ul className="space-y-2 list-none pl-0">
              {[
                "Violate any applicable laws or regulations",
                "Upload products that are illegal, hazardous, or prohibited",
                "Attempt to reverse-engineer, decompile, or extract source code from the platform",
                "Use the platform to send spam or unsolicited commercial communications",
                "Interfere with or disrupt the security, integrity, or performance of ChatSKU services",
                "Access or attempt to access other customers' data",
                "Resell or sublicense access to ChatSKU without prior written consent",
              ].map((item) => (
                <li key={item} className="flex gap-3">
                  <div className="w-1.5 h-1.5 rounded-full bg-primary mt-2 flex-shrink-0" />
                  <span>{item}</span>
                </li>
              ))}
            </ul>
            <p className="mt-3">Violation of these terms may result in immediate suspension or termination of your account.</p>
          </section>

          <section id="ip">
            <h2 className="font-display font-bold text-xl text-foreground mb-3">4. Intellectual Property</h2>
            <p className="mb-3"><strong className="text-foreground">Your content:</strong> You retain full ownership of all product data, catalog content, pricing information, images, and any other data you upload to ChatSKU. By uploading content, you grant ChatSKU a limited, non-exclusive licence to use that content solely for the purpose of providing the platform services to you.</p>
            <p className="mb-3"><strong className="text-foreground">ChatSKU platform:</strong> The ChatSKU platform, including all software, AI models, algorithms, interfaces, design elements, and documentation, remains the exclusive intellectual property of ChatSKU. Nothing in these Terms transfers any ChatSKU IP rights to you.</p>
            <p><strong className="text-foreground">Feedback:</strong> Any feedback, suggestions, or feature requests you provide may be used by ChatSKU to improve the platform without obligation or compensation to you.</p>
          </section>

          <section id="availability">
            <h2 className="font-display font-bold text-xl text-foreground mb-3">5. Service Availability & SLA</h2>
            <p className="mb-3">ChatSKU aims to provide a reliable, highly available service. Our commitments by plan:</p>
            <ul className="space-y-2 list-none pl-0">
              {[
                { plan: "Free", sla: "No formal SLA. Best-effort availability." },
                { plan: "Growth", sla: "99.5% monthly uptime target. Scheduled maintenance communicated in advance." },
                { plan: "Enterprise", sla: "99.9% monthly uptime with a formal SLA. Downtime credits available per agreement." },
              ].map(({ plan, sla }) => (
                <li key={plan} className="flex gap-3">
                  <div className="w-1.5 h-1.5 rounded-full bg-primary mt-2 flex-shrink-0" />
                  <span><strong className="text-foreground">{plan}:</strong> {sla}</span>
                </li>
              ))}
            </ul>
            <p className="mt-3">We reserve the right to perform maintenance that may temporarily affect service availability. We will provide advance notice where possible.</p>
          </section>

          <section id="payment">
            <h2 className="font-display font-bold text-xl text-foreground mb-3">6. Payment Terms and Billing</h2>
            <p className="mb-3">Paid plans are billed monthly or annually in advance. By subscribing to a paid plan, you authorise ChatSKU to charge your payment method on a recurring basis.</p>
            <ul className="space-y-2 list-none pl-0">
              {[
                "All prices are in USD and exclusive of applicable taxes",
                "Annual subscriptions are billed upfront and provide a 20% discount over monthly billing",
                "Failed payments may result in temporary suspension of your account",
                "Plan upgrades take effect immediately; downgrades take effect at the next billing cycle",
                "Refunds are not provided for partial months or unused time on annual plans, except where required by law",
              ].map((item) => (
                <li key={item} className="flex gap-3">
                  <div className="w-1.5 h-1.5 rounded-full bg-primary mt-2 flex-shrink-0" />
                  <span>{item}</span>
                </li>
              ))}
            </ul>
          </section>

          <section id="cancellation">
            <h2 className="font-display font-bold text-xl text-foreground mb-3">7. Cancellation and Termination</h2>
            <p className="mb-3"><strong className="text-foreground">By you:</strong> You may cancel your account at any time from your account settings. Cancellation takes effect at the end of the current billing period. You retain access to your account and data until that date.</p>
            <p className="mb-3"><strong className="text-foreground">By ChatSKU:</strong> We reserve the right to suspend or terminate your account immediately if you violate these Terms, engage in fraudulent activity, or fail to pay outstanding invoices after a grace period.</p>
            <p><strong className="text-foreground">Data after termination:</strong> Following account closure, your product data and account information will be retained for 30 days for potential recovery, then permanently deleted unless legally required to retain it longer.</p>
          </section>

          <section id="liability">
            <h2 className="font-display font-bold text-xl text-foreground mb-3">8. Limitation of Liability</h2>
            <p className="mb-3">To the maximum extent permitted by applicable law, ChatSKU shall not be liable for any indirect, incidental, special, consequential, or punitive damages, including but not limited to loss of profits, revenue, data, goodwill, or business opportunities, arising from your use of or inability to use the service.</p>
            <p>ChatSKU's total cumulative liability to you for any claims arising from or related to these Terms or the service shall not exceed the total amount paid by you to ChatSKU in the three (3) months immediately preceding the event giving rise to the claim.</p>
          </section>

          <section id="governing-law">
            <h2 className="font-display font-bold text-xl text-foreground mb-3">9. Governing Law</h2>
            <p>These Terms are governed by and construed in accordance with the laws of the State of Delaware, United States, without regard to its conflict of law provisions. Any disputes arising under these Terms shall be subject to the exclusive jurisdiction of the courts located in Delaware, and you consent to personal jurisdiction in those courts. The United Nations Convention on Contracts for the International Sale of Goods does not apply to these Terms.</p>
          </section>

          <section id="contact">
            <h2 className="font-display font-bold text-xl text-foreground mb-3">10. Contact</h2>
            <p className="mb-4">If you have questions about these Terms or need to contact our legal team:</p>
            <div className="p-4 rounded-xl bg-card border border-border">
              <p><strong className="text-foreground">Email:</strong> <a href="mailto:legal@chatsku.com" className="text-primary hover:underline">legal@chatsku.com</a></p>
              <p className="mt-1"><strong className="text-foreground">Response time:</strong> We aim to respond to legal inquiries within 5 business days.</p>
            </div>
          </section>

        </article>
      </div>
    </main>
    <Footer />
  </div>
);

export default Terms;
