From dc529ffa4e179d9f071ef4feac514d503869c7f8 Mon Sep 17 00:00:00 2001
From: parsa aghaei <p.aghaei@hoshmand.local>
Date: Mon, 29 Jun 2026 14:47:48 +0330
Subject: [PATCH] fix: testimonials layout - fix card width/gap alignment,
 remove overflow-visible, adjust quote icon size

---
 .../components/testimonials/testimonials.tsx  | 20 +++++++++----------
 1 file changed, 10 insertions(+), 10 deletions(-)

diff --git a/src/app/(routes)/(website)/components/testimonials/testimonials.tsx b/src/app/(routes)/(website)/components/testimonials/testimonials.tsx
index 47e6b31..886a10f 100644
--- a/src/app/(routes)/(website)/components/testimonials/testimonials.tsx
+++ b/src/app/(routes)/(website)/components/testimonials/testimonials.tsx
@@ -75,16 +75,16 @@ export default function Testimonials({ dict }: TestimonialsProps) {
         </motion.p>
       </div>
 
-      <div className="relative w-full px-12">
+      <div className="relative w-full px-14">
         <div
           ref={scrollRef}
-          className="flex gap-8 overflow-x-auto snap-x snap-mandatory scrollbar-none pb-4"
+          className="flex gap-6 overflow-x-auto snap-x snap-mandatory scrollbar-none pb-4"
           style={{ scrollbarWidth: "none", msOverflowStyle: "none" }}
         >
           {tData.map((testimonial, index) => (
             <div
               key={index}
-              className="w-full md:w-[calc(50%-1rem)] lg:w-[calc(33.333%-1.1rem)] snap-start flex-shrink-0"
+              className="w-full md:w-[calc(50%-0.75rem)] lg:w-[calc(33.333%-1rem)] snap-start flex-shrink-0"
             >
               <motion.div
                 initial={{ opacity: 0, y: 30 }}
@@ -92,14 +92,14 @@ export default function Testimonials({ dict }: TestimonialsProps) {
                 transition={{ duration: 0.5, delay: index * 0.1 }}
                 viewport={{ once: true }}
                 whileHover={{ y: -10 }}
-                className="relative p-6 md:p-8 rounded-3xl glass-panel flex flex-col h-full overflow-visible"
+                className="relative p-6 md:p-8 rounded-3xl glass-panel flex flex-col h-full"
               >
-                <div className="absolute -top-6 -start-6 w-12 h-12 bg-primary rounded-full flex items-center justify-center text-white shadow-lg">
-                  <Quote className="w-6 h-6" />
+                <div className="absolute -top-5 -start-5 w-10 h-10 bg-primary rounded-full flex items-center justify-center text-white shadow-lg">
+                  <Quote className="w-5 h-5" />
                 </div>
                 
-                <div className="flex-grow pt-2 overflow-visible">
-                  <p className="w-full min-w-0 normal-case whitespace-normal break-words tracking-normal block mb-8 italic text-sm md:text-base text-start px-8 md:px-14 leading-relaxed">
+                <div className="flex-grow pt-2">
+                  <p className="w-full min-w-0 normal-case whitespace-normal break-words tracking-normal block mb-6 italic text-sm md:text-base text-start px-6 md:px-10 leading-relaxed">
                     "{testimonial.quote}"
                   </p>
                 </div>
@@ -135,7 +135,7 @@ export default function Testimonials({ dict }: TestimonialsProps) {
             <button
               onClick={isRTL ? handleNext : handlePrev}
               disabled={isRTL ? currentIndex >= maxIndex : currentIndex === 0}
-              className="absolute left-2 top-1/2 -translate-y-1/2 w-10 h-10 rounded-full bg-background border border-border shadow-lg flex items-center justify-center text-foreground hover:text-primary transition-colors disabled:opacity-30 disabled:cursor-not-allowed z-20"
+              className="absolute left-0 top-1/2 -translate-y-1/2 w-10 h-10 rounded-full bg-background border border-border shadow-lg flex items-center justify-center text-foreground hover:text-primary transition-colors disabled:opacity-30 disabled:cursor-not-allowed z-20"
               aria-label="Previous testimonials"
             >
               <ChevronLeft className="w-5 h-5" />
@@ -143,7 +143,7 @@ export default function Testimonials({ dict }: TestimonialsProps) {
             <button
               onClick={isRTL ? handlePrev : handleNext}
               disabled={isRTL ? currentIndex === 0 : currentIndex >= maxIndex}
-              className="absolute right-2 top-1/2 -translate-y-1/2 w-10 h-10 rounded-full bg-background border border-border shadow-lg flex items-center justify-center text-foreground hover:text-primary transition-colors disabled:opacity-30 disabled:cursor-not-allowed z-20"
+              className="absolute right-0 top-1/2 -translate-y-1/2 w-10 h-10 rounded-full bg-background border border-border shadow-lg flex items-center justify-center text-foreground hover:text-primary transition-colors disabled:opacity-30 disabled:cursor-not-allowed z-20"
               aria-label="Next testimonials"
             >
               <ChevronRight className="w-5 h-5" />