feat: Lead Master — column show/hide toggle, resizable table, remove dead filter/sort buttons

- ColumnToggle component with checkbox dropdown for column visibility
- useColumnVisibility hook for state management
- Campaign/Ad/FirstContact/Spam/Dups hidden by default (mostly empty)
- ResizableTableContainer wrapping Table for column resize support
- Column defaultWidth/minWidth props
- Removed non-functional Filter and Sort buttons

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

src/components/application/table/column-toggle.tsx

@@ -0,0 +1,94 @@
+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 }) => (
+    <FontAwesomeIcon icon={faColumns3} className={className} />
+);
+
+export type ColumnDef = {
+    id: string;
+    label: string;
+    defaultVisible?: boolean;
+};
+
+interface ColumnToggleProps {
+    columns: ColumnDef[];
+    visibleColumns: Set<string>;
+    onToggle: (columnId: string) => void;
+}
+
+export const ColumnToggle = ({ columns, visibleColumns, onToggle }: ColumnToggleProps) => {
+    const [open, setOpen] = useState(false);
+    const panelRef = useRef<HTMLDivElement>(null);
+
+    useEffect(() => {
+        if (!open) return;
+        const handler = (e: MouseEvent) => {
+            if (panelRef.current && !panelRef.current.contains(e.target as Node)) {
+                setOpen(false);
+            }
+        };
+        document.addEventListener('mousedown', handler);
+        return () => document.removeEventListener('mousedown', handler);
+    }, [open]);
+
+    return (
+        <div className="relative" ref={panelRef}>
+            <Button
+                size="sm"
+                color="secondary"
+                iconLeading={ColumnsIcon}
+                onClick={() => setOpen(!open)}
+            >
+                Columns
+            </Button>
+
+            {open && (
+                <div className="absolute top-full right-0 mt-2 w-56 rounded-xl bg-primary shadow-xl ring-1 ring-secondary z-50 overflow-hidden">
+                    <div className="px-3 py-2 border-b border-secondary">
+                        <span className="text-xs font-semibold text-tertiary">Show/Hide Columns</span>
+                    </div>
+                    <div className="max-h-64 overflow-y-auto py-1">
+                        {columns.map(col => (
+                            <label
+                                key={col.id}
+                                className="flex items-center gap-2 px-3 py-1.5 text-xs text-primary hover:bg-primary_hover cursor-pointer"
+                            >
+                                <Checkbox
+                                    size="sm"
+                                    isSelected={visibleColumns.has(col.id)}
+                                    onChange={() => onToggle(col.id)}
+                                />
+                                {col.label}
+                            </label>
+                        ))}
+                    </div>
+                </div>
+            )}
+        </div>
+    );
+};
+
+export const useColumnVisibility = (columns: ColumnDef[]) => {
+    const [visibleColumns, setVisibleColumns] = useState<Set<string>>(() => {
+        return new Set(columns.filter(c => c.defaultVisible !== false).map(c => c.id));
+    });
+
+    const toggle = (columnId: string) => {
+        setVisibleColumns(prev => {
+            const next = new Set(prev);
+            if (next.has(columnId)) {
+                next.delete(columnId);
+            } else {
+                next.add(columnId);
+            }
+            return next;
+        });
+    };
+
+    return { visibleColumns, toggle };
+};