fix: convert read page status messages to tooltips with translations

- Replace DOM status element with tooltip functionality in page-reader.js
- Add translation keys for read page status messages to all 18 languages
- Update page-reader.js to use button tooltips instead of separate status div
- Fix TTS download button duplication guard with consistent CSS classes

🤖 Generated with [Claude Code](https://claude.ai/code)

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

src/languages/ar.js

@@ -101,5 +101,10 @@ export const ar = {
 	pleaseEnterText: "يرجى إدخال بعض النص أولاً!",
 	pleaseSelectFile: "يرجى تحديد ملف أولاً!",
 	pleaseEnterTranslateText: "يرجى إدخال بعض النص للترجمة!",
+
+	// Read page status messages
+	processingContent: "معالجة المحتوى...",
+	readingPageClickToPause: "قراءة الصفحة... انقر للإيقاف",
+	pausedClickToResume: "متوقف. انقر للمتابعة",
 	aiModalNotAvailable: "نافذة الذكاء الاصطناعي غير متاحة في هذا السياق",
 };

src/languages/bn.js

@@ -101,5 +101,10 @@ export const bn = {
 	pleaseEnterText: "দয়া করে প্রথমে কিছু টেক্সট লিখুন!",
 	pleaseSelectFile: "দয়া করে প্রথমে একটি ফাইল নির্বাচন করুন!",
 	pleaseEnterTranslateText: "দয়া করে অনুবাদের জন্য কিছু টেক্সট লিখুন!",
+
+	// Read page status messages
+	processingContent: "প্রক্রিয়াকরণ সামগ্রী...",
+	readingPageClickToPause: "পাতা পড়া হচ্ছে... বিরতির জন্য ক্লিক করুন",
+	pausedClickToResume: "বিরতি। পুনরায় শুরুর জন্য ক্লিক করুন",
 	aiModalNotAvailable: "AI মডেল এই প্রসঙ্গে উপলব্ধ নয়",
 };

src/languages/de.js

@@ -101,5 +101,10 @@ export const de = {
 	pleaseEnterText: "Bitte geben Sie zuerst Text ein!",
 	pleaseSelectFile: "Bitte wählen Sie zuerst eine Datei aus!",
 	pleaseEnterTranslateText: "Bitte geben Sie Text zum Übersetzen ein!",
+
+	// Read page status messages
+	processingContent: "Inhalt wird verarbeitet...",
+	readingPageClickToPause: "Seite wird vorgelesen... Klicken zum Pausieren",
+	pausedClickToResume: "Pausiert. Klicken zum Fortsetzen",
 	aiModalNotAvailable: "KI-Modal ist in diesem Kontext nicht verfügbar",
 };

src/languages/en.js

@@ -69,6 +69,11 @@ export const en = {
 		"text-to-speech: write any message & have the artificial intelligence speak it!",
 	translatePlaceholder: "Enter any text to translate...",
 
+	// Read page status messages
+	processingContent: "Processing content...",
+	readingPageClickToPause: "Reading page... Click to pause",
+	pausedClickToResume: "Paused. Click to resume",
+
 	// Translation modal tabs
 	translatePageTab: "📄 Translate Page",
 	customTextTab: "✏️ Custom Text",

src/languages/es.js

@@ -70,6 +70,11 @@ export const es = {
 		"texto a voz: ¡escribe cualquier mensaje y haz que la inteligencia artificial lo hable!",
 	translatePlaceholder: "Ingresa cualquier texto para traducir...",
 
+	// Read page status messages
+	processingContent: "Procesando contenido...",
+	readingPageClickToPause: "Leyendo página... Haz clic para pausar",
+	pausedClickToResume: "Pausado. Haz clic para reanudar",
+
 	// Translation modal tabs
 	translatePageTab: "📄 Traducir Página",
 	customTextTab: "✏️ Texto Personalizado",

src/languages/fr.js

@@ -70,6 +70,11 @@ export const fr = {
 		"texte vers parole : écrivez n'importe quel message et faites-le parler par l'intelligence artificielle !",
 	translatePlaceholder: "Entrez n'importe quel texte à traduire...",
 
+	// Read page status messages
+	processingContent: "Traitement du contenu...",
+	readingPageClickToPause: "Lecture de la page... Cliquez pour mettre en pause",
+	pausedClickToResume: "En pause. Cliquez pour reprendre",
+
 	// Translation modal tabs
 	translatePageTab: "📄 Traduire la Page",
 	customTextTab: "✏️ Texte Personnalisé",

src/languages/hi.js

@@ -100,5 +100,10 @@ export const hi = {
 	pleaseEnterText: "कृपया पहले कुछ टेक्स्ट दर्ज करें!",
 	pleaseSelectFile: "कृपया पहले एक फ़ाइल चुनें!",
 	pleaseEnterTranslateText: "कृपया अनुवाद के लिए कुछ टेक्स्ट दर्ज करें!",
+
+	// Read page status messages
+	processingContent: "सामग्री प्रक्रिया...",
+	readingPageClickToPause: "पेज पढ़ा जा रहा है... रोकने के लिए क्लिक करें",
+	pausedClickToResume: "रुका हुआ। जारी रखने के लिए क्लिक करें",
 	aiModalNotAvailable: "AI मॉडल इस संदर्भ में उपलब्ध नहीं है",
 };

src/languages/id.js

@@ -101,5 +101,10 @@ export const id = {
 	pleaseEnterText: "Silakan masukkan teks terlebih dahulu!",
 	pleaseSelectFile: "Silakan pilih file terlebih dahulu!",
 	pleaseEnterTranslateText: "Silakan masukkan teks untuk diterjemahkan!",
+
+	// Read page status messages
+	processingContent: "Memproses konten...",
+	readingPageClickToPause: "Membaca halaman... Klik untuk jeda",
+	pausedClickToResume: "Dijeda. Klik untuk melanjutkan",
 	aiModalNotAvailable: "Modal AI tidak tersedia dalam konteks ini",
 };

src/languages/ja.js

@@ -101,5 +101,10 @@ export const ja = {
 	pleaseEnterText: "まずテキストを入力してください！",
 	pleaseSelectFile: "まずファイルを選択してください！",
 	pleaseEnterTranslateText: "翻訳するテキストを入力してください！",
+
+	// Read page status messages
+	processingContent: "コンテンツ処理中...",
+	readingPageClickToPause: "ページ読み上げ中... 一時停止するにはクリック",
+	pausedClickToResume: "一時停止中。再開するにはクリック",
 	aiModalNotAvailable: "AIモーダルはこのコンテキストでは利用できません",
 };

src/languages/ko.js

@@ -101,5 +101,10 @@ export const ko = {
 	pleaseEnterText: "먼저 텍스트를 입력하세요!",
 	pleaseSelectFile: "먼저 파일을 선택하세요!",
 	pleaseEnterTranslateText: "번역할 텍스트를 입력하세요!",
+
+	// Read page status messages
+	processingContent: "콘텐츠 처리 중...",
+	readingPageClickToPause: "페이지 읽기 중... 일시정지하려면 클릭",
+	pausedClickToResume: "일시정지됨. 재개하려면 클릭",
 	aiModalNotAvailable: "AI 모달이 이 컨텍스트에서 사용할 수 없습니다",
 };

src/languages/mr.js

@@ -101,5 +101,10 @@ export const mr = {
 	pleaseEnterText: "कृपया प्रथम काही मजकूर प्रविष्ट करा!",
 	pleaseSelectFile: "कृपया प्रथम फाइल निवडा!",
 	pleaseEnterTranslateText: "कृपया भाषांतरासाठी काही मजकूर प्रविष्ट करा!",
+
+	// Read page status messages
+	processingContent: "सामग्री प्रक्रिया करत आहे...",
+	readingPageClickToPause: "पान वाचत आहे... थांबविण्यासाठी क्लिक करा",
+	pausedClickToResume: "थांबवले आहे. पुन्हा सुरू करण्यासाठी क्लिक करा",
 	aiModalNotAvailable: "AI मॉडल या संदर्भात उपलब्ध नाही",
 };

src/languages/pt.js

@@ -101,5 +101,10 @@ export const pt = {
 	pleaseEnterText: "Por favor, digite algum texto primeiro!",
 	pleaseSelectFile: "Por favor, selecione um arquivo primeiro!",
 	pleaseEnterTranslateText: "Por favor, digite algum texto para traduzir!",
+
+	// Read page status messages
+	processingContent: "Processando conteúdo...",
+	readingPageClickToPause: "Lendo página... Clique para pausar",
+	pausedClickToResume: "Pausado. Clique para continuar",
 	aiModalNotAvailable: "Modal de IA não disponível neste contexto",
 };

src/languages/ru.js

@@ -101,5 +101,10 @@ export const ru = {
 	pleaseEnterText: "Пожалуйста, сначала введите текст!",
 	pleaseSelectFile: "Пожалуйста, сначала выберите файл!",
 	pleaseEnterTranslateText: "Пожалуйста, введите текст для перевода!",
+
+	// Read page status messages
+	processingContent: "Обработка контента...",
+	readingPageClickToPause: "Чтение страницы... Нажмите для паузы",
+	pausedClickToResume: "На паузе. Нажмите для продолжения",
 	aiModalNotAvailable: "Модальное окно ИИ недоступно в этом контексте",
 };

src/languages/sw.js

@@ -101,5 +101,10 @@ export const sw = {
 	pleaseEnterText: "Tafadhali ingiza maandishi kwanza!",
 	pleaseSelectFile: "Tafadhali chagua faili kwanza!",
 	pleaseEnterTranslateText: "Tafadhali ingiza maandishi ya kutafsiri!",
+
+	// Read page status messages
+	processingContent: "Kuchakata maudhui...",
+	readingPageClickToPause: "Kusoma ukurasa... Bonyeza kwa kutua",
+	pausedClickToResume: "Kusitishwa. Bonyeza kuendelea",
 	aiModalNotAvailable: "Modal ya AI haipatikani katika muktadha huu",
 };

src/languages/te.js

@@ -101,5 +101,10 @@ export const te = {
 	pleaseEnterText: "దయచేసి ముందుగా కొంత టెక్స్ట్ నమోదు చేయండి!",
 	pleaseSelectFile: "దయచేసి ముందుగా ఫైల్ ఎంచుకోండి!",
 	pleaseEnterTranslateText: "దయచేసి అనువదించడానికి కొంత టెక్స్ట్ నమోదు చేయండి!",
+
+	// Read page status messages
+	processingContent: "కంటెంట్ ప్రాసెస్ చేస్తోంది...",
+	readingPageClickToPause: "పేజీ చదువుతోంది... నిలిపివేయడానికి క్లిక్ చేయండి",
+	pausedClickToResume: "నిలిపివేయబడింది. కొనసాగించడానికి క్లిక్ చేయండి",
 	aiModalNotAvailable: "AI మోడల్ ఈ సందర్భంలో అందుబాటులో లేదు",
 };

src/languages/tr.js

@@ -101,5 +101,10 @@ export const tr = {
 	pleaseEnterText: "Lütfen önce metin girin!",
 	pleaseSelectFile: "Lütfen önce dosya seçin!",
 	pleaseEnterTranslateText: "Lütfen çevirmek için metin girin!",
+
+	// Read page status messages
+	processingContent: "İçerik işleniyor...",
+	readingPageClickToPause: "Sayfa okunuyor... Duraklatmak için tıklayın",
+	pausedClickToResume: "Duraklatıldı. Devam etmek için tıklayın",
 	aiModalNotAvailable: "AI modalı bu bağlamda mevcut değil",
 };

src/languages/ur.js

@@ -101,5 +101,10 @@ export const ur = {
 	pleaseEnterText: "براہ کرم پہلے کچھ متن داخل کریں!",
 	pleaseSelectFile: "براہ کرم پہلے ایک فائل منتخب کریں!",
 	pleaseEnterTranslateText: "براہ کرم ترجمے کے لیے کچھ متن داخل کریں!",
+
+	// Read page status messages
+	processingContent: "مواد کی پروسیسنگ...",
+	readingPageClickToPause: "صفحہ پڑھا جا رہا ہے... رکنے کے لیے کلک کریں",
+	pausedClickToResume: "رک گیا۔ جاری رکھنے کے لیے کلک کریں",
 	aiModalNotAvailable: "AI ماڈل اس سیاق میں دستیاب نہیں ہے",
 };

src/languages/zh-tw.js

@@ -99,5 +99,10 @@ export const zhTw = {
 	pleaseEnterText: "請先輸入一些文字！",
 	pleaseSelectFile: "請先選擇一個檔案！",
 	pleaseEnterTranslateText: "請輸入一些要翻譯的文字！",
+
+	// Read page status messages
+	processingContent: "處理內容中...",
+	readingPageClickToPause: "正在朗讀頁面... 點擊暫停",
+	pausedClickToResume: "已暫停。點擊繼續",
 	aiModalNotAvailable: "AI對話框在此上下文中不可用",
 };

src/languages/zh.js

@@ -99,5 +99,10 @@ export const zh = {
 	pleaseEnterText: "请先输入一些文本！",
 	pleaseSelectFile: "请先选择一个文件！",
 	pleaseEnterTranslateText: "请输入一些要翻译的文本！",
+
+	// Read page status messages
+	processingContent: "处理内容中...",
+	readingPageClickToPause: "正在朗读页面... 点击暂停",
+	pausedClickToResume: "已暂停。点击继续",
 	aiModalNotAvailable: "AI模态框在此上下文中不可用",
 };