diff --git a/package.json b/package.json
index 1dac038c..8012983f 100644
--- a/package.json
+++ b/package.json
@@ -38,7 +38,7 @@
     "dotenv": "^16.5.0",
     "embla-carousel-autoplay": "^8.6.0",
     "embla-carousel-react": "^8.6.0",
-    "firebase": "^9.22.2",
+    "firebase": "^12.1.0",
     "firebaseui": "6.1.0",
     "framer-motion": "^12.7.5",
     "lucide-react": "^0.503.0",
diff --git a/src/css/custom.css b/src/css/custom.css
index 54bd2e0d..435ab170 100644
--- a/src/css/custom.css
+++ b/src/css/custom.css
@@ -357,26 +357,26 @@
 
 /* ===== DOCUSAURUS DOCUMENTATION PAGES DARK THEME ===== */
 
-/* Main documentation layout - EXCLUDE community page */
-[data-theme='dark'] body:not(:has(.community-page)) .main-wrapper {
+/* Main documentation layout - EXCLUDE community page AND footer */
+[data-theme='dark'] body:not(:has(.community-page)) .main-wrapper:not(.enhanced-footer *) {
   background-color: var(--dark-bg-primary) !important;
   color: var(--dark-text-primary) !important;
 }
 
-[data-theme='dark'] body:not(:has(.community-page)) .docusaurus-wrapper {
+[data-theme='dark'] body:not(:has(.community-page)) .docusaurus-wrapper:not(.enhanced-footer *) {
   background-color: var(--dark-bg-primary) !important;
 }
 
-/* Documentation content area - EXCLUDE community page */
-[data-theme='dark'] body:not(:has(.community-page)) .container {
+/* Documentation content area - EXCLUDE community page AND footer */
+[data-theme='dark'] body:not(:has(.community-page)) .container:not(.enhanced-footer .container):not(.enhanced-footer *) {
   background-color: var(--dark-bg-primary) !important;
 }
 
-[data-theme='dark'] body:not(:has(.community-page)) .row {
+[data-theme='dark'] body:not(:has(.community-page)) .row:not(.enhanced-footer .row):not(.enhanced-footer *) {
   background-color: var(--dark-bg-primary) !important;
 }
 
-[data-theme='dark'] body:not(:has(.community-page)) .col {
+[data-theme='dark'] body:not(:has(.community-page)) .col:not(.enhanced-footer .col):not(.enhanced-footer *) {
   background-color: var(--dark-bg-primary) !important;
 }
 
@@ -812,3 +812,38 @@ html {
   color: inherit;
 }
 
+/* ===== FOOTER PROTECTION FROM GLOBAL THEME OVERRIDES ===== */
+/* Prevent ANY global dark theme styles from affecting the enhanced footer */
+
+/* Override any global container/wrapper styles that might affect footer */
+[data-theme='dark'] .enhanced-footer,
+[data-theme='dark'] .enhanced-footer *,
+[data-theme='dark'] .enhanced-footer .container,
+[data-theme='dark'] .enhanced-footer .row,
+[data-theme='dark'] .enhanced-footer .col,
+[data-theme='dark'] .enhanced-footer div,
+[data-theme='dark'] .enhanced-footer section {
+  background-color: transparent !important;
+}
+
+/* Ensure footer maintains its gradient background regardless of global styles */
+[data-theme='dark'] .enhanced-footer {
+  background: linear-gradient(135deg, #0f0f23 0%, #1a1a2e 25%, #16213e 50%, #0f3460 75%, #533483 100%) !important;
+  color: #e2e8f0 !important;
+}
+
+/* Force footer sections to maintain their intended backgrounds */
+[data-theme='dark'] .enhanced-footer .footer-links-section {
+  background: rgba(0, 0, 0, 0.15) !important;
+}
+
+[data-theme='dark'] .enhanced-footer .footer-bottom {
+  background: rgba(0, 0, 0, 0.2) !important;
+}
+
+/* Prevent global text color overrides */
+[data-theme='dark'] .enhanced-footer,
+[data-theme='dark'] .enhanced-footer * {
+  color: inherit !important;
+}
+