From 5afc5d754c34dd919b63d0220e6e35ec0e03ee54 Mon Sep 17 00:00:00 2001
From: nmemmert <nmemmert@users.noreply.github.com>
Date: Thu, 15 Jan 2026 14:58:50 -0500
Subject: [PATCH] fix: enable system theme support and adjust settings page
 layout

---
 src/components/ClientLayout.tsx | 2 +-
 src/components/SettingsPage.tsx | 6 +++---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/ClientLayout.tsx b/src/components/ClientLayout.tsx
index 7b98b65..72a3522 100644
--- a/src/components/ClientLayout.tsx
+++ b/src/components/ClientLayout.tsx
@@ -10,7 +10,7 @@ export default function ClientLayout({
   children: React.ReactNode;
 }) {
   return (
-    <ThemeProvider attribute="class" defaultTheme="dark">
+    <ThemeProvider attribute="class" defaultTheme="dark" enableSystem>
       <AuthProvider>
         {children}
         <Toaster
diff --git a/src/components/SettingsPage.tsx b/src/components/SettingsPage.tsx
index 155a5e4..675cddf 100644
--- a/src/components/SettingsPage.tsx
+++ b/src/components/SettingsPage.tsx
@@ -14,8 +14,8 @@ export default function SettingsPage({ userEmail }: SettingsPageProps) {
   const [showConfirm, setShowConfirm] = useState(false);
 
   return (
-    <div className="min-h-screen bg-gradient-to-b from-slate-50 to-slate-100 dark:from-slate-900 dark:to-slate-800 pt-20 px-4 pb-8">
-      <div className="max-w-2xl mx-auto">
+    <div className="min-h-screen bg-gradient-to-b from-slate-50 to-slate-100 dark:from-slate-900 dark:to-slate-800 p-4 pb-32 pt-8">
+      <div className="max-w-md mx-auto">
         {/* Header */}
         <div className="text-center mb-8">
           <h1 className="text-4xl font-bold text-slate-900 dark:text-white mb-2">
@@ -27,7 +27,7 @@ export default function SettingsPage({ userEmail }: SettingsPageProps) {
         </div>
 
         {/* Settings Card */}
-        <div className="bg-white dark:bg-slate-800 rounded-xl shadow-lg p-6 space-y-6">
+        <div className="bg-white dark:bg-slate-800 rounded-lg shadow-sm p-4 space-y-6">
           {/* Account Section */}
           <div className="border-b border-slate-200 dark:border-slate-700 pb-6">
             <h2 className="text-lg font-semibold text-slate-900 dark:text-white mb-4">