src/app/page.tsx

@@ -14,7 +14,7 @@ import 'slick-carousel/slick/slick.css';
 import 'slick-carousel/slick/slick-theme.css';
 import dynamic from 'next/dynamic';
 
-const Slider = dynamic(() => import('react-slick'), { ssr: false });
+const Slider = dynamic(() => import('react-slick').then(mod => mod.default), { ssr: false });
 
 export default function LandingPage() {
   const channelLogos = [
@@ -165,7 +165,7 @@ export default function LandingPage() {
       <div id="channel-logos" data-section="channel-logos" className="w-full py-20">
         <div className="px-6 md:px-12">
           <h2 className="text-3xl font-bold mb-8 text-center">Available on Your Favorite Channels</h2>
-          <Slider {...channelLogosSettings}>
+          <Slider {...(channelLogosSettings as any)}>
             {channelLogos.map((channel) => (
               <div key={channel.id} className="px-3">
                 <div className="bg-card rounded-lg p-4 flex items-center justify-center h-24">
@@ -180,7 +180,7 @@ export default function LandingPage() {
       <div id="movies" data-section="movies" className="w-full py-20">
         <div className="px-6 md:px-12">
           <h2 className="text-3xl font-bold mb-8 text-center">Featured Movies</h2>
-          <Slider {...moviesSettings}>
+          <Slider {...(moviesSettings as any)}>
             {movies.map((movie) => (
               <div key={movie.id} className="px-3">
                 <div className="bg-card rounded-lg overflow-hidden">
@@ -198,7 +198,7 @@ export default function LandingPage() {
       <div id="series" data-section="series" className="w-full py-20">
         <div className="px-6 md:px-12">
           <h2 className="text-3xl font-bold mb-8 text-center">Popular Series</h2>
-          <Slider {...seriesSettings}>
+          <Slider {...(seriesSettings as any)}>
             {series.map((show) => (
               <div key={show.id} className="px-3">
                 <div className="bg-card rounded-lg overflow-hidden">