Responsive Component - Copy this React, Tailwind Component to your project

<div className="space y 6 p 6 max w screen xl mx auto text black dark:text white"> {/* Header Section */} <div className="grid grid cols 3 gap 6 bg white dark:bg gray 900 rounded lg p 6 shadow md"> <div className="space y 1"> <p className="text sm text gray 700">Nhân viên</p> <p className="text lg font medium">tam nhu</p> </div> <div className="space y 1"> <p className="text sm text gray 700">Thời gian</p> <p className="text lg font medium">Tháng 01 năm 2025</p> </div> <div className="space y 1"> <p className="text sm text gray 700">Lương cơ bản (VND)</p> <p className="text lg font medium">200.000</p> </div> </div> {/* Table and Tabs Section */} <div className="grid grid cols [2fr_1fr] gap 3"> {/* Table Section */} <div className="bg white dark:bg gray 900 rounded lg shadow md p 6 space y 4"> {/* Tabs Section */} <div className="flex justify start gap 4"> <button className={`px 5 py 2 rounded full font medium text sm transition ${activeTab === 'departments' ? 'bg yellow 100 text yellow 900 border border yellow 300 shadow sm' : 'bg gray 200 dark:bg gray 700 hover:bg gray 100' }`} onClick={() => setActiveTab('departments')} > Các bộ phận khác và tiền thưởng tương ứng </button> <button className={`px 5 py 2 rounded full font medium text sm transition ${activeTab === 'overtime' ? 'bg blue 100 text blue 900 border border blue 300 shadow sm' : 'bg gray 200 dark:bg gray 700 hover:bg gray 100' }`} onClick={() => setActiveTab('overtime')} > Tăng ca/Đi trễ </button> <button className={`px 5 py 2 rounded full font medium text sm transition ${activeTab === 'bonus' ? 'bg green 100 text green 900 border border green 300 shadow sm' : 'bg gray 200 dark:bg gray 700 hover:bg gray 100' }`} onClick={() => setActiveTab('bonus')} > Thưởng/Phạt </button> </div> {/* DataTable Section */} <div className="overflow auto"> <DataTable rows={rows} columns={columnsByTab[activeTab]} isLoading={false} /> </div> </div> {/* Side Info Section */} <div className="space y 6"> {/* Workdays Info */} <div className="bg white dark:bg gray 900 rounded lg p 6 shadow md"> <h3 className="font medium text gray 900 dark:text white mb 4">Chi tiết ngày làm việc tháng này</h3> <div className="space y 4"> <div className="flex justify between text sm text gray 500"> <span>Ngày 18</span> <span>31 ngày</span> </div> <div className="relative w full h 2 bg gray 200 rounded full"> <div className="absolute top 0 left 0 h 2 bg blue 600 rounded full" style={{ width: '10%' }} /> </div> <div className="grid grid cols 2 gap 4"> <div> <div className="flex items center gap 2 mb 1"> <div className="w 2 h 2 rounded full bg green 500" /> <span className="text sm text gray 500">Ngày đã làm</span> </div> <p className="text green 600 font medium">0.5 ngày</p> </div> <div> <div className="flex items center gap 2 mb 1"> <div className="w 2 h 2 rounded full bg red 500" /> <span className="text sm text gray 500">Ngày còn lại</span> </div> <p className="text red 600 font medium">27.5 ngày</p> </div> </div> </div> </div> {/* Salary Breakdown */} <div className="bg white dark:bg gray 900 font semibold rounded lg p 6 shadow md space y 4"> <div> <p className="text sm text gray 500">Lương theo ngày làm việc (VND)</p> <p className="text lg font medium text gray 900 dark:text white">3,571</p> </div> <div> <p className="text sm text gray 500">Lương thưởng (VND)</p> <p className="text lg font medium text gray 900 dark:text white">0</p> </div> <div> <p className="text sm text gray 500">Lương tăng ca/đi trễ</p> <p className="text lg font medium text gray 900 dark:text white">0</p> </div> <div> <p className="text sm text gray 500">Lương thưởng/phạt</p> <p className="text lg font medium text gray 900 dark:text white">0</p> </div> <div className="pt 4 border t border gray 200 dark:border gray 700"> <p className="text sm text gray 500">Tổng thu nhập tháng này (VND)</p> <p className="text lg font medium text blue 600">3,571</p> </div> </div> </div> </div> </div>cải tiến code sau để có responsive đẹp ở mọi kích cỡ màn hình mà không thay đổi code hiện tại