diff --git a/components/chartstable/tabelkategoriipkmahasiswa.tsx b/components/chartstable/tabelkategoriipkmahasiswa.tsx
index f304003..9d3666a 100644
--- a/components/chartstable/tabelkategoriipkmahasiswa.tsx
+++ b/components/chartstable/tabelkategoriipkmahasiswa.tsx
@@ -199,12 +199,12 @@ export default function TabelKategoriIPKMahasiswa({ selectedYear }: TabelKategor
         </CardTitle>
         {/* Filter Kategori IPK */}
         <div className="flex items-center gap-2 mt-4">
-          <span className="text-sm dark:text-white">Filter Kategori IPK:</span>
+          <span className="text-sm text-gray-900 dark:text-white">Filter Kategori IPK:</span>
           <Select value={selectedKategori} onValueChange={handleKategoriChange}>
-            <SelectTrigger className="w-[220px]">
+            <SelectTrigger className="w-[220px] dark:bg-slate-800 dark:text-white dark:border-slate-700">
               <SelectValue placeholder="Pilih Kategori IPK" />
             </SelectTrigger>
-            <SelectContent>
+            <SelectContent className="dark:bg-slate-800 dark:text-white dark:border-slate-700">
               <SelectItem value="all">Semua Kategori</SelectItem>
               <SelectItem value="Sangat Baik">4.00 - 3.00 Sangat Baik</SelectItem>
               <SelectItem value="Baik">2.99 - 2.50 Baik</SelectItem>
@@ -254,15 +254,15 @@ export default function TabelKategoriIPKMahasiswa({ selectedYear }: TabelKategor
       <CardContent>
         {/* Show entries selector */}
         <div className="flex items-center gap-2 mb-4">
-          <span className="text-sm">Show</span>
+          <span className="text-sm text-gray-900 dark:text-white">Show</span>
           <Select
             value={pageSize.toString()}
             onValueChange={handlePageSizeChange}
           >
-            <SelectTrigger className="w-[80px]">
+            <SelectTrigger className="w-[80px] dark:bg-slate-800 dark:text-white dark:border-slate-700">
               <SelectValue placeholder={pageSize.toString()} />
             </SelectTrigger>
-            <SelectContent>
+            <SelectContent className="dark:bg-slate-800 dark:text-white dark:border-slate-700">
               <SelectItem value="5">5</SelectItem>
               <SelectItem value="10">10</SelectItem>
               <SelectItem value="25">25</SelectItem>
@@ -270,7 +270,7 @@ export default function TabelKategoriIPKMahasiswa({ selectedYear }: TabelKategor
               <SelectItem value="100">100</SelectItem>
             </SelectContent>
           </Select>
-          <span className="text-sm">entries</span>
+          <span className="text-sm text-gray-900 dark:text-white">entries</span>
         </div>
 
         <div className="border rounded-md overflow-hidden">
@@ -340,7 +340,7 @@ export default function TabelKategoriIPKMahasiswa({ selectedYear }: TabelKategor
         {/* Pagination info and controls */}
         {!loading && !error && filteredData.length > 0 && (
           <div className="flex flex-col sm:flex-row justify-between items-center gap-4 mt-4">
-            <div className="text-sm text-muted-foreground">
+            <div className="text-sm text-gray-600 dark:text-gray-300">
               Showing {getDisplayRange().start} to {getDisplayRange().end} of {filteredData.length} entries
             </div>
             <Pagination>
@@ -348,7 +348,7 @@ export default function TabelKategoriIPKMahasiswa({ selectedYear }: TabelKategor
                 <PaginationItem>
                   <PaginationPrevious 
                     onClick={() => handlePageChange(Math.max(1, currentPage - 1))}
-                    className={currentPage === 1 ? "pointer-events-none opacity-50" : "cursor-pointer"}
+                    className={`${currentPage === 1 ? "pointer-events-none opacity-50" : "cursor-pointer"} dark:text-white dark:hover:bg-slate-800`}
                   />
                 </PaginationItem>
                 
@@ -357,7 +357,7 @@ export default function TabelKategoriIPKMahasiswa({ selectedYear }: TabelKategor
                 <PaginationItem>
                   <PaginationNext 
                     onClick={() => handlePageChange(Math.min(getTotalPages(), currentPage + 1))}
-                    className={currentPage === getTotalPages() ? "pointer-events-none opacity-50" : "cursor-pointer"}
+                    className={`${currentPage === getTotalPages() ? "pointer-events-none opacity-50" : "cursor-pointer"} dark:text-white dark:hover:bg-slate-800`}
                   />
                 </PaginationItem>
               </PaginationContent>
@@ -389,7 +389,7 @@ export default function TabelKategoriIPKMahasiswa({ selectedYear }: TabelKategor
         <PaginationLink 
           isActive={currentPage === 1} 
           onClick={() => handlePageChange(1)}
-          className="cursor-pointer"
+          className="cursor-pointer dark:text-white dark:hover:bg-slate-800"
         >
           1
         </PaginationLink>
@@ -413,7 +413,7 @@ export default function TabelKategoriIPKMahasiswa({ selectedYear }: TabelKategor
           <PaginationLink 
             isActive={currentPage === i} 
             onClick={() => handlePageChange(i)}
-            className="cursor-pointer"
+            className="cursor-pointer dark:text-white dark:hover:bg-slate-800"
           >
             {i}
           </PaginationLink>
@@ -437,7 +437,7 @@ export default function TabelKategoriIPKMahasiswa({ selectedYear }: TabelKategor
           <PaginationLink 
             isActive={currentPage === totalPages} 
             onClick={() => handlePageChange(totalPages)}
-            className="cursor-pointer"
+            className="cursor-pointer dark:text-white dark:hover:bg-slate-800"
           >
             {totalPages}
           </PaginationLink>