feat(Input): create reusable input component

src/shared/ui/Input/Input.svelte

@@ -0,0 +1,54 @@
+<!--
+    Component: Input
+    Provides styled input component with all the shadcn input props
+-->
+<script lang="ts">
+import { Input } from '$shared/shadcn/ui/input';
+import { cn } from '$shared/shadcn/utils/shadcn-utils';
+import type { ComponentProps } from 'svelte';
+
+type Props = ComponentProps<typeof Input> & {
+    /**
+     * Current search value (bindable)
+     */
+    value: string;
+    /**
+     * Additional CSS classes for the container
+     */
+    class?: string;
+};
+
+let {
+    value = $bindable(''),
+    class: className,
+    ...rest
+}: Props = $props();
+</script>
+
+<Input
+    bind:value={value}
+    class={cn(
+        'h-12 sm:h-14 md:h-16 w-full text-sm sm:text-base',
+        'backdrop-blur-md bg-white/80',
+        'border border-gray-300/50',
+        'shadow-[0_1px_3px_rgba(0,0,0,0.04)]',
+        'focus-visible:border-gray-400/60',
+        'focus-visible:outline-none',
+        'focus-visible:ring-1',
+        'focus-visible:ring-gray-400/30',
+        'focus-visible:bg-white/90',
+        'hover:bg-white/90',
+        'hover:border-gray-400/60',
+        'text-gray-900',
+        'placeholder:text-gray-400',
+        'placeholder:font-mono',
+        'placeholder:text-xs sm:placeholder:text-sm',
+        'placeholder:tracking-wide',
+        'pl-11 sm:pl-14 pr-4 sm:pr-6',
+        'rounded-xl',
+        'transition-all duration-200',
+        'font-medium',
+        className,
+    )}
+    {...rest}
+/>