feat: production deployment - full update with providers, admin, glossaries, pricing, tests

Major changes across backend, frontend, infrastructure:
- Provider system with model selection (Google, DeepL, OpenAI, Ollama, Google Cloud)
- Admin panel: user management, pricing, settings
- Glossary system with CSV import/export
- Subscription and tier quota management
- Security hardening (rate limiting, API key auth, path traversal fixes)
- Docker compose for dev, prod, and IONOS deployment
- Alembic migrations for new tables
- Frontend: dashboard, pricing page, landing page, i18n (en/fr)
- Test suite and verification scripts

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

frontend/src/app/dashboard/translate/LanguageSelector.tsx

@@ -8,6 +8,7 @@ import {
   SelectTrigger,
   SelectValue,
 } from '@/components/ui/select';
+import { useI18n } from '@/lib/i18n';
 import type { Language } from './types';
 
 interface LanguageSelectorProps {
@@ -29,36 +30,36 @@ export function LanguageSelector({
   onSourceChange,
   onTargetChange,
 }: LanguageSelectorProps) {
+  const { t } = useI18n();
+
   return (
-    <div className="flex flex-col gap-2">
+    <div className="flex flex-col gap-3">
       {error && (
-        <div className="flex items-center gap-2 rounded-md bg-destructive/10 px-3 py-2 text-xs text-destructive">
-          <AlertCircle className="size-3.5" />
-          <span>Failed to load languages: {error}</span>
+        <div className="flex items-center gap-2 rounded-lg bg-destructive/10 px-3 py-2 text-xs text-destructive">
+          <AlertCircle className="size-3.5 shrink-0" />
+          <span>{t('dashboard.translate.language.loadErrorPrefix')} {error}</span>
         </div>
       )}
-      <div className="flex items-center gap-3">
+
+      <div className="flex items-end gap-3">
+        {/* Source language */}
         <div className="flex flex-1 flex-col gap-1.5">
-          <label className="text-xs font-medium text-muted-foreground">
-            Source Language
+          <label className="text-sm font-medium text-foreground">
+            {t('dashboard.translate.language.source')}
           </label>
-          <Select 
-            value={sourceLang} 
-            onValueChange={onSourceChange}
-            disabled={isLoading}
-          >
-            <SelectTrigger className="w-full">
+          <Select value={sourceLang} onValueChange={onSourceChange} disabled={isLoading}>
+            <SelectTrigger className="h-11 w-full">
               {isLoading ? (
-                <div className="flex items-center gap-2">
+                <div className="flex items-center gap-2 text-muted-foreground">
                   <Loader2 className="size-3.5 animate-spin" />
-                  <span className="text-muted-foreground">Loading...</span>
+                  <span>{t('dashboard.translate.language.loading')}</span>
                 </div>
               ) : (
-                <SelectValue placeholder="Auto-detect" />
+                <SelectValue placeholder={t('dashboard.translate.language.autoDetect')} />
               )}
             </SelectTrigger>
             <SelectContent>
-              <SelectItem value="auto">Auto-detect</SelectItem>
+              <SelectItem value="auto">{t('dashboard.translate.language.autoDetect')}</SelectItem>
               {languages.map((lang) => (
                 <SelectItem key={lang.code} value={lang.code}>
                   {lang.name}
@@ -68,25 +69,25 @@ export function LanguageSelector({
           </Select>
         </div>
 
-        <ArrowRight className="mt-5 size-4 shrink-0 text-muted-foreground" />
+        {/* Arrow — flips in RTL via rtl: variant */}
+        <div className="mb-2 flex size-9 shrink-0 items-center justify-center rounded-full bg-muted text-muted-foreground">
+          <ArrowRight className="size-4 rtl:rotate-180" />
+        </div>
 
+        {/* Target language */}
         <div className="flex flex-1 flex-col gap-1.5">
-          <label className="text-xs font-medium text-muted-foreground">
-            Target Language
+          <label className="text-sm font-medium text-foreground">
+            {t('dashboard.translate.language.target')}
           </label>
-          <Select 
-            value={targetLang} 
-            onValueChange={onTargetChange}
-            disabled={isLoading}
-          >
-            <SelectTrigger className="w-full">
+          <Select value={targetLang} onValueChange={onTargetChange} disabled={isLoading}>
+            <SelectTrigger className="h-11 w-full">
               {isLoading ? (
-                <div className="flex items-center gap-2">
+                <div className="flex items-center gap-2 text-muted-foreground">
                   <Loader2 className="size-3.5 animate-spin" />
-                  <span className="text-muted-foreground">Loading...</span>
+                  <span>{t('dashboard.translate.language.loading')}</span>
                 </div>
               ) : (
-                <SelectValue placeholder="Select language" />
+                <SelectValue placeholder={t('dashboard.translate.language.selectPlaceholder')} />
               )}
             </SelectTrigger>
             <SelectContent>