Remove unused components and models for improved maintainability

- Deleted redundant components (`AddActionButton`, `AlertBox`, `AlertStack`, `BackButton`, `CancelButton`, and `CollapsableArea`) and related files.
- Removed unused models (`Book`, `BookSerie`, `BookTables`, `Character`, and `Chapter`) to reduce codebase clutter.
- Updated project structure and references to reflect these removals.

app/login/offline/page.tsx

@@ -1,79 +1,67 @@
-'use client';
-
-import { useEffect } from 'react';
-import OfflinePinVerify from '@/components/offline/OfflinePinVerify';
-import { useTranslations } from 'next-intl';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { faWifi, faArrowLeft } from '@fortawesome/free-solid-svg-icons';
-import * as tauri from '@/lib/tauri';
-
-export default function OfflineLoginPage() {
-    const t = useTranslations();
-
-    async function handlePinSuccess(userId: string): Promise<void> {
-        try {
-            const encryptionKey = await tauri.getUserEncryptionKey(userId);
-            if (encryptionKey) {
-                await tauri.dbInitialize(userId, encryptionKey);
-                await tauri.loginSuccess();
-            }
-        } catch (error) {
-            console.error('[OfflineLogin] Error initializing database:', error);
-        }
-    }
-
-    function handleBackToOnline(): void {
-        tauri.logout();
-    }
-
-    useEffect((): void => {
-        async function checkOfflineCapability() {
-            const offlineStatus = await tauri.offlineModeGet();
-            if (!offlineStatus.hasPin) {
-                window.location.href = '/login/login';
-            }
-        }
-
-        checkOfflineCapability().then();
-    }, []);
-
-    return (
-        <main className="flex min-h-screen flex-col items-center justify-center bg-background text-textPrimary">
-            <div className="w-full max-w-md px-4">
-                {/* Offline indicator */}
-                <div className="mb-6 flex items-center justify-center">
-                    <div className="px-4 py-2 bg-warning/10 border border-warning/30 rounded-full flex items-center gap-2">
-                        <FontAwesomeIcon icon={faWifi} className="w-4 h-4 text-warning" />
-                        <span className="text-sm text-warning font-medium">{t('offline.mode.title')}</span>
-                    </div>
-                </div>
-
-                {/* Logo */}
-                <div className="flex justify-center mb-8">
-                    <img
-                        src="/logo.png"
-                        alt="ERitors"
-                        className="object-contain w-full max-w-[240px] h-[80px]"
-                    />
-                </div>
-
-                {/* PIN Verify Component */}
-                <OfflinePinVerify
-                    onSuccess={handlePinSuccess}
-                    onCancel={handleBackToOnline}
-                />
-
-                {/* Back to online link */}
-                <div className="mt-6 text-center">
-                    <button
-                        onClick={handleBackToOnline}
-                        className="text-sm text-muted hover:text-textPrimary transition-colors inline-flex items-center gap-2"
-                    >
-                        <FontAwesomeIcon icon={faArrowLeft} className="w-3 h-3" />
-                        {t('offline.mode.backToOnline')}
-                    </button>
-                </div>
-            </div>
-        </main>
-    );
-}
+'use client';
+
+import {useEffect} from 'react';
+import OfflinePinVerify from '@/components/offline/OfflinePinVerify';
+import {useTranslations} from '@/lib/i18n';
+import {Wifi, ArrowLeft} from 'lucide-react';
+import Button from '@/components/ui/Button';
+import * as tauri from '@/lib/tauri';
+
+export default function OfflineLoginPage() {
+    const t = useTranslations();
+
+    async function handlePinSuccess(userId: string): Promise<void> {
+        try {
+            const encryptionKey = await tauri.getUserEncryptionKey(userId);
+            if (encryptionKey) {
+                await tauri.dbInitialize(userId, encryptionKey);
+                await tauri.loginSuccess();
+            }
+        } catch (error) {
+            console.error('[OfflineLogin] Error initializing database:', error);
+        }
+    }
+
+    function handleBackToOnline(): void {
+        tauri.logout();
+    }
+
+    useEffect((): void => {
+        async function checkOfflineCapability() {
+            const offlineStatus = await tauri.offlineModeGet();
+            if (!offlineStatus.hasPin) {
+                window.location.href = '/login/login';
+            }
+        }
+
+        checkOfflineCapability().then();
+    }, []);
+
+    return (
+        <main className="flex min-h-screen flex-col items-center justify-center bg-tertiary text-text-primary p-4 font-['Lora']">
+            <div className="w-full max-w-md px-4 py-10">
+                <div className="flex justify-center mb-8">
+                    <img src="/logo.png" alt="ERitors" className="object-contain" style={{width: 320, height: 107}}/>
+                </div>
+
+                <div className="text-center mb-6">
+                    <div className="inline-flex items-center gap-2 px-3 py-1.5 bg-warning/10 border border-warning/30 rounded-full mb-3">
+                        <Wifi className="w-4 h-4 text-warning" strokeWidth={1.75}/>
+                        <span className="text-sm text-warning font-medium">{t('offline.mode.title')}</span>
+                    </div>
+                </div>
+
+                <div className="bg-darkest-background rounded-xl p-5 mb-4">
+                    <OfflinePinVerify
+                        onSuccess={handlePinSuccess}
+                        onCancel={handleBackToOnline}
+                    />
+                </div>
+
+                <Button variant="ghost" fullWidth icon={ArrowLeft} onClick={handleBackToOnline}>
+                    {t('offline.mode.backToOnline')}
+                </Button>
+            </div>
+        </main>
+    );
+}