Implement authentication phase with Cidaas OAuth2 integration

- Add authentication middleware to protect routes
- Create API endpoints for login, logout, registration, and user info
- Develop UI components for login and registration forms
- Integrate VeeValidate for form validation
- Update environment configuration for Cidaas settings
- Add i18n support for English and German languages
- Enhance Tailwind CSS for improved styling of auth components
- Document authentication flow and testing procedures

app/components/ui/input/Input.vue

@@ -0,0 +1,67 @@
+<script setup lang="ts">
+import type { HTMLAttributes, InputHTMLAttributes } from 'vue'
+import type { InputVariants } from '.'
+import { computed } from 'vue'
+import { cn } from '~/lib/utils'
+import { inputVariants } from '.'
+
+/**
+ * Input component - Text input field with variants and two-way binding
+ * Supports all native input attributes and custom styling variants
+ */
+
+interface Props {
+  /** The input value */
+  modelValue?: string | number
+  /** Input type (text, email, password, etc.) */
+  type?: InputHTMLAttributes['type']
+  /** Placeholder text */
+  placeholder?: string
+  /** Whether the input is disabled */
+  disabled?: boolean
+  /** Whether the input is required */
+  required?: boolean
+  /** Input name attribute */
+  name?: string
+  /** Input ID attribute */
+  id?: string
+  /** Autocomplete attribute */
+  autocomplete?: string
+  /** Input variant */
+  variant?: InputVariants['variant']
+  /** Input size */
+  size?: InputVariants['size']
+  /** Custom CSS class */
+  class?: HTMLAttributes['class']
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  type: 'text',
+  variant: 'default',
+  size: 'default',
+})
+
+const emits = defineEmits<{
+  'update:modelValue': [value: string | number]
+}>()
+
+// Two-way binding support using computed property
+const modelValue = computed({
+  get: () => props.modelValue ?? '',
+  set: (value) => emits('update:modelValue', value),
+})
+</script>
+
+<template>
+  <input
+    v-model="modelValue"
+    :type="type"
+    :class="cn(inputVariants({ variant, size }), props.class)"
+    :placeholder="placeholder"
+    :disabled="disabled"
+    :required="required"
+    :name="name"
+    :id="id"
+    :autocomplete="autocomplete"
+  />
+</template>