interface TopBarProps {
    title: string;
    subtitle?: string;
}

export const TopBar = ({ title, subtitle }: TopBarProps) => {
    return (
        <header className="flex h-14 items-center border-b border-secondary bg-primary px-6">
            <div className="flex flex-col justify-center">
                <h1 className="text-lg font-bold text-primary">{title}</h1>
                {subtitle && <p className="text-xs text-tertiary">{subtitle}</p>}
            </div>
        </header>
    );
};
