diff --git a/app/dashboard/storefront/page.tsx b/app/dashboard/storefront/page.tsx
index af1fc76..7a87069 100644
--- a/app/dashboard/storefront/page.tsx
+++ b/app/dashboard/storefront/page.tsx
@@ -79,15 +79,11 @@ export default function StorefrontPage() {
 
   return (
     <Layout>
-      {/* ✅ Dark Themed Toaster for Notifications */}
       <Toaster position="top-right" theme="dark" duration={3000} />
-
-      {/* Broadcast Dialog Component */}
       <BroadcastDialog open={broadcastOpen} setOpen={setBroadcastOpen} />
 
       <div className="max-w-4xl mx-auto p-6 space-y-8">
-        {/* PGP Key Section */}
-        <div className="bg-white dark:bg-zinc-800 rounded-xl shadow-lg p-6 border border-gray-100 dark:border-zinc-700">
+        <div className="bg-white dark:bg-[#0F0F12] rounded-xl shadow-lg p-6 border dark:border-zinc-700">
           <div className="flex items-center gap-3 mb-4">
             <Key className="h-6 w-6 text-purple-600 dark:text-purple-400" />
             <h2 className="text-xl font-semibold text-gray-900 dark:text-zinc-100">
@@ -98,7 +94,7 @@ export default function StorefrontPage() {
             <Textarea
               name="pgpKey"
               placeholder="-----BEGIN PGP PUBLIC KEY BLOCK-----"
-              className="h-48 text-sm bg-gray-50 dark:bg-zinc-900 border-gray-200 dark:border-zinc-700 focus:ring-2 focus:ring-purple-500"
+              className="h-48 text-sm bg-gray-50 dark:bg-zinc-900 dark:bg-[#0F0F12]focus:ring-2 focus:ring-purple-500"
               spellCheck={false}
               value={storefront.pgpKey}
               onChange={handleInputChange}
@@ -109,7 +105,7 @@ export default function StorefrontPage() {
         {/* Telegram Configuration */}
         <div className="grid gap-6 md:grid-cols-2">
           {/* Bot Token */}
-          <div className="bg-white dark:bg-zinc-800 rounded-xl shadow-lg p-6 border border-gray-100 dark:border-zinc-700">
+          <div className="bg-white dark:bg-[#0F0F12] rounded-xl shadow-lg p-6 border dark:border-zinc-700">
             <div className="flex items-center gap-3 mb-4">
               <Shield className="h-6 w-6 text-emerald-600 dark:text-emerald-400" />
               <h2 className="text-xl font-semibold text-gray-900 dark:text-zinc-100">
@@ -127,7 +123,7 @@ export default function StorefrontPage() {
           </div>
 
           {/* Welcome Message */}
-          <div className="bg-white dark:bg-zinc-800 rounded-xl shadow-lg p-6 border border-gray-100 dark:border-zinc-700">
+          <div className="bg-white dark:bg-[#0F0F12]  rounded-xl shadow-lg p-6 border border-gray-100 dark:border-zinc-700">
             <div className="flex items-center gap-3 mb-4">
               <MessageSquare className="h-6 w-6 text-amber-600 dark:text-amber-400" />
               <h2 className="text-xl font-semibold text-gray-900 dark:text-zinc-100">
@@ -144,7 +140,6 @@ export default function StorefrontPage() {
           </div>
         </div>
 
-        {/* Buttons */}
         <div className="sticky bottom-6 mt-8 flex justify-between">
           <Button
             onClick={() => setBroadcastOpen(true)}