Refactor logo image handling across components

- Introduced utility functions to determine the base directory and image URL for logos based on their collection.
- Updated `Actions.svelte`, `CardFull.svelte`, `CardMiddle.svelte`, `CardSmall.svelte`, and `CardTiny.svelte` to use the new utility functions for generating image paths.
- Ensured that the correct image format (SVG, PNG, JPG) is used based on the logo's properties and active color sets.

public/images/logos/openvpn.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 512 512">
+    <path id="keyhole" fill="#1a3967"
+        d="M264.4 181.8c40.9 4.9 71.5 38.9 71.3 79.1-.1 32.6-20.6 61.9-51.7 73.7l30.7 162.8H194.9l31.2-162.5c-38.6-14.1-60.3-54.1-50.5-93.2 9.8-39 47.9-64.8 88.8-59.9" />
+    <path id="circle" fill="#ed7f22"
+        d="M256 14.6c139.3 0 253.1 108.8 256 244.9.1 88.5-48.2 170.2-126.7 214.4l-16.3-106c25.5-26.8 39.7-62.4 39.8-99.5-2.2-80.8-70-145.2-152.7-145.2s-150.5 64.4-152.7 145.2c.1 36.7 14.1 72.1 39.2 98.8l-16.4 106.4C48 429.3 0 347.7 0 259.5 2.9 123.4 116.7 14.6 256 14.6" />
+</svg>