import React, { ReactNode } from 'react';
import { LucideIcon } from 'lucide-react';

interface PanelHeaderProps {
    title: string;
    icon: LucideIcon;
    className?: string;
    children?: ReactNode;
}

export const PanelHeader: React.FC<PanelHeaderProps> = ({ title, icon: Icon, className, children }) => (
    <div className={`flex items-center gap-3 mb-6 border-b border-white/10 pb-2 ${className || ''}`}>
        <div className="text-neon-blue animate-pulse">
            <Icon className="w-5 h-5" />
        </div>
        <h2 className="text-lg font-tech font-bold text-white tracking-[0.1em] uppercase text-shadow-glow-blue">
            {title}
        </h2>
        <div className="flex-1 h-px bg-gradient-to-r from-neon-blue/50 to-transparent"></div>
        {children}
    </div>
);