diff --git a/src/components/application/table/column-toggle.tsx b/src/components/application/table/column-toggle.tsx
index 3ff4d02..7001f5c 100644
--- a/src/components/application/table/column-toggle.tsx
+++ b/src/components/application/table/column-toggle.tsx
@@ -2,7 +2,6 @@ import { useState, useRef, useEffect } from 'react';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faColumns3 } from '@fortawesome/pro-duotone-svg-icons';
 import { Button } from '@/components/base/buttons/button';
-import { Checkbox } from '@/components/base/checkbox/checkbox';
 import type { FC } from 'react';
 
 const ColumnsIcon: FC<{ className?: string }> = ({ className }) => (
@@ -54,17 +53,17 @@ export const ColumnToggle = ({ columns, visibleColumns, onToggle }: ColumnToggle
                     </div>
                     <div className="max-h-64 overflow-y-auto py-1">
                         {columns.map(col => (
-                            <label
+                            <button
                                 key={col.id}
-                                className="flex items-center gap-2 px-3 py-1.5 text-xs text-primary hover:bg-primary_hover cursor-pointer"
+                                type="button"
+                                onClick={(e) => { e.stopPropagation(); onToggle(col.id); }}
+                                className="flex w-full items-center gap-2 px-3 py-1.5 text-xs text-primary hover:bg-primary_hover cursor-pointer text-left"
                             >
-                                <Checkbox
-                                    size="sm"
-                                    isSelected={visibleColumns.has(col.id)}
-                                    onChange={() => onToggle(col.id)}
-                                />
+                                <span className={`flex size-4 shrink-0 items-center justify-center rounded border ${visibleColumns.has(col.id) ? 'bg-brand-solid border-brand text-white' : 'border-primary bg-primary'}`}>
+                                    {visibleColumns.has(col.id) && <span className="text-[10px]">✓</span>}
+                                </span>
                                 {col.label}
-                            </label>
+                            </button>
                         ))}
                     </div>
                 </div>