nvis-fe-cms-libs 1.0.1 → 1.0.3

package/dist/nvis-fe-cms-libs.es.js

@@ -1,4 +1,55 @@
-import require$$0, { useRef, useState, useEffect, useMemo } from "react";
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+import require$$0, { useRef, useState, useEffect, useMemo, forwardRef, createElement } from "react";
 var jsxRuntime = { exports: {} };
 var reactJsxRuntime_production = {};
 /**
@@ -903,7 +954,7 @@ const PartnerCard = ({ partner, idx, t, getLogoUrl, isDarkMode }) => {
     }
   );
 };
-function useWindowSize() {
+function useWindowSize$1() {
   const [width, setWidth] = useState(
     typeof window !== "undefined" ? window.innerWidth : 1200
   );
@@ -921,7 +972,7 @@ const PartnersSection = ({ data, t, isDarkMode, imageBaseUrl = "" }) => {
   const [currentPartnerSlide, setCurrentPartnerSlide] = useState(0);
   const [partnersVisible, setPartnersVisible] = useState(false);
   const partnersRef = useRef(null);
-  const windowWidth = useWindowSize();
+  const windowWidth = useWindowSize$1();
   const getLogoUrl = (logoUrl) => {
     if (!logoUrl) return null;
     if (logoUrl.startsWith("http")) return logoUrl;
@@ -1029,18 +1080,2038 @@ const PartnersSection = ({ data, t, isDarkMode, imageBaseUrl = "" }) => {
     }
   );
 };
-const index = {
-  AboutCompanySection,
-  CompanyValues,
-  TimelineSection,
-  PartnerCard,
-  PartnersSection
+const MilestoneSection = ({ data, t, isDarkMode, getMilestoneTimeline }) => {
+  const [milestones, setMilestones] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [timelineVisible, setTimelineVisible] = useState([]);
+  const timelineRefs = useRef([]);
+  useEffect(() => {
+    const fetchMilestones = () => __async(null, null, function* () {
+      var _a;
+      if (getMilestoneTimeline) {
+        try {
+          setLoading(true);
+          const res = yield getMilestoneTimeline();
+          if (res.success) {
+            setMilestones(res.data || []);
+          } else {
+            setMilestones([]);
+          }
+        } catch (error) {
+          setMilestones([]);
+        } finally {
+          setLoading(false);
+        }
+      } else {
+        const milestonesData = ((_a = data == null ? void 0 : data.sectionDataBindingItems) == null ? void 0 : _a.map((item) => item.data)) || [];
+        setMilestones(milestonesData);
+        setLoading(false);
+      }
+    });
+    fetchMilestones();
+  }, []);
+  useEffect(() => {
+    setTimelineVisible(new Array(milestones.length).fill(false));
+  }, [milestones.length]);
+  useEffect(() => {
+    const observer = new IntersectionObserver(
+      (entries) => {
+        entries.forEach((entry) => {
+          if (entry.isIntersecting) {
+            const index2 = timelineRefs.current.findIndex(
+              (el) => el === entry.target
+            );
+            if (index2 !== -1) {
+              setTimelineVisible((prev) => {
+                const newVisible = [...prev];
+                newVisible[index2] = true;
+                return newVisible;
+              });
+            }
+            observer.unobserve(entry.target);
+          }
+        });
+      },
+      { threshold: 0.1 }
+    );
+    timelineRefs.current.forEach((el) => el && observer.observe(el));
+    return () => {
+      timelineRefs.current.forEach((el) => el && observer.unobserve(el));
+    };
+  }, [milestones.length]);
+  if (loading) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("section", { className: "py-20 text-center", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: isDarkMode ? "text-white" : "text-gray-800", children: t("milestone.status.loadingData") }) });
+  }
+  if (!milestones.length) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "section",
+      {
+        className: `py-20 ${isDarkMode ? "bg-gray-900/50" : "bg-white"}`,
+        children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "max-w-7xl mx-auto px-4 text-center", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "h3",
+            {
+              className: `text-lg font-semibold mb-2 ${isDarkMode ? "text-white" : "text-gray-900"}`,
+              children: t("milestone.status.noData")
+            }
+          ),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "p",
+            {
+              className: `${isDarkMode ? "text-gray-300" : "text-gray-600"}`,
+              children: t("milestone.noDataDescription")
+            }
+          )
+        ] })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    "section",
+    {
+      className: `py-20 ${isDarkMode ? "bg-gray-800" : "bg-white"}`,
+      children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center mb-12", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            "div",
+            {
+              className: `relative inline-block px-4 py-2 rounded-full text-sm font-semibold mb-4 border transition-all duration-300 transform hover:scale-105 shadow-md hover:shadow-lg overflow-hidden ${isDarkMode ? "bg-gradient-to-br from-slate-900 via-blue-900 to-indigo-900 text-emerald-300 border-blue-800" : "bg-white text-emerald-800 border-gray-200"}`,
+              children: [
+                "📈 ",
+                t("milestone.header.badge")
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            "h2",
+            {
+              className: `text-3xl lg:text-4xl font-bold mb-4 ${isDarkMode ? "text-white" : "text-gray-900"}`,
+              children: [
+                t("milestone.header.title"),
+                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "block bg-gradient-to-r from-emerald-600 to-teal-600 bg-clip-text text-transparent", children: t("milestone.header.subtitle") })
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "relative", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute left-1/2 transform -translate-x-1/2 w-1 h-full bg-gradient-to-b from-blue-500 to-purple-600 rounded-full" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "space-y-8", children: milestones.map((milestone, index2) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            "div",
+            {
+              ref: (el) => timelineRefs.current[index2] = el,
+              className: `flex items-center transition-all duration-700 ease-out ${index2 % 2 === 0 ? "flex-row" : "flex-row-reverse"} ${timelineVisible[index2] ? "opacity-100 scale-100" : "opacity-0 scale-75"}`,
+              style: { transitionDelay: `${index2 * 200}ms` },
+              children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 px-8", children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
+                  "div",
+                  {
+                    className: `relative p-5 rounded-xl shadow-lg transition-all duration-300 hover:shadow-xl overflow-hidden ${isDarkMode ? "bg-gradient-to-br from-slate-900 via-blue-900 to-indigo-900 border border-blue-800 hover:border-blue-600" : "bg-gray-50 hover:shadow-2xl"}`,
+                    children: [
+                      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-blue-600 font-bold text-xl mb-2", children: milestone.time }),
+                      /* @__PURE__ */ jsxRuntimeExports.jsx(
+                        "h3",
+                        {
+                          className: `text-lg font-bold mb-2 ${isDarkMode ? "text-white" : "text-gray-900"}`,
+                          children: milestone.title
+                        }
+                      ),
+                      /* @__PURE__ */ jsxRuntimeExports.jsx(
+                        "p",
+                        {
+                          className: `${isDarkMode ? "text-gray-300" : "text-gray-600"}`,
+                          children: milestone.description
+                        }
+                      )
+                    ]
+                  }
+                ) }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx(
+                  "div",
+                  {
+                    className: `w-6 h-6 bg-gradient-to-r from-blue-500 to-purple-600 rounded-full border-4 ${isDarkMode ? "border-gray-800" : "border-white"} shadow-[0_0_10px_5px_rgba(59,130,246,0.5)] flex-shrink-0 z-10 animate-pulse`
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1" })
+              ]
+            },
+            milestone.id
+          )) })
+        ] })
+      ] })
+    }
+  );
+};
+const TestimonialsSection = ({ data, t, isDarkMode }) => {
+  var _a;
+  const [currentIndex, setCurrentIndex] = useState(0);
+  const testimonials = ((_a = data == null ? void 0 : data.sectionDataBindingItems) == null ? void 0 : _a.map((item) => ({
+    quote: item.data.content,
+    author: item.data.customerName,
+    position: item.data.customerTitle || t("testimonials.fallback.defaultPosition"),
+    company: item.data.customerCompany || ""
+  }))) || [];
+  const fallbackTestimonials = [
+    {
+      quote: t("testimonials.fallback.testimonial1.quote"),
+      author: t("testimonials.fallback.testimonial1.author"),
+      position: t("testimonials.fallback.testimonial1.position"),
+      company: t("testimonials.fallback.testimonial1.company")
+    },
+    {
+      quote: t("testimonials.fallback.testimonial2.quote"),
+      author: t("testimonials.fallback.testimonial2.author"),
+      position: t("testimonials.fallback.testimonial2.position"),
+      company: t("testimonials.fallback.testimonial2.company")
+    },
+    {
+      quote: t("testimonials.fallback.testimonial3.quote"),
+      author: t("testimonials.fallback.testimonial3.author"),
+      position: t("testimonials.fallback.testimonial3.position"),
+      company: t("testimonials.fallback.testimonial3.company")
+    }
+  ];
+  const displayTestimonials = testimonials.length > 0 ? testimonials : fallbackTestimonials;
+  useEffect(() => {
+    if (displayTestimonials.length > 1) {
+      const interval = setInterval(() => {
+        setCurrentIndex((prev) => (prev + 1) % displayTestimonials.length);
+      }, 5e3);
+      return () => clearInterval(interval);
+    }
+  }, [displayTestimonials.length]);
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    "section",
+    {
+      className: `py-20 transition-colors duration-200 ${isDarkMode ? "bg-gray-700" : "bg-gray-50"}`,
+      children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          "div",
+          {
+            className: `inline-block px-4 py-2 rounded-full text-sm font-semibold mb-4 ${isDarkMode ? "bg-indigo-900/50 text-indigo-300 border border-indigo-800" : "bg-indigo-100 text-indigo-800"}`,
+            children: [
+              "💬 ",
+              t("testimonials.header.badge")
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          "h2",
+          {
+            className: `text-3xl lg:text-4xl font-bold mb-8 transition-colors duration-200 ${isDarkMode ? "text-white" : "text-gray-900"}`,
+            children: [
+              t("testimonials.header.title"),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "block bg-gradient-to-r from-indigo-600 to-purple-600 bg-clip-text text-transparent", children: t("testimonials.header.subtitle") })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "relative", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            "div",
+            {
+              className: `p-6 rounded-2xl transition-all duration-500 transform ${isDarkMode ? "bg-gray-800/80 backdrop-blur-sm border border-gray-700" : "bg-white"}`,
+              children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsxs(
+                  "blockquote",
+                  {
+                    className: `text-lg lg:text-xl italic mb-6 animate-fadeIn transition-colors duration-200 ${isDarkMode ? "text-gray-300" : "text-gray-700"}`,
+                    children: [
+                      '"',
+                      displayTestimonials[currentIndex].quote,
+                      '"'
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-center space-x-4 animate-fadeIn", children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-3xl", children: "👤" }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-left", children: [
+                    /* @__PURE__ */ jsxRuntimeExports.jsx(
+                      "div",
+                      {
+                        className: `font-bold text-base transition-colors duration-200 ${isDarkMode ? "text-white" : "text-gray-900"}`,
+                        children: displayTestimonials[currentIndex].author
+                      }
+                    ),
+                    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-blue-600 font-medium text-sm", children: displayTestimonials[currentIndex].position }),
+                    displayTestimonials[currentIndex].company && /* @__PURE__ */ jsxRuntimeExports.jsx(
+                      "div",
+                      {
+                        className: `text-xs transition-colors duration-200 ${isDarkMode ? "text-gray-400" : "text-gray-600"}`,
+                        children: displayTestimonials[currentIndex].company
+                      }
+                    )
+                  ] })
+                ] })
+              ]
+            },
+            currentIndex
+          ),
+          displayTestimonials.length > 1 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex justify-center space-x-2 mt-4", children: displayTestimonials.map((_, index2) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "button",
+            {
+              onClick: () => setCurrentIndex(index2),
+              className: `w-2.5 h-2.5 rounded-full transition-all duration-300 ${index2 === currentIndex ? "bg-blue-600" : isDarkMode ? "bg-gray-600 hover:bg-gray-500" : "bg-gray-300 hover:bg-gray-400"}`
+            },
+            index2
+          )) })
+        ] })
+      ] })
+    }
+  );
+};
+const PartnerListCard = ({ partner, idx = 0, t, isDarkMode, getLogoUrl }) => {
+  const itemRef = useRef(null);
+  const [visible, setVisible] = useState(false);
+  const [isHovered, setIsHovered] = useState(false);
+  if (!partner) return null;
+  useEffect(() => {
+    const observer = new IntersectionObserver(
+      (entries) => {
+        entries.forEach((entry) => {
+          if (entry.isIntersecting) {
+            setVisible(true);
+            observer.unobserve(entry.target);
+          }
+        });
+      },
+      { threshold: 0.2 }
+    );
+    if (itemRef.current) observer.observe(itemRef.current);
+    return () => itemRef.current && observer.unobserve(itemRef.current);
+  }, []);
+  const logoSrc = getLogoUrl ? getLogoUrl(partner.logoUrl) : null;
+  const handleImageError = (e) => {
+    e.target.style.display = "none";
+    e.target.nextSibling.style.display = "flex";
+  };
+  const handleClick = () => {
+    if (partner.websiteUrl) {
+      window.open(partner.websiteUrl, "_blank", "noopener,noreferrer");
+    }
+  };
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    "div",
+    {
+      ref: itemRef,
+      className: `relative flex flex-col items-center justify-center p-4 rounded-xl shadow-sm transition-all duration-700 ease-out cursor-pointer overflow-hidden min-h-[180px]
+        ${isDarkMode ? "bg-gradient-to-br from-slate-900 via-blue-900 to-indigo-900 border border-blue-800" : "bg-white border border-gray-200"}
+        ${visible ? "opacity-100 scale-100" : "opacity-0 scale-75"}
+        ${isHovered ? isDarkMode ? "border-blue-500 shadow-lg shadow-blue-500/20 -translate-y-1" : "border-blue-300 shadow-lg shadow-blue-500/20 -translate-y-1" : ""}`,
+      style: {
+        transitionDelay: `${idx * 150}ms`,
+        transform: `translateY(${isHovered ? "-4px" : "0px"}) scale(${visible ? "1" : "0.75"})`
+      },
+      onMouseEnter: () => setIsHovered(true),
+      onMouseLeave: () => setIsHovered(false),
+      onClick: handleClick,
+      children: [
+        isDarkMode && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute w-12 h-12 bg-white/5 rounded-full", style: { left: "10%", top: "20%" } }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute w-10 h-10 bg-white/5 rounded-full", style: { right: "30%", bottom: "10%" } }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute w-14 h-14 bg-white/5 rounded-md", style: { left: "20%", bottom: "30%" } }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute inset-0 opacity-20", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "div",
+            {
+              style: {
+                backgroundImage: `url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Ccircle cx='30' cy='30' r='2'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")`,
+                backgroundSize: "60px 60px"
+              },
+              className: "w-full h-full"
+            }
+          ) })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "div",
+          {
+            className: `w-20 h-14 flex items-center justify-center mb-4 rounded-lg overflow-hidden border transition-all duration-300
+          ${isDarkMode ? "border-gray-600" : "border-gray-200"}
+          ${isHovered ? "border-blue-500" : ""}
+        `,
+            style: {
+              background: isDarkMode ? isHovered ? "linear-gradient(135deg, #4b5563 0%, #374151 100%)" : "linear-gradient(135deg, #374151 0%, #1f2937 100%)" : isHovered ? "linear-gradient(135deg, #ffffff 0%, #f8fafc 100%)" : "linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%)"
+            },
+            children: logoSrc ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(
+                "img",
+                {
+                  src: logoSrc,
+                  alt: partner.name || t("partners.logoAlt") || "Partner logo",
+                  className: "max-w-full max-h-full object-contain transition-all duration-300",
+                  style: {
+                    filter: isDarkMode ? isHovered ? "grayscale(0) opacity(1)" : "grayscale(0.3) opacity(0.8)" : isHovered ? "grayscale(0) opacity(1)" : "grayscale(0.2) opacity(0.9)",
+                    transform: isHovered ? "scale(1.05)" : "scale(1)"
+                  },
+                  onError: handleImageError,
+                  loading: "lazy"
+                }
+              ),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-full h-full bg-gradient-to-br from-blue-500 to-purple-600 flex items-center justify-center", style: { display: "none" }, children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-white font-bold text-center text-sm px-1", children: partner.name }) })
+            ] }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-full h-full bg-gradient-to-br from-blue-500 to-purple-600 flex items-center justify-center", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-white font-bold text-center text-sm px-1", children: partner.name }) })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("h4", { className: `font-bold text-center mb-2 text-sm leading-tight ${isDarkMode ? "text-white" : "text-gray-900"}`, children: partner.name }),
+        partner.description && /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `text-xs text-center mb-3 line-clamp-2 px-1 ${isDarkMode ? "text-gray-300" : "text-gray-600"}`, children: partner.description }),
+        partner.websiteUrl && /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "div",
+          {
+            className: "transition-all duration-300",
+            style: {
+              opacity: isHovered ? 1 : 0,
+              transform: `translateY(${isHovered ? "0px" : "4px"})`
+            },
+            children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-xs text-blue-600 font-medium", children: [
+              t("partners.viewDetails") || "Xem chi tiết",
+              " →"
+            ] })
+          }
+        )
+      ]
+    }
+  );
+};
+function useWindowSize() {
+  const [width, setWidth] = useState(
+    typeof window !== "undefined" ? window.innerWidth : 1200
+  );
+  useEffect(() => {
+    const handleResize = () => setWidth(window.innerWidth);
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, []);
+  return width;
+}
+const PartnerListSection = ({ t, isDarkMode, getPartnerList, imageBaseUrl = "" }) => {
+  const [partnersData, setPartnersData] = useState([]);
+  const [error, setError] = useState(null);
+  const [loading, setLoading] = useState(true);
+  const [currentPartnerSlide, setCurrentPartnerSlide] = useState(0);
+  const [partnersVisible, setPartnersVisible] = useState(false);
+  const partnersRef = useRef(null);
+  const windowWidth = useWindowSize();
+  const getLogoUrl = (logoUrl) => {
+    if (!logoUrl) return null;
+    if (logoUrl.startsWith("http")) return logoUrl;
+    return `${imageBaseUrl}${logoUrl}`;
+  };
+  useEffect(() => {
+    const fetchData = () => __async(null, null, function* () {
+      try {
+        const res = yield getPartnerList();
+        if (res.success) {
+          setPartnersData(res.data || []);
+        } else {
+          setError(res.error || "Error fetching partners");
+        }
+      } catch (err) {
+        setError(err.message);
+      } finally {
+        setLoading(false);
+      }
+    });
+    fetchData();
+  }, []);
+  const partners = useMemo(() => {
+    const getPerSlide = () => {
+      if (windowWidth < 640) return 2;
+      if (windowWidth < 1024) return 3;
+      return 4;
+    };
+    const grouped = [];
+    const perSlide = getPerSlide();
+    for (let i = 0; i < partnersData.length; i += perSlide) {
+      grouped.push(partnersData.slice(i, i + perSlide));
+    }
+    return grouped;
+  }, [partnersData, windowWidth]);
+  useEffect(() => {
+    if (partners.length > 1) {
+      const interval = setInterval(() => {
+        setCurrentPartnerSlide((prev) => (prev + 1) % partners.length);
+      }, 5e3);
+      return () => clearInterval(interval);
+    }
+  }, [partners.length]);
+  useEffect(() => {
+    const fallbackTimer = setTimeout(() => {
+      setPartnersVisible(true);
+    }, 500);
+    const observer = new IntersectionObserver(
+      (entries) => {
+        entries.forEach((entry) => {
+          if (entry.isIntersecting) {
+            clearTimeout(fallbackTimer);
+            setPartnersVisible(true);
+            observer.unobserve(entry.target);
+          }
+        });
+      },
+      { threshold: 0.1, rootMargin: "50px" }
+    );
+    if (partnersRef.current) {
+      observer.observe(partnersRef.current);
+    } else {
+      clearTimeout(fallbackTimer);
+      setPartnersVisible(true);
+    }
+    return () => {
+      clearTimeout(fallbackTimer);
+      if (partnersRef.current) {
+        observer.unobserve(partnersRef.current);
+      }
+    };
+  }, []);
+  if (loading) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("section", { className: "py-20 text-center", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: isDarkMode ? "text-white" : "text-gray-800", children: t("partners.loading") || "Đang tải danh sách đối tác..." }) });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("section", { className: "py-20 text-center", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-red-500", children: t("partners.error") || error }) });
+  }
+  if (!partnersData.length) return null;
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    "section",
+    {
+      className: `py-12 lg:py-20 transition-colors duration-300 ${isDarkMode ? "bg-gradient-to-b from-gray-950 via-gray-900 to-gray-800" : "bg-gradient-to-b from-white via-gray-50 to-gray-100"}`,
+      children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center mb-12", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            "div",
+            {
+              className: `inline-block px-4 py-2 rounded-full text-sm font-semibold mb-4 border shadow-sm ${isDarkMode ? "bg-blue-900/30 text-blue-300 border-blue-800" : "bg-blue-100 text-blue-800 border-blue-200"}`,
+              children: [
+                "🤝 ",
+                t("partners.badge") || "ĐỐI TÁC CHIẾN LƯỢC"
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            "h2",
+            {
+              className: `text-3xl lg:text-5xl font-bold leading-tight ${isDarkMode ? "text-white" : "text-gray-800"}`,
+              children: [
+                t("partners.title.part1") || "Đồng hành cùng",
+                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "block bg-gradient-to-r from-blue-500 to-purple-500 bg-clip-text text-transparent mt-2", children: t("partners.title.part2") || "Những thương hiệu hàng đầu" })
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { ref: partnersRef, className: "relative", children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          "div",
+          {
+            className: `transition-all duration-1000 ease-out ${partnersVisible ? "opacity-100 scale-100" : "opacity-0 scale-95"}`,
+            children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "relative overflow-hidden mb-8", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "min-h-[220px]", children: partners.map((group, slideIndex) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+                "div",
+                {
+                  className: `absolute inset-0 w-full transition-all duration-1000 ease-in-out ${slideIndex === currentPartnerSlide ? "opacity-100 translate-x-0" : slideIndex < currentPartnerSlide ? "opacity-0 -translate-x-full" : "opacity-0 translate-x-full"}`,
+                  style: { zIndex: slideIndex === currentPartnerSlide ? 10 : 1 },
+                  children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-6 px-2", children: group.map((partner, idx) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+                    PartnerListCard,
+                    {
+                      partner,
+                      idx,
+                      t,
+                      isDarkMode,
+                      getLogoUrl
+                    },
+                    partner.id || `${slideIndex}-${idx}`
+                  )) })
+                },
+                slideIndex
+              )) }) }),
+              partners.length > 1 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex justify-center space-x-2", style: { zIndex: 50 }, children: partners.map((_, index2) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+                "button",
+                {
+                  onClick: () => setCurrentPartnerSlide(index2),
+                  className: `w-3 h-3 rounded-full transition-all duration-300 ${index2 === currentPartnerSlide ? "bg-blue-500 scale-125 shadow-lg" : isDarkMode ? "bg-gray-600 hover:bg-blue-400" : "bg-gray-300 hover:bg-blue-500"}`,
+                  "aria-label": `Slide ${index2 + 1}`
+                },
+                index2
+              )) })
+            ]
+          }
+        ) })
+      ] })
+    }
+  );
+};
+/**
+ * @license lucide-react v0.544.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const toKebabCase = (string) => string.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
+const toCamelCase = (string) => string.replace(
+  /^([A-Z])|[\s-_]+(\w)/g,
+  (match, p1, p2) => p2 ? p2.toUpperCase() : p1.toLowerCase()
+);
+const toPascalCase = (string) => {
+  const camelCase = toCamelCase(string);
+  return camelCase.charAt(0).toUpperCase() + camelCase.slice(1);
+};
+const mergeClasses = (...classes) => classes.filter((className, index2, array) => {
+  return Boolean(className) && className.trim() !== "" && array.indexOf(className) === index2;
+}).join(" ").trim();
+const hasA11yProp = (props) => {
+  for (const prop in props) {
+    if (prop.startsWith("aria-") || prop === "role" || prop === "title") {
+      return true;
+    }
+  }
+};
+/**
+ * @license lucide-react v0.544.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+var defaultAttributes = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: 24,
+  height: 24,
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  strokeWidth: 2,
+  strokeLinecap: "round",
+  strokeLinejoin: "round"
+};
+/**
+ * @license lucide-react v0.544.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const Icon = forwardRef(
+  (_a, ref) => {
+    var _b = _a, {
+      color = "currentColor",
+      size = 24,
+      strokeWidth = 2,
+      absoluteStrokeWidth,
+      className = "",
+      children,
+      iconNode
+    } = _b, rest = __objRest(_b, [
+      "color",
+      "size",
+      "strokeWidth",
+      "absoluteStrokeWidth",
+      "className",
+      "children",
+      "iconNode"
+    ]);
+    return createElement(
+      "svg",
+      __spreadValues(__spreadValues(__spreadProps(__spreadValues({
+        ref
+      }, defaultAttributes), {
+        width: size,
+        height: size,
+        stroke: color,
+        strokeWidth: absoluteStrokeWidth ? Number(strokeWidth) * 24 / Number(size) : strokeWidth,
+        className: mergeClasses("lucide", className)
+      }), !children && !hasA11yProp(rest) && { "aria-hidden": "true" }), rest),
+      [
+        ...iconNode.map(([tag, attrs]) => createElement(tag, attrs)),
+        ...Array.isArray(children) ? children : [children]
+      ]
+    );
+  }
+);
+/**
+ * @license lucide-react v0.544.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const createLucideIcon = (iconName, iconNode) => {
+  const Component = forwardRef(
+    (_a, ref) => {
+      var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+      return createElement(Icon, __spreadValues({
+        ref,
+        iconNode,
+        className: mergeClasses(
+          `lucide-${toKebabCase(toPascalCase(iconName))}`,
+          `lucide-${iconName}`,
+          className
+        )
+      }, props));
+    }
+  );
+  Component.displayName = toPascalCase(iconName);
+  return Component;
+};
+/**
+ * @license lucide-react v0.544.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const __iconNode$9 = [
+  ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
+  ["line", { x1: "12", x2: "12", y1: "8", y2: "12", key: "1pkeuh" }],
+  ["line", { x1: "12", x2: "12.01", y1: "16", y2: "16", key: "4dfq90" }]
+];
+const CircleAlert = createLucideIcon("circle-alert", __iconNode$9);
+/**
+ * @license lucide-react v0.544.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const __iconNode$8 = [
+  ["path", { d: "M21.801 10A10 10 0 1 1 17 3.335", key: "yps3ct" }],
+  ["path", { d: "m9 11 3 3L22 4", key: "1pflzl" }]
+];
+const CircleCheckBig = createLucideIcon("circle-check-big", __iconNode$8);
+/**
+ * @license lucide-react v0.544.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const __iconNode$7 = [
+  ["path", { d: "M12 6v6l4 2", key: "mmk7yg" }],
+  ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }]
+];
+const Clock = createLucideIcon("clock", __iconNode$7);
+/**
+ * @license lucide-react v0.544.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const __iconNode$6 = [["path", { d: "M21 12a9 9 0 1 1-6.219-8.56", key: "13zald" }]];
+const LoaderCircle = createLucideIcon("loader-circle", __iconNode$6);
+/**
+ * @license lucide-react v0.544.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const __iconNode$5 = [
+  ["path", { d: "m22 7-8.991 5.727a2 2 0 0 1-2.009 0L2 7", key: "132q7q" }],
+  ["rect", { x: "2", y: "4", width: "20", height: "16", rx: "2", key: "izxlao" }]
+];
+const Mail = createLucideIcon("mail", __iconNode$5);
+/**
+ * @license lucide-react v0.544.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const __iconNode$4 = [
+  [
+    "path",
+    {
+      d: "M2.992 16.342a2 2 0 0 1 .094 1.167l-1.065 3.29a1 1 0 0 0 1.236 1.168l3.413-.998a2 2 0 0 1 1.099.092 10 10 0 1 0-4.777-4.719",
+      key: "1sd12s"
+    }
+  ]
+];
+const MessageCircle = createLucideIcon("message-circle", __iconNode$4);
+/**
+ * @license lucide-react v0.544.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const __iconNode$3 = [
+  [
+    "path",
+    {
+      d: "M22 17a2 2 0 0 1-2 2H6.828a2 2 0 0 0-1.414.586l-2.202 2.202A.71.71 0 0 1 2 21.286V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2z",
+      key: "18887p"
+    }
+  ]
+];
+const MessageSquare = createLucideIcon("message-square", __iconNode$3);
+/**
+ * @license lucide-react v0.544.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const __iconNode$2 = [
+  [
+    "path",
+    {
+      d: "M13.832 16.568a1 1 0 0 0 1.213-.303l.355-.465A2 2 0 0 1 17 15h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2A18 18 0 0 1 2 4a2 2 0 0 1 2-2h3a2 2 0 0 1 2 2v3a2 2 0 0 1-.8 1.6l-.468.351a1 1 0 0 0-.292 1.233 14 14 0 0 0 6.392 6.384",
+      key: "9njp5v"
+    }
+  ]
+];
+const Phone = createLucideIcon("phone", __iconNode$2);
+/**
+ * @license lucide-react v0.544.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const __iconNode$1 = [
+  [
+    "path",
+    {
+      d: "M14.536 21.686a.5.5 0 0 0 .937-.024l6.5-19a.496.496 0 0 0-.635-.635l-19 6.5a.5.5 0 0 0-.024.937l7.93 3.18a2 2 0 0 1 1.112 1.11z",
+      key: "1ffxy3"
+    }
+  ],
+  ["path", { d: "m21.854 2.147-10.94 10.939", key: "12cjpa" }]
+];
+const Send = createLucideIcon("send", __iconNode$1);
+/**
+ * @license lucide-react v0.544.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const __iconNode = [
+  ["path", { d: "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2", key: "975kel" }],
+  ["circle", { cx: "12", cy: "7", r: "4", key: "17ys0d" }]
+];
+const User = createLucideIcon("user", __iconNode);
+const ContactFormSection = ({ data, t, isDarkMode, consultationRequestService }) => {
+  const [formData, setFormData] = useState({
+    fullName: "",
+    workEmail: "",
+    phoneNumber: "",
+    companyName: "",
+    jobTitle: "",
+    businessType: "",
+    expectedBudget: "",
+    expectedTimeline: "",
+    requestTitle: "",
+    requestDescription: ""
+  });
+  const [formErrors, setFormErrors] = useState({});
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [submitStatus, setSubmitStatus] = useState(null);
+  const [submitMessage, setSubmitMessage] = useState("");
+  const validateField = (name, value) => {
+    const errors = {};
+    switch (name) {
+      case "fullName":
+        if (!(value == null ? void 0 : value.trim())) errors.fullName = "Họ và tên là bắt buộc";
+        else if (value.trim().length < 2) errors.fullName = "Tên phải có ít nhất 2 ký tự";
+        break;
+      case "workEmail":
+        const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+        if (!(value == null ? void 0 : value.trim())) errors.workEmail = "Email là bắt buộc";
+        else if (!emailRegex.test(value.trim())) errors.workEmail = "Email không hợp lệ";
+        break;
+      case "phoneNumber":
+        const phoneRegex = /^[0-9\s\-\+\(\)]{10,15}$/;
+        if (value && !phoneRegex.test(value.trim())) errors.phoneNumber = "Số điện thoại không hợp lệ";
+        break;
+      case "requestTitle":
+        if (!(value == null ? void 0 : value.trim())) errors.requestTitle = "Tiêu đề yêu cầu là bắt buộc";
+        else if (value.trim().length < 5) errors.requestTitle = "Tiêu đề phải có ít nhất 5 ký tự";
+        break;
+      case "requestDescription":
+        if (!(value == null ? void 0 : value.trim())) errors.requestDescription = "Mô tả yêu cầu là bắt buộc";
+        else if (value.trim().length < 10) errors.requestDescription = "Mô tả phải có ít nhất 10 ký tự";
+        break;
+      case "companyName":
+        if (value && value.trim().length > 0 && value.trim().length < 2) {
+          errors.companyName = "Tên công ty phải có ít nhất 2 ký tự";
+        }
+        break;
+      case "jobTitle":
+        if (value && value.trim().length > 0 && value.trim().length < 2) {
+          errors.jobTitle = "Chức vụ phải có ít nhất 2 ký tự";
+        }
+        break;
+    }
+    return errors;
+  };
+  const handleInputChange = (e) => {
+    const { name, value } = e.target;
+    setFormData((prev) => __spreadProps(__spreadValues({}, prev), {
+      [name]: value || ""
+    }));
+    if (formErrors[name]) {
+      setFormErrors((prev) => {
+        const newErrors = __spreadValues({}, prev);
+        delete newErrors[name];
+        return newErrors;
+      });
+    }
+  };
+  const handleBlur = (e) => {
+    const { name, value } = e.target;
+    const fieldErrors = validateField(name, value);
+    setFormErrors((prev) => __spreadValues(__spreadValues({}, prev), fieldErrors));
+  };
+  const handleSubmit = (e) => __async(null, null, function* () {
+    e.preventDefault();
+    setIsSubmitting(true);
+    setSubmitStatus(null);
+    setSubmitMessage("");
+    try {
+      const allErrors = {};
+      Object.keys(formData).forEach((key) => {
+        const fieldErrors = validateField(key, formData[key]);
+        Object.assign(allErrors, fieldErrors);
+      });
+      if (Object.keys(allErrors).length > 0) {
+        setFormErrors(allErrors);
+        setIsSubmitting(false);
+        return;
+      }
+      const cleanFormData = Object.keys(formData).reduce((acc, key) => {
+        acc[key] = typeof formData[key] === "string" ? formData[key].trim() : formData[key];
+        return acc;
+      }, {});
+      let result;
+      if (consultationRequestService == null ? void 0 : consultationRequestService.create) {
+        result = yield consultationRequestService.create(cleanFormData);
+      } else {
+        yield new Promise((resolve) => setTimeout(resolve, 2e3));
+        result = { success: true, message: "Đã gửi thông tin thành công!" };
+      }
+      if (result == null ? void 0 : result.success) {
+        setSubmitStatus("success");
+        setSubmitMessage(result.message || "Cảm ơn bạn đã gửi thông tin! Chúng tôi sẽ liên hệ lại trong vòng 24 giờ.");
+        setFormData({
+          fullName: "",
+          workEmail: "",
+          phoneNumber: "",
+          companyName: "",
+          jobTitle: "",
+          businessType: "",
+          expectedBudget: "",
+          expectedTimeline: "",
+          requestTitle: "",
+          requestDescription: ""
+        });
+        setFormErrors({});
+      } else {
+        setSubmitStatus("error");
+        setSubmitMessage((result == null ? void 0 : result.message) || "Có lỗi xảy ra khi gửi thông tin.");
+      }
+    } catch (error) {
+      setSubmitStatus("error");
+      setSubmitMessage((error == null ? void 0 : error.message) || "Có lỗi xảy ra khi gửi thông tin. Vui lòng thử lại sau.");
+    } finally {
+      setIsSubmitting(false);
+    }
+  });
+  const inputBaseClasses = `w-full px-4 py-3 rounded-xl border transition-all duration-200 focus:ring-2 focus:ring-indigo-500/20 focus:outline-none ${isDarkMode ? "bg-gray-700 border-gray-600 text-white placeholder-gray-400 focus:border-indigo-500" : "bg-white border-slate-300 text-slate-900 placeholder-slate-500 focus:border-indigo-500"}`;
+  const labelClasses = `block text-sm font-semibold mb-2 ${isDarkMode ? "text-gray-300" : "text-slate-700"}`;
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("section", { className: `py-16 transition-colors duration-200 ${isDarkMode ? "bg-gray-950" : "bg-white"}`, children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "grid lg:grid-cols-3 gap-12", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "lg:col-span-2", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `rounded-2xl p-8 shadow-lg border transition-colors duration-200 ${isDarkMode ? "bg-gray-800 border-gray-700" : "bg-white border-slate-200"}`, children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center mb-6", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-10 h-10 rounded-lg bg-gradient-to-r from-indigo-500 to-purple-600 flex items-center justify-center mr-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Send, { size: 20, className: "text-white" }) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("h2", { className: `text-2xl font-bold transition-colors duration-200 ${isDarkMode ? "text-white" : "text-slate-800"}`, children: t("form.title") || "Gửi yêu cầu tư vấn" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `text-sm transition-colors duration-200 ${isDarkMode ? "text-gray-400" : "text-slate-600"}`, children: t("form.subtitle") || "Điền thông tin để nhận tư vấn miễn phí từ chuyên gia" })
+        ] })
+      ] }),
+      submitStatus && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `mb-6 p-4 rounded-xl border transition-colors duration-200 ${submitStatus === "success" ? isDarkMode ? "bg-emerald-900/50 border-emerald-700 text-emerald-300" : "bg-emerald-50 border-emerald-200 text-emerald-800" : isDarkMode ? "bg-red-900/50 border-red-700 text-red-300" : "bg-red-50 border-red-200 text-red-800"}`, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center", children: [
+        submitStatus === "success" ? /* @__PURE__ */ jsxRuntimeExports.jsx(CircleCheckBig, { size: 20, className: "mr-2 flex-shrink-0" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(CircleAlert, { size: 20, className: "mr-2 flex-shrink-0" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm font-medium", children: submitMessage })
+      ] }) }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("form", { onSubmit: handleSubmit, className: "space-y-6", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "grid md:grid-cols-2 gap-6", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("label", { className: labelClasses, children: [
+              t("form.fields.fullName") || "Họ và tên",
+              " *"
+            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "input",
+              {
+                type: "text",
+                name: "fullName",
+                value: formData.fullName || "",
+                onChange: handleInputChange,
+                onBlur: handleBlur,
+                className: `${inputBaseClasses} ${formErrors.fullName ? "border-red-500" : ""}`,
+                placeholder: "Nguyễn Văn A",
+                required: true
+              }
+            ),
+            formErrors.fullName && /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "mt-1 text-sm text-red-500 flex items-center", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(CircleAlert, { size: 14, className: "mr-1" }),
+              formErrors.fullName
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("label", { className: labelClasses, children: [
+              t("form.fields.workEmail") || "Email",
+              " *"
+            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "input",
+              {
+                type: "email",
+                name: "workEmail",
+                value: formData.workEmail || "",
+                onChange: handleInputChange,
+                onBlur: handleBlur,
+                className: `${inputBaseClasses} ${formErrors.workEmail ? "border-red-500" : ""}`,
+                placeholder: "email@company.com",
+                required: true
+              }
+            ),
+            formErrors.workEmail && /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "mt-1 text-sm text-red-500 flex items-center", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(CircleAlert, { size: 14, className: "mr-1" }),
+              formErrors.workEmail
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "grid md:grid-cols-2 gap-6", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("label", { className: labelClasses, children: t("form.fields.phoneNumber") || "Số điện thoại" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "input",
+              {
+                type: "tel",
+                name: "phoneNumber",
+                value: formData.phoneNumber || "",
+                onChange: handleInputChange,
+                onBlur: handleBlur,
+                className: `${inputBaseClasses} ${formErrors.phoneNumber ? "border-red-500" : ""}`,
+                placeholder: "0901 234 567"
+              }
+            ),
+            formErrors.phoneNumber && /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "mt-1 text-sm text-red-500 flex items-center", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(CircleAlert, { size: 14, className: "mr-1" }),
+              formErrors.phoneNumber
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("label", { className: labelClasses, children: t("form.fields.companyName") || "Công ty/Tổ chức" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "input",
+              {
+                type: "text",
+                name: "companyName",
+                value: formData.companyName || "",
+                onChange: handleInputChange,
+                onBlur: handleBlur,
+                className: `${inputBaseClasses} ${formErrors.companyName ? "border-red-500" : ""}`,
+                placeholder: "ABC Company"
+              }
+            ),
+            formErrors.companyName && /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "mt-1 text-sm text-red-500 flex items-center", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(CircleAlert, { size: 14, className: "mr-1" }),
+              formErrors.companyName
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "grid md:grid-cols-2 gap-6", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("label", { className: labelClasses, children: t("form.fields.jobTitle") || "Chức vụ" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "input",
+              {
+                type: "text",
+                name: "jobTitle",
+                value: formData.jobTitle || "",
+                onChange: handleInputChange,
+                onBlur: handleBlur,
+                className: `${inputBaseClasses} ${formErrors.jobTitle ? "border-red-500" : ""}`,
+                placeholder: "Giám đốc công nghệ"
+              }
+            ),
+            formErrors.jobTitle && /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "mt-1 text-sm text-red-500 flex items-center", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(CircleAlert, { size: 14, className: "mr-1" }),
+              formErrors.jobTitle
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("label", { className: labelClasses, children: t("form.fields.businessType") || "Loại hình kinh doanh" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "input",
+              {
+                type: "text",
+                name: "businessType",
+                value: formData.businessType || "",
+                onChange: handleInputChange,
+                className: inputBaseClasses,
+                placeholder: "Công nghệ thông tin"
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "grid md:grid-cols-2 gap-6", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("label", { className: labelClasses, children: t("form.fields.expectedBudget") || "Ngân sách dự kiến" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "input",
+              {
+                type: "text",
+                name: "expectedBudget",
+                value: formData.expectedBudget || "",
+                onChange: handleInputChange,
+                className: inputBaseClasses,
+                placeholder: "500,000,000 - 1,000,000,000 VNĐ"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("label", { className: labelClasses, children: t("form.fields.expectedTimeline") || "Thời gian dự kiến" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "input",
+              {
+                type: "text",
+                name: "expectedTimeline",
+                value: formData.expectedTimeline || "",
+                onChange: handleInputChange,
+                className: inputBaseClasses,
+                placeholder: "3-6 tháng"
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("label", { className: labelClasses, children: [
+            t("form.fields.requestTitle") || "Tiêu đề yêu cầu",
+            " *"
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "input",
+            {
+              type: "text",
+              name: "requestTitle",
+              value: formData.requestTitle || "",
+              onChange: handleInputChange,
+              onBlur: handleBlur,
+              className: `${inputBaseClasses} ${formErrors.requestTitle ? "border-red-500" : ""}`,
+              placeholder: "Phát triển hệ thống quản lý bán hàng",
+              required: true
+            }
+          ),
+          formErrors.requestTitle && /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "mt-1 text-sm text-red-500 flex items-center", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx(CircleAlert, { size: 14, className: "mr-1" }),
+            formErrors.requestTitle
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("label", { className: labelClasses, children: [
+            t("form.fields.requestDescription") || "Mô tả yêu cầu",
+            " *"
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "textarea",
+            {
+              name: "requestDescription",
+              value: formData.requestDescription || "",
+              onChange: handleInputChange,
+              onBlur: handleBlur,
+              rows: "5",
+              className: `${inputBaseClasses} resize-none ${formErrors.requestDescription ? "border-red-500" : ""}`,
+              placeholder: "Vui lòng mô tả chi tiết về nhu cầu của bạn...",
+              required: true
+            }
+          ),
+          formErrors.requestDescription && /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "mt-1 text-sm text-red-500 flex items-center", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx(CircleAlert, { size: 14, className: "mr-1" }),
+            formErrors.requestDescription
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center space-x-4", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "button",
+            {
+              type: "submit",
+              disabled: isSubmitting,
+              className: "flex-1 bg-gradient-to-r from-indigo-600 to-purple-600 text-white py-4 px-6 rounded-xl hover:from-indigo-700 hover:to-purple-700 transition-all transform hover:scale-105 disabled:opacity-50 disabled:cursor-not-allowed disabled:transform-none flex items-center justify-center font-semibold shadow-lg",
+              children: isSubmitting ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx(LoaderCircle, { className: "animate-spin h-5 w-5 mr-2" }),
+                t("form.submitting") || "Đang gửi..."
+              ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx(Send, { size: 20, className: "mr-2" }),
+                t("form.submit") || "Gửi yêu cầu"
+              ] })
+            }
+          ),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            "button",
+            {
+              type: "button",
+              className: `px-6 py-4 rounded-xl border-2 font-semibold transition-all hover:scale-105 ${isDarkMode ? "border-gray-600 text-gray-300 hover:bg-gray-700" : "border-slate-300 text-slate-700 hover:bg-slate-50"}`,
+              children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx(Phone, { size: 20, className: "inline mr-2" }),
+                t("form.callNow") || "Gọi ngay"
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `flex items-center space-x-2 text-sm transition-colors duration-200 ${isDarkMode ? "text-gray-400" : "text-slate-600"}`, children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(CircleCheckBig, { size: 16, className: "text-emerald-500" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: t("form.privacy") || "Cam kết bảo mật thông tin và phản hồi trong 24 giờ" })
+        ] })
+      ] })
+    ] }) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-6", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `rounded-2xl p-6 shadow-lg text-white transition-colors duration-200 ${isDarkMode ? "bg-gradient-to-br from-indigo-900 to-purple-900" : "bg-gradient-to-br from-indigo-600 to-purple-600"}`, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("h4", { className: "font-bold mb-3", children: t("sidebar.quickContact.title") || "Cần hỗ trợ ngay?" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-indigo-100 text-sm mb-4", children: t("sidebar.quickContact.description") || "Liên hệ trực tiếp để được tư vấn nhanh chóng" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-3", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            "a",
+            {
+              href: "tel:19005588",
+              className: "flex items-center justify-center w-full bg-white/20 backdrop-blur-sm hover:bg-white/30 py-3 rounded-xl transition-all font-semibold",
+              children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx(Phone, { size: 18, className: "mr-2" }),
+                "1900 5588"
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("button", { className: "flex items-center justify-center w-full border border-white/30 hover:bg-white/10 py-3 rounded-xl transition-all font-semibold", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx(MessageSquare, { size: 18, className: "mr-2" }),
+            "Live Chat"
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `rounded-2xl p-6 shadow-lg border transition-colors duration-200 ${isDarkMode ? "bg-gray-800 border-gray-700" : "bg-white border-slate-200"}`, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("h4", { className: `font-bold mb-4 transition-colors duration-200 ${isDarkMode ? "text-white" : "text-slate-800"}`, children: t("sidebar.contactInfo.title") || "Thông tin liên hệ" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-4", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center space-x-3", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `w-10 h-10 rounded-lg flex items-center justify-center ${isDarkMode ? "bg-indigo-900/50 text-indigo-400" : "bg-indigo-50 text-indigo-600"}`, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Phone, { size: 18 }) }),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `font-semibold transition-colors duration-200 ${isDarkMode ? "text-white" : "text-slate-800"}`, children: "1900 5588" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `text-sm transition-colors duration-200 ${isDarkMode ? "text-gray-400" : "text-slate-600"}`, children: "Hotline 24/7" })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center space-x-3", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `w-10 h-10 rounded-lg flex items-center justify-center ${isDarkMode ? "bg-emerald-900/50 text-emerald-400" : "bg-emerald-50 text-emerald-600"}`, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Mail, { size: 18 }) }),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `font-semibold transition-colors duration-200 ${isDarkMode ? "text-white" : "text-slate-800"}`, children: "support@asasystems.vn" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `text-sm transition-colors duration-200 ${isDarkMode ? "text-gray-400" : "text-slate-600"}`, children: "Email hỗ trợ" })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center space-x-3", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `w-10 h-10 rounded-lg flex items-center justify-center ${isDarkMode ? "bg-purple-900/50 text-purple-400" : "bg-purple-50 text-purple-600"}`, children: /* @__PURE__ */ jsxRuntimeExports.jsx(MessageCircle, { size: 18 }) }),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `font-semibold transition-colors duration-200 ${isDarkMode ? "text-white" : "text-slate-800"}`, children: "Live Chat" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `text-sm transition-colors duration-200 ${isDarkMode ? "text-gray-400" : "text-slate-600"}`, children: "T2-T6: 8:00-18:00" })
+            ] })
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `rounded-2xl p-6 shadow-lg border transition-colors duration-200 ${isDarkMode ? "bg-gray-800 border-gray-700" : "bg-white border-slate-200"}`, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("h4", { className: `font-bold mb-4 transition-colors duration-200 ${isDarkMode ? "text-white" : "text-slate-800"}`, children: t("sidebar.faq.title") || "Câu hỏi thường gặp" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-3", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `p-3 rounded-lg transition-colors duration-200 ${isDarkMode ? "bg-gray-700" : "bg-slate-50"}`, children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `font-medium text-sm transition-colors duration-200 ${isDarkMode ? "text-white" : "text-slate-800"}`, children: t("sidebar.faq.responseTime.question") || "Thời gian phản hồi?" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `text-sm mt-1 transition-colors duration-200 ${isDarkMode ? "text-gray-400" : "text-slate-600"}`, children: t("sidebar.faq.responseTime.answer") || "Trong vòng 24 giờ làm việc" })
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `p-3 rounded-lg transition-colors duration-200 ${isDarkMode ? "bg-gray-700" : "bg-slate-50"}`, children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `font-medium text-sm transition-colors duration-200 ${isDarkMode ? "text-white" : "text-slate-800"}`, children: t("sidebar.faq.consultationFree.question") || "Tư vấn có miễn phí?" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `text-sm mt-1 transition-colors duration-200 ${isDarkMode ? "text-gray-400" : "text-slate-600"}`, children: t("sidebar.faq.consultationFree.answer") || "Hoàn toàn miễn phí" })
+          ] })
+        ] })
+      ] })
+    ] })
+  ] }) }) });
+};
+const ContactInfoSection = ({ data, t, isDarkMode }) => {
+  const contactData = (data == null ? void 0 : data.sectionDataBindingItems) || [];
+  if (!contactData.length) return null;
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("section", { className: `py-16 ${isDarkMode ? "bg-gray-900" : "bg-slate-50"}`, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center mb-12", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `inline-flex items-center px-4 py-2 rounded-full text-sm font-semibold mb-4 ${isDarkMode ? "bg-indigo-900/50 text-indigo-300" : "bg-indigo-50 text-indigo-700"}`, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(User, { size: 16, className: "mr-2" }),
+        t("contact.team.badge") || "Đội ngũ hỗ trợ"
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("h2", { className: `text-3xl lg:text-4xl font-bold mb-4 ${isDarkMode ? "text-white" : "text-slate-800"}`, children: [
+        t("contact.team.title") || "Liên hệ với đội ngũ",
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "block bg-gradient-to-r from-indigo-600 to-purple-600 bg-clip-text text-transparent", children: t("contact.team.subtitle") || "chuyên nghiệp của chúng tôi" })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `text-lg max-w-3xl mx-auto ${isDarkMode ? "text-gray-300" : "text-slate-600"}`, children: t("contact.team.description") || "Chúng tôi luôn sẵn sàng hỗ trợ bạn với đội ngũ chuyên nghiệp và giàu kinh nghiệm" })
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "grid md:grid-cols-2 lg:grid-cols-3 gap-8", children: contactData.map((contact, index2) => {
+      var _a;
+      return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+        "div",
+        {
+          className: `rounded-2xl p-8 shadow-lg transition-all duration-300 hover:shadow-xl hover:-translate-y-1 border ${isDarkMode ? "bg-gray-800 border-gray-700" : "bg-white border-slate-200"}`,
+          children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center mb-6", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-20 h-20 rounded-full mx-auto mb-4 flex items-center justify-center text-2xl font-bold text-white bg-gradient-to-br from-indigo-500 to-purple-600", children: ((_a = contact.data.name) == null ? void 0 : _a.charAt(0)) || "A" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: `text-xl font-bold mb-2 ${isDarkMode ? "text-white" : "text-slate-800"}`, children: contact.data.name }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: `inline-block px-3 py-1 rounded-full text-sm font-semibold ${isDarkMode ? "bg-indigo-900/50 text-indigo-300" : "bg-indigo-50 text-indigo-700"}`, children: contact.data.position })
+            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-4", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsxs(
+                "a",
+                {
+                  href: `tel:${contact.data.phone}`,
+                  className: `flex items-center p-3 rounded-xl transition-all hover:scale-105 ${isDarkMode ? "bg-gray-700 hover:bg-gray-600" : "bg-slate-50 hover:bg-slate-100"} group`,
+                  children: [
+                    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `w-10 h-10 rounded-lg flex items-center justify-center mr-3 group-hover:scale-110 transition-transform ${isDarkMode ? "bg-green-900/50 text-green-400" : "bg-green-50 text-green-600"}`, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Phone, { size: 18 }) }),
+                    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex-1", children: [
+                      /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `text-sm font-medium ${isDarkMode ? "text-gray-400" : "text-slate-500"}`, children: t("contact.info.phone") || "Điện thoại" }),
+                      /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `font-semibold ${isDarkMode ? "text-white" : "text-slate-800"}`, children: contact.data.phone })
+                    ] })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxRuntimeExports.jsxs(
+                "a",
+                {
+                  href: `mailto:${contact.data.email}`,
+                  className: `flex items-center p-3 rounded-xl transition-all hover:scale-105 ${isDarkMode ? "bg-gray-700 hover:bg-gray-600" : "bg-slate-50 hover:bg-slate-100"} group`,
+                  children: [
+                    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `w-10 h-10 rounded-lg flex items-center justify-center mr-3 group-hover:scale-110 transition-transform ${isDarkMode ? "bg-indigo-900/50 text-indigo-400" : "bg-indigo-50 text-indigo-600"}`, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Mail, { size: 18 }) }),
+                    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex-1", children: [
+                      /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `text-sm font-medium ${isDarkMode ? "text-gray-400" : "text-slate-500"}`, children: "Email" }),
+                      /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `font-semibold ${isDarkMode ? "text-white" : "text-slate-800"}`, children: contact.data.email })
+                    ] })
+                  ]
+                }
+              ),
+              contact.data.workingHours && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `flex items-center p-3 rounded-xl ${isDarkMode ? "bg-gray-700" : "bg-slate-50"}`, children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `w-10 h-10 rounded-lg flex items-center justify-center mr-3 ${isDarkMode ? "bg-purple-900/50 text-purple-400" : "bg-purple-50 text-purple-600"}`, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Clock, { size: 18 }) }),
+                /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex-1", children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `text-sm font-medium ${isDarkMode ? "text-gray-400" : "text-slate-500"}`, children: t("contact.info.workingHours") || "Giờ làm việc" }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `font-semibold ${isDarkMode ? "text-white" : "text-slate-800"}`, children: contact.data.workingHours || t("contact.info.defaultWorkingHours") || "T2-T6: 8:00-18:00" })
+                ] })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-6", children: /* @__PURE__ */ jsxRuntimeExports.jsx("button", { className: "w-full py-3 px-4 rounded-xl font-semibold transition-all transform hover:scale-105 bg-gradient-to-r from-indigo-600 to-purple-600 hover:from-indigo-700 hover:to-purple-700 text-white shadow-lg", children: t("contact.buttons.contactNow") || "Liên hệ ngay" }) })
+          ]
+        },
+        contact.id || index2
+      );
+    }) })
+  ] }) });
+};
+const ContactListAutoSection = ({ data, t, isDarkMode, getContactList }) => {
+  const [contacts, setContacts] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(null);
+  useEffect(() => {
+    loadContacts();
+  }, []);
+  const loadContacts = () => __async(null, null, function* () {
+    try {
+      setLoading(true);
+      const result = yield getContactList();
+      if (result.success) {
+        setContacts(result.data || []);
+      } else {
+        setError(result.error);
+      }
+    } catch (err) {
+      console.error("Error loading contacts:", err);
+      setError(t("contactList.error.loadData") || "Có lỗi xảy ra khi tải danh sách liên hệ");
+    } finally {
+      setLoading(false);
+    }
+  });
+  if (loading) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `py-16 px-5 text-center ${isDarkMode ? "bg-gray-900" : "bg-gray-50"}`, children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `inline-block w-10 h-10 border-4 ${isDarkMode ? "border-gray-600 border-t-blue-500" : "border-gray-300 border-t-blue-500"} rounded-full animate-spin` }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `mt-4 ${isDarkMode ? "text-gray-400" : "text-gray-600"}`, children: t("contactList.status.loading") || "Đang tải danh sách liên hệ..." })
+    ] });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `py-16 px-5 text-center ${isDarkMode ? "bg-gray-900" : "bg-gray-50"}`, children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `${isDarkMode ? "text-red-400" : "text-red-500"} text-base mb-2`, children: [
+        "⚠️ ",
+        t("contactList.error.title") || "Lỗi tải dữ liệu"
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `${isDarkMode ? "text-gray-400" : "text-gray-600"}`, children: error })
+    ] });
+  }
+  if (!contacts || contacts.length === 0) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `py-16 px-5 text-center ${isDarkMode ? "bg-gray-900" : "bg-gray-50"}`, children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-5xl mb-5", children: "📞" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: `${isDarkMode ? "text-gray-400" : "text-gray-600"} mb-2`, children: t("contactList.status.noData.title") || "Chưa có thông tin liên hệ" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `${isDarkMode ? "text-gray-500" : "text-gray-500"}`, children: t("contactList.status.noData.description") || "Danh sách liên hệ sẽ hiển thị tại đây" })
+    ] });
+  }
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("section", { className: `py-20 ${isDarkMode ? "bg-gray-900" : "bg-gray-50"} transition-colors duration-300`, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "max-w-6xl mx-auto px-5", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center mb-16", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("h2", { className: `text-4xl font-bold ${isDarkMode ? "text-white" : "text-gray-900"} mb-4`, children: t("contactList.header.title") || "Thông Tin Liên Hệ" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `text-lg ${isDarkMode ? "text-gray-400" : "text-gray-600"} max-w-2xl mx-auto`, children: t("contactList.header.description") || "Đội ngũ chuyên nghiệp của chúng tôi luôn sẵn sàng hỗ trợ bạn" })
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8 mt-10", children: contacts.map((contact, index2) => /* @__PURE__ */ jsxRuntimeExports.jsx(ContactCard, { contact, t, isDarkMode }, contact.id || index2)) })
+  ] }) });
+};
+const ContactCard = ({ contact, t, isDarkMode }) => {
+  var _a, _b;
+  const [isHovered, setIsHovered] = useState(false);
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    "div",
+    {
+      className: `
+        ${isDarkMode ? "bg-gray-800 border-gray-700" : "bg-white border-gray-200"} rounded-2xl p-8 border cursor-pointer transition-all duration-300
+        ${isHovered ? `shadow-xl ${isDarkMode ? "shadow-gray-900/40" : "shadow-gray-500/20"} -translate-y-2` : `shadow-lg ${isDarkMode ? "shadow-gray-900/20" : "shadow-gray-500/10"}`}
+      `,
+      onMouseEnter: () => setIsHovered(true),
+      onMouseLeave: () => setIsHovered(false),
+      children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center mb-6", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `w-15 h-15 rounded-full ${isDarkMode ? "bg-blue-600" : "bg-blue-500"} flex items-center justify-center text-white text-2xl font-bold mr-4`, children: ((_b = (_a = contact.name) == null ? void 0 : _a.charAt(0)) == null ? void 0 : _b.toUpperCase()) || "?" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: `text-xl font-semibold ${isDarkMode ? "text-white" : "text-gray-900"} mb-1`, children: contact.name || t("contactList.card.noName") || "Không có tên" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `text-base ${isDarkMode ? "text-gray-400" : "text-gray-600"}`, children: contact.position || t("contactList.card.noPosition") || "Chưa có chức vụ" })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            ContactInfo,
+            {
+              icon: "📧",
+              label: t("contactList.card.email") || "Email",
+              value: contact.email,
+              href: `mailto:${contact.email}`
+            }
+          ),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            ContactInfo,
+            {
+              icon: "📱",
+              label: t("contactList.card.phone") || "Điện thoại",
+              value: contact.phone,
+              href: `tel:${contact.phone}`
+            }
+          )
+        ] })
+      ]
+    }
+  );
+};
+const ContactInfo = ({ icon, label, value, href, isDarkMode }) => {
+  if (!value) return null;
+  const content = /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `flex items-center py-3 border-b ${isDarkMode ? "border-gray-600" : "border-gray-100"} last:border-b-0`, children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-lg mr-3 w-6 text-center", children: icon }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex-1", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `text-sm ${isDarkMode ? "text-gray-400" : "text-gray-600"} mb-0.5`, children: label }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `text-base font-medium ${href ? `${isDarkMode ? "text-blue-400 hover:text-blue-300" : "text-blue-500 hover:text-blue-600"}` : `${isDarkMode ? "text-white" : "text-gray-900"}`} transition-colors duration-200`, children: value })
+    ] })
+  ] });
+  if (href) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href, className: `no-underline text-inherit block ${isDarkMode ? "hover:bg-gray-700/50" : "hover:bg-gray-50"} rounded-lg -mx-2 px-2 transition-colors duration-200`, children: content });
+  }
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "-mx-2 px-2", children: content });
+};
+const CustomerFeedbackAutoSection = ({ data, t, isDarkMode, loadCustomerFeedback }) => {
+  const [feedbacks, setFeedbacks] = useState([]);
+  const [currentIndex, setCurrentIndex] = useState(0);
+  useEffect(() => {
+    const fetchData = () => __async(null, null, function* () {
+      const res = yield loadCustomerFeedback();
+      if (res.success) {
+        setFeedbacks(Array.isArray(res.data) ? res.data : []);
+      } else {
+        setFeedbacks([]);
+      }
+    });
+    fetchData();
+  }, []);
+  useEffect(() => {
+    if (feedbacks.length > 1) {
+      const interval = setInterval(() => {
+        setCurrentIndex((prev) => (prev + 1) % feedbacks.length);
+      }, 5e3);
+      return () => clearInterval(interval);
+    }
+  }, [feedbacks.length]);
+  useEffect(() => {
+    if (currentIndex >= feedbacks.length) {
+      setCurrentIndex(0);
+    }
+  }, [feedbacks.length, currentIndex]);
+  if (!feedbacks.length) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "section",
+      {
+        className: `py-20 transition-colors duration-200 ${isDarkMode ? "bg-gray-700" : "bg-gray-50"}`,
+        children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "div",
+            {
+              className: `w-24 h-24 mx-auto mb-6 rounded-full flex items-center justify-center ${isDarkMode ? "bg-gray-800" : "bg-gray-200"}`,
+              children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                "svg",
+                {
+                  className: `w-12 h-12 ${isDarkMode ? "text-gray-600" : "text-gray-400"}`,
+                  fill: "none",
+                  stroke: "currentColor",
+                  viewBox: "0 0 24 24",
+                  children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                    "path",
+                    {
+                      strokeLinecap: "round",
+                      strokeLinejoin: "round",
+                      strokeWidth: 2,
+                      d: "M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z"
+                    }
+                  )
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "h3",
+            {
+              className: `text-xl font-semibold mb-4 ${isDarkMode ? "text-white" : "text-gray-900"}`,
+              children: t("customerFeedback.emptyTitle") || "Chưa có phản hồi từ khách hàng"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "p",
+            {
+              className: `text-lg ${isDarkMode ? "text-gray-300" : "text-gray-600"}`,
+              children: t("customerFeedback.emptyDescription") || "Các phản hồi từ khách hàng sẽ được hiển thị tại đây."
+            }
+          )
+        ] })
+      }
+    );
+  }
+  const currentFeedback = feedbacks[currentIndex];
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    "section",
+    {
+      className: `py-20 transition-colors duration-200 ${isDarkMode ? "bg-gray-700" : "bg-gray-50"}`,
+      children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            "div",
+            {
+              className: `inline-block px-4 py-2 rounded-full text-sm font-semibold mb-4 ${isDarkMode ? "bg-indigo-900/50 text-indigo-300 border border-indigo-800" : "bg-indigo-100 text-indigo-800"}`,
+              children: [
+                "💬 ",
+                t("customerFeedback.badge") || "Phản hồi khách hàng"
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            "h2",
+            {
+              className: `text-3xl lg:text-4xl font-bold mb-8 transition-colors duration-200 ${isDarkMode ? "text-white" : "text-gray-900"}`,
+              children: [
+                t("customerFeedback.titlelanding") || "Khách hàng nói gì",
+                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "block bg-gradient-to-r from-indigo-600 to-purple-600 bg-clip-text text-transparent", children: t("customerFeedback.subtitle") || "về chúng tôi" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "relative", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsxs(
+              "div",
+              {
+                className: `p-6 rounded-2xl transition-all duration-500 transform ${isDarkMode ? "bg-gray-800/80 backdrop-blur-sm border border-gray-700" : "bg-white shadow-lg"}`,
+                children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsxs(
+                    "blockquote",
+                    {
+                      className: `text-lg lg:text-xl italic mb-6 animate-fadeIn transition-colors duration-200 leading-relaxed ${isDarkMode ? "text-gray-300" : "text-gray-700"}`,
+                      children: [
+                        '"',
+                        currentFeedback.content,
+                        '"'
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-center space-x-4 animate-fadeIn", children: [
+                    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-3xl", children: "👤" }),
+                    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-left", children: [
+                      /* @__PURE__ */ jsxRuntimeExports.jsx(
+                        "div",
+                        {
+                          className: `font-bold text-base transition-colors duration-200 ${isDarkMode ? "text-white" : "text-gray-900"}`,
+                          children: currentFeedback.customerName
+                        }
+                      ),
+                      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-blue-600 font-medium text-sm", children: currentFeedback.customerTitle }),
+                      currentFeedback.customerCompany && /* @__PURE__ */ jsxRuntimeExports.jsx(
+                        "div",
+                        {
+                          className: `text-xs transition-colors duration-200 ${isDarkMode ? "text-gray-400" : "text-gray-600"}`,
+                          children: currentFeedback.customerCompany
+                        }
+                      )
+                    ] })
+                  ] })
+                ]
+              },
+              currentIndex
+            ),
+            feedbacks.length > 1 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex justify-center space-x-2 mt-4", children: feedbacks.map((_, index2) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "button",
+              {
+                onClick: () => setCurrentIndex(index2),
+                className: `w-2.5 h-2.5 rounded-full transition-all duration-300 ${index2 === currentIndex ? "bg-blue-600" : isDarkMode ? "bg-gray-600 hover:bg-gray-500" : "bg-gray-300 hover:bg-gray-400"}`,
+                "aria-label": t("customerFeedback.switchToFeedback", { number: index2 + 1 }) || `Chuyển đến phản hồi ${index2 + 1}`
+              },
+              index2
+            )) })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("style", { jsx: true, children: `
+        .animate-fadeIn {
+          animation: fadeIn 0.5s ease-in-out;
+        }
+        @keyframes fadeIn {
+          from {
+            opacity: 0;
+            transform: translateY(10px);
+          }
+          to {
+            opacity: 1;
+            transform: translateY(0);
+          }
+        }
+      ` })
+      ]
+    }
+  );
+};
+const ProductListSection = ({ data, t, isDarkMode, getProductList }) => {
+  const [products, setProducts] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(null);
+  useEffect(() => {
+    const fetchProducts = () => __async(null, null, function* () {
+      try {
+        setLoading(true);
+        const result = yield getProductList();
+        if (result.success) {
+          setProducts(result.data || []);
+        } else {
+          setError(result.error || t("productList.errors.loadFailed"));
+        }
+      } catch (err) {
+        console.error("Error fetching products:", err);
+        setError(t("productList.errors.loadError"));
+      } finally {
+        setLoading(false);
+      }
+    });
+    fetchProducts();
+  }, [t]);
+  if (loading) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `py-16 px-5 text-center ${isDarkMode ? "bg-gray-900" : "bg-gray-50"}`, children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `inline-block w-10 h-10 border-4 ${isDarkMode ? "border-gray-600 border-t-blue-400" : "border-gray-300 border-t-blue-500"} rounded-full animate-spin` }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `mt-2.5 text-base ${isDarkMode ? "text-gray-400" : "text-gray-600"}`, children: t("productList.loading") })
+    ] });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `py-16 px-5 text-center ${isDarkMode ? "bg-gray-900" : "bg-gray-50"}`, children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-red-500 text-5xl mb-4", children: "⚠️" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-red-500 text-base m-0", children: error })
+    ] });
+  }
+  if (!products || products.length === 0) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `py-16 px-5 text-center ${isDarkMode ? "bg-gray-900" : "bg-gray-50"}`, children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `text-5xl mb-4 ${isDarkMode ? "text-gray-400" : "text-gray-500"}`, children: "📦" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `text-base m-0 ${isDarkMode ? "text-gray-400" : "text-gray-600"}`, children: t("productList.noProducts") })
+    ] });
+  }
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `py-16 px-5 transition-colors duration-300 ${isDarkMode ? "bg-gray-900" : "bg-gray-50"}`, children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "max-w-6xl mx-auto", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-8 items-start", children: products.map((product, index2) => /* @__PURE__ */ jsxRuntimeExports.jsx(ProductCard, { product, t, isDarkMode }, product.id || index2)) }) }) });
+};
+const ProductCard = ({ product, t, isDarkMode }) => {
+  var _a, _b, _c, _d, _e, _f, _g;
+  const [activeTab, setActiveTab] = useState("overview");
+  const [isHovered, setIsHovered] = useState(false);
+  const mainImage = ((_b = (_a = product.images) == null ? void 0 : _a.find((img) => img.isMain)) == null ? void 0 : _b.imageUrl) || ((_d = (_c = product.images) == null ? void 0 : _c[0]) == null ? void 0 : _d.imageUrl) || "/placeholder-product.png";
+  const tabs = [
+    { id: "overview", label: t("productCard.tabs.overview"), count: null },
+    { id: "features", label: t("productCard.tabs.features"), count: ((_e = product.features) == null ? void 0 : _e.length) || 0 },
+    { id: "contacts", label: t("productCard.tabs.contacts"), count: ((_f = product.contacts) == null ? void 0 : _f.length) || 0 },
+    { id: "downloads", label: t("productCard.tabs.downloads"), count: ((_g = product.productDownloads) == null ? void 0 : _g.length) || 0 }
+  ];
+  const renderOverview = () => /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "p-5", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+    "div",
+    {
+      className: `text-sm leading-relaxed ${isDarkMode ? "text-gray-300" : "text-gray-700"}`,
+      dangerouslySetInnerHTML: {
+        __html: product.overviewContent || product.description || t("productCard.noOverview")
+      }
+    }
+  ) });
+  const renderFeatures = () => {
+    const features = product.features || [];
+    if (features.length === 0) {
+      return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `p-5 text-center ${isDarkMode ? "text-gray-400" : "text-gray-600"}`, children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "m-0", children: t("productCard.noFeatures") }) });
+    }
+    const sortedFeatures = [...features].sort((a, b) => (a.order || 0) - (b.order || 0));
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "p-5", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col gap-4", children: sortedFeatures.map((feature, index2) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
+      "div",
+      {
+        className: `p-4 rounded-lg border-l-4 border-blue-500 ${isDarkMode ? "bg-gray-700" : "bg-gray-100"}`,
+        children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("h4", { className: `m-0 mb-2 text-sm font-bold ${isDarkMode ? "text-white" : "text-gray-900"}`, children: feature.title }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `m-0 text-xs leading-relaxed ${isDarkMode ? "text-gray-400" : "text-gray-600"}`, children: feature.description })
+        ]
+      },
+      index2
+    )) }) });
+  };
+  const renderContacts = () => {
+    const contacts = product.contacts || [];
+    if (contacts.length === 0) {
+      return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `p-5 text-center ${isDarkMode ? "text-gray-400" : "text-gray-600"}`, children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "m-0", children: t("productCard.noContacts") }) });
+    }
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "p-5", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col gap-4", children: contacts.map((contact, index2) => {
+      var _a2, _b2;
+      return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+        "div",
+        {
+          className: `p-4 rounded-lg border ${isDarkMode ? "bg-gray-700 border-gray-600" : "bg-gray-100 border-gray-200"}`,
+          children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center mb-2", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `w-10 h-10 rounded-full flex items-center justify-center mr-3 ${isDarkMode ? "bg-blue-600" : "bg-blue-500"}`, children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-white font-bold text-base", children: ((_b2 = (_a2 = contact.name) == null ? void 0 : _a2.charAt(0)) == null ? void 0 : _b2.toUpperCase()) || "?" }) }),
+              /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx("h4", { className: `m-0 mb-0.5 text-sm font-bold ${isDarkMode ? "text-white" : "text-gray-900"}`, children: contact.name }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `m-0 text-xs ${isDarkMode ? "text-gray-400" : "text-gray-600"}`, children: contact.position })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col gap-1", children: [
+              contact.phone && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: `text-sm ${isDarkMode ? "text-blue-400" : "text-blue-500"}`, children: "📞" }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx(
+                  "a",
+                  {
+                    href: `tel:${contact.phone}`,
+                    className: `text-xs no-underline hover:underline ${isDarkMode ? "text-blue-400" : "text-blue-500"}`,
+                    children: contact.phone
+                  }
+                )
+              ] }),
+              contact.email && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: `text-sm ${isDarkMode ? "text-blue-400" : "text-blue-500"}`, children: "✉️" }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx(
+                  "a",
+                  {
+                    href: `mailto:${contact.email}`,
+                    className: `text-xs no-underline hover:underline ${isDarkMode ? "text-blue-400" : "text-blue-500"}`,
+                    children: contact.email
+                  }
+                )
+              ] })
+            ] })
+          ]
+        },
+        contact.id || index2
+      );
+    }) }) });
+  };
+  const renderDownloads = () => {
+    const downloads = product.productDownloads || [];
+    if (downloads.length === 0) {
+      return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `p-5 text-center ${isDarkMode ? "text-gray-400" : "text-gray-600"}`, children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "m-0", children: t("productCard.noDownloads") }) });
+    }
+    const handleDownload = (fileUrl, title) => {
+      try {
+        const link = document.createElement("a");
+        link.href = fileUrl;
+        link.download = title || "download";
+        link.target = "_blank";
+        document.body.appendChild(link);
+        link.click();
+        document.body.removeChild(link);
+      } catch (error) {
+        console.error("Download error:", error);
+      }
+    };
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "p-5", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col gap-3", children: downloads.map((download, index2) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
+      "div",
+      {
+        onClick: () => handleDownload(download.fileUrl, download.title),
+        className: `p-4 rounded-lg border cursor-pointer flex items-center gap-3 transition-all duration-200 hover:translate-x-1 ${isDarkMode ? "bg-gray-700 border-gray-600 hover:bg-gray-600" : "bg-gray-100 border-gray-200 hover:bg-gray-200"}`,
+        children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `w-10 h-10 rounded-lg flex items-center justify-center flex-shrink-0 ${isDarkMode ? "bg-blue-600" : "bg-blue-500"}`, children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-white text-lg", children: "📄" }) }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex-1 min-w-0", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("h4", { className: `m-0 mb-1 text-sm font-bold overflow-hidden text-ellipsis whitespace-nowrap ${isDarkMode ? "text-white" : "text-gray-900"}`, children: download.title }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `m-0 text-xs ${isDarkMode ? "text-gray-400" : "text-gray-600"}`, children: t("productCard.downloadClick") })
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `flex-shrink-0 text-base ${isDarkMode ? "text-blue-400" : "text-blue-500"}`, children: "⬇️" })
+        ]
+      },
+      index2
+    )) }) });
+  };
+  const renderTabContent = () => {
+    switch (activeTab) {
+      case "overview":
+        return renderOverview();
+      case "features":
+        return renderFeatures();
+      case "contacts":
+        return renderContacts();
+      case "downloads":
+        return renderDownloads();
+      default:
+        return null;
+    }
+  };
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    "div",
+    {
+      className: `
+        rounded-xl overflow-hidden cursor-pointer transition-all duration-300 border
+        ${isDarkMode ? "bg-gray-800 border-gray-700" : "bg-white border-gray-200"}
+        ${isHovered ? `shadow-xl -translate-y-2 ${isDarkMode ? "shadow-gray-900/40" : "shadow-gray-500/20"}` : `shadow-lg ${isDarkMode ? "shadow-gray-900/20" : "shadow-gray-500/10"}`}
+      `,
+      onMouseEnter: () => setIsHovered(true),
+      onMouseLeave: () => setIsHovered(false),
+      children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "div",
+          {
+            className: `relative h-48 bg-cover bg-center ${isDarkMode ? "bg-gray-700" : "bg-gray-200"}`,
+            style: {
+              backgroundImage: `url(${mainImage})`
+            },
+            children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/70 via-black/30 to-transparent p-5 text-white", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "m-0 mb-2 text-lg font-bold", children: product.name }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "m-0 text-sm opacity-90", children: product.description })
+            ] })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `border-b ${isDarkMode ? "border-gray-600" : "border-gray-200"}`, children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex overflow-x-auto", children: tabs.map((tab) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          "button",
+          {
+            onClick: () => setActiveTab(tab.id),
+            className: `
+                flex-1 min-w-[100px] py-4 px-2 border-none text-xs font-medium cursor-pointer transition-all duration-300 flex items-center justify-center gap-1
+                ${activeTab === tab.id ? `${isDarkMode ? "bg-blue-600" : "bg-blue-500"} text-white font-bold` : `bg-transparent ${isDarkMode ? "text-gray-400 hover:bg-gray-700" : "text-gray-600 hover:bg-gray-100"}`}
+              `,
+            children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: tab.label }),
+              tab.count !== null && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: `
+                  text-xs py-0.5 px-1.5 rounded-full min-w-[18px] text-center
+                  ${activeTab === tab.id ? "bg-white/20 text-white" : `${isDarkMode ? "bg-gray-600 text-gray-400" : "bg-gray-200 text-gray-600"}`}
+                `, children: tab.count })
+            ]
+          },
+          tab.id
+        )) }) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "min-h-[200px] max-h-[300px] overflow-y-auto", children: renderTabContent() })
+      ]
+    }
+  );
+};
+const ImageItem = ({ item, index: index2, isDarkMode, t, getObjectUrl: getObjectUrl2 }) => {
+  var _a;
+  const media = (_a = item.medias) == null ? void 0 : _a[0];
+  const getImageUrl = () => {
+    if (!(media == null ? void 0 : media.url)) return null;
+    if (media.url instanceof File) {
+      return URL.createObjectURL(media.url);
+    }
+    if (typeof media.url === "string" && getObjectUrl2) {
+      return getObjectUrl2(media.url);
+    }
+    return media.url;
+  };
+  const imageUrl = getImageUrl();
+  require$$0.useEffect(() => {
+    return () => {
+      if (imageUrl && imageUrl.startsWith("blob:")) {
+        URL.revokeObjectURL(imageUrl);
+      }
+    };
+  }, [imageUrl]);
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    "div",
+    {
+      style: {
+        borderRadius: "8px",
+        overflow: "hidden",
+        boxShadow: isDarkMode ? "0 4px 8px rgba(0,0,0,0.3)" : "0 4px 8px rgba(0,0,0,0.1)"
+      },
+      children: imageUrl ? /* @__PURE__ */ jsxRuntimeExports.jsx(
+        "img",
+        {
+          src: imageUrl,
+          alt: `Image ${index2 + 1}`,
+          style: {
+            width: "100%",
+            height: "250px",
+            objectFit: "cover"
+          },
+          onError: (e) => {
+            e.currentTarget.parentElement.style.display = "none";
+          }
+        }
+      ) : /* @__PURE__ */ jsxRuntimeExports.jsx(
+        "div",
+        {
+          style: {
+            width: "100%",
+            height: "250px",
+            backgroundColor: isDarkMode ? "#374151" : "#f3f4f6",
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            color: isDarkMode ? "#9ca3af" : "#6b7280",
+            fontSize: "14px"
+          },
+          children: t("imageSection.noImage") || "No image available"
+        }
+      )
+    },
+    item.id || index2
+  );
+};
+const ImageSection = ({ data, t, isDarkMode, getObjectUrl: getObjectUrl2 }) => {
+  const imageItems = useMemo(() => (data == null ? void 0 : data.sectionDataBindingItems) || [], [data]);
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: {
+    padding: "40px 20px",
+    backgroundColor: isDarkMode ? "#111827" : "white"
+  }, children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { maxWidth: "1200px", margin: "0 auto" }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+    "div",
+    {
+      style: {
+        display: "grid",
+        gridTemplateColumns: "repeat(auto-fit, minmax(300px, 1fr))",
+        gap: "20px"
+      },
+      children: imageItems.map((item, index2) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+        ImageItem,
+        {
+          item,
+          index: index2,
+          isDarkMode,
+          t,
+          getObjectUrl: getObjectUrl2
+        },
+        item.id || index2
+      ))
+    }
+  ) }) });
+};
+const SingleImageItem = ({ item, index: index2, isDarkMode }) => {
+  var _a;
+  const media = (_a = item.medias) == null ? void 0 : _a[0];
+  const getImageUrl = () => {
+    if (!(media == null ? void 0 : media.url)) return null;
+    if (media.url instanceof File) {
+      return URL.createObjectURL(media.url);
+    }
+    if (getObjectUrl && typeof media.url === "string") {
+      return getObjectUrl(media.url);
+    }
+    return media.url;
+  };
+  const imageUrl = getImageUrl();
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    "div",
+    {
+      style: {
+        borderRadius: "12px",
+        overflow: "hidden",
+        boxShadow: isDarkMode ? "0 8px 24px rgba(0,0,0,0.4)" : "0 8px 24px rgba(0,0,0,0.15)",
+        marginBottom: "30px"
+      },
+      children: imageUrl && /* @__PURE__ */ jsxRuntimeExports.jsx(
+        "img",
+        {
+          src: imageUrl,
+          alt: `Single Image ${index2 + 1}`,
+          style: {
+            width: "100%",
+            height: "400px",
+            objectFit: "cover",
+            display: "block"
+          },
+          onError: (e) => {
+            e.currentTarget.style.display = "none";
+          }
+        }
+      )
+    },
+    item.id || index2
+  );
+};
+const ImageSingleSection = ({ data, t, isDarkMode, getObjectUrl: getObjectUrl2 }) => {
+  const imageItems = useMemo(() => (data == null ? void 0 : data.sectionDataBindingItems) || [], [data]);
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: {
+    padding: "40px 20px",
+    backgroundColor: isDarkMode ? "#111827" : "white"
+  }, children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { maxWidth: "800px", margin: "0 auto" }, children: imageItems.map((item, index2) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+    SingleImageItem,
+    {
+      item,
+      index: index2,
+      isDarkMode,
+      getObjectUrl: getObjectUrl2
+    },
+    item.id || index2
+  )) }) });
+};
+const TextWithTitleSection = ({ section, data, isDarkMode }) => {
+  const textItems = (data == null ? void 0 : data.sectionDataBindingItems) || [];
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: {
+    padding: "40px 20px",
+    backgroundColor: isDarkMode ? "#1f2937" : "#f8f9fa",
+    textAlign: "center"
+  }, children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { maxWidth: "800px", margin: "0 auto" }, children: textItems.map((item, index2) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    "div",
+    {
+      style: {
+        backgroundColor: isDarkMode ? "#374151" : "white",
+        padding: "30px 20px",
+        marginBottom: "20px",
+        borderRadius: "8px",
+        boxShadow: isDarkMode ? "0 2px 4px rgba(0,0,0,0.3)" : "0 2px 4px rgba(0,0,0,0.1)"
+      },
+      children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("h2", { style: {
+          fontSize: "24px",
+          fontWeight: "bold",
+          color: isDarkMode ? "#f9fafb" : "#1f2937",
+          marginBottom: "16px",
+          lineHeight: "1.3"
+        }, children: item.title }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: {
+          fontSize: "16px",
+          lineHeight: "1.6",
+          color: isDarkMode ? "#d1d5db" : "#4b5563",
+          textAlign: "left"
+        }, children: item.value })
+      ]
+    },
+    item.id || index2
+  )) }) });
+};
+const index = {
+  AboutCompanySection,
+  CompanyValues,
+  TimelineSection,
+  PartnerCard,
+  PartnersSection,
+  MilestoneSection,
+  TestimonialsSection,
+  PartnerListCard,
+  PartnerListSection,
+  ContactFormSection,
+  ContactInfoSection,
+  ContactListAutoSection,
+  CustomerFeedbackAutoSection,
+  ProductListSection,
+  ImageSection,
+  ImageSingleSection,
+  TextWithTitleSection
 };
 export {
   AboutCompanySection,
   CompanyValues,
+  ContactFormSection,
+  ContactInfoSection,
+  ContactListAutoSection,
+  CustomerFeedbackAutoSection,
+  ImageSection,
+  ImageSingleSection,
+  MilestoneSection,
   PartnerCard,
+  PartnerListCard,
+  PartnerListSection,
   PartnersSection,
+  ProductListSection,
+  TestimonialsSection,
+  TextWithTitleSection,
   TimelineSection,
   index as default
 };