import React, { useState, useEffect } from "react";
import {
  ChevronRight,
  Download,
  ExternalLink,
} from "lucide-react";

interface TocItem {
  id: string;
  title: string;
  level: number;
}

export function Privacy() {
  const [activeSection, setActiveSection] =
    useState<string>("introduction");
  const [tocOpen, setTocOpen] = useState(false);

  // Table of Contents items
  const tocItems: TocItem[] = [
    {
      id: "introduction",
      title: "Introduction",
      level: 1,
    },
    {
      id: "general-practice",
      title: "General Practice",
      level: 1,
    },
    {
      id: "definitions",
      title: "Definitions",
      level: 1,
    },
    {
      id: "collection-of-data",
      title: "Collection of Data",
      level: 1,
    },
    {
      id: "usage-of-information",
      title: "Usage of Information",
      level: 1,
    },
    {
      id: "sharing-of-data",
      title: "Sharing of Data or Information",
      level: 1,
    },
    {
      id: "retention-storage",
      title: "Period of Retention & Information Storage",
      level: 1,
    },
    {
      id: "user-rights",
      title: "Rights of Users and Subscribers",
      level: 1,
    },
    {
      id: "jurisdiction",
      title: "Jurisdiction",
      level: 1,
    },
    {
      id: "data-breach",
      title: "Notifications of Data Breach",
      level: 1,
    },
    {
      id: "disputes",
      title: "Disputes",
      level: 1,
    },
    {
      id: "amendment",
      title: "Amendment to the Policy",
      level: 1,
    },
    {
      id: "data-protection-officer",
      title: "Data Protection Officer",
      level: 1,
    },
  ];

  // Scroll to section and update active state
  const scrollToSection = (sectionId: string) => {
    const element = document.getElementById(sectionId);
    if (element) {
      const offsetTop = element.offsetTop - 100; // Account for sticky nav
      window.scrollTo({
        top: offsetTop,
        behavior: "smooth",
      });
      setActiveSection(sectionId);
    }
  };

  // Update active section on scroll
  useEffect(() => {
    const handleScroll = () => {
      const sections = tocItems
        .map((item) => document.getElementById(item.id))
        .filter(Boolean);
      const scrollPosition = window.scrollY + 150;

      for (let i = sections.length - 1; i >= 0; i--) {
        const section = sections[i];
        if (section && section.offsetTop <= scrollPosition) {
          setActiveSection(section.id);
          break;
        }
      }
    };

    window.addEventListener("scroll", handleScroll);
    return () =>
      window.removeEventListener("scroll", handleScroll);
  }, []);

  // Handle URL fragments
  useEffect(() => {
    const hash = window.location.hash.replace("#", "");
    if (hash && tocItems.find((item) => item.id === hash)) {
      setTimeout(() => scrollToSection(hash), 100);
    }
  }, []);

  const lastUpdated = "2025-01-01";
  const versionHash = "v25.01";

  return (
    <div style={{ backgroundColor: "#FFFFFF" }}>

      {/* Hero Banner */}
      <section
        className="py-16 section-margin-x"
        style={{ backgroundColor: "#FFFFFF" }}
      >
        <div className="max-w-4xl mx-auto text-center">
          <div className="inline-flex items-center gap-2 px-4 py-2 bg-blue-100 text-blue-800 rounded-full text-small mb-6">
            <span className="w-2 h-2 bg-blue-600 rounded-full"></span>
            Privacy Document
            <span className="ml-2 px-2 py-1 bg-blue-200 text-blue-900 rounded text-xs font-medium">
              {versionHash}
            </span>
          </div>

          <h1 className="text-h1 mb-6">Privacy & Cookie Policy</h1>

          <p className="text-body-lg text-muted max-w-2xl mx-auto mb-4">
            This website 'leadershipcentre.in' ('Website') is owned and operated by Kautilya Leadership Centre Pvt. Ltd ('Kautilya Leadership Centre'), a company incorporated and registered under the laws of the Republic of India.
          </p>

          <p className="text-small text-muted">
            Last updated:{" "}
            {new Date(lastUpdated).toLocaleDateString("en-US", {
              year: "numeric",
              month: "long",
              day: "numeric",
            })}
          </p>
        </div>
      </section>

      <div
        className="section-margin-x"
        style={{ backgroundColor: "#FFFFFF" }}
      >
        <div className="max-w-6xl mx-auto">
          <div className="grid grid-cols-12 gap-8">
            {/* Sticky Table of Contents */}
            <div className="col-span-12 lg:col-span-3">
              <div className="sticky top-24">
                <nav
                  aria-label="On-page navigation"
                  className="bg-white border border-gray-200 rounded-lg p-6 shadow-sm"
                >
                  <div className="flex items-center justify-between mb-4 lg:hidden">
                    <h3 className="text-h4">Contents</h3>
                    <button
                      onClick={() => setTocOpen(!tocOpen)}
                      className="p-2 hover:bg-gray-100 rounded-md transition-colors"
                      aria-expanded={tocOpen}
                    >
                      <ChevronRight
                        className={`w-4 h-4 transition-transform ${tocOpen ? "rotate-90" : ""}`}
                      />
                    </button>
                  </div>

                  <div
                    className={`space-y-2 ${tocOpen ? "block" : "hidden lg:block"}`}
                  >
                    {tocItems.map((item) => (
                      <button
                        key={item.id}
                        onClick={() => scrollToSection(item.id)}
                        className={`block w-full text-left p-2 rounded-md text-small transition-all duration-200 hover:bg-gray-100 ${
                          activeSection === item.id
                            ? "bg-blue-50 text-primary border-l-2 border-primary pl-3"
                            : "text-muted hover:text-black"
                        }`}
                      >
                        {item.title}
                      </button>
                    ))}
                  </div>
                </nav>
              </div>
            </div>

            {/* Main Content */}
            <div className="col-span-12 lg:col-span-9">
              <div
                className="max-w-3xl prose prose-lg"
                style={{ maxWidth: "720px" }}
              >
                {/* Introduction */}
                <section
                  id="introduction"
                  className="mb-12 scroll-mt-24"
                >
                  <h2
                    className="text-h2 mb-6 group cursor-pointer"
                    onClick={() =>
                      scrollToSection("introduction")
                    }
                  >
                    <span className="inline-flex items-center gap-2">
                      Introduction
                      <ExternalLink className="w-5 h-5 opacity-0 group-hover:opacity-100 transition-opacity" />
                    </span>
                  </h2>
                  <div className="space-y-4">
                    <p className="text-body-lg">
                      Please read carefully the terms of use ('Terms of Use') for using the Electronic Platform. 
                      In case, you ('User') do not agree to any of the terms or conditions, made by Kautilya 
                      Leadership Centre for the Electronic Platform, kindly refrain from using the Electronic Platform.
                    </p>
                    <p className="text-body">
                      Pursuant to the Terms of Use, this privacy & cookie policy ('Policy') of Kautilya Leadership 
                      Centre governs the access to and use of this Electronic Platform, and also sharing, storing 
                      and processing of data and information in the course of availing any services and or Courses 
                      offered by Kautilya Leadership Centre. By continuing to use the Electronic Platform, User 
                      shall be deemed to have read, understood, and be bound by this Policy.
                    </p>

                    <div className="bg-blue-50 border-l-4 border-blue-400 p-4 rounded-r-lg">
                      <p className="text-body text-blue-800">
                        <strong>Important:</strong> This policy governs how we collect, use, and protect your 
                        personal information. Please ensure you understand your privacy rights and our data practices.
                      </p>
                    </div>
                  </div>
                </section>

                {/* General Practice */}
                <section
                  id="general-practice"
                  className="mb-12 scroll-mt-24"
                >
                  <h2
                    className="text-h2 mb-6 group cursor-pointer"
                    onClick={() =>
                      scrollToSection("general-practice")
                    }
                  >
                    <span className="inline-flex items-center gap-2">
                      1. General Practice
                      <ExternalLink className="w-5 h-5 opacity-0 group-hover:opacity-100 transition-opacity" />
                    </span>
                  </h2>
                  <div className="space-y-4">
                    <p className="text-body">
                      <strong>1.1</strong> Kautilya Leadership Centre restricts the collection of data. The data collected and processed is strictly in the course of rendering of services and Courses offered by Kautilya Leadership Centre. This Policy intends to protect User's Information while putting User in control of Processing (as defined hereunder).
                    </p>
                    
                    <p className="text-body">
                      <strong>1.2</strong> For the purposes of, where applicable, Kautilya Leadership Centre is the 'Controller' and is in compliance of the requirements of GDPR.
                    </p>

                    <div className="bg-green-50 border-l-4 border-green-400 p-4 rounded-r-lg mt-6">
                      <p className="text-body text-green-800">
                        <strong>Privacy First:</strong> We are committed to collecting only the data necessary to 
                        provide our services and maintaining strict control over how your information is processed.
                      </p>
                    </div>
                  </div>
                </section>

                {/* Definitions */}
                <section
                  id="definitions"
                  className="mb-12 scroll-mt-24"
                >
                  <h2
                    className="text-h2 mb-6 group cursor-pointer"
                    onClick={() =>
                      scrollToSection("definitions")
                    }
                  >
                    <span className="inline-flex items-center gap-2">
                      2. Definitions
                      <ExternalLink className="w-5 h-5 opacity-0 group-hover:opacity-100 transition-opacity" />
                    </span>
                  </h2>
                  <div className="space-y-4">
                    <p className="text-body">
                      <strong>2.1</strong> <strong>'Applicable Laws'</strong> means any statute, law, regulation, ordinance, rule, judgment as applicable, notification, rule of common law or equity, order, decree, bye-law, government approval, directive, recommendations, guideline, requirement or other governmental restriction, or any similar form of decision of, or determination by, or any interpretation or policy by, any authority having jurisdiction over the matter in question;
                    </p>
                    
                    <p className="text-body">
                      <strong>2.2</strong> <strong>'Cookies'</strong> are small files which are stored on a User's device (computer, mobile, etcetera.). They are designed to hold a modest amount of data specific to a particular client and website, and can be accessed either by the web server or the client computer. For clarity, they store information such as cart details and login id and password, which makes it easier for the User to access and browse the Website;
                    </p>

                    <p className="text-body">
                      <strong>2.3</strong> <strong>'Course'</strong> refers to the leadership, managerial, and other functional courses including, but not limited to videos, textual materials, webinars, seminars, podcasts forming part of such course (whether made available online and/ or offline);
                    </p>

                    <p className="text-body">
                      <strong>2.4</strong> <strong>'Course User'</strong> shall mean a person nominated by the Subscriber to enrol for the Course or any person who enrols for the Course. In case the Subscriber is an individual, the Subscriber shall mean the Course User;
                    </p>

                    <p className="text-body">
                      <strong>2.5</strong> <strong>'Electronic Platform'</strong> means the Website, the Kautilya Leadership Centre mobile applications, television applications, our API's and other related services;
                    </p>

                    <p className="text-body">
                      <strong>2.6</strong> <strong>'Information'</strong> refers to data of a User and includes both Personal Data and Non-personal data;
                    </p>

                    <p className="text-body">
                      <strong>2.7</strong> <strong>'Non-personal data'</strong> means data which are not Personal Data;
                    </p>

                    <p className="text-body">
                      <strong>2.8</strong> <strong>'Personal Data'</strong> means any data relating to an identified or identifiable natural person; an identifiable natural person is one who can be identified, directly or indirectly, in particular by reference to an identifier such as a name, an identification number, location data, an online identifier or to one or more factors specific to the physical, physiological, genetic, mental, economic, cultural or social identity of that natural person;
                    </p>

                    <p className="text-body">
                      <strong>2.9</strong> <strong>'Processing'</strong> or <strong>'Processed'</strong> means any operation or set of operations which is performed on Personal Data or on sets of Personal Data, whether or not by automated means, such as collection, recording, organisation, structuring, storage, adaptation or alteration, retrieval, consultation, use, disclosure by transmission, dissemination or otherwise making available, alignment or combination, restriction, erasure or destruction. Such operation is done by a 'Processor';
                    </p>

                    <p className="text-body">
                      <strong>2.10</strong> <strong>'Subscriber'</strong> shall mean a person who has registered as a Subscriber with the Kautilya Leadership Centre;
                    </p>

                    <p className="text-body">
                      <strong>2.11</strong> <strong>'User'</strong> means and includes, the individual using, accessing and browsing the Electronic Platform, whether or not they purchase the Courses; User shall include a Course User or Subscriber as the case may be;
                    </p>

                    <p className="text-body">
                      <strong>2.12</strong> <strong>'Website'</strong> refers to all web pages, any content such as textual, visual or aural (including modules, videos, including calls to action, text placement, images and other information) made available online and/ or offline through leadershipcentre.in and provided by Kautilya Leadership Centre;
                    </p>

                    <div className="bg-gray-50 border border-gray-200 rounded-lg p-6 mt-6">
                      <h3 className="text-h3 mb-4 text-gray-800">Key Terms Summary</h3>
                      <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
                        <div>
                          <p className="text-body font-semibold mb-2">Personal Data:</p>
                          <p className="text-small text-gray-600">Any information that can identify you as an individual</p>
                        </div>
                        <div>
                          <p className="text-body font-semibold mb-2">Processing:</p>
                          <p className="text-small text-gray-600">Any operation performed on your personal data</p>
                        </div>
                        <div>
                          <p className="text-body font-semibold mb-2">Cookies:</p>
                          <p className="text-small text-gray-600">Small files stored on your device to improve your experience</p>
                        </div>
                        <div>
                          <p className="text-body font-semibold mb-2">Electronic Platform:</p>
                          <p className="text-small text-gray-600">Our website, apps, and related digital services</p>
                        </div>
                      </div>
                    </div>
                  </div>
                </section>

                {/* Collection of Data */}
                <section
                  id="collection-of-data"
                  className="mb-12 scroll-mt-24"
                >
                  <h2
                    className="text-h2 mb-6 group cursor-pointer"
                    onClick={() =>
                      scrollToSection("collection-of-data")
                    }
                  >
                    <span className="inline-flex items-center gap-2">
                      3. Collection of Data
                      <ExternalLink className="w-5 h-5 opacity-0 group-hover:opacity-100 transition-opacity" />
                    </span>
                  </h2>
                  <div className="space-y-4">
                    <p className="text-body">
                      <strong>3.1</strong> Kautilya Leadership Centre collects Information through following means:
                    </p>

                    <div className="ml-4 space-y-3">
                      <p className="text-body">
                        <strong>a.</strong> Through automated means i.e. by using Cookies, web beacons, Google Analytics, clear gifs, pixels, and other similar technologies ('Data Collection Tools'); and
                      </p>

                      <p className="text-body">
                        <strong>b.</strong> Through non-automated means i.e. Information provided through self-declaratory forms, using psychometric tools etc. Such Information is usually required when the User creates an account with the Kautilya Leadership Centre pursuant to registration, feedback, accesses materials, video recordings or podcast etc.
                      </p>
                    </div>

                    <p className="text-body">
                      <strong>3.2 Purpose:</strong> The collection of Information is for the purpose of enhancing, improving and personalising the usage of the Electronic Platform and provision of services and Courses offered by Kautilya Leadership Centre. Non-personal data of the User shall be processed for research purposes. Further, the Data Collection Tools allow Kautilya Leadership Centre to detect abuse such as spam or malware, and provide customised services such as ad or search preferences and ease the process of signing up for services and Courses.
                    </p>

                    <p className="text-body">
                      <strong>3.3 Records:</strong>
                    </p>

                    <div className="ml-4 space-y-2">
                      <p className="text-body">
                        <strong>(i)</strong> Kautilya Leadership Centre also may keep record of communication with the Users.
                      </p>

                      <p className="text-body">
                        <strong>(ii)</strong> Reports and data collected from and of the users for the purpose comparison and building user profile related data and for research and other purposes.
                      </p>
                    </div>

                    <div className="bg-blue-50 border-l-4 border-blue-400 p-4 rounded-r-lg mt-6">
                      <p className="text-body text-blue-800">
                        <strong>Data Collection Purpose:</strong> We collect data solely to improve your learning 
                        experience, provide better services, and ensure platform security. All collection is done 
                        with your consent and for legitimate business purposes.
                      </p>
                    </div>
                  </div>
                </section>

                {/* Usage of Information */}
                <section
                  id="usage-of-information"
                  className="mb-12 scroll-mt-24"
                >
                  <h2
                    className="text-h2 mb-6 group cursor-pointer"
                    onClick={() =>
                      scrollToSection("usage-of-information")
                    }
                  >
                    <span className="inline-flex items-center gap-2">
                      4. Usage of Information
                      <ExternalLink className="w-5 h-5 opacity-0 group-hover:opacity-100 transition-opacity" />
                    </span>
                  </h2>
                  <div className="space-y-4">
                    <p className="text-body">
                      <strong>4.1</strong> The Electronic Platform Processes Information collected only for the Purposes as set out in 3.2, in compliance with Applicable Laws. The Processing of Information is dependent on User's consent.
                    </p>
                    
                    <p className="text-body">
                      <strong>4.2</strong> The Processing of Information is pursuant to the User's access to the Electronic Platform; It includes Processing User's Course request, delivering orders of the Subscriber, emailing the Users as per their preferences, sharing newsletters, email updates, notifying amendments to this Policy, Terms of Use, processing payment of the Subscriber, managing account preference, updating the Course content, participating in or viewing webinars/seminars or podcast, sharing Information with the expert consultant or Course instructor etc.
                    </p>

                    <p className="text-body">
                      <strong>4.3</strong> The Information collected may also be used to provide customised recommendations, to communicate with the User.
                    </p>

                    <p className="text-body">
                      <strong>4.4</strong> Non- personal data of the User shall be used for research.
                    </p>

                    <p className="text-body">
                      <strong>4.5</strong> Further, all Personal Data is Processed only in compliance with Applicable Laws and for the purposes mentioned in this Section 4 of this Policy.
                    </p>

                    <p className="text-body">
                      <strong>4.6</strong> Kautilya Leadership Centre may request User's consent before using Information for a purpose that does not fall under this Policy.
                    </p>

                    <div className="bg-gray-50 border border-gray-200 rounded-lg p-6 mt-6">
                      <h3 className="text-h3 mb-4">How We Use Your Information</h3>
                      <ul className="list-disc pl-6 space-y-2 text-body">
                        <li>Process course enrollments and deliver educational content</li>
                        <li>Send personalized recommendations and updates</li>
                        <li>Manage your account preferences and settings</li>
                        <li>Process payments and handle billing</li>
                        <li>Communicate important policy changes</li>
                        <li>Facilitate interactions with instructors and experts</li>
                        <li>Conduct research to improve our services</li>
                      </ul>
                    </div>
                  </div>
                </section>

                {/* Sharing of Data or Information */}
                <section
                  id="sharing-of-data"
                  className="mb-12 scroll-mt-24"
                >
                  <h2
                    className="text-h2 mb-6 group cursor-pointer"
                    onClick={() =>
                      scrollToSection("sharing-of-data")
                    }
                  >
                    <span className="inline-flex items-center gap-2">
                      5. Sharing of Data or Information
                      <ExternalLink className="w-5 h-5 opacity-0 group-hover:opacity-100 transition-opacity" />
                    </span>
                  </h2>
                  <div className="space-y-4">
                    <p className="text-body">
                      <strong>5.1 Consent:</strong> Kautilya Leadership Centre does not Process and or share the User's Information without User's consent to this Policy.
                    </p>
                    
                    <p className="text-body">
                      <strong>5.2 For providing services:</strong> Information may be shared with personnel and affiliates of Kautilya Leadership Centre with appropriate confidentiality and adequate security measures for the purpose of rendering services. This includes, providing customer care support to the User.
                    </p>

                    <p className="text-body">
                      <strong>5.3 Third-party service providers or Processors:</strong> Kautilya Leadership Centre Processes User's Information with third parties in accordance with this Policy and individual agreements with third-party service providers only for the purpose of rendering of services and pursuant to the scope of the Courses offered by Kautilya Leadership Centre, in compliance with Applicable Laws. Such third parties may include consultants, cloud-storage service providers, banks, payment gateway systems, and content providers. Further, Kautilya Leadership Centre tries to ensure that such third-party service providers abide by this Policy and other Applicable Laws.
                    </p>

                    <p className="text-body">
                      <strong>5.4 For legal purposes:</strong> Kautilya Leadership Centre may share User's or Information, with the government or any institution if bound by the law to do so, and with any other entity which may endorse or sponsor the User's acccount (s) on the Electronic Platform.
                    </p>

                    <p className="text-body">
                      <strong>5.5 For processing payments:</strong> Kautilya Leadership Centre uses payment gateway services for online purchases (including refund) related transactions. The payment service provider obtains and process the required Personal and Non-personal data for payment related transactions by self-declaration of the User. Electronic Platform shall not be held liable for any Information, breach of any such Information provided to the payment service provider with regard to payment.
                    </p>

                    <p className="text-body">
                      <strong>5.6 In the event of Re-organisation:</strong> The Information of the Users shall be shared in case of merger, acquisition or reorganization of the Kautilya Leadership Centre. Such Processing shall be in accordance with this Policy and with knowledge (through notification) of the Users.
                    </p>

                    <p className="text-body">
                      <strong>5.7 Sharing of information by the User:</strong> The User may share details of the Course, Electronic Platform or services through links, emails, etcetera, such information, when shared publicly, allows User's content to become accessible through search engines.
                    </p>

                    <div className="bg-yellow-50 border-l-4 border-yellow-400 p-4 rounded-r-lg mt-6">
                      <p className="text-body text-yellow-800">
                        <strong>Third-Party Sharing:</strong> We only share your information with trusted partners 
                        and service providers who help us deliver our services. All third parties are bound by 
                        strict confidentiality and security requirements.
                      </p>
                    </div>
                  </div>
                </section>

                {/* Period of Retention and Information Storage */}
                <section
                  id="retention-storage"
                  className="mb-12 scroll-mt-24"
                >
                  <h2
                    className="text-h2 mb-6 group cursor-pointer"
                    onClick={() =>
                      scrollToSection("retention-storage")
                    }
                  >
                    <span className="inline-flex items-center gap-2">
                      6. Period of Retention and Information Storage
                      <ExternalLink className="w-5 h-5 opacity-0 group-hover:opacity-100 transition-opacity" />
                    </span>
                  </h2>
                  <div className="space-y-4">
                    <p className="text-body">
                      <strong>6.1</strong> Kautilya Leadership Centre only processes or stores Information for the Purpose as long as it is commercially or legally required and for the duration:
                    </p>

                    <div className="ml-4 space-y-2">
                      <p className="text-body">
                        <strong>a.</strong> the User browses the Electronic Platform;
                      </p>
                      <p className="text-body">
                        <strong>b.</strong> the User maintains an account on the Electronic Platform; and
                      </p>
                      <p className="text-body">
                        <strong>c.</strong> required or permitted under Applicable Laws;
                      </p>
                    </div>

                    <p className="text-body">
                      such Processing shall be in accordance with this Policy and other Applicable Laws.
                    </p>

                    <p className="text-body">
                      <strong>6.2</strong> The User may withdraw its consent in continuing to provide Information, both Personal Data and Non-Personal Data. In case, the User withdraws its consent, Kautilya Leadership Centre shall erase or delete the Information from their storage and also notify any third party. To clarify, any Information Processed post withdrawal of consent shall only be for compliance with Applicable Laws.
                    </p>

                    <div className="bg-green-50 border-l-4 border-green-400 p-4 rounded-r-lg mt-6">
                      <p className="text-body text-green-800">
                        <strong>Your Control:</strong> You have the right to withdraw consent and request deletion 
                        of your personal information at any time. We will honor such requests in accordance with 
                        applicable laws and our legal obligations.
                      </p>
                    </div>
                  </div>
                </section>

                {/* Rights of Users and Subscribers */}
                <section
                  id="user-rights"
                  className="mb-12 scroll-mt-24"
                >
                  <h2
                    className="text-h2 mb-6 group cursor-pointer"
                    onClick={() =>
                      scrollToSection("user-rights")
                    }
                  >
                    <span className="inline-flex items-center gap-2">
                      7. Rights of Users and Subscribers
                      <ExternalLink className="w-5 h-5 opacity-0 group-hover:opacity-100 transition-opacity" />
                    </span>
                  </h2>
                  <div className="space-y-4">
                    <h3 className="text-h3 mb-4">7.1 Rights of the User over information:</h3>
                    
                    <div className="ml-4 space-y-3">
                      <p className="text-body">
                        <strong>(i)</strong> the User has the right to control and deny the access of the Data Collection Tools which can be controlled through web browser and account settings of the User;
                      </p>
                      
                      <p className="text-body">
                        <strong>(ii)</strong> the User has the right to deny Information whenever such Information is required through the Electronic Platform for the purposes specified in Section 4 of this Policy, however, in such event, the Electronic Platform or Kautilya Leadership Centre may not be able to provide the requisite services or Course to the User;
                      </p>
                      
                      <p className="text-body">
                        <strong>(iii)</strong> the User has the right to rectify or update the Information;
                      </p>
                      
                      <p className="text-body">
                        <strong>(iv)</strong> the User has the right to complain to the respective protection authority in case of breach or issues regarding enforceability of User's rights, provided, such breach or issue has been first notified to Kautilya Leadership Centre and a time period of 90 days from the date of such notice of breach or issue to the Kautilya Leadership Centre has been given in order to rectify or provide an explanation for the same; and
                      </p>
                      
                      <p className="text-body">
                        <strong>(v)</strong> the User also reserve the right to give feedback or complain to the data protection officer in accordance with clause 12 of this Policy.
                      </p>
                    </div>

                    <h3 className="text-h3 mb-4 mt-8">7.2 Specific Rights of European Union subjects</h3>
                    
                    <p className="text-body">
                      In addition to the abovementioned, this Section additionally is applicable to the User who are residents of European Union. In accordance with GDPR, EU residents hold certain rights over the Information that they provide, as stated below:
                    </p>

                    <div className="ml-4 space-y-3">
                      <p className="text-body">
                        <strong>(i) Right of data portability</strong> – the User has the right to receive details and copy of Information collected from the User in compliance with this Policy. Such data or Information shall be stored in a portable, structured, commonly used and machine-readable format. Upon receiving a written request to access such Information or data Kautilya Leadership Centre shall transfer such Information to the User or any other third-party in accordance with the request and Applicable Laws. Furthermore, Kautilya Leadership Centre is not responsible for the security of the Information, its transmission or its processing once received by the third party. Kautilya Leadership Centre reserves the right to not provide the requested Information if the same would be a breach of another User's rights;
                      </p>
                      
                      <p className="text-body">
                        <strong>(ii) Right to restrict Processing</strong> – the User has the right to restrict the processing of the Information provided by the User unless such Information has to be processed in accordance with any law; and
                      </p>
                      
                      <p className="text-body">
                        <strong>(iii) Right to object</strong> – the User may object to the processing of Information which is used for direct marketing purposes, unless Kautilya Leadership Centre legitimate grounds for the processing which overrides the interests, rights and freedoms of such User or for the establishment, exercise or defence of legal claims.
                      </p>
                      
                      <p className="text-body">
                        <strong>(iv) Right to Erasure</strong> – Pursuant to Section 6.2 of this Policy, the User may request Kautilya Leadership Centre to erase all the Information Processed by Kautilya Leadership Centre relating to the User by contacting the support service in accordance with Section 7.1(vi) above.
                      </p>
                    </div>

                    <h3 className="text-h3 mb-4 mt-8">7.3 Specific Right for USA and Canada citizens</h3>
                    
                    <p className="text-body">
                      The User has the right to request access to the Information that the Electronic Platform collects and know whether such Information is being processed. However, Kautilya Leadership Centre retains the right to deny such request for access in cases where it may affect the right of any other Users or is exempted under any Applicable Law.
                    </p>

                    <p className="text-body">
                      <strong>7.4</strong> In order to claim or enforce the rights under the Sections 7.1 and 7.2, such User may be required to provide adequate and verifiable identity proof when called upon to do so.
                    </p>

                    <p className="text-body">
                      <strong>7.5</strong> In case any of the rights of a User, in compliance with Applicable Laws of respective jurisdiction, is not provided in this Policy, such User may contact Kautilya Leadership Centre's data protection officer in accordance with Section 12 of this Policy.
                    </p>

                    <div className="bg-blue-50 border border-blue-200 rounded-lg p-6 mt-6">
                      <h3 className="text-h3 mb-4 text-blue-800">Your Privacy Rights Summary</h3>
                      <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
                        <div>
                          <p className="text-body font-semibold mb-2">Control & Deny Access:</p>
                          <p className="text-small text-blue-700">Manage cookies and data collection through browser settings</p>
                        </div>
                        <div>
                          <p className="text-body font-semibold mb-2">Rectify & Update:</p>
                          <p className="text-small text-blue-700">Correct or update your personal information</p>
                        </div>
                        <div>
                          <p className="text-body font-semibold mb-2">Data Portability (EU):</p>
                          <p className="text-small text-blue-700">Receive your data in a portable format</p>
                        </div>
                        <div>
                          <p className="text-body font-semibold mb-2">Right to Erasure:</p>
                          <p className="text-small text-blue-700">Request deletion of your personal information</p>
                        </div>
                      </div>
                    </div>
                  </div>
                </section>

                {/* Jurisdiction */}
                <section
                  id="jurisdiction"
                  className="mb-12 scroll-mt-24"
                >
                  <h2
                    className="text-h2 mb-6 group cursor-pointer"
                    onClick={() =>
                      scrollToSection("jurisdiction")
                    }
                  >
                    <span className="inline-flex items-center gap-2">
                      8. Jurisdiction
                      <ExternalLink className="w-5 h-5 opacity-0 group-hover:opacity-100 transition-opacity" />
                    </span>
                  </h2>
                  <div className="space-y-4">
                    <p className="text-body">
                      <strong>8.1</strong> Any dispute regarding this Policy shall be subject to the exclusive jurisdiction of the courts at Mumbai, Maharashtra.
                    </p>
                    
                    <p className="text-body">
                      <strong>8.2</strong> Subject to Section 10 and in compliance with Applicable Laws, the User, in case is a resident outside India, may be entitled certain rights to raise complaints with the respective data protection authority within their jurisdiction.
                    </p>

                    <div className="bg-gray-50 border border-gray-200 rounded-lg p-6">
                      <p className="text-body">
                        <strong>Exclusive Jurisdiction:</strong> Mumbai, Maharashtra, India
                      </p>
                      <p className="text-body mt-2">
                        Any disputes arising from this privacy policy shall be subject to the exclusive 
                        jurisdiction of the courts in Mumbai, Maharashtra, India.
                      </p>
                    </div>
                  </div>
                </section>

                {/* Notifications of Data Breach */}
                <section
                  id="data-breach"
                  className="mb-12 scroll-mt-24"
                >
                  <h2
                    className="text-h2 mb-6 group cursor-pointer"
                    onClick={() =>
                      scrollToSection("data-breach")
                    }
                  >
                    <span className="inline-flex items-center gap-2">
                      9. Notifications of Data Breach
                      <ExternalLink className="w-5 h-5 opacity-0 group-hover:opacity-100 transition-opacity" />
                    </span>
                  </h2>
                  <div className="space-y-4">
                    <p className="text-body">
                      <strong>9.1</strong> Although, adequate safety measures and compliance is exercised, in the unlikely event of breach of the Information provided by the User to Kautilya Leadership Centre, Kautilya Leadership Centre shall notify and the assist all such affected Users promptly and in compliance with Applicable Laws.
                    </p>
                    
                    <p className="text-body">
                      <strong>9.2</strong> In case, a User learns of such a breach of Information, it may contact the data protection officer of Kautilya Leadership Centre and this in accordance with Section 12 of this Policy.
                    </p>

                    <div className="bg-red-50 border-l-4 border-red-400 p-4 rounded-r-lg mt-6">
                      <p className="text-body text-red-800">
                        <strong>Security Commitment:</strong> We implement robust security measures to protect your 
                        data. In the unlikely event of a breach, we will notify affected users promptly and take 
                        immediate action to secure your information.
                      </p>
                    </div>
                  </div>
                </section>

                {/* Disputes */}
                <section
                  id="disputes"
                  className="mb-12 scroll-mt-24"
                >
                  <h2
                    className="text-h2 mb-6 group cursor-pointer"
                    onClick={() =>
                      scrollToSection("disputes")
                    }
                  >
                    <span className="inline-flex items-center gap-2">
                      10. Disputes
                      <ExternalLink className="w-5 h-5 opacity-0 group-hover:opacity-100 transition-opacity" />
                    </span>
                  </h2>
                  <div className="space-y-4">
                    <p className="text-body">
                      <strong>10.1</strong> In the event of any dispute in respect of or concerning or connected with the interpretation or implementation or arising out this Policy, including any question regarding their existence, validity or termination, the same shall be at the first instance be amicably settled through good faith negotiations between the Parties.
                    </p>
                    
                    <p className="text-body">
                      <strong>10.2</strong> In case that a resolution of the dispute is not achieved within 30 (thirty) days from the date such dispute arises, as notified in writing by any party to the other party, then such dispute shall be referred to and finally resolved by arbitration by a sole arbitrator, administered by the Mumbai International Arbitration Centre ('MICA') in accordance with the Arbitration Rules of the Mumbai International Arbitration Centre ('MICA Rules') for the time being in force.
                    </p>

                    <p className="text-body">
                      <strong>10.3</strong> The award of the arbitration shall be final and binding on the Parties hereto and the seat and venue of arbitration shall be Mumbai, India. Language of the arbitration shall be in English.
                    </p>

                    <p className="text-body">
                      <strong>10.4</strong> The arbitrator shall give a reasoned decision or award, and shall allocate or appropriation cost, expenses and disbursement of the arbitration as the arbitrator may deem fair.
                    </p>

                    <div className="bg-blue-50 border-l-4 border-blue-400 p-4 rounded-r-lg mt-6">
                      <p className="text-body text-blue-800">
                        <strong>Dispute Resolution:</strong> We prefer to resolve disputes through direct communication. 
                        If formal procedures are needed, disputes will be resolved through arbitration in Mumbai, India.
                      </p>
                    </div>
                  </div>
                </section>

                {/* Amendment to the Policy */}
                <section
                  id="amendment"
                  className="mb-12 scroll-mt-24"
                >
                  <h2
                    className="text-h2 mb-6 group cursor-pointer"
                    onClick={() =>
                      scrollToSection("amendment")
                    }
                  >
                    <span className="inline-flex items-center gap-2">
                      11. Amendment to the Policy
                      <ExternalLink className="w-5 h-5 opacity-0 group-hover:opacity-100 transition-opacity" />
                    </span>
                  </h2>
                  <div className="space-y-4">
                    <p className="text-body">
                      <strong>11.1</strong> Kautilya Leadership Centre reserves the right to change or revise the Policy and terms of this Policy at any time by posting any changes or a revised Policy on this Electronic Platform, without advance notice to the User.
                    </p>
                    
                    <p className="text-body">
                      <strong>11.2</strong> Such amendment or the changed and or revised Policy will be effective immediately after it is posted on this Electronic Platform. Use of the Electronic Platform following the posting any such amendment or of a revised Policy will constitute the User's acceptance to any such changes or revisions.
                    </p>

                    <p className="text-body">
                      <strong>11.3</strong> Notwithstanding the above, such amendment shall be notified to the User in such manner as prescribed by law, if and when such requirement to notify the User is necessitated by law.
                    </p>

                    <div className="bg-yellow-50 border-l-4 border-yellow-400 p-4 rounded-r-lg mt-6">
                      <p className="text-body text-yellow-800">
                        <strong>Policy Updates:</strong> We may update this privacy policy from time to time. 
                        Changes will be effective immediately upon posting. We encourage you to review this 
                        policy periodically for any updates.
                      </p>
                    </div>
                  </div>
                </section>

                {/* Data Protection Officer */}
                <section
                  id="data-protection-officer"
                  className="mb-12 scroll-mt-24"
                >
                  <h2
                    className="text-h2 mb-6 group cursor-pointer"
                    onClick={() =>
                      scrollToSection("data-protection-officer")
                    }
                  >
                    <span className="inline-flex items-center gap-2">
                      12. Data Protection Officer
                      <ExternalLink className="w-5 h-5 opacity-0 group-hover:opacity-100 transition-opacity" />
                    </span>
                  </h2>
                  <div className="space-y-4">
                    <p className="text-body">
                      In case of any concerns or issues in relation to this Policy or Electronic Platform, the User may contact Kautilya Leadership Centre's data protection officer can be contacted at connect@leadershipcentre.in
                    </p>

                    <div className="bg-green-50 border border-green-200 rounded-lg p-6">
                      <h3 className="text-h3 mb-4 text-green-800">Contact Our Data Protection Officer</h3>
                      <div className="space-y-2">
                        <p className="text-body text-green-800">
                          <strong>Email:</strong> <a href="mailto:connect@leadershipcentre.in" className="underline hover:text-green-900">connect@leadershipcentre.in</a>
                        </p>
                        <p className="text-body text-green-800">
                          <strong>Organization:</strong> Kautilya Leadership Centre Pvt. Ltd
                        </p>
                        <p className="text-body text-green-800">
                          <strong>Purpose:</strong> Privacy concerns, data protection queries, policy questions
                        </p>
                      </div>
                    </div>

                    <div className="bg-blue-50 border-l-4 border-blue-400 p-4 rounded-r-lg mt-6">
                      <p className="text-body text-blue-800">
                        <strong>Privacy Support:</strong> Our data protection officer is available to address your 
                        privacy concerns, answer questions about this policy, and assist with exercising your 
                        privacy rights.
                      </p>
                    </div>
                  </div>
                </section>

                {/* Important Notice */}
                <section className="mb-12">
                  <div className="bg-gradient-to-r from-blue-50 to-green-50 border-2 border-primary rounded-lg p-8">
                    <h3 className="text-h3 mb-4 text-primary">
                      Privacy Compliance & Your Rights
                    </h3>
                    <p className="text-body mb-4">
                      This Privacy & Cookie Policy is effective as of the last updated date mentioned above. 
                      By using our Electronic Platform, you acknowledge that you have read, understood, and agree 
                      to be bound by this policy.
                    </p>
                    <p className="text-body text-muted">
                      For questions about your privacy rights, data processing, or this policy, please contact 
                      our Data Protection Officer. We are committed to protecting your privacy and ensuring 
                      compliance with all applicable data protection laws.
                    </p>
                  </div>
                </section>

                {/* Download Section */}
                <section className="mb-12">
                  <div className="text-center bg-gray-50 border border-gray-200 rounded-lg p-8">
                    <h3 className="text-h3 mb-4">Download Privacy & Cookie Policy</h3>
                    <p className="text-body text-muted mb-6">
                      Save a copy of this privacy policy for your records
                    </p>
                    <button
                      onClick={() => window.print()}
                      className="inline-flex items-center gap-2 px-6 py-3 bg-primary text-white rounded-lg hover:bg-primary/90 transition-colors"
                    >
                      <Download className="w-4 h-4" />
                      Download PDF
                    </button>
                  </div>
                </section>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  );
}