Enhance website security and add SEO meta tags for better visibility

Implement robust security headers, including CSP with nonces, and integrate comprehensive SEO meta tags into the base template and homepage. Add inline styles for CSP compliance and improve theme management script for immediate theme application.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 48ecdb60-d0f0-4b75-95c9-34e409ef35fb
Replit-Commit-Checkpoint-Type: intermediate_checkpoint

static/css/inline-styles.css

@@ -0,0 +1,29 @@
+/* Inline styles that were moved from the base template for CSP compliance */
+
+[x-cloak] {
+  display: none !important;
+}
+
+.dropdown-menu {
+  position: absolute;
+  right: 0;
+  margin-top: 0.5rem;
+  width: 12rem;
+  border-radius: 0.375rem;
+  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
+    0 4px 6px -2px rgba(0, 0, 0, 0.05);
+  z-index: 50;
+  overflow: hidden;
+}
+
+.htmx-indicator {
+  display: none;
+}
+
+.htmx-request .htmx-indicator {
+  display: block;
+}
+
+.htmx-request.htmx-indicator {
+  display: block;
+}

static/css/tailwind.css

@@ -2957,6 +2957,11 @@
       left: calc(var(--spacing) * 4);
     }
   }
+  .focus\:z-50 {
+    &:focus {
+      z-index: 50;
+    }
+  }
   .focus\:border-blue-500 {
     &:focus {
       border-color: var(--color-blue-500);

static/js/theme.js

@@ -0,0 +1,16 @@
+/**
+ * Theme management script
+ * Prevents flash of wrong theme by setting theme class immediately
+ */
+(function() {
+  let theme = localStorage.getItem("theme");
+  if (!theme) {
+    theme = window.matchMedia("(prefers-color-scheme: dark)").matches
+      ? "dark"
+      : "light";
+    localStorage.setItem("theme", theme);
+  }
+  if (theme === "dark") {
+    document.documentElement.classList.add("dark");
+  }
+})();