feat(localization): expand language support and enhance UI for user settings

- Added support for additional UI locales including Cebuano and Spanish, improving accessibility for a broader user base.
- Updated language selection components in the AppHeader and SettingsWidget to reflect new language options, enhancing user experience.
- Enhanced localization of various UI elements across components, ensuring consistent language representation and improved user engagement.
- Implemented logic to synchronize user language preferences with backend settings, providing a seamless experience when changing languages.

frontend/src/views/social/VocabNewLanguageView.vue

@@ -1,17 +1,17 @@
 <template>
   <div class="vocab-new-language-view">
     <section class="vocab-new-language-hero surface-card">
-      <span class="vocab-new-language-hero__eyebrow">Vokabeltrainer</span>
+      <span class="vocab-new-language-hero__eyebrow">{{ $t('socialnetwork.vocab.newLanguageHeroEyebrow') }}</span>
       <h2>{{ $t('socialnetwork.vocab.newLanguageTitle') }}</h2>
-      <p>Neue Sprache anlegen, Freigabecode erzeugen und direkt in die Bearbeitung wechseln.</p>
+      <p>{{ $t('socialnetwork.vocab.newLanguageHeroIntro') }}</p>
     </section>
 
     <section class="box surface-card">
       <label class="label form-field">
         <span>{{ $t('socialnetwork.vocab.languageName') }}</span>
         <input v-model="name" type="text" :class="{ 'field-error': nameTouched && !canSave }" />
-        <span class="form-hint">Ein kurzer, klarer Sprachname reicht für den Start.</span>
-        <span v-if="nameTouched && !canSave" class="form-error">Der Name sollte mindestens 2 Zeichen haben.</span>
+        <span class="form-hint">{{ $t('socialnetwork.vocab.newLanguageNameHint') }}</span>
+        <span v-if="nameTouched && !canSave" class="form-error">{{ $t('socialnetwork.vocab.newLanguageNameValidation') }}</span>
       </label>
 
       <div class="actions form-actions-row">