Fix navbar logo background in dark mode on collections page

Scoped dynamic dark mode CSS overrides to only apply within main
element, preventing them from affecting the navbar logo container.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

Author: drusepth

app/views/page_collections/show.html.erb

@@ -1207,16 +1207,16 @@ document.addEventListener('DOMContentLoaded', function() {
       to { opacity: 1; transform: translateY(0); }
     }
     
-    /* Dark mode styles */
-    .dark .bg-white { background-color: #1f2937; }
-    .dark .text-gray-900 { color: #f9fafb; }
-    .dark .text-gray-700 { color: #d1d5db; }
-    .dark .text-gray-600 { color: #9ca3af; }
-    .dark .text-gray-500 { color: #6b7280; }
-    .dark .border-gray-200 { border-color: #374151; }
-    .dark .border-gray-300 { border-color: #4b5563; }
-    .dark .bg-gray-50 { background-color: #111827; }
-    .dark .bg-gray-100 { background-color: #1f2937; }
+    /* Dark mode styles - scoped to main content only to avoid affecting navbar */
+    .dark main .bg-white { background-color: #1f2937; }
+    .dark main .text-gray-900 { color: #f9fafb; }
+    .dark main .text-gray-700 { color: #d1d5db; }
+    .dark main .text-gray-600 { color: #9ca3af; }
+    .dark main .text-gray-500 { color: #6b7280; }
+    .dark main .border-gray-200 { border-color: #374151; }
+    .dark main .border-gray-300 { border-color: #4b5563; }
+    .dark main .bg-gray-50 { background-color: #111827; }
+    .dark main .bg-gray-100 { background-color: #1f2937; }
     
     /* Prevent MaterializeCSS dropdown conflicts */
     select[data-no-materialize="true"] + .select-wrapper {