Create a fully responsive image slider component in Next.js using Tailwind CSS. The slider should display images with accompanying text information. Each slide should have a smooth transition animation. The component should be fully responsive, adjusting the layout for different screen sizes. The text should be overlaid on the images and centered both vertically and horizontally. Include navigation controls (previous and next buttons) to navigate through the slides. | A shadcn/ui and v0 generation - v0