Redesign login, register, me pages with premium layout and i18n

src/app/(site)/register/page.tsx

@@ -10,7 +10,8 @@ import { captchaConfig } from "@/lib/services/captcha";
 import { siteSettings } from "@/lib/services/site-settings";
 
 export default async function RegisterPage() {
-	const t = await getTranslations("header");
+	const th = await getTranslations("header");
+	const tpr = await getTranslations("pages.register");
 	const [hotelName, imagerRaw, cfg] = await Promise.all([
 		siteSettings.get("hotel_name", "Hotel"),
 		siteSettings.get(
@@ -67,26 +68,19 @@ export default async function RegisterPage() {
 						}}
 					>
 						<span className="w-2 h-2 rounded-full bg-green-500" />
-						{online.toLocaleString()} online
+						{tpr("usersOnline", { count: online })}
 					</div>
 					<h1
 						className="text-xl font-black"
 						style={{ color: "var(--color-text-readable)" }}
 					>
-						Join{" "}
-						<span
-							style={{
-								color: "var(--color-primary-readable, var(--color-primary))",
-							}}
-						>
-							{hotelName}
-						</span>
+						{tpr("title")} — {hotelName}
 					</h1>
 					<p
 						className="text-xs mt-1 mx-auto max-w-[200px] leading-relaxed"
 						style={{ color: "var(--color-text-muted)" }}
 					>
-						{t("tagline")}
+						{th("tagline")}
 					</p>
 				</div>
 
@@ -103,7 +97,7 @@ export default async function RegisterPage() {
 							className="text-xs font-bold uppercase tracking-widest mb-3"
 							style={{ color: "var(--color-text-muted)" }}
 						>
-							Who&apos;s online
+							{tpr("whoIsOnline")}
 						</h3>
 						<div className="grid grid-cols-4 gap-1.5">
 							{recentUsers.map((u) => (
@@ -143,7 +137,7 @@ export default async function RegisterPage() {
 					className="text-xs text-center"
 					style={{ color: "var(--color-text-muted)" }}
 				>
-					Already have an account?{" "}
+					{tpr("alreadyHaveAccountPre")}{" "}
 					<Link
 						href="/login"
 						className="font-extrabold hover:underline"
@@ -151,7 +145,7 @@ export default async function RegisterPage() {
 							color: "var(--color-primary-readable, var(--color-primary))",
 						}}
 					>
-						Sign in
+						{tpr("alreadyHaveAccountLink")}
 					</Link>
 				</p>
 			</div>
@@ -163,13 +157,13 @@ export default async function RegisterPage() {
 						className="text-2xl font-black tracking-tight"
 						style={{ color: "var(--color-text-readable)" }}
 					>
-						Create your account
+						{tpr("title")}
 					</h2>
 					<p
 						className="text-sm mt-0.5"
 						style={{ color: "var(--color-text-muted)" }}
 					>
-						Free and takes less than a minute
+						{tpr("subtitle")}
 					</p>
 				</div>
 				<RegisterForm