import Heading from "@/components/reuseables/Heading";
import React from "react";
import { Col, Container, Row } from "react-bootstrap";
import { motion } from "framer-motion";
import { fadeIn, slideFromLeft } from "@/components/reuseables/variants";
import Image from "next/image";
import Link from "next/link";
import IndustrySidebar from "./IndustrySidebar";
import Clientele from "@/components/reuseables/Clientele";
const OurApproachData = [
  {
    title: "Education   ",
    subtitle: "Our Approach",
    paragraphs: [
      "FC & CFO Services at Advith Consulting LLP brings together specialists at different functional layers enabling finance operations in your organisation to function in an efficient manner. Depending upon the requirement of the business, our areas of focus range from streamling routine finance operations to ensuring compliances including taxation and corporate law and even to strategic, business finance & assurance, to provide a holistic approach to financial management. ",
    ],
    imageSrc: "/images/about/people.jpg",
    imageAlt: "Approch",
  },
  // Add more objects here if you have more content sections
];

const Sidebar = [
  { name: "Transaction Advisory", link: "/services/details" },
  { name: "Business Advisory", link: "/services/details" },
  { name: "Risk Advisory", link: "/services/details" },
];

const TransactionAdvisory = [
  {
    title: "Deal Advisory",
    serviceIcon: "ri-group-2-line",
    descr: "Lorem Ipsum is simply dummy text",
  },
  {
    title: "Merger & Acquisition",
    serviceIcon: "ri-group-2-line",
    descr: "Lorem Ipsum is simply dummy text",
  },
  {
    title: "Due Diligence",
    serviceIcon: "ri-group-2-line",
    descr: "Lorem Ipsum is simply dummy text",
  },
  {
    title: "Fund Raise Assistance",
    serviceIcon: "ri-group-2-line",
    descr: "Lorem Ipsum is simply dummy text",
  },
  {
    title: "Project Management ",
    serviceIcon: "ri-group-2-line",
    descr: "Lorem Ipsum is simply dummy text",
  },
];

const BusinessAdvisory = [
  {
    title: "Strategic Office ",
    serviceIcon: "ri-group-2-line",
    descr:
      "Lorem Ipsum is simply dummy text of the printing and typesetting industry.",
  },
  {
    title: "Taxation ",
    serviceIcon: "ri-group-2-line",
    descr:
      "Lorem Ipsum is simply dummy text of the printing and typesetting industry.",
  },
  {
    title: "Business Modelling ",
    serviceIcon: "ri-group-2-line",
    descr:
      "Lorem Ipsum is simply dummy text of the printing and typesetting industry.",
  },
  {
    title: "Family Business Structuring",
    serviceIcon: "ri-group-2-line",
    descr:
      "Lorem Ipsum is simply dummy text of the printing and typesetting industry.",
  },
];

const RiskAdvisory = [
  {
    title: "Establishing Process & Internal Controls",
    serviceIcon: "ri-group-2-line",

    descr:
      "Lorem Ipsum is simply dummy text of the printing and typesetting industry.",
  },
  {
    title: "Review of Internal Controls ",
    serviceIcon: "ri-group-2-line",

    descr:
      "Lorem Ipsum is simply dummy text of the printing and typesetting industry.",
  },
];

const partners = [
  {
    id: 1,
    image: "/images/partner/partner1.png",
    altText: "partner",
    link: "#",
  },
  {
    id: 2,
    image: "/images/partner/partner2.png",
    altText: "partner",
    link: "#",
  },
  {
    id: 3,
    image: "/images/partner/partner1.png",
    altText: "partner",
    link: "#",
  },
  {
    id: 4,
    image: "/images/partner/partner2.png",
    altText: "partner",
    link: "#",
  },
  {
    id: 5,
    image: "/images/partner/partner1.png",
    altText: "partner",
    link: "#",
  },
];

const Education = () => {
  return (
    <>
      <div className="our-approch ptb-100">
        <Container>
          {OurApproachData.map((item) => (
            <Row className="align-items-center" key={item.id}>
              <Col lg={6} md={12}>
                <div className="what-we-do-text">
                  <span className="sub-title">{item.subtitle}</span>
                  <Heading el="h2" heading={item.title} className="h2" />
                  {item.paragraphs.map((paragraph, index) => (
                    <p key={index}>{paragraph}</p>
                  ))}
                </div>
              </Col>

              <Col lg={6} md={12}>
                <div className="what-we-do-img">
                  <motion.div
                    variants={fadeIn(0.4)}
                    initial={"hidden"}
                    whileInView={"show"}
                    viewport={{ once: false, amount: 0.2 }}
                  >
                    <Image
                      src={item.imageSrc}
                      alt={item.imageAlt}
                      layout="fill"
                      className="img-fluid image"
                    />
                  </motion.div>
                </div>
              </Col>
            </Row>
          ))}
        </Container>
      </div>

      <section className="bg-light pb-100 pt-100">
        <Container>
          <Row>
            <Col md={3} sm={12}>
              <IndustrySidebar title="CFO Services" services={Sidebar} />
            </Col>
            <Col md={9} sm={12}>
              <section className="cfo-services pb-50 pt-50">
                <Container>
                  <Row className="justify-content-center align-items-center">
                    {TransactionAdvisory &&
                      TransactionAdvisory.map((service) => (
                        <Col lg={4} md={6} sm={6} key={service.id}>
                          <div className="single-services-item border">
                            <div className="d-flex align-items-center icon">
                              <i className={service.serviceIcon}></i>
                            </div>
                            <h5> {service.title}</h5>
                            <p>{service.descr}</p>
                          </div>
                        </Col>
                      ))}
                  </Row>
                </Container>
              </section>
            </Col>
          </Row>
        </Container>
        <Container className="pt-100">
          <Row>
            <Col md={3} sm={12}>
              <div className="what-we-do-text text-left">
                <span className="sub-title">lorem</span>
                <Heading el="h2" heading="Clientele" />
              </div>
            </Col>
            <Col md={8} sm={12} className="align-self-center">
              <Clientele partners={partners} />
            </Col>
          </Row>
        </Container>
      </section>
    </>
  );
};

export default Education;