feat(auth): integrate codice-fiscale-js for fiscal code validation in registration

app/components/MessageComposer.vue

@@ -42,28 +42,17 @@ const removeFile = (idx: number) => {
 </script>
 
 <template>
-  <div class="message-composer mt-4 border-top pt-3">
+  <div class="message-composer mt-3">
     <form @submit.prevent="handleSubmit">
-      
-      <!-- Preview Allegati -->
-      <div v-if="files.length > 0" class="mb-3 d-flex flex-wrap gap-2">
-        <div v-for="(file, idx) in files" :key="idx" class="badge bg-light text-dark border p-2 d-flex align-items-center gap-2">
+      <div v-if="files.length > 0" class="message-files mb-3">
+        <div v-for="(file, idx) in files" :key="idx" class="message-file-chip">
           <BIIcon name="it-clip" size="xs" />
-          <span class="text-truncate" style="max-width: 150px;">{{ file.name }}</span>
-          <button type="button" class="btn-close ms-2" style="font-size: 0.5rem;" @click="removeFile(idx)" aria-label="Rimuovi allegato"></button>
+          <span class="text-truncate file-name">{{ file.name }}</span>
+          <button type="button" class="btn-close btn-close-sm" @click="removeFile(idx)" aria-label="Rimuovi allegato"></button>
         </div>
       </div>
 
-      <div class="input-group align-items-end">
-        <button
-          type="button"
-          class="btn btn-outline-secondary me-2 rounded"
-          title="Allega file (max 5)"
-          @click="fileInputRef?.click()"
-          :disabled="isSubmitting || files.length >= 5"
-        >
-          <BIIcon name="it-clip" size="sm" />
-        </button>
+      <div class="composer-shell">
         <input 
           ref="fileInputRef"
           type="file" 
@@ -73,26 +62,38 @@ const removeFile = (idx: number) => {
           accept="image/*,video/*,.pdf,.doc,.docx"
         />
 
-        <textarea
-            v-model="message"
-            class="form-control rounded"
-            placeholder="Scrivi un messaggio... (Ctrl+Enter per inviare)"
-            rows="2"
-            :disabled="isSubmitting"
-            @keydown="handleKeydown"
-        />
         <button
-            type="submit"
-            class="btn btn-primary ms-2 rounded"
-            :disabled="isSubmitting || (message.trim() === '' && files.length === 0)"
+          type="button"
+          class="btn btn-outline-secondary btn-icon composer-attach"
+          title="Allega file"
+          @click="fileInputRef?.click()"
+          :disabled="isSubmitting || files.length >= 5"
+        >
+          <BIIcon name="it-clip" size="sm" />
+        </button>
+
+        <textarea
+          v-model="message"
+          class="form-control composer-textarea"
+          placeholder="Scrivi aggiornamento o domanda"
+          rows="2"
+          :disabled="isSubmitting"
+          @keydown="handleKeydown"
+        />
+
+        <button
+          type="submit"
+          class="btn btn-primary composer-submit"
+          :disabled="isSubmitting || (message.trim() === '' && files.length === 0)"
         >
           <span v-if="isSubmitting" class="spinner-border spinner-border-sm me-2" role="status" aria-hidden="true"></span>
           <BIIcon v-else name="it-arrow-right" size="sm" color="white" class="me-1" />
           Invia
         </button>
       </div>
+
       <small class="text-muted d-block mt-2">
-        💡 <strong>Tip:</strong> Premi Ctrl+Enter per inviare velocemente
+        `Ctrl` + `Invio` per inviare. Fino a 5 allegati.
       </small>
     </form>
   </div>
@@ -100,13 +101,79 @@ const removeFile = (idx: number) => {
 
 <style scoped>
 .message-composer {
-  background-color: #f9f9f9;
-  border-radius: 0.5rem;
-  padding: 1rem;
+  border-top: 1px solid #d9e3ee;
+  padding-top: 1rem;
 }
 
-textarea {
-  resize: vertical;
-  font-family: inherit;
+.message-files {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.5rem;
 }
-</style>
+
+.message-file-chip {
+  align-items: center;
+  background: #f2f7fc;
+  border: 1px solid #d9e3ee;
+  border-radius: 999px;
+  display: inline-flex;
+  gap: 0.5rem;
+  max-width: 100%;
+  padding: 0.4rem 0.75rem;
+}
+
+.file-name {
+  max-width: 14rem;
+}
+
+.composer-shell {
+  align-items: flex-end;
+  background: #fff;
+  border: 1px solid #c5d0db;
+  border-radius: 8px;
+  display: grid;
+  gap: 0.75rem;
+  grid-template-columns: auto minmax(0, 1fr) auto;
+  padding: 0.75rem;
+}
+
+.composer-shell:focus-within {
+  border-color: #06c;
+  box-shadow: 0 0 0 2px rgba(0, 102, 204, 0.12);
+}
+
+.composer-attach {
+  flex-shrink: 0;
+}
+
+.composer-textarea {
+  border: 0;
+  box-shadow: none;
+  min-height: 3rem;
+  padding: 0;
+  resize: vertical;
+}
+
+.composer-submit {
+  min-width: 7rem;
+}
+
+.btn-close-sm {
+  font-size: 0.55rem;
+}
+
+@media (max-width: 767.98px) {
+  .composer-shell {
+    grid-template-columns: auto 1fr;
+  }
+
+  .composer-textarea {
+    grid-column: 1 / -1;
+  }
+
+  .composer-submit {
+    grid-column: 2;
+    justify-self: end;
+  }
+}
+</style>