 import React from "react";
import { Link } from "react-router-dom";

function Dashboard () {
    return(
        <div className="min-h-screen bg-slate-50 p-6 flex flex-col gap-6 items-center justify-center">
            
            <h2 className="text-2xl md:text-3xl font-extrabold text-slate-800 text-center tracking-wide max-w-2xl">
                WELCOME TO STOCKHUB LTD STOCK MANAGEMENT SYSTEM
            </h2>
            
            <div className="grid grid-cols-1 sm:grid-cols-2 gap-4 w-full max-w-2xl mt-4">
                <Link to="/product" className="bg-white p-6 rounded shadow-sm border border-slate-200 text-center font-bold text-slate-700 hover:border-blue-500 hover:text-blue-500 transition-all">
                    📦 Product Management
                </Link>
                <Link to="/warehouse" className="bg-white p-6 rounded shadow-sm border border-slate-200 text-center font-bold text-slate-700 hover:border-blue-500 hover:text-blue-500 transition-all">
                    🏢 Warehouse Management
                </Link>
                {/* Note: I kept your exact link route "/transactions" here */}
                <Link to="/transactions" className="bg-white p-6 rounded shadow-sm border border-slate-200 text-center font-bold text-slate-700 hover:border-blue-500 hover:text-blue-500 transition-all">
                    🔄 Stock Transactions
                </Link>
                <Link to="/reports" className="bg-white p-6 rounded shadow-sm border border-slate-200 text-center font-bold text-slate-700 hover:border-blue-500 hover:text-blue-500 transition-all">
                    📊 Inventory Reports
                </Link>
            </div>

        </div>
    )
}
export default Dashboard;
