rotate + hover on start-page

src/lib/components/FileDropzone.svelte

@@ -103,9 +103,9 @@
 
 <button
 	type="button"
-	class="flex w-full cursor-pointer flex-col items-center justify-center gap-2 rounded-2xl border-2 border-dashed border-primary-300 bg-white px-6 py-10 text-center transition focus:outline-none focus-visible:ring-2 focus-visible:ring-primary-400 {isDragging
-		? 'border-primary-400 bg-primary-100/60'
-		: ''} {className}"
+	class="flex w-full cursor-pointer flex-col items-center justify-center gap-2 rounded-2xl border-2 border-dashed px-6 py-10 text-center transition-all duration-150 focus:outline-none focus-visible:ring-2 focus-visible:ring-primary-400 {isDragging
+		? 'scale-[1.02] border-primary bg-primary-100/70 shadow-lg ring-4 ring-primary/25'
+		: 'border-primary-300 bg-white hover:border-primary-400 hover:bg-primary-50/60'} {className}"
 	aria-label={ariaLabel}
 	data-dropzone-ready={fileInput ? 'true' : 'false'}
 	onclick={openFileDialog}
@@ -116,7 +116,11 @@
 >
 	{#if icon}
 		{@const IconComponent = icon}
-		<IconComponent class="h-10 w-10 text-primary" />
+		<IconComponent
+			class="h-10 w-10 text-primary transition-transform duration-150 {isDragging
+				? 'scale-125'
+				: ''}"
+		/>
 	{/if}
 	<div class="flex flex-row items-baseline justify-center gap-2">
 		<span class="text-[18px] font-bold text-primary-900">{label}</span>
@@ -125,6 +129,9 @@
 	{#if sublabel}
 		<p class="text-[13px] text-primary-700">{sublabel}</p>
 	{/if}
+	{#if isDragging}
+		<p class="text-[13px] font-bold text-primary">Jetzt loslassen zum Hinzufügen</p>
+	{/if}
 </button>
 
 {#if rejectionMessage}