(function() {
    const ViewCollab = () => {
        return (
            <div className="px-4 pt-24 pb-32">
                <h1 className="text-2xl font-bold text-white mb-6">Kolaborasi Kreatif</h1>
                
                <div className="bg-gradient-to-r from-blue-900 to-purple-900 rounded-3xl p-6 mb-8 relative overflow-hidden shadow-lg border border-white/10">
                    <div className="relative z-10">
                        <h2 className="text-xl font-bold text-white mb-2">Cari Tim Impianmu</h2>
                        <p className="text-blue-100 text-sm mb-4">Hubungkan talenta lokal. Dari sutradara hingga penata artistik.</p>
                        <button className="bg-white text-blue-900 px-4 py-2 rounded-xl text-sm font-bold shadow-lg">
                            + Pasang Lowongan
                        </button>
                    </div>
                </div>

                <div className="space-y-4">
                     {/* Mock Data Item */}
                    <div className="bg-[#1e1e2e] p-5 rounded-2xl border border-white/5">
                        <div className="flex justify-between items-start mb-2">
                            <h4 className="font-bold text-white">Penata Kostum (Batik)</h4>
                            <span className="bg-red-500/20 text-red-400 text-[10px] px-2 py-0.5 rounded">URGENT</span>
                        </div>
                        <p className="text-xs text-purple-400 mb-3">Project: Gadis Polder</p>
                        <p className="text-sm text-gray-400">Dicari yang paham pakem motif Banyumasan.</p>
                    </div>
                </div>
            </div>
        );
    };
    window.ViewCollab = ViewCollab;
})();