Refactor dashboard components and update global styles

- Updated the title and description in layout.tsx to reflect the new application name.
- Replaced the background color in globals.css with a background image for the title section.
- Enhanced the Devices and UserDevices pages by adding search and filter components for improved user interaction.
- Introduced a new DevicesTable component for displaying device data with pagination.
- Updated the Users page to improve layout and added a filter for user status.
- Made various UI adjustments across components for better consistency and usability.

app/(dashboard)/users/page.tsx

@@ -18,35 +18,38 @@ export default async function AdminUsers({
 
 	return (
 		<div>
-			<h3 className="border-b-2 text-2xl font-bold title-bg py-4 px-2 mb-4">
+			<h3 className="border-b-2 text-gray-500 text-2xl font-bold title-bg py-4 px-2 mb-4">
 				Users
 			</h3>
 			<div
 				id="user-filters"
 				className=" border-b-2 pb-4 gap-4 flex items-center justify-start"
 			>
-				<Search />
-				<Filter
-					options={[
-						{
-							value: "all",
-							label: "ALL",
-							icon: <Minus size={14} />,
-						},
-						{
-							value: "unverified",
-							label: "Unverfieid",
-							icon: <CheckCheck size={14} />,
-						},
-						{
-							value: "verified",
-							label: "Verified",
-							icon: <Hourglass size={14} />,
-						},
-					]}
-					defaultOption="all"
-					queryParamKey="status"
-				/>
+				<div className="flex flex-col sm:flex-row flex-wrap items-start justify-start gap-2">
+					<Search />
+					<Filter
+						options={[
+							{
+								value: "all",
+								label: "ALL",
+								icon: <Minus size={14} />,
+							},
+							{
+								value: "unverified",
+								label: "Unverfieid",
+								icon: <CheckCheck size={14} />,
+							},
+							{
+								value: "verified",
+								label: "Verified",
+								icon: <Hourglass size={14} />,
+							},
+						]}
+						defaultOption="all"
+						queryParamKey="status"
+					/>
+				</div>
+
 			</div>
 			<Suspense fallback={"loading...."}>
 				<UsersTable searchParams={searchParams} />