"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import BlogCardThree from '@/components/sections/blog/BlogCardThree';

export default function BasketballPage() {
  return (
    <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay navItems={[{ name: "Home", id: "/" }, { name: "Football", id: "/football" }, { name: "Basketball", id: "/basketball" }, { name: "UFC", id: "/ufc" }, { name: "Hockey", id: "/hockey" }, { name: "Baseball", id: "/baseball" }]} />
      </div>
      <div id="latest" data-section="latest">
        <BlogCardThree title="Basketball News & Highlights" animationType="slide-up" textboxLayout="default" useInvertedBackground={false} description="Catch up on the latest basketball action and news." blogs={[]} />
      </div>
    </ThemeProvider>
  );
}