Cài đặt tính năng hiển thị chi phí

frontend/src/pages/TourDetailPage.tsx

@@ -539,12 +539,15 @@ export const TourDetailPage = ({ onBack }: { onBack: () => void }) => {
 
       {/* Financial Quick-View Widget or Quote */}
       <div className="max-w-2xl mx-auto -mt-10 px-4 relative z-10">
-        <div className={`rounded-3xl p-6 shadow-2xl transition-all duration-500 ${hasFinanceAccess ? 'bg-indigo-600 text-white shadow-indigo-200' : 'bg-white text-gray-600 border border-gray-100'}`}>
+        <div 
+          onClick={() => hasFinanceAccess && setActiveTab('expense')}
+          className={`rounded-3xl p-6 shadow-2xl transition-all duration-500 ${hasFinanceAccess ? 'bg-indigo-600 text-white shadow-indigo-200 cursor-pointer hover:scale-[1.02] active:scale-95' : 'bg-white text-gray-600 border border-gray-100'}`}
+        >
           <div className="flex justify-between items-center">
             {hasFinanceAccess ? (
               <>
                 <div>
-                  <p className="text-indigo-100 text-xs font-black uppercase tracking-widest mb-1">Tổng chi tiêu hiện tại</p>
+                  <p className="text-indigo-100 text-[10px] font-black uppercase tracking-widest mb-1">Tổng chi tiêu hiện tại (Nhấn để xem chi tiết)</p>
                   <h3 className="text-3xl font-black">{tourInfo.budget}</h3>
                 </div>
                 <div className="p-4 bg-white/10 rounded-2xl backdrop-blur-md"><Wallet className="w-8 h-8" /></div>