import type { ReactNode } from "react";

type PageHeaderProps = {
  title: string;
  subtitle?: string;
  breadcrumb?: ReactNode;
};

export default function PageHeader({ title, subtitle, breadcrumb }: PageHeaderProps) {
  return (
    <div className="bg-gradient-to-r from-[#CC1414] to-[#8B0000] text-white py-8 md:py-12">
      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
        {breadcrumb ? <div className="text-red-100 text-sm mb-2">{breadcrumb}</div> : null}
        <h1 className="text-3xl md:text-4xl font-black">{title}</h1>
        {subtitle ? <p className="text-red-100 mt-2 max-w-3xl">{subtitle}</p> : null}
      </div>
    </div>
  );
}