x

apps/spa/src/components/DynamicProductCarousel.tsx

@@ -3,6 +3,7 @@ import { useRef } from 'react';
 import { ChevronLeft, ChevronRight } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
 import { getLocalizedField } from '../utils/localization';
+import { getSectionPaddingClasses } from '../utils/spacing';
 
 interface DynamicProductCarouselProps {
   payload: any;
@@ -21,7 +22,7 @@ export default function DynamicProductCarousel({ payload }: DynamicProductCarous
   const scrollRight = () => carouselRef.current?.scrollBy({ left: 300, behavior: 'smooth' });
 
   return (
-    <section className="ui-section-band bg-pop-bg">
+    <section className={`bg-pop-bg ${getSectionPaddingClasses(p)}`}>
       <div className="ui-section-inner">
         {(title || description) && (
           <div className="text-center mb-12">