styles: refactor codebase base style

src/app/(modules)/package/components/PackageColumns.tsx

@@ -35,14 +35,14 @@ function StateBadges({ value }: { value: string | null }) {
           <PopoverTrigger asChild>
             <button
               type="button"
-              className="flex items-center justify-center rounded-full border border-border/40 bg-muted/50 px-1.5 py-0.5 text-[10px] font-bold text-muted-foreground transition-colors hover:bg-muted"
+              className="flex items-center justify-center rounded-full border border-border/40 bg-muted/50 px-1.5 py-0.5 text-muted-foreground transition-colors hover:bg-muted"
             >
               +{remainingStates.length}
             </button>
           </PopoverTrigger>
           <PopoverContent className="w-auto p-2" align="start">
             <div className="flex flex-col gap-1.5">
-              <p className="mb-0.5 px-1 text-[10px] font-bold uppercase tracking-wider text-muted-foreground">
+              <p className="mb-0.5 px-1 text-muted-foreground">
                 Other States
               </p>
               {remainingStates.map((state) => (
@@ -64,7 +64,7 @@ export function usePackageColumns(projects: Project[]) {
       {
         accessorKey: 'name',
         header: 'Package Name',
-        cell: ({ row }) => <div className="font-semibold">{row.original.name}</div>,
+        cell: ({ row }) => <div>{row.original.name}</div>,
       },
       {
         accessorKey: 'project_id',

src/app/(modules)/package/components/PackageDialog.tsx

@@ -70,13 +70,13 @@ export function PackageDialog({
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent className="max-w-2xl" onOpenAutoFocus={(event) => event.preventDefault()}>
         <DialogHeader className="gap-2">
-          <DialogTitle className="flex items-center gap-3 text-xl">
+          <DialogTitle className="flex items-center gap-3">
             <div className="rounded-lg bg-primary p-2 text-primary-foreground shadow-sm">
               <PackageIcon className="size-5" />
             </div>
             {packageId ? 'Edit Package Details' : 'Create New Package'}
           </DialogTitle>
-          <DialogDescription className="text-sm">
+          <DialogDescription>
             {packageId
               ? 'Update the technical specifications for your road infrastructure package.'
               : 'Select a project and provide the essential data to establish a new package.'}
@@ -89,7 +89,7 @@ export function PackageDialog({
               <Select value={projectId} onValueChange={onProjectChange}>
                 <SelectTrigger aria-invalid={!!projectErrorMessage}>
                   {isProjectsLoading ? (
-                    <span className="flex items-center gap-2 text-sm text-muted-foreground">
+                    <span className="flex items-center gap-2 text-muted-foreground">
                       <Loader2 className="size-4 animate-spin" />
                       Loading...
                     </span>

src/app/(modules)/package/page.tsx

@@ -4,7 +4,6 @@ import { useCallback, useState } from 'react';
 import { Package as PackageIcon, Plus } from 'lucide-react';
 
 import { PageHeader } from '@/components/page-header';
-import { PoweredBy } from '@/components/powered-by';
 import { Button } from '@/components/ui/button';
 import type { Package } from '@/types';
 
@@ -108,8 +107,6 @@ export default function PackagePage() {
           onEdit={openEdit}
           onDelete={deletePackage}
         />
-
-        <PoweredBy />
       </main>
 
       <PackageDialog