Enhance theme support: update CSS variables for dark and light themes, improve modal styles, and ensure SVGs use currentColor for theme compatibility.

src/components/Actions.svelte

@@ -1,6 +1,5 @@
 <script>
   export let logo;
-  export let onCopy;
   export let onDownload;
 
   // Download menu state

src/components/InlineSvg.svelte

@@ -11,8 +11,17 @@
     const res = await fetch(path);
     let text = await res.text();
     if (!color) {
-      // No user-selected color, render as-is (SVG uses fill="currentColor")
-      svgHtml = text;
+      // No user-selected color, add currentColor to ensure theme colors are applied
+      const parser = new DOMParser();
+      const doc = parser.parseFromString(text, "image/svg+xml");
+      const svg = doc.documentElement;
+
+      // Set currentColor on SVG element if no fill is specified
+      if (!svg.hasAttribute("fill")) {
+        svg.setAttribute("fill", "currentColor");
+      }
+
+      svgHtml = doc.documentElement.outerHTML;
       return;
     }
     // Parse and update color only if user selected

src/components/Preview.svelte

@@ -140,7 +140,7 @@ $: getLogoThemeColor = logo => getDefaultLogoColor(logo.colors, theme);
 
   :global(.modal-content) {
     background: var(--color-card);
-    color: var(--text-color);
+    color: var(--color-text);
     border-radius: 8px;
     padding: 1rem;
     max-width: 500px;
@@ -167,7 +167,7 @@ $: getLogoThemeColor = logo => getDefaultLogoColor(logo.colors, theme);
     border: none;
     font-size: 1.5rem;
     cursor: pointer;
-    color: var(--text-color, #222);
+    color: var(--color-text);
     transition: color 0.2s;
   }