Refactor secure connection handling in LoginForm and introduce SecureConnectionIndicator component

- Remove inline secure connection checks from LoginForm and replace them with a new SecureConnectionIndicator component.
- The SecureConnectionIndicator displays secure connection status messages based on the current protocol.
- Clean up LoginForm template for improved readability and maintainability.

app/components/Auth/LoginForm.vue

@@ -4,7 +4,7 @@
 import { z } from 'zod'
 import { useForm } from 'vee-validate'
 import { toTypedSchema } from '@vee-validate/zod'
-import { AlertCircle, AlertTriangle, Loader2, ShieldCheck, ShieldAlert } from 'lucide-vue-next'
+import { AlertCircle, Loader2 } from 'lucide-vue-next'
 
 const { login } = useAuth()
 
@@ -37,12 +37,6 @@ const onSubmit = handleSubmit(async (values) => {
     submitError.value = error.message || 'Anmeldung fehlgeschlagen. Bitte versuche es erneut.'
   }
 })
-
-// Is the connection secure?
-const isSecureConnection = ref(false)
-onMounted(() => {
-  isSecureConnection.value = window.location.protocol === 'https:'
-})
 </script>
 
 <template>
@@ -81,17 +75,8 @@ onMounted(() => {
       {{ isSubmitting ? 'Wird angemeldet...' : 'Anmelden' }}
     </Button>
 
-    <ClientOnly>
-      <!-- Secure Connection Text -->
-      <p v-if="!isSecureConnection" class="flex items-center justify-center gap-2 text-sm text-white/70">
-        <ShieldAlert :size="16" class="flex-shrink-0 text-error" />
-        <span class="text-error">Die Datenübertragung erfolgt NICHT verschlüsselt</span>
-      </p>
-      <p v-else class="flex items-center justify-center gap-2 text-sm text-white/70">
-        <ShieldCheck :size="16" class="flex-shrink-0 text-success" />
-        <span class="text-success">Die Datenübertragung erfolgt verschlüsselt</span>
-      </p>
-    </ClientOnly>
+    <!-- Secure Connection Indicator -->
+    <SecureConnectionIndicator />
 
   </form>
 </template>