feat: add dark mode support, accordion UI, and current combination display

- Update Theme Studio sidebar to use DaisyUI theme-aware classes for dark mode
- Convert Customise accordion to native details/summary elements for proper interaction
- Add "Current combination" card showing active theme settings
- Add SVG recolorer for logo color customization
- Add image controller for serving uploaded images
- Implement header background image controls (zoom, position)
- Add toggle_customise event handler to preserve accordion state across re-renders

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

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

lib/simpleshop_theme/media/svg_recolorer.ex

@@ -0,0 +1,134 @@
+defmodule SimpleshopTheme.Media.SVGRecolorer do
+  @moduledoc """
+  Recolors SVG images by replacing fill and stroke colors with a target color.
+
+  This module provides functionality to dynamically recolor SVG logos
+  to match the site's branding colors.
+  """
+
+  @doc """
+  Recolors an SVG by replacing common color attributes with the target color.
+
+  Replaces:
+  - fill="..." attributes (except fill="none")
+  - stroke="..." attributes (except stroke="none")
+  - style="fill:..." inline styles
+  - style="stroke:..." inline styles
+
+  ## Examples
+
+      iex> svg = ~s(<svg><path fill="#000000" d="..."/></svg>)
+      iex> SVGRecolorer.recolor(svg, "#ff6600")
+      ~s(<svg><path fill="#ff6600" d="..."/></svg>)
+
+  """
+  @spec recolor(String.t(), String.t()) :: String.t()
+  def recolor(svg_content, target_color) when is_binary(svg_content) and is_binary(target_color) do
+    svg_content
+    |> recolor_fill_attributes(target_color)
+    |> recolor_stroke_attributes(target_color)
+    |> recolor_inline_fill_styles(target_color)
+    |> recolor_inline_stroke_styles(target_color)
+    |> recolor_css_fill_styles(target_color)
+    |> recolor_css_stroke_styles(target_color)
+    |> recolor_current_color(target_color)
+  end
+
+  defp recolor_fill_attributes(svg, color) do
+    Regex.replace(
+      ~r/fill\s*=\s*["'](?!none)([^"']+)["']/i,
+      svg,
+      ~s(fill="#{color}")
+    )
+  end
+
+  defp recolor_stroke_attributes(svg, color) do
+    Regex.replace(
+      ~r/stroke\s*=\s*["'](?!none)([^"']+)["']/i,
+      svg,
+      ~s(stroke="#{color}")
+    )
+  end
+
+  defp recolor_inline_fill_styles(svg, color) do
+    Regex.replace(
+      ~r/style\s*=\s*["']([^"']*)fill\s*:\s*(?!none)[^;}"']+([^"']*)["']/i,
+      svg,
+      ~s(style="\\1fill:#{color}\\2")
+    )
+  end
+
+  defp recolor_inline_stroke_styles(svg, color) do
+    Regex.replace(
+      ~r/style\s*=\s*["']([^"']*)stroke\s*:\s*(?!none)[^;}"']+([^"']*)["']/i,
+      svg,
+      ~s(style="\\1stroke:#{color}\\2")
+    )
+  end
+
+  defp recolor_css_fill_styles(svg, color) do
+    # Replace fill declarations in CSS style blocks: fill:#XXXXXX or fill: #XXXXXX
+    # But preserve fill:none
+    Regex.replace(
+      ~r/fill\s*:\s*(?!none)(#[0-9A-Fa-f]{3,6}|[a-zA-Z]+)(?=[;\s\}])/,
+      svg,
+      "fill:#{color}"
+    )
+  end
+
+  defp recolor_css_stroke_styles(svg, color) do
+    # Replace stroke declarations in CSS style blocks: stroke:#XXXXXX or stroke: #XXXXXX
+    # But preserve stroke:none
+    Regex.replace(
+      ~r/stroke\s*:\s*(?!none)(#[0-9A-Fa-f]{3,6}|[a-zA-Z]+)(?=[;\s\}])/,
+      svg,
+      "stroke:#{color}"
+    )
+  end
+
+  defp recolor_current_color(svg, color) do
+    String.replace(svg, "currentColor", color)
+  end
+
+  @doc """
+  Validates that a string is a valid hex color code.
+
+  ## Examples
+
+      iex> SVGRecolorer.valid_hex_color?("#ff6600")
+      true
+
+      iex> SVGRecolorer.valid_hex_color?("#f60")
+      true
+
+      iex> SVGRecolorer.valid_hex_color?("invalid")
+      false
+
+  """
+  @spec valid_hex_color?(String.t()) :: boolean()
+  def valid_hex_color?(color) when is_binary(color) do
+    Regex.match?(~r/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6})$/, color)
+  end
+
+  def valid_hex_color?(_), do: false
+
+  @doc """
+  Normalizes a hex color to 6-digit format.
+
+  ## Examples
+
+      iex> SVGRecolorer.normalize_hex_color("#f60")
+      "#ff6600"
+
+      iex> SVGRecolorer.normalize_hex_color("#ff6600")
+      "#ff6600"
+
+  """
+  @spec normalize_hex_color(String.t()) :: String.t()
+  def normalize_hex_color("#" <> hex) when byte_size(hex) == 3 do
+    [r, g, b] = String.graphemes(hex)
+    "##{r}#{r}#{g}#{g}#{b}#{b}"
+  end
+
+  def normalize_hex_color(color), do: color
+end