From 672091d1f51245f4bdbc2ccf82270a3cdc2e8c59 Mon Sep 17 00:00:00 2001
From: Alireza Hassani <alirezahassani@Meshkees-Mac-mini.local>
Date: Mon, 3 Aug 2026 00:06:44 +0330
Subject: [PATCH] Polish business FA layout and wire special-group keys plus
 SSL sync.

RTL carousels/FABs, special key+title fields, slider gallery fixes, and dashboard SSL sync agent for super-admin.

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 .../src/components/AddCustomerModal.tsx       |   86 +-
 .../components/AddWebsiteSliderSlideModal.tsx |   29 +-
 apps/business/src/components/BlogCard.tsx     |   52 +-
 .../src/components/BlogCategoryRow.tsx        |   34 +-
 .../src/components/BlogCommentsModal.tsx      |    5 +-
 .../src/components/BlogCommentsSection.tsx    |    7 +-
 apps/business/src/components/BrandModal.tsx   |   45 +-
 apps/business/src/components/BrandRow.tsx     |   24 +-
 .../src/components/CategoryModal.module.css   |    7 +
 .../business/src/components/CategoryModal.tsx |   40 +-
 .../src/components/CategoryRow.module.css     |    8 +-
 apps/business/src/components/CategoryRow.tsx  |   42 +-
 .../ContactSubmissionDetailModal.tsx          |   29 +-
 .../src/components/CreateStoreItemsModal.tsx  |   46 +-
 .../src/components/EditStoreItemsModal.tsx    |   44 +-
 apps/business/src/components/ImageCropper.tsx |   32 +-
 .../business/src/components/ImageUploader.tsx |   10 +-
 .../components/ListFiltersPanel.module.css    |   27 +-
 .../src/components/OrderTransactionsModal.tsx |   13 +-
 .../components/PickStoreSpecialItemsModal.tsx |   36 +-
 .../src/components/PickStoreVariantModal.tsx  |   22 +-
 .../src/components/PickWebsiteBrandsModal.tsx |   38 +-
 .../components/PickWebsiteCategoriesModal.tsx |   38 +-
 .../src/components/PortfolioCard.module.css   |    4 +
 .../business/src/components/PortfolioCard.tsx |   46 +-
 .../src/components/PortfolioCommentsModal.tsx |    5 +-
 .../components/PortfolioCommentsSection.tsx   |    7 +-
 .../src/components/ProductCard.module.css     |   51 +-
 apps/business/src/components/ProductCard.tsx  |   71 +-
 .../src/components/ProductCommentsModal.tsx   |    5 +-
 .../src/components/ProductDetailsTabs.tsx     |   11 +-
 .../src/components/ProductSearchSelect.tsx    |   71 +-
 .../components/SearchableSelect.module.css    |   19 +-
 .../src/components/SearchableSelect.tsx       |   59 +-
 apps/business/src/components/Sidebar.tsx      |   15 +-
 .../src/components/StoreItemCard.module.css   |   54 +-
 .../business/src/components/StoreItemCard.tsx |   78 +-
 .../StoreItemMultiSearchSelect.module.css     |   16 +-
 .../components/StoreItemMultiSearchSelect.tsx |   61 +-
 .../StoreSpecialCarousel.module.css           |    6 +
 .../src/components/StoreSpecialCarousel.tsx   |  129 +-
 .../src/components/StoreSpecialModal.tsx      |   91 +-
 .../src/components/Tooltip.module.css         |    1 +
 .../WebsiteGroupCarousel.module.css           |    6 +
 .../src/components/WebsiteGroupCarousel.tsx   |  117 +-
 .../WebsiteGroupItemCard.module.css           |   37 +-
 .../src/components/WebsiteGroupItemCard.tsx   |   48 +-
 .../WebsiteSliderGallery.module.css           |    4 +-
 .../src/components/WebsiteSliderGallery.tsx   |   62 +-
 .../src/components/WebsiteSliderSlideCard.tsx |   16 +-
 apps/business/src/data/productComments.ts     |    4 +-
 apps/business/src/i18n/messages.ts            | 1471 +++++++++++++++++
 apps/business/src/pages/AddNewBlogPage.tsx    |   60 +-
 .../src/pages/AddNewPortfolioPage.tsx         |   73 +-
 apps/business/src/pages/AddNewProductPage.tsx |   51 +-
 .../business/src/pages/BlogCategoriesPage.tsx |   34 +-
 apps/business/src/pages/BlogDetailsPage.tsx   |   33 +-
 apps/business/src/pages/BlogListPage.tsx      |   29 +-
 apps/business/src/pages/BlogPage.module.css   |    8 +-
 apps/business/src/pages/BlogPage.tsx          |   51 +-
 apps/business/src/pages/BlogSettingsPage.tsx  |   27 +-
 apps/business/src/pages/BrandsPage.module.css |    8 +-
 apps/business/src/pages/BrandsPage.tsx        |   38 +-
 .../src/pages/CategoriesPage.module.css       |    8 +-
 apps/business/src/pages/CategoriesPage.tsx    |   40 +-
 .../src/pages/CustomersPage.module.css        |   48 +-
 apps/business/src/pages/CustomersPage.tsx     |  229 +--
 .../src/pages/MyProductsPage.module.css       |   21 +-
 apps/business/src/pages/MyProductsPage.tsx    |   54 +-
 apps/business/src/pages/OrdersPage.module.css |    6 +-
 apps/business/src/pages/OrdersPage.tsx        |  198 ++-
 .../src/pages/PortfolioCategoriesPage.tsx     |   34 +-
 .../src/pages/PortfolioDetailsPage.tsx        |   25 +-
 apps/business/src/pages/PortfolioListPage.tsx |   27 +-
 .../src/pages/PortfolioSettingsPage.tsx       |   27 +-
 apps/business/src/pages/PortfoliosPage.tsx    |   51 +-
 .../src/pages/ProductSettingsPage.tsx         |   40 +-
 apps/business/src/pages/ShoppingCardsPage.tsx |  105 +-
 .../src/pages/StoreItemsPage.module.css       |    8 +-
 apps/business/src/pages/StoreItemsPage.tsx    |   68 +-
 apps/business/src/pages/StorePage.tsx         |   50 +-
 apps/business/src/pages/StoreSettingsPage.tsx |   74 +-
 apps/business/src/pages/StoreSpecialsPage.tsx |   77 +-
 apps/business/src/pages/WebsiteBadgesPage.tsx |   21 +-
 .../business/src/pages/WebsiteContactPage.tsx |   74 +-
 .../src/pages/WebsiteEPaymentPage.tsx         |   21 +-
 apps/business/src/pages/WebsiteFaqPage.tsx    |   21 +-
 apps/business/src/pages/WebsitePage.tsx       |   81 +-
 .../business/src/pages/WebsiteSlidersPage.tsx |   30 +-
 .../src/pages/WebsiteSpecialBrandsPage.tsx    |   75 +-
 .../pages/WebsiteSpecialCategoriesPage.tsx    |   75 +-
 .../src/pages/WebsiteSubscriptionsPage.tsx    |   21 +-
 apps/business/src/services/blogService.ts     |   16 +-
 .../src/services/expertReviewService.ts       |    4 +-
 .../business/src/services/portfolioService.ts |   16 +-
 apps/business/src/services/productService.ts  |    2 +
 .../src/services/storeSpecialService.ts       |    2 +
 apps/business/src/types/product.ts            |    1 +
 apps/business/src/types/storeSpecial.ts       |    1 +
 apps/business/src/types/websiteBrandGroup.ts  |    3 +
 .../src/types/websiteCategoryGroup.ts         |    3 +
 apps/business/src/utils/storeProductGroups.ts |    5 +-
 apps/super-admin/src/pages/WebsitesPage.tsx   |   40 +
 .../super-admin/src/services/domainService.ts |    9 +-
 apps/super-admin/src/types/domain.ts          |    5 +
 deploy/meshkee-ssl-sync-agent.service         |   14 +
 deploy/ssl-sync-agent.mjs                     |   93 ++
 deploy/ssl-sync.sh                            |    2 +-
 docs/DEPLOY.md                                |   44 +-
 docs/PROJECT_CONTEXT.md                       |    2 +-
 .../src/components/Pagination.module.css      |   18 +-
 .../src/components/Pagination.tsx             |   23 +-
 .../src/context/LocaleContext.tsx             |    2 +
 113 files changed, 4154 insertions(+), 1451 deletions(-)
 create mode 100644 deploy/meshkee-ssl-sync-agent.service
 create mode 100644 deploy/ssl-sync-agent.mjs

diff --git a/apps/business/src/components/AddCustomerModal.tsx b/apps/business/src/components/AddCustomerModal.tsx
index a32b409..1c290a0 100644
--- a/apps/business/src/components/AddCustomerModal.tsx
+++ b/apps/business/src/components/AddCustomerModal.tsx
@@ -1,6 +1,8 @@
 import { useEffect, useState } from 'react'
 import { createPortal } from 'react-dom'
 import { X } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
+import { useT } from '../i18n/useT'
 import { ApiError } from '../lib/api'
 import { toE164CellNumber } from '../lib/cellNumber'
 import {
@@ -19,13 +21,16 @@ interface AddCustomerModalProps {
 const ANIMATION_MS = 220
 
 export function AddCustomerModal({ open, onClose, onCreated }: AddCustomerModalProps) {
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
   const [mounted, setMounted] = useState(open)
   const [closing, setClosing] = useState(false)
   const [firstName, setFirstName] = useState('')
   const [lastName, setLastName] = useState('')
   const [cellNumber, setCellNumber] = useState('')
   const [password, setPassword] = useState('')
-  const [email, setEmail] = useState('')
+  const [passwordConfirm, setPasswordConfirm] = useState('')
   const [isSubmitting, setIsSubmitting] = useState(false)
   const [error, setError] = useState('')
 
@@ -37,7 +42,7 @@ export function AddCustomerModal({ open, onClose, onCreated }: AddCustomerModalP
       setLastName('')
       setCellNumber('')
       setPassword('')
-      setEmail('')
+      setPasswordConfirm('')
       setError('')
     } else if (mounted) {
       setClosing(true)
@@ -69,6 +74,18 @@ export function AddCustomerModal({ open, onClose, onCreated }: AddCustomerModalP
     const normalizedCell = toE164CellNumber(cellNumber.trim())
     if (!canSubmit || !normalizedCell) return
 
+    const trimmedPassword = password.trim()
+    if (trimmedPassword || passwordConfirm.trim()) {
+      if (trimmedPassword.length < 8) {
+        setError(t('customers.addModal.errorPasswordLength'))
+        return
+      }
+      if (trimmedPassword !== passwordConfirm.trim()) {
+        setError(t('customers.addModal.errorPasswordMatch'))
+        return
+      }
+    }
+
     setIsSubmitting(true)
     setError('')
     try {
@@ -76,8 +93,7 @@ export function AddCustomerModal({ open, onClose, onCreated }: AddCustomerModalP
         cellNumber: normalizedCell,
         firstName: firstName.trim(),
         lastName: lastName.trim(),
-        ...(password.trim() ? { password: password.trim() } : {}),
-        ...(email.trim() ? { email: email.trim() } : {}),
+        ...(trimmedPassword ? { password: trimmedPassword } : {}),
       })
       onCreated({
         id: created.id,
@@ -91,7 +107,7 @@ export function AddCustomerModal({ open, onClose, onCreated }: AddCustomerModalP
       })
       onClose()
     } catch (err) {
-      setError(err instanceof ApiError ? err.message : 'Unable to add customer.')
+      setError(err instanceof ApiError ? err.message : t('customers.addModal.error'))
     } finally {
       setIsSubmitting(false)
     }
@@ -108,79 +124,91 @@ export function AddCustomerModal({ open, onClose, onCreated }: AddCustomerModalP
         role="dialog"
         aria-modal="true"
         aria-labelledby="add-customer-title"
+        lang={isFa ? 'fa' : 'en'}
+        dir={isFa ? 'rtl' : 'ltr'}
       >
         <div className={modalStyles.header}>
           <div>
             <h3 id="add-customer-title" className={modalStyles.title}>
-              Add customer
+              {t('customers.addModal.title')}
             </h3>
-            <p className={modalStyles.subtitle}>
-              Creates a verified customer account or links an existing user to your business.
-            </p>
+            <p className={modalStyles.subtitle}>{t('customers.addModal.subtitle')}</p>
           </div>
-          <button type="button" className={modalStyles.closeBtn} onClick={onClose} aria-label="Close">
+          <button
+            type="button"
+            className={modalStyles.closeBtn}
+            onClick={onClose}
+            aria-label={t('common.close')}
+          >
             <X size={18} />
           </button>
         </div>
 
         <div className={modalStyles.body}>
-          <p className={formStyles.hint}>
-            Password is required only for new accounts. Existing users are added as verified
-            customers.
-          </p>
+          <p className={formStyles.hint}>{t('customers.addModal.hint')}</p>
 
           {error && <p className={modalStyles.errorText}>{error}</p>}
 
           <div className={formStyles.formGrid}>
             <div className={modalStyles.field}>
-              <label htmlFor="add-customer-first-name">First name</label>
+              <label htmlFor="add-customer-first-name">{t('customers.addModal.firstName')}</label>
               <input
                 id="add-customer-first-name"
                 value={firstName}
                 onChange={(e) => setFirstName(e.target.value)}
                 disabled={isSubmitting}
+                dir={isFa ? 'rtl' : 'ltr'}
               />
             </div>
             <div className={modalStyles.field}>
-              <label htmlFor="add-customer-last-name">Last name</label>
+              <label htmlFor="add-customer-last-name">{t('customers.addModal.lastName')}</label>
               <input
                 id="add-customer-last-name"
                 value={lastName}
                 onChange={(e) => setLastName(e.target.value)}
                 disabled={isSubmitting}
+                dir={isFa ? 'rtl' : 'ltr'}
               />
             </div>
             <div className={`${modalStyles.field} ${formStyles.formFull}`}>
-              <label htmlFor="add-customer-cell">Cell number</label>
+              <label htmlFor="add-customer-cell">{t('customers.addModal.cell')}</label>
               <input
                 id="add-customer-cell"
                 value={cellNumber}
                 onChange={(e) => setCellNumber(e.target.value)}
-                placeholder="0912..."
+                placeholder={t('customers.addModal.cellPlaceholder')}
                 autoComplete="off"
                 disabled={isSubmitting}
+                inputMode="tel"
+                dir="ltr"
               />
             </div>
-            <div className={`${modalStyles.field} ${formStyles.formFull}`}>
-              <label htmlFor="add-customer-password">Password (new users)</label>
+            <div className={modalStyles.field}>
+              <label htmlFor="add-customer-password">{t('customers.addModal.password')}</label>
               <input
                 id="add-customer-password"
                 type="password"
                 autoComplete="new-password"
                 value={password}
                 onChange={(e) => setPassword(e.target.value)}
-                placeholder="Min. 8 characters"
+                placeholder={t('customers.addModal.passwordPlaceholder')}
                 disabled={isSubmitting}
+                dir="ltr"
               />
             </div>
-            <div className={`${modalStyles.field} ${formStyles.formFull}`}>
-              <label htmlFor="add-customer-email">Email (optional)</label>
+            <div className={modalStyles.field}>
+              <label htmlFor="add-customer-password-confirm">
+                {t('customers.addModal.passwordConfirm')}
+              </label>
               <input
-                id="add-customer-email"
-                type="email"
-                value={email}
-                onChange={(e) => setEmail(e.target.value)}
+                id="add-customer-password-confirm"
+                type="password"
+                autoComplete="new-password"
+                value={passwordConfirm}
+                onChange={(e) => setPasswordConfirm(e.target.value)}
+                placeholder={t('customers.addModal.passwordConfirmPlaceholder')}
                 disabled={isSubmitting}
+                dir="ltr"
               />
             </div>
           </div>
@@ -192,7 +220,7 @@ export function AddCustomerModal({ open, onClose, onCreated }: AddCustomerModalP
               onClick={onClose}
               disabled={isSubmitting}
             >
-              Cancel
+              {t('customers.addModal.cancel')}
             </button>
             <button
               type="button"
@@ -200,7 +228,7 @@ export function AddCustomerModal({ open, onClose, onCreated }: AddCustomerModalP
               onClick={() => void handleSubmit()}
               disabled={isSubmitting || !canSubmit}
             >
-              Add customer
+              {t('customers.addModal.submit')}
             </button>
           </div>
         </div>
diff --git a/apps/business/src/components/AddWebsiteSliderSlideModal.tsx b/apps/business/src/components/AddWebsiteSliderSlideModal.tsx
index fbfc751..69386a0 100644
--- a/apps/business/src/components/AddWebsiteSliderSlideModal.tsx
+++ b/apps/business/src/components/AddWebsiteSliderSlideModal.tsx
@@ -2,6 +2,7 @@ import { useEffect, useRef, useState } from 'react'
 import { createPortal } from 'react-dom'
 import { X } from 'lucide-react'
 import { ImageCropper } from './ImageCropper'
+import { useT } from '../i18n/useT'
 import modalStyles from './CategoryModal.module.css'
 import styles from './AddWebsiteSliderSlideModal.module.css'
 
@@ -26,6 +27,7 @@ export function AddWebsiteSliderSlideModal({
   onSubmit,
   isSubmitting = false,
 }: AddWebsiteSliderSlideModalProps) {
+  const t = useT()
   const formRef = useRef<HTMLFormElement>(null)
   const [mounted, setMounted] = useState(open)
   const [closing, setClosing] = useState(false)
@@ -85,32 +87,37 @@ export function AddWebsiteSliderSlideModal({
       >
         <div className={modalStyles.header}>
           <h3 id="add-slide-title" className={modalStyles.title}>
-            Add slide
+            {t('website.sliders.modal.title')}
           </h3>
-          <button type="button" className={modalStyles.closeBtn} onClick={onClose} aria-label="Close">
+          <button
+            type="button"
+            className={modalStyles.closeBtn}
+            onClick={onClose}
+            aria-label={t('common.close')}
+          >
             <X size={20} />
           </button>
         </div>
 
         <form ref={formRef} className={modalStyles.form} onSubmit={handleSubmit}>
           <div className={modalStyles.field}>
-            <label>Slide image</label>
+            <label>{t('website.sliders.modal.image')}</label>
             <ImageCropper
               value={image}
               onChange={setImage}
               aspect={9 / 4}
-              uploadLabel="Upload slide image"
-              hint="9:4 banner ratio recommended"
-              changeLabel="Change image"
+              uploadLabel={t('website.sliders.modal.upload')}
+              hint={t('website.sliders.modal.hint')}
+              changeLabel={t('website.sliders.modal.changeImage')}
             />
           </div>
 
           <div className={modalStyles.field}>
-            <label htmlFor="slide-title">Title (optional)</label>
+            <label htmlFor="slide-title">{t('website.sliders.modal.titleOptional')}</label>
             <input
               id="slide-title"
               type="text"
-              placeholder="e.g. Summer sale"
+              placeholder={t('website.sliders.modal.titlePlaceholder')}
               value={title}
               onChange={(e) => setTitle(e.target.value)}
               disabled={isSubmitting}
@@ -118,7 +125,7 @@ export function AddWebsiteSliderSlideModal({
           </div>
 
           <div className={modalStyles.field}>
-            <label htmlFor="slide-link">Link URL (optional)</label>
+            <label htmlFor="slide-link">{t('website.sliders.modal.linkOptional')}</label>
             <input
               id="slide-link"
               type="url"
@@ -137,14 +144,14 @@ export function AddWebsiteSliderSlideModal({
               onClick={onClose}
               disabled={isSubmitting}
             >
-              Cancel
+              {t('products.form.cancel')}
             </button>
             <button
               type="submit"
               className={modalStyles.submitBtn}
               disabled={isSubmitting || !image}
             >
-              {isSubmitting ? 'Adding...' : 'Add slide'}
+              {isSubmitting ? t('website.adding') : t('website.sliders.modal.addSlide')}
             </button>
           </div>
         </form>
diff --git a/apps/business/src/components/BlogCard.tsx b/apps/business/src/components/BlogCard.tsx
index b5db0d8..72c82b3 100644
--- a/apps/business/src/components/BlogCard.tsx
+++ b/apps/business/src/components/BlogCard.tsx
@@ -1,11 +1,13 @@
 import { Link } from 'react-router-dom'
 import { Pencil, MessageSquare, Trash2, BadgeCheck, Clock } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
 import type { Blog } from '../types/blog'
 import {
   formatBlogAuthor,
   formatBlogCardDate,
   isBlogVerified,
 } from '../services/blogService'
+import { useT } from '../i18n/useT'
 import { textLocaleAttrs } from '../utils/textLocale'
 import { Tooltip } from './Tooltip'
 import cardStyles from './BlogCard.module.css'
@@ -30,11 +32,21 @@ export function BlogCard({
   onRemove,
   isVerifying = false,
 }: BlogCardProps) {
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
   const verified = isBlogVerified(blog)
-  const publishDate = formatBlogCardDate(blog.publishedAt ?? blog.createdAt)
+  const publishDate = formatBlogCardDate(
+    blog.publishedAt ?? blog.createdAt,
+    isFa ? 'fa' : 'en',
+  )
   const titleLocale = textLocaleAttrs(blog.title)
   const abstractLocale = textLocaleAttrs(blog.abstract)
   const hasAbstract = Boolean(blog.abstract?.trim())
+  const verifyLabel = verified ? t('blog.card.unverify') : t('blog.card.verify')
+  // In FA UI, keep cards RTL even when title/abstract are English.
+  const titleDir = isFa ? 'rtl' : titleLocale.dir
+  const abstractDir = isFa ? 'rtl' : abstractLocale.dir
 
   return (
     <article className={cardStyles.card}>
@@ -53,21 +65,21 @@ export function BlogCard({
           {!verified && (
             <span className={`${cardStyles.statusBadge} ${cardStyles.waitingBadge}`}>
               <Clock size={11} aria-hidden="true" />
-              Waiting
+              {t('blog.card.waiting')}
             </span>
           )}
           {verified && (
             <span className={`${cardStyles.statusBadge} ${cardStyles.verifiedBadge}`}>
-              Verified
+              {t('blog.card.verified')}
             </span>
           )}
         </div>
 
-        <div className={cardStyles.body}>
+        <div className={cardStyles.body} dir={isFa ? 'rtl' : 'ltr'}>
           <h3
             className={[cardStyles.title, titleLocale.className].filter(Boolean).join(' ')}
             lang={titleLocale.lang}
-            dir={titleLocale.dir}
+            dir={titleDir}
           >
             {blog.title}
           </h3>
@@ -77,13 +89,17 @@ export function BlogCard({
                 .filter(Boolean)
                 .join(' ')}
               lang={abstractLocale.lang}
-              dir={abstractLocale.dir}
+              dir={abstractDir}
             >
               {blog.abstract}
             </p>
           ) : (
-            <p className={cardStyles.abstract} lang="en" dir="ltr">
-              No summary yet.
+            <p
+              className={cardStyles.abstract}
+              lang={isFa ? 'fa' : 'en'}
+              dir={isFa ? 'rtl' : 'ltr'}
+            >
+              {t('blog.card.noSummary')}
             </p>
           )}
           <p className={cardStyles.meta}>
@@ -95,28 +111,32 @@ export function BlogCard({
       </Link>
 
       <div className={controlStyles.controls}>
-        <Tooltip label="Edit blog">
-          <button type="button" onClick={() => onEdit(blog.id)} aria-label="Edit">
+        <Tooltip label={t('blog.card.edit')}>
+          <button
+            type="button"
+            onClick={() => onEdit(blog.id)}
+            aria-label={t('blog.card.edit')}
+          >
             <Pencil size={16} />
           </button>
         </Tooltip>
-        <Tooltip label={verified ? 'Unverify blog' : 'Verify blog'}>
+        <Tooltip label={verifyLabel}>
           <button
             type="button"
             className={verified ? cardStyles.verifyActive : cardStyles.verifyWaiting}
             disabled={isVerifying}
             onClick={() => onToggleVerify(blog.id)}
-            aria-label={verified ? 'Unverify blog' : 'Verify blog'}
+            aria-label={verifyLabel}
           >
             {verified ? <BadgeCheck size={16} /> : <Clock size={16} />}
           </button>
         </Tooltip>
-        <Tooltip label="View comments">
+        <Tooltip label={t('blog.card.comments')}>
           <button
             type="button"
             className={controlStyles.iconBtn}
             onClick={() => onComments(blog.id)}
-            aria-label={`Comments (${commentCount})`}
+            aria-label={`${t('blog.card.comments')} (${commentCount})`}
           >
             <MessageSquare size={16} />
             {commentCount > 0 && (
@@ -124,12 +144,12 @@ export function BlogCard({
             )}
           </button>
         </Tooltip>
-        <Tooltip label="Remove blog">
+        <Tooltip label={t('blog.card.remove')}>
           <button
             type="button"
             className={controlStyles.danger}
             onClick={() => onRemove(blog.id)}
-            aria-label="Remove"
+            aria-label={t('blog.card.remove')}
           >
             <Trash2 size={16} />
           </button>
diff --git a/apps/business/src/components/BlogCategoryRow.tsx b/apps/business/src/components/BlogCategoryRow.tsx
index 3c76c85..012a2c7 100644
--- a/apps/business/src/components/BlogCategoryRow.tsx
+++ b/apps/business/src/components/BlogCategoryRow.tsx
@@ -1,5 +1,7 @@
 import { FolderPlus, Pencil, Trash2, ChevronRight } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
 import type { Category } from '../types/category'
+import { useT } from '../i18n/useT'
 import { Tooltip } from './Tooltip'
 import styles from './CategoryRow.module.css'
 
@@ -24,6 +26,16 @@ export function BlogCategoryRow({
   onEdit,
   onRemove,
 }: BlogCategoryRowProps) {
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
+  const primaryName = isFa ? category.nameFa || category.nameEn : category.nameEn
+  const secondaryName = isFa
+    ? category.nameFa
+      ? category.nameEn
+      : ''
+    : category.nameFa
+
   return (
     <div className={styles.row} style={{ marginLeft: depth * 8 }}>
       <div
@@ -45,9 +57,13 @@ export function BlogCategoryRow({
       >
         <div className={styles.textBlock}>
           <div className={styles.names}>
-            <span className={styles.nameEn}>{category.nameEn}</span>
-            <span className={styles.separator}>·</span>
-            <span className={styles.nameFa}>{category.nameFa}</span>
+            <span className={isFa ? styles.nameFa : styles.nameEn}>{primaryName}</span>
+            {secondaryName ? (
+              <>
+                <span className={styles.separator}>·</span>
+                <span className={isFa ? styles.nameEn : styles.nameFa}>{secondaryName}</span>
+              </>
+            ) : null}
             {hasChildren && (
               <span className={`${styles.chevron} ${expanded ? styles.chevronOpen : ''}`}>
                 <ChevronRight size={18} />
@@ -59,32 +75,32 @@ export function BlogCategoryRow({
       </div>
 
       <div className={styles.controls}>
-        <Tooltip label="Add sub category">
+        <Tooltip label={t('categories.tooltip.addSub')}>
           <button
             type="button"
             className={styles.controlBtn}
             onClick={() => onAddSub(category.id)}
-            aria-label="Add sub category"
+            aria-label={t('categories.tooltip.addSub')}
           >
             <FolderPlus size={17} />
           </button>
         </Tooltip>
-        <Tooltip label="Edit category">
+        <Tooltip label={t('categories.tooltip.edit')}>
           <button
             type="button"
             className={styles.controlBtn}
             onClick={() => onEdit(category.id)}
-            aria-label="Edit category"
+            aria-label={t('categories.tooltip.edit')}
           >
             <Pencil size={17} />
           </button>
         </Tooltip>
-        <Tooltip label="Remove category">
+        <Tooltip label={t('categories.tooltip.remove')}>
           <button
             type="button"
             className={`${styles.controlBtn} ${styles.danger}`}
             onClick={() => onRemove(category.id)}
-            aria-label="Remove"
+            aria-label={t('categories.tooltip.remove')}
           >
             <Trash2 size={17} />
           </button>
diff --git a/apps/business/src/components/BlogCommentsModal.tsx b/apps/business/src/components/BlogCommentsModal.tsx
index 9dcff49..b12db88 100644
--- a/apps/business/src/components/BlogCommentsModal.tsx
+++ b/apps/business/src/components/BlogCommentsModal.tsx
@@ -1,6 +1,7 @@
 import { useEffect, useState } from 'react'
 import { createPortal } from 'react-dom'
 import { X, ThumbsUp, Check, XCircle, Trash2 } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
 import type { ProductComment } from '../types/comment'
 import { formatCommentDate } from '../data/productComments'
 import { ApiError } from '../lib/api'
@@ -30,6 +31,8 @@ export function BlogCommentsModal({
   onClose,
   onCountChange,
 }: BlogCommentsModalProps) {
+  const { locale } = useLocale()
+  const dateLocale = locale === 'fa' ? 'fa' : 'en'
   const [mounted, setMounted] = useState(open)
   const [closing, setClosing] = useState(false)
   const [comments, setComments] = useState<ProductComment[]>([])
@@ -200,7 +203,7 @@ export function BlogCommentsModal({
                       <div className={styles.commentMeta}>
                         <div className={styles.author}>{comment.author}</div>
                         <div className={styles.dateTime}>
-                          {formatCommentDate(comment.createdAt)}
+                          {formatCommentDate(comment.createdAt, dateLocale)}
                         </div>
                       </div>
                       <span className={styles.likes}>
diff --git a/apps/business/src/components/BlogCommentsSection.tsx b/apps/business/src/components/BlogCommentsSection.tsx
index f52a9a6..df593a0 100644
--- a/apps/business/src/components/BlogCommentsSection.tsx
+++ b/apps/business/src/components/BlogCommentsSection.tsx
@@ -1,5 +1,6 @@
 import { useEffect, useState } from 'react'
 import { ThumbsUp, Check, XCircle, Trash2 } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
 import type { ProductComment } from '../types/comment'
 import { formatCommentDate } from '../data/productComments'
 import { ApiError } from '../lib/api'
@@ -18,6 +19,8 @@ interface BlogCommentsSectionProps {
 }
 
 export function BlogCommentsSection({ blogId, onCountChange }: BlogCommentsSectionProps) {
+  const { locale } = useLocale()
+  const dateLocale = locale === 'fa' ? 'fa' : 'en'
   const [comments, setComments] = useState<ProductComment[]>([])
   const [totalComments, setTotalComments] = useState(0)
   const [currentPage, setCurrentPage] = useState(1)
@@ -130,7 +133,9 @@ export function BlogCommentsSection({ blogId, onCountChange }: BlogCommentsSecti
                 <div className={styles.commentHeader}>
                   <div className={styles.commentMeta}>
                     <div className={styles.author}>{comment.author}</div>
-                    <div className={styles.dateTime}>{formatCommentDate(comment.createdAt)}</div>
+                    <div className={styles.dateTime}>
+                      {formatCommentDate(comment.createdAt, dateLocale)}
+                    </div>
                   </div>
                   <span className={styles.likes}>
                     <ThumbsUp size={13} />
diff --git a/apps/business/src/components/BrandModal.tsx b/apps/business/src/components/BrandModal.tsx
index 7897fa6..ec0c88e 100644
--- a/apps/business/src/components/BrandModal.tsx
+++ b/apps/business/src/components/BrandModal.tsx
@@ -1,6 +1,8 @@
 import { useEffect, useRef, useState } from 'react'
 import { createPortal } from 'react-dom'
 import { X } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
+import { useT } from '../i18n/useT'
 import { ImageCropper } from './ImageCropper'
 import type { Brand, BrandFormData } from '../types/brand'
 import styles from './BrandModal.module.css'
@@ -21,9 +23,12 @@ export function BrandModal({
   onClose,
   onSubmit,
   editingBrand = null,
-  title = 'Add Brand',
+  title,
   isSubmitting = false,
 }: BrandModalProps) {
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
   const formRef = useRef<HTMLFormElement>(null)
   const [mounted, setMounted] = useState(open)
   const [closing, setClosing] = useState(false)
@@ -85,39 +90,46 @@ export function BrandModal({
         role="dialog"
         aria-modal="true"
         aria-labelledby="brand-modal-title"
+        lang={isFa ? 'fa' : 'en'}
+        dir={isFa ? 'rtl' : 'ltr'}
       >
         <div className={styles.header}>
           <h3 id="brand-modal-title" className={styles.title}>
-            {title}
+            {title ?? t('brands.add')}
           </h3>
-          <button className={styles.closeBtn} onClick={onClose} aria-label="Close">
+          <button
+            type="button"
+            className={styles.closeBtn}
+            onClick={onClose}
+            aria-label={t('common.close')}
+          >
             <X size={20} />
           </button>
         </div>
 
         <form ref={formRef} className={styles.form} onSubmit={handleSubmit}>
           <div className={styles.field}>
-            <label>Brand logo</label>
+            <label>{t('brands.modal.logo')}</label>
             <ImageCropper
               value={image}
               onChange={setImage}
               outputFormat="png"
               accept="image/png"
-              uploadLabel="Upload brand logo"
-              hint="PNG only — transparent background recommended"
-              changeLabel="Change logo"
+              uploadLabel={t('brands.modal.uploadLogo')}
+              hint={t('brands.modal.logoHint')}
+              changeLabel={t('brands.modal.changeLogo')}
             />
           </div>
 
           <div className={styles.field}>
-            <label htmlFor="nameFa">Name (FA)</label>
+            <label htmlFor="nameFa">{t('brands.modal.nameFa')}</label>
             <input
               id="nameFa"
               name="nameFa"
               type="text"
               dir="rtl"
               className="faText"
-              placeholder="نام برند"
+              placeholder={t('brands.modal.nameFaPlaceholder')}
               value={nameFa}
               onChange={(e) => setNameFa(e.target.value)}
               disabled={isSubmitting}
@@ -125,13 +137,13 @@ export function BrandModal({
           </div>
 
           <div className={styles.field}>
-            <label htmlFor="nameEn">Name (EN)</label>
+            <label htmlFor="nameEn">{t('brands.modal.nameEn')}</label>
             <input
               id="nameEn"
               name="nameEn"
               type="text"
-              dir="ltr"
-              placeholder="Brand name"
+              dir={isFa ? 'rtl' : 'ltr'}
+              placeholder={t('brands.modal.nameEnPlaceholder')}
               value={nameEn}
               onChange={(e) => setNameEn(e.target.value)}
               required
@@ -140,12 +152,13 @@ export function BrandModal({
           </div>
 
           <div className={styles.field}>
-            <label htmlFor="about">About</label>
+            <label htmlFor="about">{t('brands.modal.about')}</label>
             <textarea
               id="about"
               name="about"
               rows={3}
-              placeholder="Short description of this brand"
+              dir={isFa ? 'rtl' : 'ltr'}
+              placeholder={t('brands.modal.aboutPlaceholder')}
               value={about}
               onChange={(e) => setAbout(e.target.value)}
               disabled={isSubmitting}
@@ -159,10 +172,10 @@ export function BrandModal({
               onClick={onClose}
               disabled={isSubmitting}
             >
-              Cancel
+              {t('brands.modal.cancel')}
             </button>
             <button type="submit" className={styles.submitBtn} disabled={isSubmitting}>
-              {isSubmitting ? 'Saving...' : 'Save Brand'}
+              {isSubmitting ? t('brands.modal.saving') : t('brands.modal.save')}
             </button>
           </div>
         </form>
diff --git a/apps/business/src/components/BrandRow.tsx b/apps/business/src/components/BrandRow.tsx
index 2a0f1af..7214d9a 100644
--- a/apps/business/src/components/BrandRow.tsx
+++ b/apps/business/src/components/BrandRow.tsx
@@ -1,5 +1,7 @@
 import { Pencil, Trash2 } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
 import type { Brand } from '../types/brand'
+import { useT } from '../i18n/useT'
 import { Tooltip } from './Tooltip'
 import rowStyles from './CategoryRow.module.css'
 import styles from './BrandRow.module.css'
@@ -11,6 +13,12 @@ interface BrandRowProps {
 }
 
 export function BrandRow({ brand, onEdit, onRemove }: BrandRowProps) {
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
+  const primaryName = isFa ? brand.nameFa || brand.nameEn : brand.nameEn
+  const secondaryName = isFa ? (brand.nameFa ? brand.nameEn : '') : brand.nameFa
+
   return (
     <div className={rowStyles.row}>
       <div className={styles.info}>
@@ -19,33 +27,33 @@ export function BrandRow({ brand, onEdit, onRemove }: BrandRowProps) {
         )}
         <div className={rowStyles.textBlock}>
           <div className={rowStyles.names}>
-            <span className={rowStyles.nameEn}>{brand.nameEn}</span>
-            {brand.nameFa && (
+            <span className={isFa ? rowStyles.nameFa : rowStyles.nameEn}>{primaryName}</span>
+            {secondaryName ? (
               <>
                 <span className={rowStyles.separator}>·</span>
-                <span className={rowStyles.nameFa}>{brand.nameFa}</span>
+                <span className={isFa ? rowStyles.nameEn : rowStyles.nameFa}>{secondaryName}</span>
               </>
-            )}
+            ) : null}
           </div>
           {brand.about && <p className={rowStyles.description}>{brand.about}</p>}
         </div>
       </div>
 
       <div className={rowStyles.controls}>
-        <Tooltip label="Edit brand">
+        <Tooltip label={t('brands.tooltip.edit')}>
           <button
             className={rowStyles.controlBtn}
             onClick={() => onEdit(brand.id)}
-            aria-label="Edit brand"
+            aria-label={t('brands.tooltip.edit')}
           >
             <Pencil size={17} />
           </button>
         </Tooltip>
-        <Tooltip label="Remove brand">
+        <Tooltip label={t('brands.tooltip.remove')}>
           <button
             className={`${rowStyles.controlBtn} ${rowStyles.danger}`}
             onClick={() => onRemove(brand.id)}
-            aria-label="Remove brand"
+            aria-label={t('brands.tooltip.remove')}
           >
             <Trash2 size={17} />
           </button>
diff --git a/apps/business/src/components/CategoryModal.module.css b/apps/business/src/components/CategoryModal.module.css
index a746d49..947f1be 100644
--- a/apps/business/src/components/CategoryModal.module.css
+++ b/apps/business/src/components/CategoryModal.module.css
@@ -70,6 +70,13 @@
   color: var(--text-secondary);
 }
 
+.hint {
+  margin: 0;
+  font-size: 11px;
+  line-height: 1.4;
+  color: var(--text-muted);
+}
+
 .field input,
 .field textarea {
   padding: var(--field-padding-y) var(--field-padding-x);
diff --git a/apps/business/src/components/CategoryModal.tsx b/apps/business/src/components/CategoryModal.tsx
index 6df3597..9a7d369 100644
--- a/apps/business/src/components/CategoryModal.tsx
+++ b/apps/business/src/components/CategoryModal.tsx
@@ -1,6 +1,8 @@
 import { useEffect, useRef, useState } from 'react'
 import { createPortal } from 'react-dom'
 import { X } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
+import { useT } from '../i18n/useT'
 import type { Category, CategoryFormData } from '../types/category'
 import { flattenCategories } from '../utils/categories'
 import { SearchableSelect } from './SearchableSelect'
@@ -26,9 +28,12 @@ export function CategoryModal({
   categories,
   defaultParentId = '',
   editingCategory = null,
-  title = 'Add Category',
+  title,
   isSubmitting = false,
 }: CategoryModalProps) {
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
   const formRef = useRef<HTMLFormElement>(null)
   const [mounted, setMounted] = useState(open)
   const [closing, setClosing] = useState(false)
@@ -91,35 +96,43 @@ export function CategoryModal({
         role="dialog"
         aria-modal="true"
         aria-labelledby="category-modal-title"
+        lang={isFa ? 'fa' : 'en'}
+        dir={isFa ? 'rtl' : 'ltr'}
       >
         <div className={styles.header}>
           <h3 id="category-modal-title" className={styles.title}>
-            {title}
+            {title ?? t('categories.add')}
           </h3>
-          <button className={styles.closeBtn} onClick={onClose} aria-label="Close">
+          <button
+            type="button"
+            className={styles.closeBtn}
+            onClick={onClose}
+            aria-label={t('common.close')}
+          >
             <X size={20} />
           </button>
         </div>
 
         <form ref={formRef} className={styles.form} onSubmit={handleSubmit}>
           <div className={styles.field}>
-            <label>Parent Category</label>
+            <label>{t('categories.modal.parent')}</label>
             <SearchableSelect
               options={parentOptions}
               value={parentId}
               onChange={setParentId}
+              placeholder={t('categories.select.search')}
             />
           </div>
 
           <div className={styles.field}>
-            <label htmlFor="nameFa">Name (FA)</label>
+            <label htmlFor="nameFa">{t('categories.modal.nameFa')}</label>
             <input
               id="nameFa"
               name="nameFa"
               type="text"
               dir="rtl"
               className="faText"
-              placeholder="نام دسته‌بندی"
+              placeholder={t('categories.modal.nameFaPlaceholder')}
               value={nameFa}
               onChange={(e) => setNameFa(e.target.value)}
               required
@@ -128,13 +141,13 @@ export function CategoryModal({
           </div>
 
           <div className={styles.field}>
-            <label htmlFor="nameEn">Name (EN)</label>
+            <label htmlFor="nameEn">{t('categories.modal.nameEn')}</label>
             <input
               id="nameEn"
               name="nameEn"
               type="text"
-              dir="ltr"
-              placeholder="Category name"
+              dir={isFa ? 'rtl' : 'ltr'}
+              placeholder={t('categories.modal.nameEnPlaceholder')}
               value={nameEn}
               onChange={(e) => setNameEn(e.target.value)}
               required
@@ -143,12 +156,13 @@ export function CategoryModal({
           </div>
 
           <div className={styles.field}>
-            <label htmlFor="description">Description</label>
+            <label htmlFor="description">{t('categories.modal.description')}</label>
             <textarea
               id="description"
               name="description"
               rows={3}
-              placeholder="Short description of this category"
+              dir={isFa ? 'rtl' : 'ltr'}
+              placeholder={t('categories.modal.descriptionPlaceholder')}
               value={description}
               onChange={(e) => setDescription(e.target.value)}
               disabled={isSubmitting}
@@ -162,10 +176,10 @@ export function CategoryModal({
               onClick={onClose}
               disabled={isSubmitting}
             >
-              Cancel
+              {t('categories.modal.cancel')}
             </button>
             <button type="submit" className={styles.submitBtn} disabled={isSubmitting}>
-              {isSubmitting ? 'Saving...' : 'Save Category'}
+              {isSubmitting ? t('categories.modal.saving') : t('categories.modal.save')}
             </button>
           </div>
         </form>
diff --git a/apps/business/src/components/CategoryRow.module.css b/apps/business/src/components/CategoryRow.module.css
index 867ca17..e13636e 100644
--- a/apps/business/src/components/CategoryRow.module.css
+++ b/apps/business/src/components/CategoryRow.module.css
@@ -85,11 +85,17 @@
 .nameFa {
   font-family: var(--font-ui);
   font-size: 15px;
-  font-weight: 500;
+  font-weight: 600;
   color: var(--text-primary);
   direction: rtl;
 }
 
+.names .nameEn:not(:first-child),
+.names .nameFa:not(:first-child) {
+  font-weight: 500;
+  color: var(--text-secondary);
+}
+
 .description {
   margin-top: 4px;
   font-size: 13px;
diff --git a/apps/business/src/components/CategoryRow.tsx b/apps/business/src/components/CategoryRow.tsx
index 27d6aa4..a16434b 100644
--- a/apps/business/src/components/CategoryRow.tsx
+++ b/apps/business/src/components/CategoryRow.tsx
@@ -1,5 +1,7 @@
 import { FolderPlus, Layers, ListTree, Trash2, ChevronRight, ClipboardList } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
 import type { Category } from '../types/category'
+import { useT } from '../i18n/useT'
 import { Tooltip } from './Tooltip'
 import styles from './CategoryRow.module.css'
 
@@ -32,6 +34,16 @@ export function CategoryRow({
   onOptions,
   onRemove,
 }: CategoryRowProps) {
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
+  const primaryName = isFa ? category.nameFa || category.nameEn : category.nameEn
+  const secondaryName = isFa
+    ? category.nameFa
+      ? category.nameEn
+      : ''
+    : category.nameFa
+
   return (
     <div
       className={styles.row}
@@ -56,9 +68,13 @@ export function CategoryRow({
       >
         <div className={styles.textBlock}>
           <div className={styles.names}>
-            <span className={styles.nameEn}>{category.nameEn}</span>
-            <span className={styles.separator}>·</span>
-            <span className={styles.nameFa}>{category.nameFa}</span>
+            <span className={isFa ? styles.nameFa : styles.nameEn}>{primaryName}</span>
+            {secondaryName ? (
+              <>
+                <span className={styles.separator}>·</span>
+                <span className={isFa ? styles.nameEn : styles.nameFa}>{secondaryName}</span>
+              </>
+            ) : null}
             {hasChildren && (
               <span className={`${styles.chevron} ${expanded ? styles.chevronOpen : ''}`}>
                 <ChevronRight size={18} />
@@ -72,20 +88,20 @@ export function CategoryRow({
       </div>
 
       <div className={styles.controls}>
-        <Tooltip label="Add sub category">
+        <Tooltip label={t('categories.tooltip.addSub')}>
           <button
             className={styles.controlBtn}
             onClick={() => onAddSub(category.id)}
-            aria-label="Add sub category"
+            aria-label={t('categories.tooltip.addSub')}
           >
             <FolderPlus size={17} />
           </button>
         </Tooltip>
-        <Tooltip label="Manage variations">
+        <Tooltip label={t('categories.tooltip.variations')}>
           <button
             className={`${styles.controlBtn} ${styles.iconBtn}`}
             onClick={() => onVariations(category.id)}
-            aria-label={`Variations (${variationCount})`}
+            aria-label={`${t('categories.tooltip.variations')} (${variationCount})`}
           >
             <Layers size={17} />
             {variationCount > 0 && (
@@ -93,11 +109,11 @@ export function CategoryRow({
             )}
           </button>
         </Tooltip>
-        <Tooltip label="Technical data form">
+        <Tooltip label={t('categories.tooltip.technical')}>
           <button
             className={`${styles.controlBtn} ${styles.iconBtn}`}
             onClick={() => onTechnicalForm(category.id)}
-            aria-label={`Technical data form (${technicalFieldCount})`}
+            aria-label={`${t('categories.tooltip.technical')} (${technicalFieldCount})`}
           >
             <ClipboardList size={17} />
             {technicalFieldCount > 0 && (
@@ -105,20 +121,20 @@ export function CategoryRow({
             )}
           </button>
         </Tooltip>
-        <Tooltip label="Category options">
+        <Tooltip label={t('categories.tooltip.options')}>
           <button
             className={styles.controlBtn}
             onClick={() => onOptions(category.id)}
-            aria-label="Options"
+            aria-label={t('categories.tooltip.options')}
           >
             <ListTree size={17} />
           </button>
         </Tooltip>
-        <Tooltip label="Remove category">
+        <Tooltip label={t('categories.tooltip.remove')}>
           <button
             className={`${styles.controlBtn} ${styles.danger}`}
             onClick={() => onRemove(category.id)}
-            aria-label="Remove"
+            aria-label={t('categories.tooltip.remove')}
           >
             <Trash2 size={17} />
           </button>
diff --git a/apps/business/src/components/ContactSubmissionDetailModal.tsx b/apps/business/src/components/ContactSubmissionDetailModal.tsx
index a2ebcc5..58468b4 100644
--- a/apps/business/src/components/ContactSubmissionDetailModal.tsx
+++ b/apps/business/src/components/ContactSubmissionDetailModal.tsx
@@ -1,8 +1,10 @@
 import { useEffect, useState } from 'react'
 import { createPortal } from 'react-dom'
 import { X } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
 import type { ContactSubmission } from '../types/contactSubmission'
 import { formatCellForDisplay } from '../lib/cellNumber'
+import { useT } from '../i18n/useT'
 import modalStyles from './VariationsModal.module.css'
 import styles from './ContactSubmissionDetailModal.module.css'
 
@@ -14,12 +16,13 @@ interface ContactSubmissionDetailModalProps {
 
 const ANIMATION_MS = 220
 
-function formatDateTime(value: string) {
+function formatDateTime(value: string, locale: 'en' | 'fa') {
   const d = new Date(value)
   if (Number.isNaN(d.getTime())) return { date: value, time: '' }
+  const intlLocale = locale === 'fa' ? 'fa-IR' : 'en-US'
   return {
-    date: d.toLocaleDateString('en-US', { year: 'numeric', month: 'short', day: '2-digit' }),
-    time: d.toLocaleTimeString('en-US', { hour: '2-digit', minute: '2-digit' }),
+    date: d.toLocaleDateString(intlLocale, { year: 'numeric', month: 'short', day: '2-digit' }),
+    time: d.toLocaleTimeString(intlLocale, { hour: '2-digit', minute: '2-digit' }),
   }
 }
 
@@ -28,6 +31,8 @@ export function ContactSubmissionDetailModal({
   submission,
   onClose,
 }: ContactSubmissionDetailModalProps) {
+  const t = useT()
+  const { locale } = useLocale()
   const [mounted, setMounted] = useState(open)
   const [closing, setClosing] = useState(false)
 
@@ -56,7 +61,7 @@ export function ContactSubmissionDetailModal({
 
   if (!mounted || !submission) return null
 
-  const { date, time } = formatDateTime(submission.createdAt)
+  const { date, time } = formatDateTime(submission.createdAt, locale)
 
   return createPortal(
     <div
@@ -73,7 +78,7 @@ export function ContactSubmissionDetailModal({
         <div className={modalStyles.header}>
           <div>
             <h2 id="contact-submission-title" className={modalStyles.title}>
-              Contact submission
+              {t('website.contact.detailTitle')}
             </h2>
             <p className={modalStyles.subtitle}>{submission.title}</p>
           </div>
@@ -81,7 +86,7 @@ export function ContactSubmissionDetailModal({
             type="button"
             className={modalStyles.closeBtn}
             onClick={onClose}
-            aria-label="Close"
+            aria-label={t('common.close')}
           >
             <X size={20} />
           </button>
@@ -90,31 +95,31 @@ export function ContactSubmissionDetailModal({
         <div className={styles.body}>
           <dl className={styles.metaGrid}>
             <div className={styles.metaItem}>
-              <dt>Name</dt>
+              <dt>{t('website.contact.col.name')}</dt>
               <dd>{submission.name}</dd>
             </div>
             <div className={styles.metaItem}>
-              <dt>Email</dt>
+              <dt>{t('website.contact.col.email')}</dt>
               <dd>{submission.email ?? '—'}</dd>
             </div>
             <div className={styles.metaItem}>
-              <dt>Cell number</dt>
+              <dt>{t('website.contact.col.cell')}</dt>
               <dd>
                 {submission.cellNumber ? formatCellForDisplay(submission.cellNumber) : '—'}
               </dd>
             </div>
             <div className={styles.metaItem}>
-              <dt>Date</dt>
+              <dt>{t('website.contact.col.date')}</dt>
               <dd>{date}</dd>
             </div>
             <div className={styles.metaItem}>
-              <dt>Time</dt>
+              <dt>{t('website.contact.col.time')}</dt>
               <dd>{time || '—'}</dd>
             </div>
           </dl>
 
           <div className={styles.messageBlock}>
-            <h3 className={styles.messageLabel}>Message</h3>
+            <h3 className={styles.messageLabel}>{t('website.contact.detailMessage')}</h3>
             <p className={styles.messageText}>{submission.text}</p>
           </div>
         </div>
diff --git a/apps/business/src/components/CreateStoreItemsModal.tsx b/apps/business/src/components/CreateStoreItemsModal.tsx
index 9db8613..2b89808 100644
--- a/apps/business/src/components/CreateStoreItemsModal.tsx
+++ b/apps/business/src/components/CreateStoreItemsModal.tsx
@@ -1,6 +1,8 @@
 import { useEffect, useMemo, useState } from 'react'
 import { createPortal } from 'react-dom'
 import { Plus, X } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
+import { useT } from '../i18n/useT'
 import { ApiError } from '../lib/api'
 import { listAllProducts } from '../services/productService'
 import {
@@ -40,6 +42,8 @@ export function CreateStoreItemsModal({
   onCreated,
   onEditExisting,
 }: CreateStoreItemsModalProps) {
+  const t = useT()
+  const { locale } = useLocale()
   const [mounted, setMounted] = useState(open)
   const [closing, setClosing] = useState(false)
   const [products, setProducts] = useState<{ id: string; title: string; nameFa: string }[]>([])
@@ -118,7 +122,7 @@ export function CreateStoreItemsModal({
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load products.')
+        setError(t('storeItems.create.errorProducts'))
       }
     } finally {
       setIsLoadingProducts(false)
@@ -138,7 +142,7 @@ export function CreateStoreItemsModal({
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load product variations.')
+        setError(t('storeItems.create.errorVariations'))
       }
       setVariations([])
       setRows([])
@@ -235,7 +239,7 @@ export function CreateStoreItemsModal({
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to create store items.')
+        setError(t('storeItems.create.errorCreate'))
       }
     } finally {
       setIsSubmitting(false)
@@ -253,36 +257,40 @@ export function CreateStoreItemsModal({
         role="dialog"
         aria-modal="true"
         aria-labelledby="create-store-items-title"
+        lang={locale === 'fa' ? 'fa' : 'en'}
+        dir={locale === 'fa' ? 'rtl' : 'ltr'}
       >
         <div className={modalStyles.header}>
           <div>
             <h3 id="create-store-items-title" className={modalStyles.title}>
-              Add Store Items
+              {t('storeItems.create.title')}
             </h3>
-            <p className={modalStyles.subtitle}>
-              Create sellable variants from a product&apos;s variations.
-            </p>
+            <p className={modalStyles.subtitle}>{t('storeItems.create.subtitle')}</p>
           </div>
-          <button className={modalStyles.closeBtn} onClick={onClose} aria-label="Close">
+          <button
+            className={modalStyles.closeBtn}
+            onClick={onClose}
+            aria-label={t('common.close')}
+          >
             <X size={20} />
           </button>
         </div>
 
         <form className={modalStyles.body} onSubmit={(e) => void handleSubmit(e)}>
           <div className={modalStyles.field}>
-            <label htmlFor="store-item-product">Product</label>
             <ProductSearchSelect
               id="store-item-product"
               options={products}
               value={productId}
               onChange={handleProductChange}
-              placeholder="Type 3+ characters to search products"
+              placeholder={t('storeItems.create.productPlaceholder')}
               disabled={isLoadingProducts || isSubmitting}
+              aria-label={t('storeItems.create.productPlaceholder')}
             />
           </div>
 
           {productId && isLoadingVariations && (
-            <p className={modalStyles.emptyText}>Loading product variations...</p>
+            <p className={modalStyles.emptyText}>{t('storeItems.create.loadingVariations')}</p>
           )}
 
           {productId && !isLoadingVariations && (
@@ -294,8 +302,8 @@ export function CreateStoreItemsModal({
                 {formVariations.map((variation) => (
                   <span key={variation.id}>{variation.name}</span>
                 ))}
-                <span>Price (IRT)</span>
-                <span>Stock</span>
+                <span>{t('storeItems.create.price')}</span>
+                <span>{t('storeItems.create.stock')}</span>
                 <span />
               </div>
 
@@ -346,13 +354,13 @@ export function CreateStoreItemsModal({
                       disabled={isSubmitting}
                     />
                     <div className={rowStyles.removeCell}>
-                      <Tooltip label="Remove row">
+                      <Tooltip label={t('storeItems.create.removeRow')}>
                         <button
                           type="button"
                           className={modalStyles.removeRowBtn}
                           onClick={() => removeRow(row.id)}
                           disabled={rows.length <= 1 || isSubmitting}
-                          aria-label="Remove row"
+                          aria-label={t('storeItems.create.removeRow')}
                         >
                           <X size={16} />
                         </button>
@@ -369,7 +377,7 @@ export function CreateStoreItemsModal({
                 disabled={isSubmitting}
               >
                 <Plus size={16} />
-                Add row
+                {t('storeItems.create.addRow')}
               </button>
             </>
           )}
@@ -383,14 +391,16 @@ export function CreateStoreItemsModal({
               onClick={onClose}
               disabled={isSubmitting}
             >
-              Cancel
+              {t('storeItems.create.cancel')}
             </button>
             <button
               type="submit"
               className={modalStyles.submitBtn}
               disabled={!canSubmit}
             >
-              {isSubmitting ? 'Creating…' : 'Create store items'}
+              {isSubmitting
+                ? t('storeItems.create.submitting')
+                : t('storeItems.create.submit')}
             </button>
           </div>
         </form>
diff --git a/apps/business/src/components/EditStoreItemsModal.tsx b/apps/business/src/components/EditStoreItemsModal.tsx
index b35aec5..e30e982 100644
--- a/apps/business/src/components/EditStoreItemsModal.tsx
+++ b/apps/business/src/components/EditStoreItemsModal.tsx
@@ -1,6 +1,8 @@
 import { useEffect, useMemo, useState } from 'react'
 import { createPortal } from 'react-dom'
 import { Plus, X } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
+import { useT } from '../i18n/useT'
 import { ApiError } from '../lib/api'
 import {
   getProductVariationValues,
@@ -59,6 +61,9 @@ export function EditStoreItemsModal({
   onClose,
   onSaved,
 }: EditStoreItemsModalProps) {
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
   const [mounted, setMounted] = useState(open)
   const [closing, setClosing] = useState(false)
   const [variations, setVariations] = useState<ProductVariationSelection[]>([])
@@ -113,7 +118,7 @@ export function EditStoreItemsModal({
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load product variations.')
+        setError(t('storeItems.create.errorVariations'))
       }
     } finally {
       setIsLoading(false)
@@ -203,13 +208,17 @@ export function EditStoreItemsModal({
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to save store items.')
+        setError(t('storeItems.edit.errorSave'))
       }
     } finally {
       setIsSubmitting(false)
     }
   }
 
+  const subtitle = isFa
+    ? [productNameFa, productTitle].filter(Boolean).join(' / ')
+    : [productTitle, productNameFa].filter(Boolean).join(' / ')
+
   return createPortal(
     <div
       className={`${modalStyles.overlay} ${closing ? modalStyles.overlayOut : modalStyles.overlayIn}`}
@@ -221,25 +230,28 @@ export function EditStoreItemsModal({
         role="dialog"
         aria-modal="true"
         aria-labelledby="edit-store-items-title"
+        lang={isFa ? 'fa' : 'en'}
+        dir={isFa ? 'rtl' : 'ltr'}
       >
         <div className={modalStyles.header}>
           <div>
             <h3 id="edit-store-items-title" className={modalStyles.title}>
-              Edit Store Items
+              {t('storeItems.edit.title')}
             </h3>
-            <p className={modalStyles.subtitle}>
-              {productTitle}
-              {productNameFa ? ` / ${productNameFa}` : ''}
-            </p>
+            <p className={modalStyles.subtitle}>{subtitle}</p>
           </div>
-          <button className={modalStyles.closeBtn} onClick={onClose} aria-label="Close">
+          <button
+            className={modalStyles.closeBtn}
+            onClick={onClose}
+            aria-label={t('common.close')}
+          >
             <X size={20} />
           </button>
         </div>
 
         <form className={modalStyles.body} onSubmit={(e) => void handleSubmit(e)}>
           {isLoading ? (
-            <p className={modalStyles.emptyText}>Loading product variations...</p>
+            <p className={modalStyles.emptyText}>{t('storeItems.create.loadingVariations')}</p>
           ) : (
             <>
               <div
@@ -249,8 +261,8 @@ export function EditStoreItemsModal({
                 {formVariations.map((variation) => (
                   <span key={variation.id}>{variation.name}</span>
                 ))}
-                <span>Price (IRT)</span>
-                <span>Stock</span>
+                <span>{t('storeItems.create.price')}</span>
+                <span>{t('storeItems.create.stock')}</span>
                 <span />
               </div>
 
@@ -301,13 +313,13 @@ export function EditStoreItemsModal({
                       disabled={isSubmitting}
                     />
                     <div className={rowStyles.removeCell}>
-                      <Tooltip label="Remove row">
+                      <Tooltip label={t('storeItems.create.removeRow')}>
                         <button
                           type="button"
                           className={modalStyles.removeRowBtn}
                           onClick={() => removeRow(row.id)}
                           disabled={rows.length <= 1 || isSubmitting}
-                          aria-label="Remove row"
+                          aria-label={t('storeItems.create.removeRow')}
                         >
                           <X size={16} />
                         </button>
@@ -324,7 +336,7 @@ export function EditStoreItemsModal({
                 disabled={isSubmitting}
               >
                 <Plus size={16} />
-                Add row
+                {t('storeItems.create.addRow')}
               </button>
             </>
           )}
@@ -338,10 +350,10 @@ export function EditStoreItemsModal({
               onClick={onClose}
               disabled={isSubmitting}
             >
-              Cancel
+              {t('storeItems.create.cancel')}
             </button>
             <button type="submit" className={modalStyles.submitBtn} disabled={!canSubmit}>
-              {isSubmitting ? 'Saving…' : 'Save changes'}
+              {isSubmitting ? t('storeItems.edit.saving') : t('storeItems.edit.save')}
             </button>
           </div>
         </form>
diff --git a/apps/business/src/components/ImageCropper.tsx b/apps/business/src/components/ImageCropper.tsx
index 1a6dbb2..662617b 100644
--- a/apps/business/src/components/ImageCropper.tsx
+++ b/apps/business/src/components/ImageCropper.tsx
@@ -2,6 +2,7 @@ import { useCallback, useEffect, useState } from 'react'
 import Cropper, { type Area } from 'react-easy-crop'
 import { ImagePlus, X } from 'lucide-react'
 import { getCroppedImage } from '../utils/cropImage'
+import { useT } from '../i18n/useT'
 import styles from './ImageCropper.module.css'
 
 interface ImageCropperProps {
@@ -22,10 +23,14 @@ export function ImageCropper({
   aspect = 1,
   outputFormat = 'jpeg',
   accept = 'image/*',
-  uploadLabel = 'Upload thumbnail image',
-  hint = 'Click to select, then crop',
-  changeLabel = 'Change thumbnail',
+  uploadLabel,
+  hint,
+  changeLabel,
 }: ImageCropperProps) {
+  const t = useT()
+  const resolvedUploadLabel = uploadLabel ?? t('products.form.thumbnailUpload')
+  const resolvedHint = hint ?? t('products.form.thumbnailHint')
+  const resolvedChangeLabel = changeLabel ?? t('products.form.thumbnailChange')
   const [imageSrc, setImageSrc] = useState<string | null>(null)
   const [crop, setCrop] = useState({ x: 0, y: 0 })
   const [zoom, setZoom] = useState(1)
@@ -93,8 +98,13 @@ export function ImageCropper({
     <div className={styles.wrapper}>
       {value && !imageSrc && (
         <div className={styles.preview}>
-          <img src={value} alt="Thumbnail preview" className={styles.previewImgNatural} />
-          <button type="button" className={styles.removeBtn} onClick={removeThumbnail} aria-label="Remove thumbnail">
+          <img src={value} alt={resolvedUploadLabel} className={styles.previewImgNatural} />
+          <button
+            type="button"
+            className={styles.removeBtn}
+            onClick={removeThumbnail}
+            aria-label={t('products.form.thumbnailRemove')}
+          >
             <X size={16} />
           </button>
         </div>
@@ -103,8 +113,8 @@ export function ImageCropper({
       {!value && !imageSrc && (
         <label className={styles.uploadZone} style={frameStyle}>
           <ImagePlus size={28} />
-          <span>{uploadLabel}</span>
-          <span className={styles.hint}>{hint}</span>
+          <span>{resolvedUploadLabel}</span>
+          <span className={styles.hint}>{resolvedHint}</span>
           <input type="file" accept={accept} onChange={handleFile} hidden />
         </label>
       )}
@@ -125,7 +135,7 @@ export function ImageCropper({
           </div>
           <div className={styles.cropControls}>
             <label className={styles.zoomLabel}>
-              Zoom
+              {t('products.form.zoom')}
               <input
                 type="range"
                 min={1}
@@ -137,7 +147,7 @@ export function ImageCropper({
             </label>
             <div className={styles.cropActions}>
               <button type="button" className={styles.cancelBtn} onClick={cancelCrop}>
-                Cancel
+                {t('products.form.cancel')}
               </button>
               <button
                 type="button"
@@ -145,7 +155,7 @@ export function ImageCropper({
                 onClick={() => void applyCrop()}
                 disabled={!croppedArea}
               >
-                Apply Crop
+                {t('products.form.applyCrop')}
               </button>
             </div>
           </div>
@@ -154,7 +164,7 @@ export function ImageCropper({
 
       {value && !imageSrc && (
         <label className={styles.changeBtn}>
-          {changeLabel}
+          {resolvedChangeLabel}
           <input type="file" accept={accept} onChange={handleFile} hidden />
         </label>
       )}
diff --git a/apps/business/src/components/ImageUploader.tsx b/apps/business/src/components/ImageUploader.tsx
index 2225664..63a2f63 100644
--- a/apps/business/src/components/ImageUploader.tsx
+++ b/apps/business/src/components/ImageUploader.tsx
@@ -1,5 +1,6 @@
 import { useRef } from 'react'
 import { ImagePlus, X } from 'lucide-react'
+import { useT } from '../i18n/useT'
 import styles from './ImageUploader.module.css'
 
 interface ImageUploaderProps {
@@ -8,6 +9,7 @@ interface ImageUploaderProps {
 }
 
 export function ImageUploader({ images, onChange }: ImageUploaderProps) {
+  const t = useT()
   const inputRef = useRef<HTMLInputElement>(null)
 
   function handleFiles(e: React.ChangeEvent<HTMLInputElement>) {
@@ -39,12 +41,12 @@ export function ImageUploader({ images, onChange }: ImageUploaderProps) {
       <div className={styles.grid}>
         {images.map((src, index) => (
           <div key={`${src.slice(0, 32)}-${index}`} className={styles.item}>
-            <img src={src} alt={`Product image ${index + 1}`} />
+            <img src={src} alt={t('products.form.images')} />
             <button
               type="button"
               className={styles.removeBtn}
               onClick={() => removeImage(index)}
-              aria-label={`Remove image ${index + 1}`}
+              aria-label={t('products.form.imagesRemove', { index: index + 1 })}
             >
               <X size={14} />
             </button>
@@ -57,7 +59,7 @@ export function ImageUploader({ images, onChange }: ImageUploaderProps) {
           onClick={() => inputRef.current?.click()}
         >
           <ImagePlus size={24} />
-          <span>Add images</span>
+          <span>{t('products.form.imagesAdd')}</span>
         </button>
       </div>
 
@@ -69,7 +71,7 @@ export function ImageUploader({ images, onChange }: ImageUploaderProps) {
         hidden
         onChange={handleFiles}
       />
-      <p className={styles.hint}>Upload multiple product images. Click + to add more.</p>
+      <p className={styles.hint}>{t('products.form.imagesHint')}</p>
     </div>
   )
 }
diff --git a/apps/business/src/components/ListFiltersPanel.module.css b/apps/business/src/components/ListFiltersPanel.module.css
index e0014f4..4cd7589 100644
--- a/apps/business/src/components/ListFiltersPanel.module.css
+++ b/apps/business/src/components/ListFiltersPanel.module.css
@@ -1,6 +1,6 @@
 .filtersPanel {
   margin-bottom: 12px;
-  padding: 14px 16px;
+  padding: 10px 14px;
   background: var(--glass-bg);
   backdrop-filter: blur(var(--blur-glass));
   -webkit-backdrop-filter: blur(var(--blur-glass));
@@ -10,25 +10,25 @@
 }
 
 .filtersTitle {
-  font-size: 14px;
+  font-size: 13px;
   font-weight: 700;
   color: var(--text-primary);
-  margin-bottom: 10px;
+  margin-bottom: 8px;
 }
 
 .filtersGrid {
   display: grid;
   grid-template-columns: repeat(12, 1fr);
-  gap: 10px 12px;
-  align-items: end;
+  gap: 8px 12px;
+  align-items: center;
 }
 
 .filtersInputs {
   grid-column: span 10;
   display: grid;
   grid-template-columns: repeat(12, 1fr);
-  gap: 10px 12px;
-  align-items: end;
+  gap: 8px 12px;
+  align-items: center;
 }
 
 .filterActions {
@@ -38,13 +38,13 @@
   gap: 8px;
   align-items: center;
   justify-content: flex-end;
-  align-self: end;
+  align-self: center;
 }
 
 .field {
   display: flex;
   flex-direction: column;
-  gap: 4px;
+  gap: 0;
 }
 
 .fieldCol2 {
@@ -98,15 +98,12 @@
 .switchField {
   display: flex;
   flex-direction: column;
-  gap: 4px;
+  gap: 0;
+  justify-content: center;
 }
 
 .switchFieldSpacer {
-  font-size: 12px;
-  font-weight: 500;
-  line-height: 1.3;
-  visibility: hidden;
-  user-select: none;
+  display: none;
 }
 
 .switchInline {
diff --git a/apps/business/src/components/OrderTransactionsModal.tsx b/apps/business/src/components/OrderTransactionsModal.tsx
index ecd2e5d..ed2e544 100644
--- a/apps/business/src/components/OrderTransactionsModal.tsx
+++ b/apps/business/src/components/OrderTransactionsModal.tsx
@@ -1,6 +1,7 @@
 import { useEffect, useMemo, useState } from 'react'
 import { createPortal } from 'react-dom'
 import { X } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
 import type { Order, OrderTransaction, TransactionStatus, TransactionType } from '../services/orderService'
 import { formatIrtPrice } from '../utils/irtPrice'
 import modalStyles from './VariationsModal.module.css'
@@ -43,10 +44,10 @@ function statusClass(status: TransactionStatus) {
   }
 }
 
-function formatDateTime(value: string) {
+function formatDateTime(value: string, locale: 'en' | 'fa') {
   const d = new Date(value)
   if (Number.isNaN(d.getTime())) return value
-  return d.toLocaleString('en-US', {
+  return d.toLocaleString(locale === 'fa' ? 'fa-IR' : 'en-US', {
     year: 'numeric',
     month: 'short',
     day: '2-digit',
@@ -55,10 +56,10 @@ function formatDateTime(value: string) {
   })
 }
 
-function transactionDetails(transaction: OrderTransaction) {
+function transactionDetails(transaction: OrderTransaction, locale: 'en' | 'fa') {
   const rows: { label: string; value: string }[] = [
     { label: 'Status', value: transaction.status },
-    { label: 'Date', value: formatDateTime(transaction.createdAt) },
+    { label: 'Date', value: formatDateTime(transaction.createdAt, locale) },
   ]
 
   if (transaction.type === 'pos' && transaction.posType) {
@@ -83,6 +84,8 @@ function transactionDetails(transaction: OrderTransaction) {
 }
 
 export function OrderTransactionsModal({ open, order, onClose }: OrderTransactionsModalProps) {
+  const { locale } = useLocale()
+  const dateLocale = locale === 'fa' ? 'fa' : 'en'
   const [mounted, setMounted] = useState(open)
   const [closing, setClosing] = useState(false)
 
@@ -147,7 +150,7 @@ export function OrderTransactionsModal({ open, order, onClose }: OrderTransactio
           ) : (
             <ul className={styles.txList}>
               {transactions.map((transaction) => {
-                const details = transactionDetails(transaction)
+                const details = transactionDetails(transaction, dateLocale)
                 return (
                   <li key={transaction.id} className={styles.txCard}>
                     <div className={styles.txHeader}>
diff --git a/apps/business/src/components/PickStoreSpecialItemsModal.tsx b/apps/business/src/components/PickStoreSpecialItemsModal.tsx
index b694752..b3b74d3 100644
--- a/apps/business/src/components/PickStoreSpecialItemsModal.tsx
+++ b/apps/business/src/components/PickStoreSpecialItemsModal.tsx
@@ -1,6 +1,8 @@
 import { useEffect, useMemo, useState } from 'react'
 import { createPortal } from 'react-dom'
 import { X } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
+import { useT } from '../i18n/useT'
 import { ApiError } from '../lib/api'
 import { listAllStoreItems } from '../services/storeItemService'
 import { groupStoreItemsByProduct } from '../utils/storeProductGroups'
@@ -30,6 +32,9 @@ export function PickStoreSpecialItemsModal({
   onConfirm,
   isSubmitting = false,
 }: PickStoreSpecialItemsModalProps) {
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
   const [mounted, setMounted] = useState(open)
   const [closing, setClosing] = useState(false)
   const [options, setOptions] = useState<StoreItemSearchOption[]>([])
@@ -97,7 +102,7 @@ export function PickStoreSpecialItemsModal({
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load store items.')
+        setError(t('website.specialItems.pickErrorLoad'))
       }
     } finally {
       setIsLoading(false)
@@ -117,6 +122,12 @@ export function PickStoreSpecialItemsModal({
     onConfirm(selectedIds)
   }
 
+  function confirmLabel() {
+    if (isSubmitting) return t('website.adding')
+    if (selectedIds.length === 1) return t('website.pick.addOneItem')
+    return t('website.pick.addItems', { count: selectedIds.length })
+  }
+
   if (!mounted) return null
 
   return createPortal(
@@ -130,15 +141,22 @@ export function PickStoreSpecialItemsModal({
         role="dialog"
         aria-modal="true"
         aria-labelledby="pick-special-items-title"
+        lang={isFa ? 'fa' : 'en'}
+        dir={isFa ? 'rtl' : 'ltr'}
       >
         <div className={modalStyles.header}>
           <div>
             <h2 id="pick-special-items-title" className={modalStyles.title}>
-              Add to {specialTitle}
+              {t('website.pick.addTo', { title: specialTitle })}
             </h2>
-            <p className={modalStyles.subtitle}>Select store items to feature in this category.</p>
+            <p className={modalStyles.subtitle}>{t('website.specialItems.pickSubtitle')}</p>
           </div>
-          <button type="button" className={modalStyles.closeBtn} onClick={onClose} aria-label="Close">
+          <button
+            type="button"
+            className={modalStyles.closeBtn}
+            onClick={onClose}
+            aria-label={t('common.close')}
+          >
             <X size={20} />
           </button>
         </div>
@@ -147,22 +165,22 @@ export function PickStoreSpecialItemsModal({
           {error && <p className={styles.error}>{error}</p>}
 
           {isLoading ? (
-            <p className={styles.empty}>Loading store items...</p>
+            <p className={styles.empty}>{t('website.specialItems.pickLoading')}</p>
           ) : options.length === 0 ? (
-            <p className={styles.empty}>All store items are already in this category.</p>
+            <p className={styles.empty}>{t('website.specialItems.pickEmpty')}</p>
           ) : (
             <StoreItemMultiSearchSelect
               options={options}
               selectedIds={selectedIds}
               onToggle={toggleSelection}
-              placeholder="Type 3+ characters to search store items"
+              placeholder={t('website.specialItems.pickSearch')}
               disabled={isSubmitting}
             />
           )}
 
           <div className={styles.footer}>
             <button type="button" className={styles.cancelBtn} onClick={onClose} disabled={isSubmitting}>
-              Cancel
+              {t('products.form.cancel')}
             </button>
             <button
               type="button"
@@ -170,7 +188,7 @@ export function PickStoreSpecialItemsModal({
               onClick={handleConfirm}
               disabled={isSubmitting || selectedIds.length === 0}
             >
-              {isSubmitting ? 'Adding...' : `Add ${selectedIds.length || ''} item${selectedIds.length === 1 ? '' : 's'}`}
+              {confirmLabel()}
             </button>
           </div>
         </div>
diff --git a/apps/business/src/components/PickStoreVariantModal.tsx b/apps/business/src/components/PickStoreVariantModal.tsx
index 412c2d7..7702d79 100644
--- a/apps/business/src/components/PickStoreVariantModal.tsx
+++ b/apps/business/src/components/PickStoreVariantModal.tsx
@@ -1,6 +1,8 @@
 import { useEffect, useState } from 'react'
 import { createPortal } from 'react-dom'
 import { X } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
+import { useT } from '../i18n/useT'
 import type { StoreItem } from '../services/storeItemService'
 import { StoreItemPrice } from './StoreItemPrice'
 import modalStyles from './VariationsModal.module.css'
@@ -25,6 +27,9 @@ export function PickStoreVariantModal({
   onClose,
   onSelect,
 }: PickStoreVariantModalProps) {
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
   const [mounted, setMounted] = useState(open)
   const [closing, setClosing] = useState(false)
 
@@ -53,6 +58,10 @@ export function PickStoreVariantModal({
 
   if (!mounted) return null
 
+  const subtitle = isFa
+    ? [productNameFa, productTitle].filter(Boolean).join(' / ')
+    : [productTitle, productNameFa].filter(Boolean).join(' / ')
+
   return createPortal(
     <div
       className={`${modalStyles.overlay} ${closing ? modalStyles.overlayOut : modalStyles.overlayIn}`}
@@ -64,22 +73,21 @@ export function PickStoreVariantModal({
         role="dialog"
         aria-modal="true"
         aria-labelledby="pick-variant-title"
+        lang={isFa ? 'fa' : 'en'}
+        dir={isFa ? 'rtl' : 'ltr'}
       >
         <div className={modalStyles.header}>
           <div>
             <h2 id="pick-variant-title" className={modalStyles.title}>
-              Choose variant
+              {t('storeItems.pick.title')}
             </h2>
-            <p className={modalStyles.subtitle}>
-              {productTitle}
-              {productNameFa ? ` / ${productNameFa}` : ''}
-            </p>
+            <p className={modalStyles.subtitle}>{subtitle}</p>
           </div>
           <button
             type="button"
             className={modalStyles.closeBtn}
             onClick={onClose}
-            aria-label="Close"
+            aria-label={t('common.close')}
           >
             <X size={18} />
           </button>
@@ -98,7 +106,7 @@ export function PickStoreVariantModal({
                     <span className={styles.optionLabel}>{variant.label}</span>
                     {variant.stockQuantity !== null && (
                       <span className={styles.optionStock}>
-                        {variant.stockQuantity} in stock
+                        {t('storeItems.pick.inStock', { count: variant.stockQuantity })}
                       </span>
                     )}
                   </div>
diff --git a/apps/business/src/components/PickWebsiteBrandsModal.tsx b/apps/business/src/components/PickWebsiteBrandsModal.tsx
index e59f018..8886785 100644
--- a/apps/business/src/components/PickWebsiteBrandsModal.tsx
+++ b/apps/business/src/components/PickWebsiteBrandsModal.tsx
@@ -1,6 +1,8 @@
 import { useEffect, useMemo, useState } from 'react'
 import { createPortal } from 'react-dom'
 import { X } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
+import { useT } from '../i18n/useT'
 import { ApiError } from '../lib/api'
 import { listAllBrands } from '../services/brandService'
 import {
@@ -29,6 +31,9 @@ export function PickWebsiteBrandsModal({
   onConfirm,
   isSubmitting = false,
 }: PickWebsiteBrandsModalProps) {
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
   const [mounted, setMounted] = useState(open)
   const [closing, setClosing] = useState(false)
   const [options, setOptions] = useState<StoreItemSearchOption[]>([])
@@ -92,7 +97,7 @@ export function PickWebsiteBrandsModal({
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load brands.')
+        setError(t('website.specialBrands.pickErrorLoad'))
       }
     } finally {
       setIsLoading(false)
@@ -110,6 +115,12 @@ export function PickWebsiteBrandsModal({
     onConfirm(selectedIds)
   }
 
+  function confirmLabel() {
+    if (isSubmitting) return t('website.adding')
+    if (selectedIds.length === 1) return t('website.pick.addOneBrand')
+    return t('website.pick.addBrands', { count: selectedIds.length })
+  }
+
   if (!mounted) return null
 
   return createPortal(
@@ -123,15 +134,22 @@ export function PickWebsiteBrandsModal({
         role="dialog"
         aria-modal="true"
         aria-labelledby="pick-brands-title"
+        lang={isFa ? 'fa' : 'en'}
+        dir={isFa ? 'rtl' : 'ltr'}
       >
         <div className={modalStyles.header}>
           <div>
             <h2 id="pick-brands-title" className={modalStyles.title}>
-              Add to {groupTitle}
+              {t('website.pick.addTo', { title: groupTitle })}
             </h2>
-            <p className={modalStyles.subtitle}>Select brands to feature in this group.</p>
+            <p className={modalStyles.subtitle}>{t('website.specialBrands.pickSubtitle')}</p>
           </div>
-          <button type="button" className={modalStyles.closeBtn} onClick={onClose} aria-label="Close">
+          <button
+            type="button"
+            className={modalStyles.closeBtn}
+            onClick={onClose}
+            aria-label={t('common.close')}
+          >
             <X size={20} />
           </button>
         </div>
@@ -140,22 +158,22 @@ export function PickWebsiteBrandsModal({
           {error && <p className={styles.error}>{error}</p>}
 
           {isLoading ? (
-            <p className={styles.empty}>Loading brands...</p>
+            <p className={styles.empty}>{t('website.specialBrands.pickLoading')}</p>
           ) : options.length === 0 ? (
-            <p className={styles.empty}>All brands are already in this group.</p>
+            <p className={styles.empty}>{t('website.specialBrands.pickEmpty')}</p>
           ) : (
             <StoreItemMultiSearchSelect
               options={options}
               selectedIds={selectedIds}
               onToggle={toggleSelection}
-              placeholder="Type 3+ characters to search brands"
+              placeholder={t('website.specialBrands.pickSearch')}
               disabled={isSubmitting}
             />
           )}
 
           <div className={styles.footer}>
             <button type="button" className={styles.cancelBtn} onClick={onClose} disabled={isSubmitting}>
-              Cancel
+              {t('products.form.cancel')}
             </button>
             <button
               type="button"
@@ -163,9 +181,7 @@ export function PickWebsiteBrandsModal({
               onClick={handleConfirm}
               disabled={isSubmitting || selectedIds.length === 0}
             >
-              {isSubmitting
-                ? 'Adding...'
-                : `Add ${selectedIds.length || ''} brand${selectedIds.length === 1 ? '' : 's'}`}
+              {confirmLabel()}
             </button>
           </div>
         </div>
diff --git a/apps/business/src/components/PickWebsiteCategoriesModal.tsx b/apps/business/src/components/PickWebsiteCategoriesModal.tsx
index 12ca1be..f07e839 100644
--- a/apps/business/src/components/PickWebsiteCategoriesModal.tsx
+++ b/apps/business/src/components/PickWebsiteCategoriesModal.tsx
@@ -1,6 +1,8 @@
 import { useEffect, useMemo, useState } from 'react'
 import { createPortal } from 'react-dom'
 import { X } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
+import { useT } from '../i18n/useT'
 import { ApiError } from '../lib/api'
 import { listProductCategories, mapProductCategoryToUi } from '../services/productCategoryService'
 import {
@@ -29,6 +31,9 @@ export function PickWebsiteCategoriesModal({
   onConfirm,
   isSubmitting = false,
 }: PickWebsiteCategoriesModalProps) {
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
   const [mounted, setMounted] = useState(open)
   const [closing, setClosing] = useState(false)
   const [options, setOptions] = useState<StoreItemSearchOption[]>([])
@@ -93,7 +98,7 @@ export function PickWebsiteCategoriesModal({
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load categories.')
+        setError(t('website.specialCategories.pickErrorLoad'))
       }
     } finally {
       setIsLoading(false)
@@ -111,6 +116,12 @@ export function PickWebsiteCategoriesModal({
     onConfirm(selectedIds)
   }
 
+  function confirmLabel() {
+    if (isSubmitting) return t('website.adding')
+    if (selectedIds.length === 1) return t('website.pick.addOneCategory')
+    return t('website.pick.addCategories', { count: selectedIds.length })
+  }
+
   if (!mounted) return null
 
   return createPortal(
@@ -124,15 +135,22 @@ export function PickWebsiteCategoriesModal({
         role="dialog"
         aria-modal="true"
         aria-labelledby="pick-categories-title"
+        lang={isFa ? 'fa' : 'en'}
+        dir={isFa ? 'rtl' : 'ltr'}
       >
         <div className={modalStyles.header}>
           <div>
             <h2 id="pick-categories-title" className={modalStyles.title}>
-              Add to {groupTitle}
+              {t('website.pick.addTo', { title: groupTitle })}
             </h2>
-            <p className={modalStyles.subtitle}>Select product categories to feature in this group.</p>
+            <p className={modalStyles.subtitle}>{t('website.specialCategories.pickSubtitle')}</p>
           </div>
-          <button type="button" className={modalStyles.closeBtn} onClick={onClose} aria-label="Close">
+          <button
+            type="button"
+            className={modalStyles.closeBtn}
+            onClick={onClose}
+            aria-label={t('common.close')}
+          >
             <X size={20} />
           </button>
         </div>
@@ -141,22 +159,22 @@ export function PickWebsiteCategoriesModal({
           {error && <p className={styles.error}>{error}</p>}
 
           {isLoading ? (
-            <p className={styles.empty}>Loading categories...</p>
+            <p className={styles.empty}>{t('website.specialCategories.pickLoading')}</p>
           ) : options.length === 0 ? (
-            <p className={styles.empty}>All categories are already in this group.</p>
+            <p className={styles.empty}>{t('website.specialCategories.pickEmpty')}</p>
           ) : (
             <StoreItemMultiSearchSelect
               options={options}
               selectedIds={selectedIds}
               onToggle={toggleSelection}
-              placeholder="Type 3+ characters to search categories"
+              placeholder={t('website.specialCategories.pickSearch')}
               disabled={isSubmitting}
             />
           )}
 
           <div className={styles.footer}>
             <button type="button" className={styles.cancelBtn} onClick={onClose} disabled={isSubmitting}>
-              Cancel
+              {t('products.form.cancel')}
             </button>
             <button
               type="button"
@@ -164,9 +182,7 @@ export function PickWebsiteCategoriesModal({
               onClick={handleConfirm}
               disabled={isSubmitting || selectedIds.length === 0}
             >
-              {isSubmitting
-                ? 'Adding...'
-                : `Add ${selectedIds.length || ''} categor${selectedIds.length === 1 ? 'y' : 'ies'}`}
+              {confirmLabel()}
             </button>
           </div>
         </div>
diff --git a/apps/business/src/components/PortfolioCard.module.css b/apps/business/src/components/PortfolioCard.module.css
index b3d4825..8046bbb 100644
--- a/apps/business/src/components/PortfolioCard.module.css
+++ b/apps/business/src/components/PortfolioCard.module.css
@@ -92,6 +92,10 @@
   overflow: hidden;
 }
 
+.titleEn[dir='rtl'] {
+  text-align: right;
+}
+
 .abstract {
   margin: 0;
   font-size: 13px;
diff --git a/apps/business/src/components/PortfolioCard.tsx b/apps/business/src/components/PortfolioCard.tsx
index d16d465..e113e73 100644
--- a/apps/business/src/components/PortfolioCard.tsx
+++ b/apps/business/src/components/PortfolioCard.tsx
@@ -1,7 +1,9 @@
 import { Link } from 'react-router-dom'
 import { ChevronUp, Pencil, MessageSquare, Trash2 } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
 import type { Portfolio } from '../types/portfolio'
 import { formatPortfolioCardDate } from '../services/portfolioService'
+import { useT } from '../i18n/useT'
 import { textLocaleAttrs } from '../utils/textLocale'
 import { Tooltip } from './Tooltip'
 import cardStyles from './PortfolioCard.module.css'
@@ -28,13 +30,21 @@ export function PortfolioCard({
   onComments,
   onRemove,
 }: PortfolioCardProps) {
-  const publishDate = formatPortfolioCardDate(portfolio.publishedAt ?? portfolio.createdAt)
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
+  const publishDate = formatPortfolioCardDate(
+    portfolio.publishedAt ?? portfolio.createdAt,
+    isFa ? 'fa' : 'en',
+  )
   const titleFa = (portfolio.titleFa || portfolio.title || '').trim()
   const titleEn = (portfolio.titleEn || '').trim()
   const showBothTitles = Boolean(titleFa && titleEn)
   const showAbstract = !showBothTitles
   const abstractLocale = textLocaleAttrs(portfolio.abstract)
   const hasAbstract = Boolean(portfolio.abstract?.trim())
+  // In FA UI, keep cards RTL even when EN titles/abstracts are shown.
+  const abstractDir = isFa ? 'rtl' : abstractLocale.dir
 
   return (
     <article className={cardStyles.card}>
@@ -52,14 +62,14 @@ export function PortfolioCard({
           )}
         </div>
 
-        <div className={cardStyles.body}>
+        <div className={cardStyles.body} dir={isFa ? 'rtl' : 'ltr'}>
           {titleFa ? (
             <h3 className={`${cardStyles.titleFa} faText`} lang="fa" dir="rtl">
               {titleFa}
             </h3>
           ) : null}
           {titleEn ? (
-            <p className={cardStyles.titleEn} lang="en" dir="ltr">
+            <p className={cardStyles.titleEn} lang="en" dir={isFa ? 'rtl' : 'ltr'}>
               {titleEn}
             </p>
           ) : null}
@@ -70,13 +80,17 @@ export function PortfolioCard({
                   .filter(Boolean)
                   .join(' ')}
                 lang={abstractLocale.lang}
-                dir={abstractLocale.dir}
+                dir={abstractDir}
               >
                 {portfolio.abstract}
               </p>
             ) : (
-              <p className={cardStyles.abstract} lang="en" dir="ltr">
-                No summary yet.
+              <p
+                className={cardStyles.abstract}
+                lang={isFa ? 'fa' : 'en'}
+                dir={isFa ? 'rtl' : 'ltr'}
+              >
+                {t('portfolio.card.noSummary')}
               </p>
             )
           ) : null}
@@ -93,27 +107,31 @@ export function PortfolioCard({
       </Link>
 
       <div className={controlStyles.controls}>
-        <Tooltip label="Move up">
+        <Tooltip label={t('portfolio.card.moveUp')}>
           <button
             type="button"
             onClick={() => onMoveUp(portfolio.id)}
             disabled={!canMoveUp || isMovingUp}
-            aria-label="Move up"
+            aria-label={t('portfolio.card.moveUp')}
           >
             <ChevronUp size={16} />
           </button>
         </Tooltip>
-        <Tooltip label="Edit portfolio">
-          <button type="button" onClick={() => onEdit(portfolio.id)} aria-label="Edit">
+        <Tooltip label={t('portfolio.card.edit')}>
+          <button
+            type="button"
+            onClick={() => onEdit(portfolio.id)}
+            aria-label={t('portfolio.card.edit')}
+          >
             <Pencil size={16} />
           </button>
         </Tooltip>
-        <Tooltip label="View comments">
+        <Tooltip label={t('portfolio.card.comments')}>
           <button
             type="button"
             className={controlStyles.iconBtn}
             onClick={() => onComments(portfolio.id)}
-            aria-label={`Comments (${commentCount})`}
+            aria-label={`${t('portfolio.card.comments')} (${commentCount})`}
           >
             <MessageSquare size={16} />
             {commentCount > 0 && (
@@ -121,12 +139,12 @@ export function PortfolioCard({
             )}
           </button>
         </Tooltip>
-        <Tooltip label="Remove portfolio">
+        <Tooltip label={t('portfolio.card.remove')}>
           <button
             type="button"
             className={controlStyles.danger}
             onClick={() => onRemove(portfolio.id)}
-            aria-label="Remove"
+            aria-label={t('portfolio.card.remove')}
           >
             <Trash2 size={16} />
           </button>
diff --git a/apps/business/src/components/PortfolioCommentsModal.tsx b/apps/business/src/components/PortfolioCommentsModal.tsx
index d088926..45af31b 100644
--- a/apps/business/src/components/PortfolioCommentsModal.tsx
+++ b/apps/business/src/components/PortfolioCommentsModal.tsx
@@ -1,6 +1,7 @@
 import { useEffect, useState } from 'react'
 import { createPortal } from 'react-dom'
 import { X, ThumbsUp, Check, XCircle, Trash2 } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
 import type { ProductComment } from '../types/comment'
 import { formatCommentDate } from '../data/productComments'
 import { ApiError } from '../lib/api'
@@ -30,6 +31,8 @@ export function PortfolioCommentsModal({
   onClose,
   onCountChange,
 }: PortfolioCommentsModalProps) {
+  const { locale } = useLocale()
+  const dateLocale = locale === 'fa' ? 'fa' : 'en'
   const [mounted, setMounted] = useState(open)
   const [closing, setClosing] = useState(false)
   const [comments, setComments] = useState<ProductComment[]>([])
@@ -200,7 +203,7 @@ export function PortfolioCommentsModal({
                       <div className={styles.commentMeta}>
                         <div className={styles.author}>{comment.author}</div>
                         <div className={styles.dateTime}>
-                          {formatCommentDate(comment.createdAt)}
+                          {formatCommentDate(comment.createdAt, dateLocale)}
                         </div>
                       </div>
                       <span className={styles.likes}>
diff --git a/apps/business/src/components/PortfolioCommentsSection.tsx b/apps/business/src/components/PortfolioCommentsSection.tsx
index 49990dd..f82656f 100644
--- a/apps/business/src/components/PortfolioCommentsSection.tsx
+++ b/apps/business/src/components/PortfolioCommentsSection.tsx
@@ -1,5 +1,6 @@
 import { useEffect, useState } from 'react'
 import { ThumbsUp, Check, XCircle, Trash2 } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
 import type { ProductComment } from '../types/comment'
 import { formatCommentDate } from '../data/productComments'
 import { ApiError } from '../lib/api'
@@ -21,6 +22,8 @@ export function PortfolioCommentsSection({
   portfolioId,
   onCountChange,
 }: PortfolioCommentsSectionProps) {
+  const { locale } = useLocale()
+  const dateLocale = locale === 'fa' ? 'fa' : 'en'
   const [comments, setComments] = useState<ProductComment[]>([])
   const [totalComments, setTotalComments] = useState(0)
   const [currentPage, setCurrentPage] = useState(1)
@@ -133,7 +136,9 @@ export function PortfolioCommentsSection({
                 <div className={styles.commentHeader}>
                   <div className={styles.commentMeta}>
                     <div className={styles.author}>{comment.author}</div>
-                    <div className={styles.dateTime}>{formatCommentDate(comment.createdAt)}</div>
+                    <div className={styles.dateTime}>
+                      {formatCommentDate(comment.createdAt, dateLocale)}
+                    </div>
                   </div>
                   <span className={styles.likes}>
                     <ThumbsUp size={13} />
diff --git a/apps/business/src/components/ProductCard.module.css b/apps/business/src/components/ProductCard.module.css
index 18e97fe..8bbc85e 100644
--- a/apps/business/src/components/ProductCard.module.css
+++ b/apps/business/src/components/ProductCard.module.css
@@ -24,7 +24,8 @@
   cursor: pointer;
 }
 
-.clickable:hover .nameEn {
+.clickable:hover .nameFa,
+.clickable:hover .nameEnPrimary {
   color: var(--primary);
 }
 
@@ -62,14 +63,48 @@
 .body {
   padding: 10px 10px 8px;
   flex: 1;
+  direction: rtl;
+  text-align: right;
 }
 
-.nameEn {
+.nameFa {
+  font-family: var(--font-ui);
   font-size: 13px;
   font-weight: 600;
   color: var(--text-primary);
   line-height: 1.3;
   margin-bottom: 3px;
+  direction: rtl;
+  text-align: right;
+  unicode-bidi: plaintext;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  transition: color 0.2s;
+}
+
+.nameEn {
+  font-size: 11px;
+  font-weight: 500;
+  color: var(--text-secondary);
+  line-height: 1.3;
+  margin-bottom: 6px;
+  direction: ltr;
+  text-align: right;
+  display: -webkit-box;
+  -webkit-line-clamp: 1;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+}
+
+.nameEnPrimary {
+  font-size: 13px;
+  font-weight: 600;
+  color: var(--text-primary);
+  line-height: 1.3;
+  margin-bottom: 3px;
+  direction: ltr;
   text-align: left;
   display: -webkit-box;
   -webkit-line-clamp: 2;
@@ -78,9 +113,9 @@
   transition: color 0.2s;
 }
 
-.nameFa {
+.nameFaSecondary {
   font-family: var(--font-ui);
-  font-size: 12px;
+  font-size: 11px;
   font-weight: 500;
   color: var(--text-secondary);
   direction: rtl;
@@ -96,11 +131,19 @@
 .categoryChip {
   display: inline-block;
   padding: 3px 10px;
+  font-family: var(--font-ui);
   font-size: 11px;
   font-weight: 500;
   color: var(--text-secondary);
   background: rgba(148, 163, 184, 0.15);
   border-radius: 50px;
+  direction: rtl;
+  unicode-bidi: plaintext;
+}
+
+.bodyLtr {
+  direction: ltr;
+  text-align: left;
 }
 
 .controls {
diff --git a/apps/business/src/components/ProductCard.tsx b/apps/business/src/components/ProductCard.tsx
index fb763db..28b4c38 100644
--- a/apps/business/src/components/ProductCard.tsx
+++ b/apps/business/src/components/ProductCard.tsx
@@ -1,6 +1,8 @@
 import { Link } from 'react-router-dom'
 import { Pencil, Info, Trash2, Layers, MessageSquare, ClipboardList } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
 import type { Product } from '../types/product'
+import { useT } from '../i18n/useT'
 import { Tooltip } from './Tooltip'
 import styles from './ProductCard.module.css'
 
@@ -27,49 +29,82 @@ export function ProductCard({
   onRemove,
   onVariations,
 }: ProductCardProps) {
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
+  const primaryName = isFa ? product.nameFa || product.nameEn : product.nameEn
+  const secondaryName = isFa
+    ? product.nameFa
+      ? product.nameEn
+      : ''
+    : product.nameFa
+  const categoryLabel = isFa ? product.categoryFa || product.category : product.category
+
   return (
     <article className={styles.card}>
       <Link to={`/products/detail/${product.id}`} className={styles.clickable}>
         <div className={styles.imageWrap}>
-          <img src={product.image} alt={product.nameEn} className={styles.image} loading="lazy" />
-          {product.status === 'draft' && <span className={styles.badge}>Draft</span>}
+          <img
+            src={product.image}
+            alt={primaryName}
+            className={styles.image}
+            loading="lazy"
+          />
+          {product.status === 'draft' && (
+            <span className={styles.badge}>{t('products.card.draft')}</span>
+          )}
         </div>
 
-        <div className={styles.body}>
-          <h3 className={styles.nameEn}>{product.nameEn}</h3>
-          <p className={styles.nameFa}>{product.nameFa}</p>
-          <span className={styles.categoryChip}>{product.category}</span>
+        <div className={`${styles.body}${isFa ? '' : ` ${styles.bodyLtr}`}`} dir={isFa ? 'rtl' : 'ltr'}>
+          {isFa ? (
+            <>
+              <h3 className={styles.nameFa}>{primaryName}</h3>
+              {secondaryName ? <p className={styles.nameEn}>{secondaryName}</p> : null}
+            </>
+          ) : (
+            <>
+              <h3 className={styles.nameEnPrimary}>{primaryName}</h3>
+              {secondaryName ? <p className={styles.nameFaSecondary}>{secondaryName}</p> : null}
+            </>
+          )}
+          {categoryLabel ? (
+            <span className={styles.categoryChip}>{categoryLabel}</span>
+          ) : null}
         </div>
       </Link>
 
       <div className={styles.controls}>
-        <Tooltip label="Edit product">
-          <button type="button" onClick={() => onEdit(product.id)} aria-label="Edit">
+        <Tooltip label={t('products.card.edit')}>
+          <button type="button" onClick={() => onEdit(product.id)} aria-label={t('products.card.edit')}>
             <Pencil size={16} />
           </button>
         </Tooltip>
-        <Tooltip label="Quick info">
-          <button type="button" onClick={() => onQuickInfo(product.id)} aria-label="Quick info">
+        <Tooltip label={t('products.card.quickInfo')}>
+          <button
+            type="button"
+            onClick={() => onQuickInfo(product.id)}
+            aria-label={t('products.card.quickInfo')}
+          >
             <Info size={16} />
           </button>
         </Tooltip>
-        <Tooltip label="Manage variations">
+        <Tooltip label={t('products.card.variations')}>
           <button
             type="button"
             className={styles.iconBtn}
             onClick={() => onVariations(product.id)}
-            aria-label={`Variations (${variantCount})`}
+            aria-label={`${t('products.card.variations')} (${variantCount})`}
           >
             <Layers size={16} />
             {variantCount > 0 && <span className={styles.variantBadge}>{variantCount}</span>}
           </button>
         </Tooltip>
-        <Tooltip label="View comments">
+        <Tooltip label={t('products.card.comments')}>
           <button
             type="button"
             className={styles.iconBtn}
             onClick={() => onComments(product.id)}
-            aria-label={`Comments (${commentCount})`}
+            aria-label={`${t('products.card.comments')} (${commentCount})`}
           >
             <MessageSquare size={16} />
             {commentCount > 0 && (
@@ -77,21 +112,21 @@ export function ProductCard({
             )}
           </button>
         </Tooltip>
-        <Tooltip label="Technical data">
+        <Tooltip label={t('products.card.technical')}>
           <button
             type="button"
             onClick={() => onTechnicalInfo(product.id)}
-            aria-label="Technical data"
+            aria-label={t('products.card.technical')}
           >
             <ClipboardList size={16} />
           </button>
         </Tooltip>
-        <Tooltip label="Remove product">
+        <Tooltip label={t('products.card.remove')}>
           <button
             type="button"
             className={styles.danger}
             onClick={() => onRemove(product.id)}
-            aria-label="Remove"
+            aria-label={t('products.card.remove')}
           >
             <Trash2 size={16} />
           </button>
diff --git a/apps/business/src/components/ProductCommentsModal.tsx b/apps/business/src/components/ProductCommentsModal.tsx
index 59ff09f..68e5f58 100644
--- a/apps/business/src/components/ProductCommentsModal.tsx
+++ b/apps/business/src/components/ProductCommentsModal.tsx
@@ -1,6 +1,7 @@
 import { useEffect, useState } from 'react'
 import { createPortal } from 'react-dom'
 import { X, ThumbsUp, Check, XCircle, Trash2 } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
 import type { ProductComment } from '../types/comment'
 import { formatCommentDate } from '../data/productComments'
 import { ApiError } from '../lib/api'
@@ -30,6 +31,8 @@ export function ProductCommentsModal({
   onClose,
   onCountChange,
 }: ProductCommentsModalProps) {
+  const { locale } = useLocale()
+  const dateLocale = locale === 'fa' ? 'fa' : 'en'
   const [mounted, setMounted] = useState(open)
   const [closing, setClosing] = useState(false)
   const [comments, setComments] = useState<ProductComment[]>([])
@@ -200,7 +203,7 @@ export function ProductCommentsModal({
                       <div className={styles.commentMeta}>
                         <div className={styles.author}>{comment.author}</div>
                         <div className={styles.dateTime}>
-                          {formatCommentDate(comment.createdAt)}
+                          {formatCommentDate(comment.createdAt, dateLocale)}
                         </div>
                       </div>
                       <span className={styles.likes}>
diff --git a/apps/business/src/components/ProductDetailsTabs.tsx b/apps/business/src/components/ProductDetailsTabs.tsx
index e3b8d07..bf6ed9b 100644
--- a/apps/business/src/components/ProductDetailsTabs.tsx
+++ b/apps/business/src/components/ProductDetailsTabs.tsx
@@ -1,5 +1,6 @@
 import { useEffect, useState } from 'react'
 import { Check, Star, ThumbsUp, Trash2, XCircle } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
 import { formatCommentDate } from '../data/productComments'
 import { ApiError } from '../lib/api'
 import {
@@ -38,6 +39,8 @@ function formatTechnicalValue(item: ProductTechnicalValue): string {
 }
 
 export function ProductDetailsTabs({ productId, commentCount }: ProductDetailsTabsProps) {
+  const { locale } = useLocale()
+  const dateLocale = locale === 'fa' ? 'fa' : 'en'
   const [activeTab, setActiveTab] = useState<DetailTab>('technical')
   const [technicalValues, setTechnicalValues] = useState<ProductTechnicalValue[]>([])
   const [technicalMessage, setTechnicalMessage] = useState('')
@@ -296,7 +299,9 @@ export function ProductDetailsTabs({ productId, commentCount }: ProductDetailsTa
                     <div className={styles.commentHeader}>
                       <div>
                         <div className={styles.author}>{comment.author}</div>
-                        <div className={styles.meta}>{formatCommentDate(comment.createdAt)}</div>
+                        <div className={styles.meta}>
+                          {formatCommentDate(comment.createdAt, dateLocale)}
+                        </div>
                       </div>
                       <span className={styles.likes}>
                         <ThumbsUp size={13} />
@@ -363,7 +368,9 @@ export function ProductDetailsTabs({ productId, commentCount }: ProductDetailsTa
                     <div className={styles.reviewHeader}>
                       <div>
                         <div className={styles.reviewTitle}>{review.authorName}</div>
-                        <div className={styles.meta}>{formatReviewDate(review.createdAt)}</div>
+                        <div className={styles.meta}>
+                          {formatReviewDate(review.createdAt, dateLocale)}
+                        </div>
                       </div>
                       <div className={styles.rating} aria-label={`Rating ${review.rate} out of 10`}>
                         <Star size={14} fill="currentColor" />
diff --git a/apps/business/src/components/ProductSearchSelect.tsx b/apps/business/src/components/ProductSearchSelect.tsx
index fee9c11..99c2802 100644
--- a/apps/business/src/components/ProductSearchSelect.tsx
+++ b/apps/business/src/components/ProductSearchSelect.tsx
@@ -1,5 +1,7 @@
 import { useEffect, useMemo, useRef, useState } from 'react'
 import { ChevronDown, Search, X } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
+import { useT } from '../i18n/useT'
 import styles from './SearchableSelect.module.css'
 
 export interface ProductSearchOption {
@@ -16,6 +18,14 @@ interface ProductSearchSelectProps {
   disabled?: boolean
   id?: string
   minSearchLength?: number
+  'aria-label'?: string
+}
+
+function formatProductLabel(option: ProductSearchOption, preferFa: boolean) {
+  if (preferFa && option.nameFa) {
+    return option.title ? `${option.nameFa} / ${option.title}` : option.nameFa
+  }
+  return option.nameFa ? `${option.title} / ${option.nameFa}` : option.title
 }
 
 export function ProductSearchSelect({
@@ -26,13 +36,18 @@ export function ProductSearchSelect({
   disabled = false,
   id,
   minSearchLength = 3,
+  'aria-label': ariaLabel,
 }: ProductSearchSelectProps) {
+  const t = useT()
+  const { locale } = useLocale()
+  const preferFa = locale === 'fa'
   const [open, setOpen] = useState(false)
   const [query, setQuery] = useState('')
   const containerRef = useRef<HTMLDivElement>(null)
   const inputRef = useRef<HTMLInputElement>(null)
 
   const selected = options.find((option) => option.id === value)
+  const selectedLabel = selected ? formatProductLabel(selected, preferFa) : ''
 
   const filtered = useMemo(() => {
     const trimmed = query.trim()
@@ -70,7 +85,7 @@ export function ProductSearchSelect({
   const showDropdown = open && query.trim().length >= minSearchLength
 
   return (
-    <div className={styles.wrapper} ref={containerRef}>
+    <div className={styles.wrapper} ref={containerRef} dir={preferFa ? 'rtl' : 'ltr'}>
       <div className={`${styles.inputWrap} ${open ? styles.inputWrapOpen : ''}`}>
         <Search size={16} className={styles.searchIcon} />
         <input
@@ -78,12 +93,8 @@ export function ProductSearchSelect({
           id={id}
           type="text"
           className={styles.input}
-          placeholder={
-            selected
-              ? `${selected.title}${selected.nameFa ? ` / ${selected.nameFa}` : ''}`
-              : placeholder
-          }
-          value={open ? query : selected ? `${selected.title}${selected.nameFa ? ` / ${selected.nameFa}` : ''}` : ''}
+          placeholder={selected ? selectedLabel : placeholder}
+          value={open ? query : selectedLabel}
           onChange={(e) => {
             setQuery(e.target.value)
             if (!open) setOpen(true)
@@ -91,13 +102,15 @@ export function ProductSearchSelect({
           }}
           onFocus={handleFocus}
           disabled={disabled}
+          aria-label={ariaLabel ?? placeholder}
+          dir={preferFa ? 'rtl' : 'ltr'}
         />
         {value && !open && (
           <button
             type="button"
             className={styles.clearBtn}
             onClick={() => onChange('')}
-            aria-label="Clear selection"
+            aria-label={t('storeItems.search.clear')}
           >
             <X size={14} />
           </button>
@@ -106,10 +119,12 @@ export function ProductSearchSelect({
       </div>
 
       {showDropdown && (
-        <ul className={styles.dropdown} role="listbox">
+        <ul className={`${styles.dropdown} ${styles.dropdownInFlow}`} role="listbox">
           {filtered.length === 0 ? (
             <li className={styles.noResults}>
-              {options.length === 0 ? 'No products available.' : 'No matching products.'}
+              {options.length === 0
+                ? t('storeItems.search.noProducts')
+                : t('storeItems.search.noMatch')}
             </li>
           ) : (
             filtered.map((option) => (
@@ -121,11 +136,33 @@ export function ProductSearchSelect({
                   className={`${styles.option} ${option.id === value ? styles.optionSelected : ''}`}
                   onClick={() => selectOption(option.id)}
                 >
-                  <span className={styles.optionEn}>{option.title}</span>
-                  {option.nameFa && (
+                  {preferFa && option.nameFa ? (
                     <>
-                      <span className={styles.optionSep}>/</span>
-                      <span className={styles.optionFa}>{option.nameFa}</span>
+                      <span className={styles.optionFa} dir="rtl">
+                        {option.nameFa}
+                      </span>
+                      {option.title && (
+                        <>
+                          <span className={styles.optionSep}>/</span>
+                          <span className={styles.optionEn} dir="rtl">
+                            {option.title}
+                          </span>
+                        </>
+                      )}
+                    </>
+                  ) : (
+                    <>
+                      <span className={styles.optionEn} dir={preferFa ? 'rtl' : 'ltr'}>
+                        {option.title}
+                      </span>
+                      {option.nameFa && (
+                        <>
+                          <span className={styles.optionSep}>/</span>
+                          <span className={styles.optionFa} dir="rtl">
+                            {option.nameFa}
+                          </span>
+                        </>
+                      )}
                     </>
                   )}
                 </button>
@@ -136,8 +173,10 @@ export function ProductSearchSelect({
       )}
 
       {open && query.trim().length > 0 && query.trim().length < minSearchLength && (
-        <ul className={styles.dropdown}>
-          <li className={styles.noResults}>Type at least {minSearchLength} characters to search</li>
+        <ul className={`${styles.dropdown} ${styles.dropdownInFlow}`}>
+          <li className={styles.noResults}>
+            {t('storeItems.search.minChars', { count: minSearchLength })}
+          </li>
         </ul>
       )}
     </div>
diff --git a/apps/business/src/components/SearchableSelect.module.css b/apps/business/src/components/SearchableSelect.module.css
index 0413447..68f0379 100644
--- a/apps/business/src/components/SearchableSelect.module.css
+++ b/apps/business/src/components/SearchableSelect.module.css
@@ -87,6 +87,17 @@
   animation: dropdownIn 0.15s ease;
 }
 
+/* Prefer for selects inside overflow-clipped modals — expands parent instead of clipping. */
+.dropdownInFlow {
+  position: static;
+  top: auto;
+  left: auto;
+  right: auto;
+  max-height: min(50vh, 400px);
+  margin-top: 6px;
+  z-index: auto;
+}
+
 @keyframes dropdownIn {
   from {
     opacity: 0;
@@ -105,7 +116,7 @@
   width: 100%;
   padding: 7px 10px;
   font-size: var(--field-font-size);
-  text-align: left;
+  text-align: start;
   color: var(--text-primary);
   border-radius: 8px;
   transition: background 0.15s;
@@ -123,6 +134,11 @@
 
 .optionEn {
   font-weight: 500;
+  text-align: start;
+}
+
+.optionEn[dir='rtl'] {
+  text-align: right;
 }
 
 .optionSep {
@@ -133,6 +149,7 @@
   font-family: var(--font-ui);
   font-weight: 500;
   direction: rtl;
+  text-align: right;
 }
 
 .noResults {
diff --git a/apps/business/src/components/SearchableSelect.tsx b/apps/business/src/components/SearchableSelect.tsx
index 0ddc092..9e77a7f 100644
--- a/apps/business/src/components/SearchableSelect.tsx
+++ b/apps/business/src/components/SearchableSelect.tsx
@@ -1,5 +1,7 @@
 import { useEffect, useRef, useState } from 'react'
 import { ChevronDown, Search, X } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
+import { useT } from '../i18n/useT'
 import type { FlatCategory } from '../types/category'
 import styles from './SearchableSelect.module.css'
 
@@ -10,18 +12,34 @@ interface SearchableSelectProps {
   placeholder?: string
 }
 
+function categoryLabel(cat: FlatCategory, isFa: boolean) {
+  if (isFa) {
+    return cat.nameFa
+      ? `${cat.nameFa}${cat.nameEn ? ` / ${cat.nameEn}` : ''}`
+      : cat.nameEn
+  }
+  return cat.nameEn
+    ? `${cat.nameEn}${cat.nameFa ? ` / ${cat.nameFa}` : ''}`
+    : cat.nameFa
+}
+
 export function SearchableSelect({
   options,
   value,
   onChange,
-  placeholder = 'Search categories...',
+  placeholder,
 }: SearchableSelectProps) {
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
   const [open, setOpen] = useState(false)
   const [query, setQuery] = useState('')
   const containerRef = useRef<HTMLDivElement>(null)
   const inputRef = useRef<HTMLInputElement>(null)
 
   const selected = options.find((o) => o.id === value)
+  const selectedLabel = selected ? categoryLabel(selected, isFa) : ''
+  const searchPlaceholder = placeholder ?? t('categories.select.search')
 
   const filtered = options.filter((cat) => {
     const q = query.trim().toLowerCase()
@@ -55,27 +73,28 @@ export function SearchableSelect({
   }
 
   return (
-    <div className={styles.wrapper} ref={containerRef}>
+    <div className={styles.wrapper} ref={containerRef} dir={isFa ? 'rtl' : 'ltr'}>
       <div className={`${styles.inputWrap} ${open ? styles.inputWrapOpen : ''}`}>
         <Search size={16} className={styles.searchIcon} />
         <input
           ref={inputRef}
           type="text"
           className={styles.input}
-          placeholder={selected ? `${selected.nameEn} / ${selected.nameFa}` : placeholder}
-          value={open ? query : selected ? `${selected.nameEn} / ${selected.nameFa}` : ''}
+          placeholder={selected ? selectedLabel : searchPlaceholder}
+          value={open ? query : selectedLabel}
           onChange={(e) => {
             setQuery(e.target.value)
             if (!open) setOpen(true)
           }}
           onFocus={handleFocus}
+          dir={isFa ? 'rtl' : 'ltr'}
         />
         {value && !open && (
           <button
             type="button"
             className={styles.clearBtn}
             onClick={() => onChange('')}
-            aria-label="Clear selection"
+            aria-label={t('categories.select.clear')}
           >
             <X size={14} />
           </button>
@@ -91,23 +110,41 @@ export function SearchableSelect({
               className={`${styles.option} ${value === '' ? styles.optionSelected : ''}`}
               onClick={() => selectOption('')}
             >
-              — None (root category) —
+              {t('categories.select.none')}
             </button>
           </li>
           {filtered.length === 0 ? (
-            <li className={styles.noResults}>No categories found</li>
+            <li className={styles.noResults}>{t('categories.select.empty')}</li>
           ) : (
             filtered.map((cat) => (
               <li key={cat.id}>
                 <button
                   type="button"
                   className={`${styles.option} ${value === cat.id ? styles.optionSelected : ''}`}
-                  style={{ paddingLeft: `${14 + cat.depth * 16}px` }}
+                  style={{ paddingInlineStart: `${14 + cat.depth * 16}px` }}
                   onClick={() => selectOption(cat.id)}
                 >
-                  <span className={styles.optionEn}>{cat.nameEn}</span>
-                  <span className={styles.optionSep}>·</span>
-                  <span className={styles.optionFa}>{cat.nameFa}</span>
+                  {isFa ? (
+                    <>
+                      <span className={styles.optionFa}>{cat.nameFa}</span>
+                      {cat.nameEn ? (
+                        <>
+                          <span className={styles.optionSep}>·</span>
+                          <span className={styles.optionEn}>{cat.nameEn}</span>
+                        </>
+                      ) : null}
+                    </>
+                  ) : (
+                    <>
+                      <span className={styles.optionEn}>{cat.nameEn}</span>
+                      {cat.nameFa ? (
+                        <>
+                          <span className={styles.optionSep}>·</span>
+                          <span className={styles.optionFa}>{cat.nameFa}</span>
+                        </>
+                      ) : null}
+                    </>
+                  )}
                 </button>
               </li>
             ))
diff --git a/apps/business/src/components/Sidebar.tsx b/apps/business/src/components/Sidebar.tsx
index e4daf2d..1919872 100644
--- a/apps/business/src/components/Sidebar.tsx
+++ b/apps/business/src/components/Sidebar.tsx
@@ -201,15 +201,18 @@ export function Sidebar() {
   }, [])
 
   useEffect(() => {
-    navItems.forEach((item) => {
-      if (item.type === 'group' && isGroupActive(item.basePath, pathname)) {
-        setOpenGroups((prev) => ({ ...prev, [item.id]: true }))
-      }
-    })
+    const activeGroup = navItems.find(
+      (item) => item.type === 'group' && isGroupActive(item.basePath, pathname),
+    )
+    if (!activeGroup || activeGroup.type !== 'group') return
+    setOpenGroups({ [activeGroup.id]: true })
   }, [pathname, navItems])
 
   function toggleGroup(id: string) {
-    setOpenGroups((prev) => ({ ...prev, [id]: !prev[id] }))
+    setOpenGroups((prev) => {
+      const willOpen = !prev[id]
+      return willOpen ? { [id]: true } : {}
+    })
   }
 
   return (
diff --git a/apps/business/src/components/StoreItemCard.module.css b/apps/business/src/components/StoreItemCard.module.css
index ac3e001..1b59bf6 100644
--- a/apps/business/src/components/StoreItemCard.module.css
+++ b/apps/business/src/components/StoreItemCard.module.css
@@ -24,11 +24,12 @@
   background: transparent;
   border: none;
   padding: 0;
-  text-align: left;
+  text-align: start;
   cursor: pointer;
 }
 
-.clickable:hover .nameEn {
+.clickable:hover .nameEnPrimary,
+.clickable:hover .nameFa {
   color: var(--primary);
 }
 
@@ -72,35 +73,75 @@
 }
 
 .festivalBadge {
-  left: 8px;
+  inset-inline-start: 8px;
   text-transform: uppercase;
   color: #7c3aed;
 }
 
 .stockBadge {
-  right: 8px;
+  inset-inline-end: 8px;
   color: var(--primary);
 }
 
 .body {
   padding: 10px 10px 8px;
   flex: 1;
+  direction: rtl;
+  text-align: right;
 }
 
-.nameEn {
+.bodyLtr {
+  direction: ltr;
+  text-align: left;
+}
+
+.nameFa {
+  font-family: var(--font-ui);
   font-size: 13px;
   font-weight: 600;
   color: var(--text-primary);
   line-height: 1.3;
   margin-bottom: 3px;
+  direction: rtl;
+  text-align: right;
+  unicode-bidi: plaintext;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  transition: color 0.2s;
+}
+
+.nameEn {
+  font-size: 11px;
+  font-weight: 500;
+  color: var(--text-secondary);
+  line-height: 1.3;
+  margin-bottom: 4px;
+  direction: ltr;
+  text-align: right;
+  display: -webkit-box;
+  -webkit-line-clamp: 1;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+}
+
+.nameEnPrimary {
+  font-size: 13px;
+  font-weight: 600;
+  color: var(--text-primary);
+  line-height: 1.3;
+  margin-bottom: 3px;
+  direction: ltr;
   text-align: left;
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
   overflow: hidden;
+  transition: color 0.2s;
 }
 
-.nameFa {
+.nameFaSecondary {
   font-family: var(--font-ui);
   font-size: 12px;
   font-weight: 500;
@@ -173,7 +214,6 @@
   color: #ef4444;
 }
 
-
 .addToCartIcon {
   display: block;
   flex-shrink: 0;
diff --git a/apps/business/src/components/StoreItemCard.tsx b/apps/business/src/components/StoreItemCard.tsx
index 07bf076..06cab06 100644
--- a/apps/business/src/components/StoreItemCard.tsx
+++ b/apps/business/src/components/StoreItemCard.tsx
@@ -1,5 +1,7 @@
 import { useId } from 'react'
 import { Pencil, Percent, Sparkles, Trash2 } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
+import { useT } from '../i18n/useT'
 import {
   formatVariantCount,
   type StoreProductListing,
@@ -63,9 +65,21 @@ export function StoreItemCard({
   onFestival,
   onRemove,
   onAddToCart,
-  removeTooltip = 'Remove from store',
+  removeTooltip,
 }: StoreItemCardProps) {
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
   const plusGradientId = `add-cart-gradient-${useId().replace(/:/g, '')}`
+  const removeLabel = removeTooltip ?? t('storeItems.card.remove')
+  const primaryName = isFa
+    ? listing.productNameFa || listing.productTitle
+    : listing.productTitle
+  const secondaryName = isFa
+    ? listing.productNameFa
+      ? listing.productTitle
+      : ''
+    : listing.productNameFa
 
   return (
     <article className={styles.card}>
@@ -74,23 +88,43 @@ export function StoreItemCard({
           {listing.productImage ? (
             <img
               src={listing.productImage}
-              alt={listing.productTitle}
+              alt={primaryName}
               className={styles.image}
               loading="lazy"
             />
           ) : (
             <div className={styles.imagePlaceholder} />
           )}
-          {listing.showFestival && <span className={styles.festivalBadge}>Festival</span>}
+          {listing.showFestival && (
+            <span className={styles.festivalBadge}>{t('storeItems.card.festival')}</span>
+          )}
           {listing.productTotalStock > 0 && (
-            <span className={styles.stockBadge}>{listing.productTotalStock} in stock</span>
+            <span className={styles.stockBadge}>
+              {t('storeItems.card.inStock', { count: listing.productTotalStock })}
+            </span>
           )}
         </div>
 
-        <div className={styles.body}>
-          <h3 className={styles.nameEn}>{listing.productTitle}</h3>
-          {listing.productNameFa && <p className={styles.nameFa}>{listing.productNameFa}</p>}
-          <p className={styles.variantLabel}>{formatVariantCount(listing.variantCount)}</p>
+        <div
+          className={`${styles.body}${isFa ? '' : ` ${styles.bodyLtr}`}`}
+          dir={isFa ? 'rtl' : 'ltr'}
+        >
+          {isFa ? (
+            <>
+              <h3 className={styles.nameFa}>{primaryName}</h3>
+              {secondaryName ? <p className={styles.nameEn}>{secondaryName}</p> : null}
+            </>
+          ) : (
+            <>
+              <h3 className={styles.nameEnPrimary}>{primaryName}</h3>
+              {secondaryName ? (
+                <p className={styles.nameFaSecondary}>{secondaryName}</p>
+              ) : null}
+            </>
+          )}
+          <p className={styles.variantLabel}>
+            {formatVariantCount(listing.variantCount, locale)}
+          </p>
           <StoreItemPrice
             price={listing.displayPrice}
             discountedPrice={listing.displayDiscountedPrice}
@@ -100,44 +134,52 @@ export function StoreItemCard({
 
       <div className={styles.controls} onClick={(e) => e.stopPropagation()}>
         <div className={styles.controlsLeft}>
-          <Tooltip label="Edit store items">
-            <button type="button" onClick={() => onEdit(listing)} aria-label="Edit store items">
+          <Tooltip label={t('storeItems.card.edit')}>
+            <button
+              type="button"
+              onClick={() => onEdit(listing)}
+              aria-label={t('storeItems.card.edit')}
+            >
               <Pencil size={16} />
             </button>
           </Tooltip>
-          <Tooltip label="Set discounts">
-            <button type="button" onClick={() => onDiscount(listing)} aria-label="Set discounts">
+          <Tooltip label={t('storeItems.card.discount')}>
+            <button
+              type="button"
+              onClick={() => onDiscount(listing)}
+              aria-label={t('storeItems.card.discount')}
+            >
               <Percent size={16} />
             </button>
           </Tooltip>
-          <Tooltip label="Festival reward points">
+          <Tooltip label={t('storeItems.card.festivalPoints')}>
             <button
               type="button"
               className={listing.showFestival ? styles.festivalActive : undefined}
               onClick={() => onFestival(listing)}
-              aria-label="Festival reward points"
+              aria-label={t('storeItems.card.festivalPoints')}
             >
               <Sparkles size={16} />
             </button>
           </Tooltip>
-          <Tooltip label={removeTooltip}>
+          <Tooltip label={removeLabel}>
             <button
               type="button"
               className={styles.danger}
               onClick={() => onRemove(listing)}
-              aria-label={removeTooltip}
+              aria-label={removeLabel}
             >
               <Trash2 size={16} />
             </button>
           </Tooltip>
         </div>
 
-        <Tooltip label="Add to shopping cart">
+        <Tooltip label={t('storeItems.card.addToCart')}>
           <button
             type="button"
             className={styles.addToCartBtn}
             onClick={() => onAddToCart(listing)}
-            aria-label="Add to shopping cart"
+            aria-label={t('storeItems.card.addToCart')}
           >
             <GradientPlusIcon gradientId={plusGradientId} />
           </button>
diff --git a/apps/business/src/components/StoreItemMultiSearchSelect.module.css b/apps/business/src/components/StoreItemMultiSearchSelect.module.css
index 647bd0b..87772ab 100644
--- a/apps/business/src/components/StoreItemMultiSearchSelect.module.css
+++ b/apps/business/src/components/StoreItemMultiSearchSelect.module.css
@@ -15,7 +15,7 @@
   width: 100%;
   padding: 8px 10px;
   font-size: var(--field-font-size);
-  text-align: left;
+  text-align: start;
   color: var(--text-primary);
   border-radius: 8px;
   transition: background 0.15s;
@@ -87,6 +87,7 @@
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
+  text-align: start;
 }
 
 .optionFa {
@@ -95,6 +96,19 @@
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
+  text-align: start;
+}
+
+.optionMeta .optionFa:first-child {
+  font-size: inherit;
+  font-weight: 500;
+  color: var(--text-primary);
+}
+
+.optionMeta .optionEn:not(:first-child) {
+  font-size: 12px;
+  font-weight: 500;
+  color: var(--text-secondary);
 }
 
 .selectedList {
diff --git a/apps/business/src/components/StoreItemMultiSearchSelect.tsx b/apps/business/src/components/StoreItemMultiSearchSelect.tsx
index 674de93..c62e22f 100644
--- a/apps/business/src/components/StoreItemMultiSearchSelect.tsx
+++ b/apps/business/src/components/StoreItemMultiSearchSelect.tsx
@@ -1,5 +1,7 @@
 import { useEffect, useMemo, useRef, useState } from 'react'
 import { Search, X } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
+import { useT } from '../i18n/useT'
 import selectStyles from './SearchableSelect.module.css'
 import styles from './StoreItemMultiSearchSelect.module.css'
 
@@ -23,16 +25,20 @@ export function StoreItemMultiSearchSelect({
   options,
   selectedIds,
   onToggle,
-  placeholder = 'Type 3+ characters to search store items',
+  placeholder,
   disabled = false,
   minSearchLength = 3,
 }: StoreItemMultiSearchSelectProps) {
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
   const [open, setOpen] = useState(false)
   const [query, setQuery] = useState('')
   const containerRef = useRef<HTMLDivElement>(null)
   const inputRef = useRef<HTMLInputElement>(null)
 
   const selectedSet = useMemo(() => new Set(selectedIds), [selectedIds])
+  const searchPlaceholder = placeholder ?? t('storeItems.search.minChars', { count: minSearchLength })
 
   const filtered = useMemo(() => {
     const trimmed = query.trim()
@@ -65,10 +71,40 @@ export function StoreItemMultiSearchSelect({
     if (!disabled) setOpen(true)
   }
 
+  function renderOptionMeta(option: StoreItemSearchOption) {
+    const primary = isFa ? option.nameFa || option.title : option.title
+    const secondary = isFa
+      ? option.nameFa
+        ? option.title
+        : ''
+      : option.nameFa
+
+    return (
+      <span className={styles.optionMeta}>
+        <span
+          className={isFa && option.nameFa ? styles.optionFa : styles.optionEn}
+          lang={isFa && option.nameFa ? 'fa' : 'en'}
+          dir={isFa ? 'rtl' : 'ltr'}
+        >
+          {primary}
+        </span>
+        {secondary ? (
+          <span
+            className={isFa ? styles.optionEn : `${styles.optionFa} faText`}
+            lang={isFa ? 'en' : 'fa'}
+            dir="rtl"
+          >
+            {secondary}
+          </span>
+        ) : null}
+      </span>
+    )
+  }
+
   const showDropdown = open && query.trim().length >= minSearchLength
 
   return (
-    <div className={styles.wrapper}>
+    <div className={styles.wrapper} dir={isFa ? 'rtl' : 'ltr'}>
       <div className={selectStyles.wrapper} ref={containerRef}>
         <div className={`${selectStyles.inputWrap} ${open ? selectStyles.inputWrapOpen : ''}`}>
           <Search size={16} className={selectStyles.searchIcon} />
@@ -76,7 +112,7 @@ export function StoreItemMultiSearchSelect({
             ref={inputRef}
             type="text"
             className={selectStyles.input}
-            placeholder={placeholder}
+            placeholder={searchPlaceholder}
             value={query}
             onChange={(e) => {
               setQuery(e.target.value)
@@ -84,6 +120,7 @@ export function StoreItemMultiSearchSelect({
             }}
             onFocus={handleFocus}
             disabled={disabled}
+            dir={isFa ? 'rtl' : 'ltr'}
           />
         </div>
 
@@ -91,7 +128,9 @@ export function StoreItemMultiSearchSelect({
           <ul className={`${selectStyles.dropdown} ${styles.dropdown}`} role="listbox">
             {filtered.length === 0 ? (
               <li className={selectStyles.noResults}>
-                {options.length === 0 ? 'No store items available.' : 'No matching store items.'}
+                {options.length === 0
+                  ? t('storeItems.search.noProducts')
+                  : t('storeItems.search.noMatch')}
               </li>
             ) : (
               filtered.map((option) => {
@@ -115,10 +154,7 @@ export function StoreItemMultiSearchSelect({
                           <span className={styles.thumbPlaceholder} />
                         )}
                       </span>
-                      <span className={styles.optionMeta}>
-                        <span className={styles.optionEn}>{option.title}</span>
-                        {option.nameFa && <span className={`${styles.optionFa} faText`}>{option.nameFa}</span>}
-                      </span>
+                      {renderOptionMeta(option)}
                     </button>
                   </li>
                 )
@@ -130,7 +166,7 @@ export function StoreItemMultiSearchSelect({
         {open && query.trim().length > 0 && query.trim().length < minSearchLength && (
           <ul className={selectStyles.dropdown}>
             <li className={selectStyles.noResults}>
-              Type at least {minSearchLength} characters to search
+              {t('storeItems.search.minChars', { count: minSearchLength })}
             </li>
           </ul>
         )}
@@ -147,15 +183,12 @@ export function StoreItemMultiSearchSelect({
                   <span className={styles.thumbPlaceholder} />
                 )}
               </span>
-              <div className={styles.optionMeta}>
-                <span className={styles.optionEn}>{option.title}</span>
-                {option.nameFa && <span className={`${styles.optionFa} faText`}>{option.nameFa}</span>}
-              </div>
+              {renderOptionMeta(option)}
               <button
                 type="button"
                 className={styles.removeSelectedBtn}
                 onClick={() => onToggle(option.id)}
-                aria-label={`Remove ${option.title}`}
+                aria-label={t('storeItems.search.clear')}
               >
                 <X size={14} />
               </button>
diff --git a/apps/business/src/components/StoreSpecialCarousel.module.css b/apps/business/src/components/StoreSpecialCarousel.module.css
index 0dd6cf9..6e8749e 100644
--- a/apps/business/src/components/StoreSpecialCarousel.module.css
+++ b/apps/business/src/components/StoreSpecialCarousel.module.css
@@ -22,6 +22,12 @@
   gap: 4px;
 }
 
+.navPair {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+}
+
 .navBtn {
   width: 32px;
   height: 32px;
diff --git a/apps/business/src/components/StoreSpecialCarousel.tsx b/apps/business/src/components/StoreSpecialCarousel.tsx
index 1f52125..fb41b6b 100644
--- a/apps/business/src/components/StoreSpecialCarousel.tsx
+++ b/apps/business/src/components/StoreSpecialCarousel.tsx
@@ -1,5 +1,7 @@
 import { ChevronLeft, ChevronRight, Pencil, Plus, Trash2 } from 'lucide-react'
 import { useRef } from 'react'
+import { useLocale } from '@meshkee/dashboard-ui'
+import { useT } from '../i18n/useT'
 import type { StoreSpecial } from '../types/storeSpecial'
 import { specialItemsToListings } from '../utils/storeSpecialListings'
 import type { StoreProductListing } from '../utils/storeProductGroups'
@@ -33,6 +35,9 @@ export function StoreSpecialCarousel({
   onRemoveListing,
   onAddToCart,
 }: StoreSpecialCarouselProps) {
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
   const trackRef = useRef<HTMLDivElement>(null)
   const listings = specialItemsToListings(special.items)
 
@@ -43,85 +48,101 @@ export function StoreSpecialCarousel({
     track.scrollBy({ left: direction * amount, behavior: 'smooth' })
   }
 
+  const addCard = (
+    <div className={styles.cardSlot}>
+      <Tooltip label={t('website.specialItems.addItemsTo', { title: special.title })}>
+        <button
+          type="button"
+          className={styles.addCard}
+          onClick={() => onAddItems(special)}
+          aria-label={t('website.specialItems.addItemsTo', { title: special.title })}
+        >
+          <span className={styles.addIcon}>
+            <Plus size={28} />
+          </span>
+        </button>
+      </Tooltip>
+    </div>
+  )
+
+  const itemCards = listings.map((listing) => (
+    <div key={listing.storeItemId} className={styles.cardSlot}>
+      <StoreItemCard
+        listing={listing}
+        onOpen={onOpenListing}
+        onEdit={onEditListing}
+        onDiscount={onDiscountListing}
+        onFestival={onFestivalListing}
+        onRemove={() => onRemoveListing(special, listing)}
+        onAddToCart={onAddToCart}
+        removeTooltip={t('website.specialItems.removeFromSpecial')}
+      />
+    </div>
+  ))
+
   return (
     <section className={styles.section}>
       <div className={styles.header}>
         <h3 className={styles.title}>{special.title}</h3>
         <div className={styles.headerActions}>
-          <Tooltip label="Edit category">
+          <Tooltip label={t('website.specialItems.editCategory')}>
             <button
               type="button"
               className={controlStyles.controlBtn}
               onClick={() => onEditSpecial(special)}
-              aria-label="Edit category"
+              aria-label={t('website.specialItems.editCategory')}
             >
               <Pencil size={16} />
             </button>
           </Tooltip>
-          <Tooltip label="Delete category">
+          <Tooltip label={t('website.specialItems.deleteCategory')}>
             <button
               type="button"
               className={`${controlStyles.controlBtn} ${controlStyles.danger}`}
               onClick={() => onDeleteSpecial(special)}
-              aria-label="Delete category"
+              aria-label={t('website.specialItems.deleteCategory')}
             >
               <Trash2 size={16} />
             </button>
           </Tooltip>
-          <Tooltip label="Scroll left">
-            <button
-              type="button"
-              className={styles.navBtn}
-              onClick={() => scrollBy(-1)}
-              aria-label="Scroll left"
-            >
-              <ChevronLeft size={18} />
-            </button>
-          </Tooltip>
-          <Tooltip label="Scroll right">
-            <button
-              type="button"
-              className={styles.navBtn}
-              onClick={() => scrollBy(1)}
-              aria-label="Scroll right"
-            >
-              <ChevronRight size={18} />
-            </button>
-          </Tooltip>
+          <div className={styles.navPair} dir="ltr">
+            <Tooltip label={t('website.specialItems.scrollLeft')}>
+              <button
+                type="button"
+                className={styles.navBtn}
+                onClick={() => scrollBy(-1)}
+                aria-label={t('website.specialItems.scrollLeft')}
+              >
+                <ChevronLeft size={18} />
+              </button>
+            </Tooltip>
+            <Tooltip label={t('website.specialItems.scrollRight')}>
+              <button
+                type="button"
+                className={styles.navBtn}
+                onClick={() => scrollBy(1)}
+                aria-label={t('website.specialItems.scrollRight')}
+              >
+                <ChevronRight size={18} />
+              </button>
+            </Tooltip>
+          </div>
         </div>
       </div>
 
       <div className={styles.trackWrap}>
-        <div className={styles.track} ref={trackRef}>
-          <div className={styles.cardSlot}>
-            <Tooltip label={`Add store items to ${special.title}`}>
-              <button
-                type="button"
-                className={styles.addCard}
-                onClick={() => onAddItems(special)}
-                aria-label={`Add store items to ${special.title}`}
-              >
-                <span className={styles.addIcon}>
-                  <Plus size={28} />
-                </span>
-              </button>
-            </Tooltip>
-          </div>
-
-          {listings.map((listing) => (
-            <div key={listing.storeItemId} className={styles.cardSlot}>
-              <StoreItemCard
-                listing={listing}
-                onOpen={onOpenListing}
-                onEdit={onEditListing}
-                onDiscount={onDiscountListing}
-                onFestival={onFestivalListing}
-                onRemove={() => onRemoveListing(special, listing)}
-                onAddToCart={onAddToCart}
-                removeTooltip="Remove from special"
-              />
-            </div>
-          ))}
+        <div className={styles.track} ref={trackRef} dir={isFa ? 'rtl' : 'ltr'}>
+          {isFa ? (
+            <>
+              {addCard}
+              {itemCards}
+            </>
+          ) : (
+            <>
+              {itemCards}
+              {addCard}
+            </>
+          )}
         </div>
       </div>
     </section>
diff --git a/apps/business/src/components/StoreSpecialModal.tsx b/apps/business/src/components/StoreSpecialModal.tsx
index d8df61b..d58c5c4 100644
--- a/apps/business/src/components/StoreSpecialModal.tsx
+++ b/apps/business/src/components/StoreSpecialModal.tsx
@@ -1,41 +1,54 @@
 import { useEffect, useRef, useState } from 'react'
 import { createPortal } from 'react-dom'
 import { X } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
+import { useT } from '../i18n/useT'
 import styles from './CategoryModal.module.css'
 
+export interface StoreSpecialModalValues {
+  key: string
+  title: string
+}
+
 interface StoreSpecialModalProps {
   open: boolean
   onClose: () => void
-  onSubmit: (title: string) => void
+  onSubmit: (values: StoreSpecialModalValues) => void
+  initialKey?: string
   initialTitle?: string
   title?: string
   submitLabel?: string
-  fieldLabel?: string
   isSubmitting?: boolean
 }
 
 const ANIMATION_MS = 220
+const KEY_PATTERN = /^[a-zA-Z][a-zA-Z0-9_-]*$/
 
 export function StoreSpecialModal({
   open,
   onClose,
   onSubmit,
+  initialKey = '',
   initialTitle = '',
-  title = 'Add Special Category',
-  submitLabel = 'Create',
-  fieldLabel = 'Category title',
+  title,
+  submitLabel,
   isSubmitting = false,
 }: StoreSpecialModalProps) {
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
   const formRef = useRef<HTMLFormElement>(null)
   const [mounted, setMounted] = useState(open)
   const [closing, setClosing] = useState(false)
-  const [categoryTitle, setCategoryTitle] = useState(initialTitle)
+  const [groupKey, setGroupKey] = useState(initialKey)
+  const [groupTitle, setGroupTitle] = useState(initialTitle)
 
   useEffect(() => {
     if (open) {
       setMounted(true)
       setClosing(false)
-      setCategoryTitle(initialTitle)
+      setGroupKey(initialKey)
+      setGroupTitle(initialTitle)
     } else if (mounted) {
       setClosing(true)
       const timer = setTimeout(() => {
@@ -44,7 +57,7 @@ export function StoreSpecialModal({
       }, ANIMATION_MS)
       return () => clearTimeout(timer)
     }
-  }, [open, initialTitle, mounted])
+  }, [open, initialKey, initialTitle, mounted])
 
   useEffect(() => {
     if (!mounted || closing) return
@@ -57,11 +70,15 @@ export function StoreSpecialModal({
 
   if (!mounted) return null
 
+  const trimmedKey = groupKey.trim()
+  const trimmedTitle = groupTitle.trim()
+  const keyValid = KEY_PATTERN.test(trimmedKey)
+  const canSubmit = keyValid && trimmedTitle.length > 0
+
   function handleSubmit(e: React.FormEvent<HTMLFormElement>) {
     e.preventDefault()
-    const trimmed = categoryTitle.trim()
-    if (!trimmed) return
-    onSubmit(trimmed)
+    if (!canSubmit) return
+    onSubmit({ key: trimmedKey, title: trimmedTitle })
   }
 
   return createPortal(
@@ -75,39 +92,69 @@ export function StoreSpecialModal({
         role="dialog"
         aria-modal="true"
         aria-labelledby="special-modal-title"
+        lang={isFa ? 'fa' : 'en'}
+        dir={isFa ? 'rtl' : 'ltr'}
       >
         <div className={styles.header}>
           <h2 id="special-modal-title" className={styles.title}>
-            {title}
+            {title ?? t('website.specialItems.createTitle')}
           </h2>
-          <button type="button" className={styles.closeBtn} onClick={onClose} aria-label="Close">
+          <button
+            type="button"
+            className={styles.closeBtn}
+            onClick={onClose}
+            aria-label={t('common.close')}
+          >
             <X size={20} />
           </button>
         </div>
 
         <form ref={formRef} className={styles.form} onSubmit={handleSubmit}>
           <div className={styles.field}>
-            <label htmlFor="special-category-title">{fieldLabel}</label>
+            <label htmlFor="special-group-key">{t('website.groupKey')}</label>
             <input
-              id="special-category-title"
-              value={categoryTitle}
-              onChange={(e) => setCategoryTitle(e.target.value)}
-              placeholder="e.g. Special Sale, Our Best Sellers"
+              id="special-group-key"
+              value={groupKey}
+              onChange={(e) => setGroupKey(e.target.value)}
+              placeholder={t('website.groupKeyPlaceholder')}
               autoFocus
               disabled={isSubmitting}
+              dir="ltr"
+              autoComplete="off"
+              spellCheck={false}
+            />
+            <p className={styles.hint}>{t('website.groupKeyHint')}</p>
+          </div>
+
+          <div className={styles.field}>
+            <label htmlFor="special-group-title">{t('website.groupValue')}</label>
+            <input
+              id="special-group-title"
+              value={groupTitle}
+              onChange={(e) => setGroupTitle(e.target.value)}
+              placeholder={t('website.groupValuePlaceholder')}
+              disabled={isSubmitting}
+              dir={isFa ? 'rtl' : 'ltr'}
             />
           </div>
 
           <div className={styles.actions}>
-            <button type="button" className={styles.cancelBtn} onClick={onClose} disabled={isSubmitting}>
-              Cancel
+            <button
+              type="button"
+              className={styles.cancelBtn}
+              onClick={onClose}
+              disabled={isSubmitting}
+            >
+              {t('products.form.cancel')}
             </button>
             <button
               type="submit"
               className={styles.submitBtn}
-              disabled={isSubmitting || !categoryTitle.trim()}
+              disabled={isSubmitting || !canSubmit}
             >
-              {isSubmitting ? 'Saving...' : submitLabel}
+              {isSubmitting
+                ? t('website.saving')
+                : (submitLabel ?? t('website.create'))}
             </button>
           </div>
         </form>
diff --git a/apps/business/src/components/Tooltip.module.css b/apps/business/src/components/Tooltip.module.css
index 0f51a1d..f65dc6a 100644
--- a/apps/business/src/components/Tooltip.module.css
+++ b/apps/business/src/components/Tooltip.module.css
@@ -9,6 +9,7 @@
   left: 50%;
   transform: translateX(-50%) translateY(4px);
   padding: 6px 10px;
+  font-family: var(--font-ui);
   font-size: 12px;
   font-weight: 500;
   line-height: 1.3;
diff --git a/apps/business/src/components/WebsiteGroupCarousel.module.css b/apps/business/src/components/WebsiteGroupCarousel.module.css
index 3c53af5..296b67a 100644
--- a/apps/business/src/components/WebsiteGroupCarousel.module.css
+++ b/apps/business/src/components/WebsiteGroupCarousel.module.css
@@ -22,6 +22,12 @@
   gap: 4px;
 }
 
+.navPair {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+}
+
 .navBtn {
   width: 32px;
   height: 32px;
diff --git a/apps/business/src/components/WebsiteGroupCarousel.tsx b/apps/business/src/components/WebsiteGroupCarousel.tsx
index fba0f48..c3bfcb1 100644
--- a/apps/business/src/components/WebsiteGroupCarousel.tsx
+++ b/apps/business/src/components/WebsiteGroupCarousel.tsx
@@ -1,5 +1,7 @@
 import { ChevronLeft, ChevronRight, Pencil, Plus, Trash2 } from 'lucide-react'
 import { useRef, type ReactNode } from 'react'
+import { useLocale } from '@meshkee/dashboard-ui'
+import { useT } from '../i18n/useT'
 import controlStyles from './CategoryRow.module.css'
 import { Tooltip } from './Tooltip'
 import styles from './WebsiteGroupCarousel.module.css'
@@ -26,10 +28,15 @@ export function WebsiteGroupCarousel<T>({
   onEditGroup,
   onDeleteGroup,
   addTooltip,
-  editTooltip = 'Edit group',
-  deleteTooltip = 'Delete group',
+  editTooltip,
+  deleteTooltip,
 }: WebsiteGroupCarouselProps<T>) {
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
   const trackRef = useRef<HTMLDivElement>(null)
+  const editLabel = editTooltip ?? t('website.editGroup')
+  const deleteLabel = deleteTooltip ?? t('website.deleteGroup')
 
   function scrollBy(direction: -1 | 1) {
     const track = trackRef.current
@@ -38,76 +45,92 @@ export function WebsiteGroupCarousel<T>({
     track.scrollBy({ left: direction * amount, behavior: 'smooth' })
   }
 
+  const addCard = (
+    <div className={styles.cardSlot}>
+      <Tooltip label={addTooltip}>
+        <button
+          type="button"
+          className={styles.addCard}
+          onClick={onAddItems}
+          aria-label={addTooltip}
+        >
+          <span className={styles.addIcon}>
+            <Plus size={28} />
+          </span>
+        </button>
+      </Tooltip>
+    </div>
+  )
+
+  const itemCards = items.map((item) => (
+    <div key={itemKey(item)} className={styles.cardSlot}>
+      {renderItem(item)}
+    </div>
+  ))
+
   return (
     <section className={styles.section}>
       <div className={styles.header}>
         <h3 className={styles.title}>{title}</h3>
         <div className={styles.headerActions}>
-          <Tooltip label={editTooltip}>
+          <Tooltip label={editLabel}>
             <button
               type="button"
               className={controlStyles.controlBtn}
               onClick={onEditGroup}
-              aria-label={editTooltip}
+              aria-label={editLabel}
             >
               <Pencil size={16} />
             </button>
           </Tooltip>
-          <Tooltip label={deleteTooltip}>
+          <Tooltip label={deleteLabel}>
             <button
               type="button"
               className={`${controlStyles.controlBtn} ${controlStyles.danger}`}
               onClick={onDeleteGroup}
-              aria-label={deleteTooltip}
+              aria-label={deleteLabel}
             >
               <Trash2 size={16} />
             </button>
           </Tooltip>
-          <Tooltip label="Scroll left">
-            <button
-              type="button"
-              className={styles.navBtn}
-              onClick={() => scrollBy(-1)}
-              aria-label="Scroll left"
-            >
-              <ChevronLeft size={18} />
-            </button>
-          </Tooltip>
-          <Tooltip label="Scroll right">
-            <button
-              type="button"
-              className={styles.navBtn}
-              onClick={() => scrollBy(1)}
-              aria-label="Scroll right"
-            >
-              <ChevronRight size={18} />
-            </button>
-          </Tooltip>
+          <div className={styles.navPair} dir="ltr">
+            <Tooltip label={t('website.scrollLeft')}>
+              <button
+                type="button"
+                className={styles.navBtn}
+                onClick={() => scrollBy(-1)}
+                aria-label={t('website.scrollLeft')}
+              >
+                <ChevronLeft size={18} />
+              </button>
+            </Tooltip>
+            <Tooltip label={t('website.scrollRight')}>
+              <button
+                type="button"
+                className={styles.navBtn}
+                onClick={() => scrollBy(1)}
+                aria-label={t('website.scrollRight')}
+              >
+                <ChevronRight size={18} />
+              </button>
+            </Tooltip>
+          </div>
         </div>
       </div>
 
       <div className={styles.trackWrap}>
-        <div className={styles.track} ref={trackRef}>
-          <div className={styles.cardSlot}>
-            <Tooltip label={addTooltip}>
-              <button
-                type="button"
-                className={styles.addCard}
-                onClick={onAddItems}
-                aria-label={addTooltip}
-              >
-                <span className={styles.addIcon}>
-                  <Plus size={28} />
-                </span>
-              </button>
-            </Tooltip>
-          </div>
-
-          {items.map((item) => (
-            <div key={itemKey(item)} className={styles.cardSlot}>
-              {renderItem(item)}
-            </div>
-          ))}
+        <div className={styles.track} ref={trackRef} dir={isFa ? 'rtl' : 'ltr'}>
+          {isFa ? (
+            <>
+              {addCard}
+              {itemCards}
+            </>
+          ) : (
+            <>
+              {itemCards}
+              {addCard}
+            </>
+          )}
         </div>
       </div>
     </section>
diff --git a/apps/business/src/components/WebsiteGroupItemCard.module.css b/apps/business/src/components/WebsiteGroupItemCard.module.css
index f725e37..358e92f 100644
--- a/apps/business/src/components/WebsiteGroupItemCard.module.css
+++ b/apps/business/src/components/WebsiteGroupItemCard.module.css
@@ -22,22 +22,38 @@
   min-width: 0;
 }
 
-.nameEn {
+.namePrimary {
+  margin: 0;
   font-size: 14px;
   font-weight: 600;
   color: var(--text-primary);
   line-height: 1.35;
+  text-align: start;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
 }
 
-.nameFa {
-  margin-top: 4px;
-  font-family: var(--font-ui);
-  font-size: 13px;
+.namePrimary[dir='rtl'] {
+  text-align: right;
+}
+
+.nameSecondary {
+  margin: 4px 0 0;
+  font-size: 12px;
   font-weight: 500;
   color: var(--text-secondary);
-  text-align: left;
-  line-height: 1.4;
-  direction: rtl;
+  line-height: 1.35;
+  text-align: start;
+  display: -webkit-box;
+  -webkit-line-clamp: 1;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+}
+
+.nameSecondary[dir='rtl'] {
+  text-align: right;
 }
 
 .subtitle {
@@ -45,12 +61,17 @@
   font-size: 12px;
   color: var(--text-muted);
   line-height: 1.4;
+  text-align: start;
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
   overflow: hidden;
 }
 
+.card[dir='rtl'] .subtitle {
+  text-align: right;
+}
+
 .controls {
   display: flex;
   justify-content: flex-end;
diff --git a/apps/business/src/components/WebsiteGroupItemCard.tsx b/apps/business/src/components/WebsiteGroupItemCard.tsx
index 8e2821e..ec1ad01 100644
--- a/apps/business/src/components/WebsiteGroupItemCard.tsx
+++ b/apps/business/src/components/WebsiteGroupItemCard.tsx
@@ -1,4 +1,6 @@
 import { Trash2 } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
+import { useT } from '../i18n/useT'
 import { Tooltip } from './Tooltip'
 import styles from './WebsiteGroupItemCard.module.css'
 
@@ -15,23 +17,55 @@ export function WebsiteGroupItemCard({
   nameFa,
   subtitle,
   onRemove,
-  removeTooltip = 'Remove from group',
+  removeTooltip,
 }: WebsiteGroupItemCardProps) {
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
+  const removeLabel = removeTooltip ?? t('website.removeFromGroup')
+  const primaryName = isFa ? nameFa?.trim() || title : title
+  const secondaryName = isFa
+    ? nameFa?.trim()
+      ? title
+      : ''
+    : nameFa?.trim() || ''
+
   return (
-    <article className={styles.card}>
+    <article className={styles.card} dir={isFa ? 'rtl' : 'ltr'}>
       <div className={styles.text}>
-        <h3 className={styles.nameEn}>{title}</h3>
-        {nameFa && <p className={styles.nameFa}>{nameFa}</p>}
-        {subtitle && <p className={styles.subtitle}>{subtitle}</p>}
+        {isFa ? (
+          <>
+            <h3 className={`${styles.namePrimary} faText`} lang="fa" dir="rtl">
+              {primaryName}
+            </h3>
+            {secondaryName ? (
+              <p className={styles.nameSecondary} lang="en" dir="rtl">
+                {secondaryName}
+              </p>
+            ) : null}
+          </>
+        ) : (
+          <>
+            <h3 className={styles.namePrimary} lang="en" dir="ltr">
+              {primaryName}
+            </h3>
+            {secondaryName ? (
+              <p className={`${styles.nameSecondary} faText`} lang="fa" dir="rtl">
+                {secondaryName}
+              </p>
+            ) : null}
+          </>
+        )}
+        {subtitle ? <p className={styles.subtitle}>{subtitle}</p> : null}
       </div>
 
       <div className={styles.controls}>
-        <Tooltip label={removeTooltip}>
+        <Tooltip label={removeLabel}>
           <button
             type="button"
             className={styles.danger}
             onClick={onRemove}
-            aria-label={removeTooltip}
+            aria-label={removeLabel}
           >
             <Trash2 size={16} />
           </button>
diff --git a/apps/business/src/components/WebsiteSliderGallery.module.css b/apps/business/src/components/WebsiteSliderGallery.module.css
index af6b968..ffcd570 100644
--- a/apps/business/src/components/WebsiteSliderGallery.module.css
+++ b/apps/business/src/components/WebsiteSliderGallery.module.css
@@ -5,12 +5,12 @@
 .header {
   display: flex;
   align-items: center;
-  justify-content: flex-end;
+  justify-content: flex-start;
   gap: 12px;
   margin-bottom: 8px;
 }
 
-.headerActions {
+.navPair {
   display: flex;
   align-items: center;
   gap: 4px;
diff --git a/apps/business/src/components/WebsiteSliderGallery.tsx b/apps/business/src/components/WebsiteSliderGallery.tsx
index 70e31e8..e2a882e 100644
--- a/apps/business/src/components/WebsiteSliderGallery.tsx
+++ b/apps/business/src/components/WebsiteSliderGallery.tsx
@@ -1,5 +1,7 @@
 import { ChevronLeft, ChevronRight, Plus } from 'lucide-react'
 import { useRef } from 'react'
+import { useLocale } from '@meshkee/dashboard-ui'
+import { useT } from '../i18n/useT'
 import type { WebsiteSliderSlide } from '../types/websiteSlider'
 import { Tooltip } from './Tooltip'
 import { WebsiteSliderSlideCard } from './WebsiteSliderSlideCard'
@@ -16,6 +18,9 @@ export function WebsiteSliderGallery({
   onAddSlide,
   onRemoveSlide,
 }: WebsiteSliderGalleryProps) {
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
   const trackRef = useRef<HTMLDivElement>(null)
   const showNav = slides.length > 0
 
@@ -26,27 +31,50 @@ export function WebsiteSliderGallery({
     track.scrollBy({ left: direction * amount, behavior: 'smooth' })
   }
 
+  const addCard = (
+    <div className={`${styles.slideSlot} ${styles.slideSlotAdd}`}>
+      <Tooltip label={t('website.sliders.addSlide')}>
+        <button
+          type="button"
+          className={styles.addCard}
+          onClick={onAddSlide}
+          aria-label={t('website.sliders.addSlide')}
+        >
+          <span className={styles.addIcon}>
+            <Plus size={28} />
+          </span>
+        </button>
+      </Tooltip>
+    </div>
+  )
+
+  const slideCards = slides.map((slide) => (
+    <div key={slide.id} className={styles.slideSlot}>
+      <WebsiteSliderSlideCard slide={slide} onRemove={() => onRemoveSlide(slide)} />
+    </div>
+  ))
+
   return (
     <section className={styles.section}>
       {showNav && (
         <div className={styles.header}>
-          <div className={styles.headerActions}>
-            <Tooltip label="Scroll left">
+          <div className={styles.navPair} dir="ltr">
+            <Tooltip label={t('website.scrollLeft')}>
               <button
                 type="button"
                 className={styles.navBtn}
                 onClick={() => scrollBy(-1)}
-                aria-label="Scroll left"
+                aria-label={t('website.scrollLeft')}
               >
                 <ChevronLeft size={18} />
               </button>
             </Tooltip>
-            <Tooltip label="Scroll right">
+            <Tooltip label={t('website.scrollRight')}>
               <button
                 type="button"
                 className={styles.navBtn}
                 onClick={() => scrollBy(1)}
-                aria-label="Scroll right"
+                aria-label={t('website.scrollRight')}
               >
                 <ChevronRight size={18} />
               </button>
@@ -56,27 +84,9 @@ export function WebsiteSliderGallery({
       )}
 
       <div className={styles.trackWrap}>
-        <div className={styles.track} ref={trackRef}>
-          <div className={`${styles.slideSlot} ${styles.slideSlotAdd}`}>
-            <Tooltip label="Add slide">
-              <button
-                type="button"
-                className={styles.addCard}
-                onClick={onAddSlide}
-                aria-label="Add slide"
-              >
-                <span className={styles.addIcon}>
-                  <Plus size={28} />
-                </span>
-              </button>
-            </Tooltip>
-          </div>
-
-          {slides.map((slide) => (
-            <div key={slide.id} className={styles.slideSlot}>
-              <WebsiteSliderSlideCard slide={slide} onRemove={() => onRemoveSlide(slide)} />
-            </div>
-          ))}
+        <div className={styles.track} ref={trackRef} dir={isFa ? 'rtl' : 'ltr'}>
+          {slideCards}
+          {addCard}
         </div>
       </div>
     </section>
diff --git a/apps/business/src/components/WebsiteSliderSlideCard.tsx b/apps/business/src/components/WebsiteSliderSlideCard.tsx
index 9d1d628..69d450f 100644
--- a/apps/business/src/components/WebsiteSliderSlideCard.tsx
+++ b/apps/business/src/components/WebsiteSliderSlideCard.tsx
@@ -1,4 +1,5 @@
 import { Trash2 } from 'lucide-react'
+import { useT } from '../i18n/useT'
 import type { WebsiteSliderSlide } from '../types/websiteSlider'
 import { Tooltip } from './Tooltip'
 import styles from './WebsiteSliderSlideCard.module.css'
@@ -9,20 +10,27 @@ interface WebsiteSliderSlideCardProps {
 }
 
 export function WebsiteSliderSlideCard({ slide, onRemove }: WebsiteSliderSlideCardProps) {
+  const t = useT()
+
   return (
     <article className={styles.card}>
       <div className={styles.imageWrap}>
-        <img src={slide.imageUrl} alt={slide.title ?? 'Slider slide'} className={styles.image} loading="lazy" />
+        <img
+          src={slide.imageUrl}
+          alt={slide.title ?? t('website.sliders.slideAlt')}
+          className={styles.image}
+          loading="lazy"
+        />
       </div>
 
       <div className={styles.footer}>
-        <p className={styles.title}>{slide.title?.trim() || 'Untitled slide'}</p>
-        <Tooltip label="Remove slide">
+        <p className={styles.title}>{slide.title?.trim() || t('website.sliders.untitled')}</p>
+        <Tooltip label={t('website.sliders.removeSlide')}>
           <button
             type="button"
             className={styles.removeBtn}
             onClick={onRemove}
-            aria-label="Remove slide"
+            aria-label={t('website.sliders.removeSlide')}
           >
             <Trash2 size={16} />
           </button>
diff --git a/apps/business/src/data/productComments.ts b/apps/business/src/data/productComments.ts
index 388c8ea..7d9a2c2 100644
--- a/apps/business/src/data/productComments.ts
+++ b/apps/business/src/data/productComments.ts
@@ -1,5 +1,5 @@
-export function formatCommentDate(iso: string): string {
-  return new Date(iso).toLocaleString('en-US', {
+export function formatCommentDate(iso: string, locale: 'en' | 'fa' = 'en'): string {
+  return new Date(iso).toLocaleString(locale === 'fa' ? 'fa-IR' : 'en-US', {
     year: 'numeric',
     month: 'short',
     day: 'numeric',
diff --git a/apps/business/src/i18n/messages.ts b/apps/business/src/i18n/messages.ts
index 3bbfb86..8fd8328 100644
--- a/apps/business/src/i18n/messages.ts
+++ b/apps/business/src/i18n/messages.ts
@@ -135,6 +135,742 @@ const en = {
   'products.activity.barAdded': '{month}: {count} added',
   'products.activity.barUpdated': '{month}: {count} updated',
 
+  'products.list.subtitle': '{count} products · View, edit and manage your catalog.',
+  'products.list.filters': 'Filters',
+  'products.list.filterName': 'Name',
+  'products.list.filterNamePlaceholder': 'Search by product name',
+  'products.list.search': 'Search',
+  'products.list.clearFilters': 'Clear filters',
+  'products.list.loading': 'Loading products...',
+  'products.list.empty': 'No products found.',
+  'products.list.emptyFiltered': 'No products match your filters.',
+  'products.list.errorLoad': 'Unable to load products.',
+  'products.list.errorDelete': 'Unable to delete product.',
+  'products.list.pagination': 'Page {page} / {totalPages} · {perPage} per page · {total} total',
+  'products.list.deleteTitle': 'Delete Product',
+  'products.list.deleteMessage':
+    'Are you sure you want to delete "{name}"? This action cannot be undone.',
+  'products.list.addByAi': 'Add product by AI',
+  'products.list.addNew': 'Add new product',
+  'products.card.edit': 'Edit product',
+  'products.card.quickInfo': 'Quick info',
+  'products.card.variations': 'Manage variations',
+  'products.card.comments': 'View comments',
+  'products.card.technical': 'Technical data',
+  'products.card.remove': 'Remove product',
+  'products.card.draft': 'Draft',
+
+  'products.form.errorOptions': 'Unable to load form options.',
+  'products.form.errorSave': 'Unable to save product.',
+  'products.form.thumbnail': 'Thumbnail Image',
+  'products.form.thumbnailUpload': 'Upload thumbnail image',
+  'products.form.thumbnailHint': 'Click to select, then crop',
+  'products.form.thumbnailChange': 'Change thumbnail',
+  'products.form.thumbnailRemove': 'Remove thumbnail',
+  'products.form.zoom': 'Zoom',
+  'products.form.applyCrop': 'Apply Crop',
+  'products.form.category': 'Category',
+  'products.form.categoryPlaceholder': 'Search and select category...',
+  'products.form.brand': 'Brand',
+  'products.form.optional': '(optional)',
+  'products.form.brandPlaceholder': 'Search and select brand...',
+  'products.form.nameFa': 'Name (FA)',
+  'products.form.nameFaPlaceholder': 'نام محصول',
+  'products.form.nameEn': 'Name (EN)',
+  'products.form.nameEnPlaceholder': 'Product name',
+  'products.form.summary': 'Summary',
+  'products.form.summaryPlaceholder': 'Short summary shown in product listings',
+  'products.form.description': 'Description',
+  'products.form.descriptionPlaceholder': 'Full product description with formatting...',
+  'products.form.images': 'Product Images',
+  'products.form.imagesAdd': 'Add images',
+  'products.form.imagesHint': 'Upload multiple product images. Click + to add more.',
+  'products.form.imagesRemove': 'Remove image {index}',
+  'products.form.tags': 'Tags',
+  'products.form.tagsPlaceholder': 'Type a tag and press Enter',
+  'products.form.cancel': 'Cancel',
+  'products.form.saving': 'Saving...',
+  'products.form.save': 'Save Product',
+  'products.form.update': 'Update Product',
+
+  'categories.page.subtitle': 'Manage your digital product categories and subcategories.',
+  'categories.loading': 'Loading categories...',
+  'categories.empty': 'No categories yet. Use + or AI to add categories.',
+  'categories.add': 'Add Category',
+  'categories.addSub': 'Add Sub Category',
+  'categories.edit': 'Edit Category',
+  'categories.addByAi': 'Fill categories by AI',
+  'categories.deleteTitle': 'Delete Category',
+  'categories.deleteMessage':
+    'Are you sure you want to delete "{name}"? Subcategories will also be removed.',
+  'categories.tooltip.addSub': 'Add sub category',
+  'categories.tooltip.edit': 'Edit category',
+  'categories.tooltip.variations': 'Manage variations',
+  'categories.tooltip.technical': 'Technical data form',
+  'categories.tooltip.options': 'Category options',
+  'categories.tooltip.remove': 'Remove category',
+  'categories.modal.parent': 'Parent Category',
+  'categories.modal.nameFa': 'Name (FA)',
+  'categories.modal.nameEn': 'Name (EN)',
+  'categories.modal.description': 'Description',
+  'categories.modal.nameFaPlaceholder': 'نام دسته‌بندی',
+  'categories.modal.nameEnPlaceholder': 'Category name',
+  'categories.modal.descriptionPlaceholder': 'Short description of this category',
+  'categories.modal.cancel': 'Cancel',
+  'categories.modal.save': 'Save Category',
+  'categories.modal.saving': 'Saving...',
+  'categories.select.search': 'Search categories...',
+  'categories.select.none': '— None (root category) —',
+  'categories.select.empty': 'No categories found',
+  'categories.select.clear': 'Clear selection',
+
+  'brands.page.subtitle': 'Manage product brands for your store catalog.',
+  'brands.loading': 'Loading brands...',
+  'brands.empty': 'No brands yet. Click + to add one.',
+  'brands.add': 'Add Brand',
+  'brands.edit': 'Edit Brand',
+  'brands.deleteTitle': 'Delete Brand',
+  'brands.deleteMessage':
+    'Are you sure you want to delete "{name}"? Products linked to this brand will have their brand cleared.',
+  'brands.toast.created': 'Brand created.',
+  'brands.toast.updated': 'Brand updated.',
+  'brands.toast.deleted': 'Brand deleted.',
+  'brands.errorLoad': 'Unable to load brands.',
+  'brands.errorSave': 'Unable to save brand.',
+  'brands.errorDelete': 'Unable to delete brand.',
+  'brands.tooltip.edit': 'Edit brand',
+  'brands.tooltip.remove': 'Remove brand',
+  'brands.modal.logo': 'Brand logo',
+  'brands.modal.uploadLogo': 'Upload brand logo',
+  'brands.modal.logoHint': 'PNG only — transparent background recommended',
+  'brands.modal.changeLogo': 'Change logo',
+  'brands.modal.nameFa': 'Name (FA)',
+  'brands.modal.nameEn': 'Name (EN)',
+  'brands.modal.about': 'About',
+  'brands.modal.nameFaPlaceholder': 'نام برند',
+  'brands.modal.nameEnPlaceholder': 'Brand name',
+  'brands.modal.aboutPlaceholder': 'Short description of this brand',
+  'brands.modal.cancel': 'Cancel',
+  'brands.modal.save': 'Save Brand',
+  'brands.modal.saving': 'Saving...',
+
+  'productSettings.title': 'Product settings',
+  'productSettings.subtitle': 'Configure how comments and expert reviews are moderated.',
+  'productSettings.moderation': 'Moderation',
+  'productSettings.loading': 'Loading settings...',
+  'productSettings.errorLoad': 'Unable to load settings.',
+  'productSettings.errorSave': 'Unable to save settings.',
+  'productSettings.saved': 'Settings saved.',
+  'productSettings.commentsAuto': 'Auto-approve comments',
+  'productSettings.commentsAutoDesc':
+    'New comments are published immediately when submitted. You can still reject them later if needed.',
+  'productSettings.reviewsAuto': 'Auto-approve expert reviews',
+  'productSettings.reviewsAutoDesc':
+    'New expert reviews are published immediately when submitted. You can still reject them later if needed.',
+
+  'store.page.subtitle': 'Manage your store items, orders and settings.',
+  'store.card.items.desc': 'View and manage all items listed in your store.',
+  'store.card.items.link': 'View items',
+  'store.card.orders.desc': 'Track and manage customer orders and fulfillment.',
+  'store.card.orders.link': 'View orders',
+  'store.card.shipping.desc': 'Configure shipping rates, zones and delivery options.',
+  'store.card.shipping.link': 'Manage shipping',
+  'store.card.cards.desc': 'Manage saved shopping cards and payment methods.',
+  'store.card.cards.link': 'View cards',
+  'store.card.settings.desc': 'Configure store preferences, pages and themes.',
+  'store.card.settings.link': 'View settings',
+
+  'storeItems.subtitle': 'Products for sale with one or more priced variants.',
+  'storeItems.filters': 'Filters',
+  'storeItems.filterName': 'Name',
+  'storeItems.filterNamePlaceholder': 'Search by product name',
+  'storeItems.minPrice': 'Min price (IRT)',
+  'storeItems.maxPrice': 'Max price (IRT)',
+  'storeItems.onlyDiscounted': 'Only discounted',
+  'storeItems.search': 'Search',
+  'storeItems.clearFilters': 'Clear filters',
+  'storeItems.loading': 'Loading store items...',
+  'storeItems.empty': 'No store items yet. Use the + button to add products from your catalog.',
+  'storeItems.emptyFiltered': 'No store items match your filters.',
+  'storeItems.errorLoad': 'Unable to load store items.',
+  'storeItems.errorRemove': 'Unable to remove store item.',
+  'storeItems.add': 'Add store items',
+  'storeItems.cartOpen': 'Open shopping cart, {count} items',
+  'storeItems.cartOne': 'item in cart',
+  'storeItems.cartMany': 'items in cart',
+  'storeItems.addedToCart': 'Added to shopping cart.',
+  'storeItems.deleteTitle': 'Remove from Store',
+  'storeItems.deleteMessage':
+    'Remove "{name}" and all {variants} from your store? This cannot be undone.',
+  'storeItems.card.inStock': '{count} in stock',
+  'storeItems.card.festival': 'Festival',
+  'storeItems.card.variantOne': '1 variant',
+  'storeItems.card.variantMany': '{count} variants',
+  'storeItems.card.edit': 'Edit store items',
+  'storeItems.card.discount': 'Set discounts',
+  'storeItems.card.festivalPoints': 'Festival reward points',
+  'storeItems.card.remove': 'Remove from store',
+  'storeItems.card.addToCart': 'Add to shopping cart',
+  'storeItems.pick.title': 'Choose variant',
+  'storeItems.pick.inStock': '{count} in stock',
+  'storeItems.create.title': 'Add Store Items',
+  'storeItems.create.subtitle': "Create sellable variants from a product's variations.",
+  'storeItems.create.productPlaceholder': 'Product — type 3+ characters to search',
+  'storeItems.create.loadingVariations': 'Loading product variations...',
+  'storeItems.create.price': 'Price (IRT)',
+  'storeItems.create.stock': 'Stock',
+  'storeItems.create.removeRow': 'Remove row',
+  'storeItems.create.addRow': 'Add row',
+  'storeItems.create.cancel': 'Cancel',
+  'storeItems.create.submit': 'Create store items',
+  'storeItems.create.submitting': 'Creating…',
+  'storeItems.create.errorProducts': 'Unable to load products.',
+  'storeItems.create.errorVariations': 'Unable to load product variations.',
+  'storeItems.create.errorCreate': 'Unable to create store items.',
+  'storeItems.edit.title': 'Edit Store Items',
+  'storeItems.edit.save': 'Save changes',
+  'storeItems.edit.saving': 'Saving…',
+  'storeItems.edit.errorSave': 'Unable to save store items.',
+  'storeItems.search.clear': 'Clear selection',
+  'storeItems.search.noProducts': 'No products available.',
+  'storeItems.search.noMatch': 'No matching products.',
+  'storeItems.search.minChars': 'Type at least {count} characters to search',
+
+  'orders.title': 'Orders',
+  'orders.subtitle':
+    'Track customer orders placed through your website, application, or by operators.',
+  'orders.filters': 'Filters',
+  'orders.filter.orderId': 'Order ID',
+  'orders.filter.customer': 'Customer name or number',
+  'orders.filter.dateFrom': 'Date from',
+  'orders.filter.dateTo': 'Date to',
+  'orders.filter.minCost': 'Min cost (IRT)',
+  'orders.filter.maxCost': 'Max cost (IRT)',
+  'orders.search': 'Search',
+  'orders.clearFilters': 'Clear filters',
+  'orders.listTitle': 'Order list',
+  'orders.showing': 'Showing {from} - {to} of {total}',
+  'orders.none': 'No orders',
+  'orders.empty': 'No results found.',
+  'orders.loading': 'Loading orders...',
+  'orders.error.load': 'Unable to load orders.',
+  'orders.error.minMax': 'Minimum cost cannot be greater than maximum cost.',
+  'orders.error.remove': 'Unable to remove order.',
+  'orders.removed': 'Order {orderNumber} has been removed.',
+  'orders.col.orderId': 'Order ID',
+  'orders.col.customer': 'Customer',
+  'orders.col.items': 'Items',
+  'orders.col.total': 'Total cost',
+  'orders.col.date': 'Date & time',
+  'orders.col.step': 'Step',
+  'orders.col.source': 'Registered by',
+  'orders.col.actions': 'Actions',
+  'orders.pageMeta': 'Page {page} / {totalPages} · {pageSize} per page · {total} total',
+  'orders.viewItems': 'View items',
+  'orders.transactions': 'Transaction details',
+  'orders.remove': 'Remove order',
+  'orders.changeStep': 'Change step: {step}',
+  'orders.deleteTitle': 'Remove order?',
+  'orders.deleteMessage': 'Remove order {orderNumber}? This cannot be undone.',
+  'orders.source.operator': 'Operator',
+  'orders.source.app': 'Application',
+  'orders.source.website': 'Website',
+
+  'shoppingCards.title': 'Shopping cards',
+  'shoppingCards.subtitle': 'Saved operator carts waiting to be completed as orders.',
+  'shoppingCards.listTitle': 'Shopping card list',
+  'shoppingCards.none': 'No shopping cards',
+  'shoppingCards.empty': 'No results found.',
+  'shoppingCards.loading': 'Loading shopping cards...',
+  'shoppingCards.error.load': 'Unable to load shopping cards.',
+  'shoppingCards.error.remove': 'Unable to remove shopping card.',
+  'shoppingCards.removed': 'Shopping card removed.',
+  'shoppingCards.continue': 'Continue',
+  'shoppingCards.continueAria': 'Continue shopping card',
+  'shoppingCards.remove': 'Remove card',
+  'shoppingCards.removeAria': 'Remove shopping card',
+  'shoppingCards.deleteTitle': 'Remove shopping card?',
+  'shoppingCards.deleteMessage':
+    'Remove this shopping card for {name}? This cannot be undone.',
+
+  'storeSettings.title': 'Store settings',
+  'storeSettings.subtitle':
+    'Control online sales and define how orders move through fulfillment.',
+  'storeSettings.sales': 'Sales',
+  'storeSettings.onlineSell': 'Online sell',
+  'storeSettings.onlineSellDesc':
+    'When disabled, all sales on your website are turned off. Customers will not be able to place new orders online.',
+  'storeSettings.orderProcess': 'Order process',
+  'storeSettings.orderProcessDesc':
+    'Define the steps an order can move through — for example: under processing, ready for shipping, shipped, delivered.',
+  'storeSettings.labelEn': 'Label (EN)',
+  'storeSettings.labelFa': 'عنوان (فارسی)',
+  'storeSettings.stepEnAria': 'Order step {index} English label',
+  'storeSettings.stepFaAria': 'Order step {index} Farsi label',
+  'storeSettings.stepColorAria': 'Color for step {index}',
+  'storeSettings.moveUp': 'Move step up',
+  'storeSettings.moveDown': 'Move step down',
+  'storeSettings.removeStep': 'Remove step',
+  'storeSettings.addStep': 'Add step',
+  'storeSettings.saveSteps': 'Save steps',
+  'storeSettings.saving': 'Saving...',
+  'storeSettings.emptySteps':
+    'No order steps yet. Add the first step to define your workflow.',
+  'storeSettings.error.minSteps': 'Add at least one order process step.',
+  'storeSettings.error.labels': 'Every order step needs an English and Farsi label.',
+  'storeSettings.error.saveSteps': 'Unable to save order process steps.',
+  'storeSettings.stepsSaved': 'Order process steps saved.',
+
+  'customers.title': 'Customers',
+  'customers.subtitle':
+    'View customers who have registered or ordered from your business.',
+  'customers.filters': 'Filters',
+  'customers.filter.name': 'Search by name',
+  'customers.filter.cell': 'Cell number',
+  'customers.search': 'Search',
+  'customers.clearFilters': 'Clear filters',
+  'customers.listTitle': 'Customer list',
+  'customers.showing': 'Showing {from} - {to} of {total}',
+  'customers.none': 'No customers',
+  'customers.empty': 'No results found.',
+  'customers.loading': 'Loading customers...',
+  'customers.pageMeta': 'Page {page} / {totalPages} · {pageSize} per page · {total} total',
+  'customers.col.name': 'Name',
+  'customers.col.cell': 'Cell number',
+  'customers.col.email': 'Email',
+  'customers.col.orders': 'Orders',
+  'customers.col.transactions': 'Transactions',
+  'customers.col.date': 'Date joined',
+  'customers.col.actions': 'Actions',
+  'customers.noOrders': 'No order yet',
+  'customers.disabled': 'Disabled',
+  'customers.enable': 'Enable customer',
+  'customers.disable': 'Disable customer',
+  'customers.enableAria': 'Enable {name}',
+  'customers.disableAria': 'Disable {name}',
+  'customers.edit': 'Edit customer',
+  'customers.sms': 'Send SMS',
+  'customers.tickets': 'Tickets',
+  'customers.remove': 'Remove customer',
+  'customers.add': 'Add customer',
+  'customers.error.load': 'Unable to load customers.',
+  'customers.error.update': 'Unable to update customer.',
+  'customers.error.remove': 'Unable to remove customer.',
+  'customers.toast.enabled': '"{name}" has been enabled.',
+  'customers.toast.disabled': '"{name}" has been disabled.',
+  'customers.toast.removed': '"{name}" has been removed.',
+  'customers.toast.updated': '"{name}" has been updated.',
+  'customers.toast.added': '"{name}" has been added.',
+  'customers.toast.smsSoon': 'SMS to {phone} is not available yet.',
+  'customers.toast.ticketsSoon': 'Tickets for "{name}" are not available yet.',
+  'customers.deleteTitle': 'Remove customer?',
+  'customers.deleteMessage':
+    'Remove "{name}" from your business? Their account will not be deleted.',
+  'customers.addModal.title': 'Add customer',
+  'customers.addModal.subtitle':
+    'Creates a verified customer account or links an existing user to your business.',
+  'customers.addModal.hint':
+    'Password is required only for new accounts. Existing users are added as verified customers.',
+  'customers.addModal.firstName': 'First name',
+  'customers.addModal.lastName': 'Last name',
+  'customers.addModal.cell': 'Cell number',
+  'customers.addModal.cellPlaceholder': '0912...',
+  'customers.addModal.password': 'Password (new users)',
+  'customers.addModal.passwordPlaceholder': 'Min. 8 characters',
+  'customers.addModal.passwordConfirm': 'Retype password',
+  'customers.addModal.passwordConfirmPlaceholder': 'Repeat password',
+  'customers.addModal.cancel': 'Cancel',
+  'customers.addModal.submit': 'Add customer',
+  'customers.addModal.error': 'Unable to add customer.',
+  'customers.addModal.errorPasswordMatch': 'Passwords do not match.',
+  'customers.addModal.errorPasswordLength': 'Password must be at least 8 characters.',
+
+  'blog.page.subtitle': 'Create and manage blog posts and categories.',
+  'blog.card.list.desc': 'View, edit and manage all your blog posts.',
+  'blog.card.list.link': 'View blogs',
+  'blog.card.new.desc': 'Create and publish a new blog post.',
+  'blog.card.new.link': 'Add blog',
+  'blog.card.categories.title': 'Blog Categories',
+  'blog.card.categories.desc': 'Organize your blog posts into categories and subcategories.',
+  'blog.card.categories.link': 'View categories',
+  'blog.card.settings.desc': 'Configure blog comment moderation and display options.',
+  'blog.card.settings.link': 'View settings',
+
+  'blog.list.subtitle': '{count} posts · View, edit and manage your blog content.',
+  'blog.list.loading': 'Loading blog posts...',
+  'blog.list.empty': 'No blog posts found.',
+  'blog.list.errorLoad': 'Unable to load blog posts.',
+  'blog.list.errorDelete': 'Unable to delete blog post.',
+  'blog.list.errorVerify': 'Unable to update blog verification.',
+  'blog.list.toast.removed': 'Blog post removed.',
+  'blog.list.toast.verified': 'Blog verified.',
+  'blog.list.toast.unverified': 'Blog unverified.',
+  'blog.list.deleteTitle': 'Delete Blog Post',
+  'blog.list.deleteMessage':
+    'Are you sure you want to delete "{name}"? This action cannot be undone.',
+  'blog.list.addNew': 'Add new blog',
+
+  'blog.card.edit': 'Edit blog',
+  'blog.card.verify': 'Verify blog',
+  'blog.card.unverify': 'Unverify blog',
+  'blog.card.comments': 'View comments',
+  'blog.card.remove': 'Remove blog',
+  'blog.card.waiting': 'Waiting',
+  'blog.card.verified': 'Verified',
+  'blog.card.noSummary': 'No summary yet.',
+
+  'blog.settings.title': 'Blog settings',
+  'blog.settings.subtitle': 'Configure how blog comments are moderated.',
+  'blog.settings.commentsAuto': 'Auto-approve comments',
+  'blog.settings.commentsAutoDesc':
+    'New blog comments are published immediately when submitted. You can still reject them later if needed.',
+  'blog.settings.commentsAutoAria': 'Auto-approve blog comments',
+
+  'blog.categories.title': 'Blog Categories',
+  'blog.categories.subtitle': 'Organize your blog posts into categories and subcategories.',
+  'blog.categories.empty': 'No categories yet. Click + to add one.',
+  'blog.categories.errorLoad': 'Unable to load categories.',
+  'blog.categories.errorSave': 'Unable to save category.',
+  'blog.categories.errorDelete': 'Unable to delete category.',
+
+  'blog.form.add.subtitle': 'Create and publish a new blog post.',
+  'blog.form.edit.subtitle': 'Update blog post details and save changes.',
+  'blog.form.cancel': 'Cancel',
+  'blog.form.saving': 'Saving...',
+  'blog.form.save': 'Save Blog',
+  'blog.form.update': 'Update Blog',
+  'blog.form.errorSave': 'Unable to save blog post.',
+  'blog.form.toast.created': 'Blog post created.',
+  'blog.form.toast.updated': 'Blog post updated.',
+  'blog.form.titleImage': 'Title Image',
+  'blog.form.uploadTitleImage': 'Upload title image',
+  'blog.form.changeTitleImage': 'Change title image',
+  'blog.form.cropHint': 'Click to select, then crop',
+  'blog.form.type': 'Type',
+  'blog.form.category': 'Category',
+  'blog.form.categoryPlaceholder': 'Search and select category...',
+  'blog.form.title': 'Title',
+  'blog.form.titlePlaceholder': 'Blog post title',
+  'blog.form.abstract': 'Abstract',
+  'blog.form.abstractPlaceholder': 'Short summary shown in blog listings',
+  'blog.form.mainText': 'Main Text',
+  'blog.form.mainTextPlaceholder': 'Full blog content with formatting and images...',
+  'blog.form.tags': 'Tags',
+  'blog.form.type.article': 'Article',
+  'blog.form.type.news': 'News',
+  'blog.form.type.blog': 'Blog',
+
+  'blog.details.loading': 'Loading blog post...',
+  'blog.details.notFound': 'Blog post not found.',
+  'blog.details.errorLoad': 'Unable to load blog post.',
+  'blog.details.back': 'Back to My Blogs',
+  'blog.details.noContent': 'No content yet.',
+  'blog.details.author': 'Author',
+
+  'portfolio.page.subtitle': 'Manage your portfolio items and showcase projects.',
+  'portfolio.card.list.desc': 'View, edit and manage all your portfolio items.',
+  'portfolio.card.list.link': 'View portfolios',
+  'portfolio.card.new.desc': 'Create and publish a new portfolio project.',
+  'portfolio.card.new.link': 'Add portfolio',
+  'portfolio.card.categories.title': 'Portfolio Categories',
+  'portfolio.card.categories.desc': 'Organize portfolio items into categories and subcategories.',
+  'portfolio.card.categories.link': 'View categories',
+  'portfolio.card.settings.desc': 'Configure portfolio comment moderation and display options.',
+  'portfolio.card.settings.link': 'View settings',
+
+  'portfolio.list.subtitle': '{count} items · View, edit and manage your portfolio content.',
+  'portfolio.list.loading': 'Loading portfolios...',
+  'portfolio.list.empty': 'No portfolio items found.',
+  'portfolio.list.errorLoad': 'Unable to load portfolios.',
+  'portfolio.list.errorDelete': 'Unable to delete portfolio.',
+  'portfolio.list.errorMove': 'Unable to move portfolio.',
+  'portfolio.list.toast.removed': 'Portfolio removed.',
+  'portfolio.list.toast.movedUp': 'Portfolio moved up.',
+  'portfolio.list.deleteTitle': 'Delete Portfolio',
+  'portfolio.list.deleteMessage':
+    'Are you sure you want to delete "{name}"? This action cannot be undone.',
+  'portfolio.list.addNew': 'Add new portfolio',
+
+  'portfolio.card.moveUp': 'Move up',
+  'portfolio.card.edit': 'Edit portfolio',
+  'portfolio.card.comments': 'View comments',
+  'portfolio.card.remove': 'Remove portfolio',
+  'portfolio.card.noSummary': 'No summary yet.',
+
+  'portfolio.settings.title': 'Portfolio settings',
+  'portfolio.settings.subtitle': 'Configure how portfolio comments are moderated.',
+  'portfolio.settings.commentsAuto': 'Auto-approve comments',
+  'portfolio.settings.commentsAutoDesc':
+    'New portfolio comments are published immediately when submitted. You can still reject them later if needed.',
+  'portfolio.settings.commentsAutoAria': 'Auto-approve portfolio comments',
+
+  'portfolio.categories.title': 'Portfolio Categories',
+  'portfolio.categories.subtitle':
+    'Organize your portfolio items into categories and subcategories.',
+  'portfolio.categories.empty': 'No categories yet. Click + to add one.',
+  'portfolio.categories.errorLoad': 'Unable to load categories.',
+  'portfolio.categories.errorSave': 'Unable to save category.',
+  'portfolio.categories.errorDelete': 'Unable to delete category.',
+
+  'portfolio.form.add.subtitle': 'Create and publish a new portfolio project.',
+  'portfolio.form.edit.subtitle': 'Update portfolio details and save changes.',
+  'portfolio.form.cancel': 'Cancel',
+  'portfolio.form.saving': 'Saving...',
+  'portfolio.form.save': 'Save Portfolio',
+  'portfolio.form.update': 'Update Portfolio',
+  'portfolio.form.errorSave': 'Unable to save portfolio.',
+  'portfolio.form.toast.created': 'Portfolio created.',
+  'portfolio.form.toast.updated': 'Portfolio updated.',
+  'portfolio.form.titleImage': 'Title Image',
+  'portfolio.form.aspectAria': 'Title image aspect ratio',
+  'portfolio.form.aspect.square': 'Square',
+  'portfolio.form.aspect.reel': '9:16 (Reel)',
+  'portfolio.form.uploadTitleImage': 'Upload title image',
+  'portfolio.form.changeTitleImage': 'Change title image',
+  'portfolio.form.cropHint': 'Click to select, then crop',
+  'portfolio.form.category': 'Category',
+  'portfolio.form.categoryPlaceholder': 'Search and select category...',
+  'portfolio.form.titleFa': 'Title (FA)',
+  'portfolio.form.titleFaPlaceholder': 'عنوان فارسی',
+  'portfolio.form.titleEn': 'Title (EN)',
+  'portfolio.form.titleEnPlaceholder': 'English title',
+  'portfolio.form.abstract': 'Abstract',
+  'portfolio.form.abstractPlaceholder': 'Short summary shown in portfolio listings',
+  'portfolio.form.mainText': 'Main Text',
+  'portfolio.form.mainTextPlaceholder': 'Full portfolio content with formatting and images...',
+  'portfolio.form.gallery': 'Image Gallery',
+  'portfolio.form.tags': 'Tags',
+
+  'portfolio.details.loading': 'Loading portfolio...',
+  'portfolio.details.notFound': 'Portfolio not found.',
+  'portfolio.details.errorLoad': 'Unable to load portfolio.',
+  'portfolio.details.back': 'Back to My Portfolios',
+  'portfolio.details.noContent': 'No content yet.',
+  'portfolio.details.gallery': 'Gallery',
+  'portfolio.details.galleryImage': 'View gallery image {index}',
+
+  'website.page.subtitle': 'Manage public website content, forms, and customer-facing settings.',
+  'website.card.sliders.desc': 'Manage homepage banner sliders and promotional image carousels.',
+  'website.card.sliders.link': 'Manage sliders',
+  'website.card.specialCategories.desc':
+    'Highlight selected product categories on your website homepage.',
+  'website.card.specialCategories.link': 'Manage categories',
+  'website.card.specialBrands.desc': 'Showcase partner or featured brands on your website homepage.',
+  'website.card.specialBrands.link': 'Manage brands',
+  'website.card.specialItems.desc':
+    'Curate featured store items into categories for your website carousels.',
+  'website.card.specialItems.link': 'Manage special items',
+  'website.card.contact.desc': 'View submissions from your website contact form.',
+  'website.card.contact.link': 'View submissions',
+  'website.card.subscriptions.desc':
+    'Manage newsletter sign-ups and subscription options for visitors.',
+  'website.card.subscriptions.link': 'Manage subscriptions',
+  'website.card.faq.desc': 'Create and organize frequently asked questions for your website.',
+  'website.card.faq.link': 'Manage FAQ',
+  'website.card.badges.desc': 'Show trust badges, certifications, and highlights on your website.',
+  'website.card.badges.link': 'Manage badges',
+  'website.card.ePayment.desc': 'Configure online payment gateways and checkout payment options.',
+  'website.card.ePayment.link': 'Manage e-payment',
+
+  'website.scrollLeft': 'Scroll left',
+  'website.scrollRight': 'Scroll right',
+  'website.editGroup': 'Edit group',
+  'website.deleteGroup': 'Delete group',
+  'website.removeFromGroup': 'Remove from group',
+  'website.save': 'Save',
+  'website.create': 'Create',
+  'website.adding': 'Adding...',
+  'website.saving': 'Saving...',
+  'website.groupTitle': 'Group title',
+  'website.groupTitlePlaceholder': 'e.g. Featured, Best Sellers',
+  'website.groupKey': 'Key (English)',
+  'website.groupKeyPlaceholder': 'e.g. top-selling',
+  'website.groupKeyHint':
+    'English only — letters, numbers, hyphens, underscores. Used by websites.',
+  'website.groupValue': 'Display title',
+  'website.groupValuePlaceholder': 'Shown on the website in any language',
+  'website.removeFromGroupTitle': 'Remove from Group',
+  'website.removeFromGroupMessage': 'Remove "{name}" from "{group}"?',
+  'website.pick.addTo': 'Add to {title}',
+  'website.pick.addOneCategory': 'Add 1 category',
+  'website.pick.addCategories': 'Add {count} categories',
+  'website.pick.addOneBrand': 'Add 1 brand',
+  'website.pick.addBrands': 'Add {count} brands',
+
+  'website.sliders.subtitle': 'Manage homepage banner slides in a 9:4 gallery.',
+  'website.sliders.loading': 'Loading slides...',
+  'website.sliders.errorLoad': 'Unable to load slides.',
+  'website.sliders.errorUpload': 'Unable to upload slide image.',
+  'website.sliders.errorAdd': 'Unable to add slide.',
+  'website.sliders.errorRemove': 'Unable to remove slide.',
+  'website.sliders.toastAdded': 'Slide added.',
+  'website.sliders.toastRemoved': 'Slide removed.',
+  'website.sliders.removeTitle': 'Remove Slide',
+  'website.sliders.removeMessage': 'Remove this slide from the homepage slider?',
+  'website.sliders.defaultTitle': 'Homepage slider',
+  'website.sliders.addSlide': 'Add slide',
+  'website.sliders.removeSlide': 'Remove slide',
+  'website.sliders.untitled': 'Untitled slide',
+  'website.sliders.slideAlt': 'Slider slide',
+  'website.sliders.modal.title': 'Add slide',
+  'website.sliders.modal.image': 'Slide image',
+  'website.sliders.modal.upload': 'Upload slide image',
+  'website.sliders.modal.hint': '9:4 banner ratio recommended',
+  'website.sliders.modal.changeImage': 'Change image',
+  'website.sliders.modal.titleOptional': 'Title (optional)',
+  'website.sliders.modal.titlePlaceholder': 'e.g. Summer sale',
+  'website.sliders.modal.linkOptional': 'Link URL (optional)',
+  'website.sliders.modal.addSlide': 'Add slide',
+
+  'website.specialCategories.subtitle':
+    'Curate featured product categories into groups for your website homepage.',
+  'website.specialCategories.loading': 'Loading special category groups...',
+  'website.specialCategories.empty':
+    'No special category groups yet. Use the + button to create one, then add categories to each carousel.',
+  'website.specialCategories.errorLoad': 'Unable to load special category groups.',
+  'website.specialCategories.errorCreate': 'Unable to create special category group.',
+  'website.specialCategories.errorUpdate': 'Unable to update special category group.',
+  'website.specialCategories.errorDelete': 'Unable to delete special category group.',
+  'website.specialCategories.errorAdd': 'Unable to add categories.',
+  'website.specialCategories.errorRemove': 'Unable to remove category.',
+  'website.specialCategories.toastCreated': 'Special category group created.',
+  'website.specialCategories.toastUpdated': 'Special category group updated.',
+  'website.specialCategories.toastDeleted': 'Special category group deleted.',
+  'website.specialCategories.toastAdded': 'Categories added to group.',
+  'website.specialCategories.toastRemoved': 'Removed from special category group.',
+  'website.specialCategories.addFab': 'Add special category group',
+  'website.specialCategories.addTooltip': 'Add categories to {title}',
+  'website.specialCategories.createTitle': 'Add Special Category Group',
+  'website.specialCategories.editTitle': 'Edit Special Category Group',
+  'website.specialCategories.deleteTitle': 'Delete Special Category Group',
+  'website.specialCategories.deleteMessage':
+    'Delete "{title}"? Product categories will remain in your catalog.',
+  'website.specialCategories.pickSubtitle':
+    'Select product categories to feature in this group.',
+  'website.specialCategories.pickLoading': 'Loading categories...',
+  'website.specialCategories.pickEmpty': 'All categories are already in this group.',
+  'website.specialCategories.pickSearch': 'Type 3+ characters to search categories',
+  'website.specialCategories.pickErrorLoad': 'Unable to load categories.',
+
+  'website.specialBrands.subtitle': 'Curate featured brands into groups for your website homepage.',
+  'website.specialBrands.loading': 'Loading special brand groups...',
+  'website.specialBrands.empty':
+    'No special brand groups yet. Use the + button to create one, then add brands to each carousel.',
+  'website.specialBrands.errorLoad': 'Unable to load special brand groups.',
+  'website.specialBrands.errorCreate': 'Unable to create special brand group.',
+  'website.specialBrands.errorUpdate': 'Unable to update special brand group.',
+  'website.specialBrands.errorDelete': 'Unable to delete special brand group.',
+  'website.specialBrands.errorAdd': 'Unable to add brands.',
+  'website.specialBrands.errorRemove': 'Unable to remove brand.',
+  'website.specialBrands.toastCreated': 'Special brand group created.',
+  'website.specialBrands.toastUpdated': 'Special brand group updated.',
+  'website.specialBrands.toastDeleted': 'Special brand group deleted.',
+  'website.specialBrands.toastAdded': 'Brands added to group.',
+  'website.specialBrands.toastRemoved': 'Removed from special brand group.',
+  'website.specialBrands.addFab': 'Add special brand group',
+  'website.specialBrands.addTooltip': 'Add brands to {title}',
+  'website.specialBrands.createTitle': 'Add Special Brand Group',
+  'website.specialBrands.editTitle': 'Edit Special Brand Group',
+  'website.specialBrands.deleteTitle': 'Delete Special Brand Group',
+  'website.specialBrands.deleteMessage':
+    'Delete "{title}"? Brands will remain in your catalog.',
+  'website.specialBrands.pickSubtitle': 'Select brands to feature in this group.',
+  'website.specialBrands.pickLoading': 'Loading brands...',
+  'website.specialBrands.pickEmpty': 'All brands are already in this group.',
+  'website.specialBrands.pickSearch': 'Type 3+ characters to search brands',
+  'website.specialBrands.pickErrorLoad': 'Unable to load brands.',
+
+  'website.specialItems.subtitle':
+    'Curate featured store items into categories for your website carousels.',
+  'website.specialItems.loading': 'Loading special categories...',
+  'website.specialItems.empty':
+    'No special categories yet. Use the + button to create one, then add store items to each carousel.',
+  'website.specialItems.errorLoad': 'Unable to load special categories.',
+  'website.specialItems.errorCreate': 'Unable to create special category.',
+  'website.specialItems.errorUpdate': 'Unable to update special category.',
+  'website.specialItems.errorDelete': 'Unable to delete special category.',
+  'website.specialItems.errorAdd': 'Unable to add store items.',
+  'website.specialItems.errorRemove': 'Unable to remove store item.',
+  'website.specialItems.toastCreated': 'Special category created.',
+  'website.specialItems.toastUpdated': 'Special category updated.',
+  'website.specialItems.toastDeleted': 'Special category deleted.',
+  'website.specialItems.toastAdded': 'Store items added to special category.',
+  'website.specialItems.toastRemoved': 'Removed from special category.',
+  'website.specialItems.addFab': 'Add special category',
+  'website.specialItems.createTitle': 'Add Special Category',
+  'website.specialItems.editTitle': 'Edit Special Category',
+  'website.specialItems.deleteTitle': 'Delete Special Category',
+  'website.specialItems.deleteMessage':
+    'Delete "{title}"? Store items will remain in your catalog.',
+  'website.specialItems.removeTitle': 'Remove from Special',
+  'website.specialItems.removeMessage':
+    'Remove "{name}" from "{group}"?',
+  'website.specialItems.editCategory': 'Edit category',
+  'website.specialItems.deleteCategory': 'Delete category',
+  'website.specialItems.scrollLeft': 'Scroll left',
+  'website.specialItems.scrollRight': 'Scroll right',
+  'website.specialItems.addItemsTo': 'Add store items to {title}',
+  'website.specialItems.removeFromSpecial': 'Remove from special',
+  'website.specialItems.pickSubtitle': 'Select store items to feature in this category.',
+  'website.specialItems.pickLoading': 'Loading store items...',
+  'website.specialItems.pickEmpty': 'All store items are already in this category.',
+  'website.specialItems.pickSearch': 'Type 3+ characters to search store items',
+  'website.specialItems.pickErrorLoad': 'Unable to load store items.',
+  'website.pick.addOneItem': 'Add 1 item',
+  'website.pick.addItems': 'Add {count} items',
+
+  'website.contact.subtitle': 'Submissions received from your website contact form.',
+  'website.contact.filters': 'Filters',
+  'website.contact.searchPlaceholder': 'Title, name, email, cell number, or message',
+  'website.contact.search': 'Search',
+  'website.contact.clearFilters': 'Clear filters',
+  'website.contact.listTitle': 'Submissions',
+  'website.contact.showing': 'Showing {from} - {to} of {total}',
+  'website.contact.none': 'No submissions',
+  'website.contact.empty': 'No submissions found.',
+  'website.contact.loading': 'Loading...',
+  'website.contact.errorLoad': 'Unable to load contact submissions.',
+  'website.contact.pageMeta': 'Page {page} / {totalPages} · {pageSize} per page · {total} total',
+  'website.contact.col.title': 'Title',
+  'website.contact.col.name': 'Name',
+  'website.contact.col.email': 'Email',
+  'website.contact.col.cell': 'Cell number',
+  'website.contact.col.date': 'Date',
+  'website.contact.col.time': 'Time',
+  'website.contact.viewSubmission': 'View submission from {name}',
+  'website.contact.detailTitle': 'Contact submission',
+  'website.contact.detailMessage': 'Message',
+
+  'website.subscriptions.subtitle': 'Manage newsletter and subscription sign-ups on your website.',
+  'website.subscriptions.lead': 'Control how visitors subscribe to updates from your business.',
+  'website.subscriptions.note': 'Subscription management will be connected here. Planned options include:',
+  'website.subscriptions.feature.enable': 'Enable or disable subscription forms',
+  'website.subscriptions.feature.welcome': 'Custom welcome message and consent text',
+  'website.subscriptions.feature.export': 'Export or view subscriber list',
+
+  'website.faq.subtitle': 'Create and organize frequently asked questions for your website.',
+  'website.faq.lead':
+    'Build an FAQ section to answer common customer questions before they contact you.',
+  'website.faq.note': 'FAQ editor will be connected here. Planned options include:',
+  'website.faq.feature.crud': 'Add, edit, and reorder questions and answers',
+  'website.faq.feature.groups': 'Group items by category',
+  'website.faq.feature.publish': 'Publish or hide individual entries',
+
+  'website.badges.subtitle': 'Show trust badges and highlights on your public website.',
+  'website.badges.lead':
+    'Display certifications, guarantees, and trust signals to website visitors.',
+  'website.badges.note': 'Badge management will be connected here. Planned options include:',
+  'website.badges.feature.upload': 'Upload badge images with title and link',
+  'website.badges.feature.reorder': 'Reorder badges for homepage or footer display',
+  'website.badges.feature.toggle': 'Toggle visibility per badge',
+
+  'website.ePayment.subtitle': 'Configure online payment methods for your website checkout.',
+  'website.ePayment.lead': 'Connect payment gateways so customers can pay online through your store.',
+  'website.ePayment.note': 'E-payment settings will be connected here. Planned options include:',
+  'website.ePayment.feature.enable': 'Enable or disable online payments',
+  'website.ePayment.feature.credentials': 'Configure payment provider credentials',
+  'website.ePayment.feature.methods': 'Set supported payment methods and test mode',
+
   'title.signIn': 'Sign in',
   'title.home': 'Home',
   'title.businessProfile': 'Business Profile',
@@ -380,6 +1116,741 @@ const fa: Record<MessageKey, string> = {
   'products.activity.barAdded': '{month}: {count} افزوده‌شده',
   'products.activity.barUpdated': '{month}: {count} به‌روزرسانی‌شده',
 
+  'products.list.subtitle': '{count} محصول · کاتالوگ خود را ببینید، ویرایش و مدیریت کنید.',
+  'products.list.filters': 'فیلترها',
+  'products.list.filterName': 'نام',
+  'products.list.filterNamePlaceholder': 'جستجو بر اساس نام محصول',
+  'products.list.search': 'جستجو',
+  'products.list.clearFilters': 'پاک کردن فیلترها',
+  'products.list.loading': 'در حال بارگذاری محصولات...',
+  'products.list.empty': 'محصولی یافت نشد.',
+  'products.list.emptyFiltered': 'هیچ محصولی با فیلترهای شما مطابقت ندارد.',
+  'products.list.errorLoad': 'بارگذاری محصولات ممکن نشد.',
+  'products.list.errorDelete': 'حذف محصول ممکن نشد.',
+  'products.list.pagination': 'صفحه {page} / {totalPages} · {perPage} در هر صفحه · {total} مجموع',
+  'products.list.deleteTitle': 'حذف محصول',
+  'products.list.deleteMessage':
+    'آیا از حذف «{name}» مطمئن هستید؟ این عمل قابل بازگشت نیست.',
+  'products.list.addByAi': 'افزودن محصول با هوش مصنوعی',
+  'products.list.addNew': 'افزودن محصول جدید',
+  'products.card.edit': 'ویرایش محصول',
+  'products.card.quickInfo': 'اطلاعات سریع',
+  'products.card.variations': 'مدیریت تنوع‌ها',
+  'products.card.comments': 'مشاهده نظرات',
+  'products.card.technical': 'اطلاعات فنی',
+  'products.card.remove': 'حذف محصول',
+  'products.card.draft': 'پیش‌نویس',
+
+  'products.form.errorOptions': 'بارگذاری گزینه‌های فرم ممکن نشد.',
+  'products.form.errorSave': 'ذخیره محصول ممکن نشد.',
+  'products.form.thumbnail': 'تصویر بندانگشتی',
+  'products.form.thumbnailUpload': 'آپلود تصویر بندانگشتی',
+  'products.form.thumbnailHint': 'برای انتخاب کلیک کنید، سپس برش دهید',
+  'products.form.thumbnailChange': 'تغییر تصویر بندانگشتی',
+  'products.form.thumbnailRemove': 'حذف تصویر بندانگشتی',
+  'products.form.zoom': 'بزرگ‌نمایی',
+  'products.form.applyCrop': 'اعمال برش',
+  'products.form.category': 'دسته‌بندی',
+  'products.form.categoryPlaceholder': 'جستجو و انتخاب دسته‌بندی...',
+  'products.form.brand': 'برند',
+  'products.form.optional': '(اختیاری)',
+  'products.form.brandPlaceholder': 'جستجو و انتخاب برند...',
+  'products.form.nameFa': 'نام (فارسی)',
+  'products.form.nameFaPlaceholder': 'نام محصول',
+  'products.form.nameEn': 'نام (انگلیسی)',
+  'products.form.nameEnPlaceholder': 'Product name',
+  'products.form.summary': 'خلاصه',
+  'products.form.summaryPlaceholder': 'خلاصه کوتاه برای نمایش در فهرست محصولات',
+  'products.form.description': 'توضیحات',
+  'products.form.descriptionPlaceholder': 'توضیحات کامل محصول با قالب‌بندی...',
+  'products.form.images': 'تصاویر محصول',
+  'products.form.imagesAdd': 'افزودن تصاویر',
+  'products.form.imagesHint': 'چند تصویر محصول آپلود کنید. برای افزودن بیشتر روی + کلیک کنید.',
+  'products.form.imagesRemove': 'حذف تصویر {index}',
+  'products.form.tags': 'برچسب‌ها',
+  'products.form.tagsPlaceholder': 'برچسب را بنویسید و Enter بزنید',
+  'products.form.cancel': 'انصراف',
+  'products.form.saving': 'در حال ذخیره...',
+  'products.form.save': 'ذخیره محصول',
+  'products.form.update': 'به‌روزرسانی محصول',
+
+  'categories.page.subtitle': 'دسته‌بندی‌ها و زیردسته‌های محصولات دیجیتال خود را مدیریت کنید.',
+  'categories.loading': 'در حال بارگذاری دسته‌بندی‌ها...',
+  'categories.empty': 'هنوز دسته‌بندی‌ای نیست. با + یا هوش مصنوعی اضافه کنید.',
+  'categories.add': 'افزودن دسته‌بندی',
+  'categories.addSub': 'افزودن زیردسته',
+  'categories.edit': 'ویرایش دسته‌بندی',
+  'categories.addByAi': 'پر کردن دسته‌ها با هوش مصنوعی',
+  'categories.deleteTitle': 'حذف دسته‌بندی',
+  'categories.deleteMessage':
+    'آیا از حذف «{name}» مطمئن هستید؟ زیردسته‌ها نیز حذف می‌شوند.',
+  'categories.tooltip.addSub': 'افزودن زیردسته',
+  'categories.tooltip.edit': 'ویرایش دسته‌بندی',
+  'categories.tooltip.variations': 'مدیریت تنوع‌ها',
+  'categories.tooltip.technical': 'فرم اطلاعات فنی',
+  'categories.tooltip.options': 'گزینه‌های دسته‌بندی',
+  'categories.tooltip.remove': 'حذف دسته‌بندی',
+  'categories.modal.parent': 'دسته والد',
+  'categories.modal.nameFa': 'نام (فارسی)',
+  'categories.modal.nameEn': 'نام (انگلیسی)',
+  'categories.modal.description': 'توضیحات',
+  'categories.modal.nameFaPlaceholder': 'نام دسته‌بندی',
+  'categories.modal.nameEnPlaceholder': 'Category name',
+  'categories.modal.descriptionPlaceholder': 'توضیح کوتاه این دسته‌بندی',
+  'categories.modal.cancel': 'انصراف',
+  'categories.modal.save': 'ذخیره دسته‌بندی',
+  'categories.modal.saving': 'در حال ذخیره...',
+  'categories.select.search': 'جستجوی دسته‌بندی‌ها...',
+  'categories.select.none': '— بدون والد (دسته اصلی) —',
+  'categories.select.empty': 'دسته‌بندی‌ای یافت نشد',
+  'categories.select.clear': 'پاک کردن انتخاب',
+
+  'brands.page.subtitle': 'برندهای محصول فروشگاه خود را مدیریت کنید.',
+  'brands.loading': 'در حال بارگذاری برندها...',
+  'brands.empty': 'هنوز برندی نیست. برای افزودن روی + کلیک کنید.',
+  'brands.add': 'افزودن برند',
+  'brands.edit': 'ویرایش برند',
+  'brands.deleteTitle': 'حذف برند',
+  'brands.deleteMessage':
+    'آیا از حذف «{name}» مطمئن هستید؟ برند محصولات مرتبط پاک می‌شود.',
+  'brands.toast.created': 'برند ایجاد شد.',
+  'brands.toast.updated': 'برند به‌روزرسانی شد.',
+  'brands.toast.deleted': 'برند حذف شد.',
+  'brands.errorLoad': 'بارگذاری برندها ممکن نشد.',
+  'brands.errorSave': 'ذخیره برند ممکن نشد.',
+  'brands.errorDelete': 'حذف برند ممکن نشد.',
+  'brands.tooltip.edit': 'ویرایش برند',
+  'brands.tooltip.remove': 'حذف برند',
+  'brands.modal.logo': 'لوگوی برند',
+  'brands.modal.uploadLogo': 'آپلود لوگوی برند',
+  'brands.modal.logoHint': 'فقط PNG — پس‌زمینه شفاف توصیه می‌شود',
+  'brands.modal.changeLogo': 'تغییر لوگو',
+  'brands.modal.nameFa': 'نام (فارسی)',
+  'brands.modal.nameEn': 'نام (انگلیسی)',
+  'brands.modal.about': 'درباره',
+  'brands.modal.nameFaPlaceholder': 'نام برند',
+  'brands.modal.nameEnPlaceholder': 'Brand name',
+  'brands.modal.aboutPlaceholder': 'توضیح کوتاه این برند',
+  'brands.modal.cancel': 'انصراف',
+  'brands.modal.save': 'ذخیره برند',
+  'brands.modal.saving': 'در حال ذخیره...',
+
+  'productSettings.title': 'تنظیمات محصول',
+  'productSettings.subtitle': 'نحوه تأیید نظرات و بررسی‌های کارشناسی را پیکربندی کنید.',
+  'productSettings.moderation': 'نظارت',
+  'productSettings.loading': 'در حال بارگذاری تنظیمات...',
+  'productSettings.errorLoad': 'بارگذاری تنظیمات ممکن نشد.',
+  'productSettings.errorSave': 'ذخیره تنظیمات ممکن نشد.',
+  'productSettings.saved': 'تنظیمات ذخیره شد.',
+  'productSettings.commentsAuto': 'تأیید خودکار نظرات',
+  'productSettings.commentsAutoDesc':
+    'نظرات جدید بلافاصله پس از ثبت منتشر می‌شوند. در صورت نیاز بعداً می‌توانید آن‌ها را رد کنید.',
+  'productSettings.reviewsAuto': 'تأیید خودکار بررسی کارشناسی',
+  'productSettings.reviewsAutoDesc':
+    'بررسی‌های کارشناسی جدید بلافاصله پس از ثبت منتشر می‌شوند. در صورت نیاز بعداً می‌توانید آن‌ها را رد کنید.',
+
+  'store.page.subtitle': 'اقلام، سفارش‌ها و تنظیمات فروشگاه را مدیریت کنید.',
+  'store.card.items.desc': 'همه اقلام فهرست‌شده در فروشگاه را ببینید و مدیریت کنید.',
+  'store.card.items.link': 'مشاهده اقلام',
+  'store.card.orders.desc': 'سفارش‌های مشتریان و ارسال را پیگیری و مدیریت کنید.',
+  'store.card.orders.link': 'مشاهده سفارش‌ها',
+  'store.card.shipping.desc': 'نرخ‌ها، مناطق و گزینه‌های ارسال را پیکربندی کنید.',
+  'store.card.shipping.link': 'مدیریت ارسال',
+  'store.card.cards.desc': 'کارت‌های خرید ذخیره‌شده و روش‌های پرداخت را مدیریت کنید.',
+  'store.card.cards.link': 'مشاهده کارت‌ها',
+  'store.card.settings.desc': 'ترجیحات، صفحات و ظاهر فروشگاه را پیکربندی کنید.',
+  'store.card.settings.link': 'مشاهده تنظیمات',
+
+  'storeItems.subtitle': 'محصولات فروش با یک یا چند تنوع قیمت‌گذاری‌شده.',
+  'storeItems.filters': 'فیلترها',
+  'storeItems.filterName': 'نام',
+  'storeItems.filterNamePlaceholder': 'جستجو بر اساس نام محصول',
+  'storeItems.minPrice': 'حداقل قیمت (IRT)',
+  'storeItems.maxPrice': 'حداکثر قیمت (IRT)',
+  'storeItems.onlyDiscounted': 'فقط تخفیف‌دار',
+  'storeItems.search': 'جستجو',
+  'storeItems.clearFilters': 'پاک کردن فیلترها',
+  'storeItems.loading': 'در حال بارگذاری اقلام فروشگاه...',
+  'storeItems.empty': 'هنوز قلمی در فروشگاه نیست. با دکمه + از کاتالوگ اضافه کنید.',
+  'storeItems.emptyFiltered': 'هیچ قلمی با فیلترهای شما مطابقت ندارد.',
+  'storeItems.errorLoad': 'بارگذاری اقلام فروشگاه ممکن نشد.',
+  'storeItems.errorRemove': 'حذف قلم از فروشگاه ممکن نشد.',
+  'storeItems.add': 'افزودن اقلام فروشگاه',
+  'storeItems.cartOpen': 'باز کردن سبد خرید، {count} قلم',
+  'storeItems.cartOne': 'قلم در سبد',
+  'storeItems.cartMany': 'قلم در سبد',
+  'storeItems.addedToCart': 'به سبد خرید اضافه شد.',
+  'storeItems.deleteTitle': 'حذف از فروشگاه',
+  'storeItems.deleteMessage':
+    '«{name}» و همه {variants} از فروشگاه حذف شوند؟ این عمل قابل بازگشت نیست.',
+  'storeItems.card.inStock': '{count} موجود',
+  'storeItems.card.festival': 'جشنواره',
+  'storeItems.card.variantOne': '۱ تنوع',
+  'storeItems.card.variantMany': '{count} تنوع',
+  'storeItems.card.edit': 'ویرایش اقلام فروشگاه',
+  'storeItems.card.discount': 'تنظیم تخفیف',
+  'storeItems.card.festivalPoints': 'امتیاز جشنواره',
+  'storeItems.card.remove': 'حذف از فروشگاه',
+  'storeItems.card.addToCart': 'افزودن به سبد خرید',
+  'storeItems.pick.title': 'انتخاب تنوع',
+  'storeItems.pick.inStock': '{count} موجود',
+  'storeItems.create.title': 'افزودن اقلام فروشگاه',
+  'storeItems.create.subtitle': 'تنوع‌های قابل فروش را از تنوع‌های یک محصول بسازید.',
+  'storeItems.create.productPlaceholder': 'محصول — حداقل ۳ کاراکتر برای جستجو',
+  'storeItems.create.loadingVariations': 'در حال بارگذاری تنوع‌های محصول...',
+  'storeItems.create.price': 'قیمت (IRT)',
+  'storeItems.create.stock': 'موجودی',
+  'storeItems.create.removeRow': 'حذف ردیف',
+  'storeItems.create.addRow': 'افزودن ردیف',
+  'storeItems.create.cancel': 'انصراف',
+  'storeItems.create.submit': 'ایجاد اقلام فروشگاه',
+  'storeItems.create.submitting': 'در حال ایجاد…',
+  'storeItems.create.errorProducts': 'بارگذاری محصولات ممکن نشد.',
+  'storeItems.create.errorVariations': 'بارگذاری تنوع‌های محصول ممکن نشد.',
+  'storeItems.create.errorCreate': 'ایجاد اقلام فروشگاه ممکن نشد.',
+  'storeItems.edit.title': 'ویرایش اقلام فروشگاه',
+  'storeItems.edit.save': 'ذخیره تغییرات',
+  'storeItems.edit.saving': 'در حال ذخیره…',
+  'storeItems.edit.errorSave': 'ذخیره اقلام فروشگاه ممکن نشد.',
+  'storeItems.search.clear': 'پاک کردن انتخاب',
+  'storeItems.search.noProducts': 'محصولی موجود نیست.',
+  'storeItems.search.noMatch': 'محصولی یافت نشد.',
+  'storeItems.search.minChars': 'حداقل {count} کاراکتر برای جستجو وارد کنید',
+
+  'orders.title': 'سفارش‌ها',
+  'orders.subtitle':
+    'سفارش‌های مشتریان از وب‌سایت، اپلیکیشن یا ثبت‌شده توسط اپراتور را پیگیری کنید.',
+  'orders.filters': 'فیلترها',
+  'orders.filter.orderId': 'شماره سفارش',
+  'orders.filter.customer': 'نام یا شماره مشتری',
+  'orders.filter.dateFrom': 'از تاریخ',
+  'orders.filter.dateTo': 'تا تاریخ',
+  'orders.filter.minCost': 'حداقل مبلغ (IRT)',
+  'orders.filter.maxCost': 'حداکثر مبلغ (IRT)',
+  'orders.search': 'جستجو',
+  'orders.clearFilters': 'پاک کردن فیلترها',
+  'orders.listTitle': 'فهرست سفارش‌ها',
+  'orders.showing': 'نمایش {from} تا {to} از {total}',
+  'orders.none': 'بدون سفارش',
+  'orders.empty': 'نتیجه‌ای یافت نشد.',
+  'orders.loading': 'در حال بارگذاری سفارش‌ها...',
+  'orders.error.load': 'بارگذاری سفارش‌ها ممکن نشد.',
+  'orders.error.minMax': 'حداقل مبلغ نمی‌تواند از حداکثر بیشتر باشد.',
+  'orders.error.remove': 'حذف سفارش ممکن نشد.',
+  'orders.removed': 'سفارش {orderNumber} حذف شد.',
+  'orders.col.orderId': 'شماره سفارش',
+  'orders.col.customer': 'مشتری',
+  'orders.col.items': 'اقلام',
+  'orders.col.total': 'مبلغ کل',
+  'orders.col.date': 'تاریخ و ساعت',
+  'orders.col.step': 'وضعیت',
+  'orders.col.source': 'ثبت‌شده توسط',
+  'orders.col.actions': 'عملیات',
+  'orders.pageMeta': 'صفحه {page} / {totalPages} · {pageSize} در هر صفحه · {total} کل',
+  'orders.viewItems': 'مشاهده اقلام',
+  'orders.transactions': 'جزئیات تراکنش',
+  'orders.remove': 'حذف سفارش',
+  'orders.changeStep': 'تغییر وضعیت: {step}',
+  'orders.deleteTitle': 'حذف سفارش؟',
+  'orders.deleteMessage': 'سفارش {orderNumber} حذف شود؟ این عمل قابل بازگشت نیست.',
+  'orders.source.operator': 'اپراتور',
+  'orders.source.app': 'اپلیکیشن',
+  'orders.source.website': 'وب‌سایت',
+
+  'shoppingCards.title': 'کارت‌های خرید',
+  'shoppingCards.subtitle': 'سبدهای ذخیره‌شده اپراتور که منتظر تکمیل به‌صورت سفارش هستند.',
+  'shoppingCards.listTitle': 'فهرست کارت‌های خرید',
+  'shoppingCards.none': 'بدون کارت خرید',
+  'shoppingCards.empty': 'نتیجه‌ای یافت نشد.',
+  'shoppingCards.loading': 'در حال بارگذاری کارت‌های خرید...',
+  'shoppingCards.error.load': 'بارگذاری کارت‌های خرید ممکن نشد.',
+  'shoppingCards.error.remove': 'حذف کارت خرید ممکن نشد.',
+  'shoppingCards.removed': 'کارت خرید حذف شد.',
+  'shoppingCards.continue': 'ادامه',
+  'shoppingCards.continueAria': 'ادامه کارت خرید',
+  'shoppingCards.remove': 'حذف کارت',
+  'shoppingCards.removeAria': 'حذف کارت خرید',
+  'shoppingCards.deleteTitle': 'حذف کارت خرید؟',
+  'shoppingCards.deleteMessage':
+    'کارت خرید «{name}» حذف شود؟ این عمل قابل بازگشت نیست.',
+
+  'storeSettings.title': 'تنظیمات فروشگاه',
+  'storeSettings.subtitle':
+    'فروش آنلاین را کنترل کنید و مسیر پردازش سفارش‌ها را تعریف کنید.',
+  'storeSettings.sales': 'فروش',
+  'storeSettings.onlineSell': 'فروش آنلاین',
+  'storeSettings.onlineSellDesc':
+    'در صورت غیرفعال بودن، همه فروش‌های وب‌سایت خاموش می‌شوند و مشتریان نمی‌توانند سفارش آنلاین ثبت کنند.',
+  'storeSettings.orderProcess': 'فرآیند سفارش',
+  'storeSettings.orderProcessDesc':
+    'مراحل طی‌شده توسط سفارش را تعریف کنید — مثلاً: در حال پردازش، آماده ارسال، ارسال‌شده، تحویل‌شده.',
+  'storeSettings.labelEn': 'Label (EN)',
+  'storeSettings.labelFa': 'عنوان (فارسی)',
+  'storeSettings.stepEnAria': 'برچسب انگلیسی مرحله {index}',
+  'storeSettings.stepFaAria': 'برچسب فارسی مرحله {index}',
+  'storeSettings.stepColorAria': 'رنگ مرحله {index}',
+  'storeSettings.moveUp': 'جابه‌جایی به بالا',
+  'storeSettings.moveDown': 'جابه‌جایی به پایین',
+  'storeSettings.removeStep': 'حذف مرحله',
+  'storeSettings.addStep': 'افزودن مرحله',
+  'storeSettings.saveSteps': 'ذخیره مراحل',
+  'storeSettings.saving': 'در حال ذخیره...',
+  'storeSettings.emptySteps':
+    'هنوز مرحله‌ای نیست. اولین مرحله را برای تعریف گردش کار اضافه کنید.',
+  'storeSettings.error.minSteps': 'حداقل یک مرحله فرآیند سفارش اضافه کنید.',
+  'storeSettings.error.labels': 'هر مرحله باید برچسب انگلیسی و فارسی داشته باشد.',
+  'storeSettings.error.saveSteps': 'ذخیره مراحل فرآیند سفارش ممکن نشد.',
+  'storeSettings.stepsSaved': 'مراحل فرآیند سفارش ذخیره شد.',
+
+  'customers.title': 'مشتریان',
+  'customers.subtitle':
+    'مشتریانی را ببینید که در کسب‌وکار شما ثبت‌نام کرده یا سفارش داده‌اند.',
+  'customers.filters': 'فیلترها',
+  'customers.filter.name': 'جستجو بر اساس نام',
+  'customers.filter.cell': 'شماره موبایل',
+  'customers.search': 'جستجو',
+  'customers.clearFilters': 'پاک کردن فیلترها',
+  'customers.listTitle': 'فهرست مشتریان',
+  'customers.showing': 'نمایش {from} تا {to} از {total}',
+  'customers.none': 'بدون مشتری',
+  'customers.empty': 'نتیجه‌ای یافت نشد.',
+  'customers.loading': 'در حال بارگذاری مشتریان...',
+  'customers.pageMeta': 'صفحه {page} / {totalPages} · {pageSize} در هر صفحه · {total} کل',
+  'customers.col.name': 'نام',
+  'customers.col.cell': 'شماره موبایل',
+  'customers.col.email': 'ایمیل',
+  'customers.col.orders': 'سفارش‌ها',
+  'customers.col.transactions': 'تراکنش‌ها',
+  'customers.col.date': 'تاریخ عضویت',
+  'customers.col.actions': 'عملیات',
+  'customers.noOrders': 'بدون سفارش',
+  'customers.disabled': 'غیرفعال',
+  'customers.enable': 'فعال‌سازی مشتری',
+  'customers.disable': 'غیرفعال‌سازی مشتری',
+  'customers.enableAria': 'فعال‌سازی {name}',
+  'customers.disableAria': 'غیرفعال‌سازی {name}',
+  'customers.edit': 'ویرایش مشتری',
+  'customers.sms': 'ارسال پیامک',
+  'customers.tickets': 'تیکت‌ها',
+  'customers.remove': 'حذف مشتری',
+  'customers.add': 'افزودن مشتری',
+  'customers.error.load': 'بارگذاری مشتریان ممکن نشد.',
+  'customers.error.update': 'به‌روزرسانی مشتری ممکن نشد.',
+  'customers.error.remove': 'حذف مشتری ممکن نشد.',
+  'customers.toast.enabled': '«{name}» فعال شد.',
+  'customers.toast.disabled': '«{name}» غیرفعال شد.',
+  'customers.toast.removed': '«{name}» حذف شد.',
+  'customers.toast.updated': '«{name}» به‌روزرسانی شد.',
+  'customers.toast.added': '«{name}» اضافه شد.',
+  'customers.toast.smsSoon': 'ارسال پیامک به {phone} هنوز در دسترس نیست.',
+  'customers.toast.ticketsSoon': 'تیکت‌های «{name}» هنوز در دسترس نیست.',
+  'customers.deleteTitle': 'حذف مشتری؟',
+  'customers.deleteMessage':
+    '«{name}» از کسب‌وکار شما حذف شود؟ حساب کاربری او حذف نخواهد شد.',
+  'customers.addModal.title': 'افزودن مشتری',
+  'customers.addModal.subtitle':
+    'یک حساب تأییدشده مشتری می‌سازد یا کاربر موجود را به کسب‌وکار شما وصل می‌کند.',
+  'customers.addModal.hint':
+    'رمز عبور فقط برای حساب‌های جدید لازم است. کاربران موجود به‌عنوان مشتری تأییدشده اضافه می‌شوند.',
+  'customers.addModal.firstName': 'نام',
+  'customers.addModal.lastName': 'نام خانوادگی',
+  'customers.addModal.cell': 'شماره موبایل',
+  'customers.addModal.cellPlaceholder': '۰۹۱۲...',
+  'customers.addModal.password': 'رمز عبور (کاربران جدید)',
+  'customers.addModal.passwordPlaceholder': 'حداقل ۸ کاراکتر',
+  'customers.addModal.passwordConfirm': 'تکرار رمز عبور',
+  'customers.addModal.passwordConfirmPlaceholder': 'رمز عبور را تکرار کنید',
+  'customers.addModal.cancel': 'انصراف',
+  'customers.addModal.submit': 'افزودن مشتری',
+  'customers.addModal.error': 'افزودن مشتری ممکن نشد.',
+  'customers.addModal.errorPasswordMatch': 'رمزهای عبور یکسان نیستند.',
+  'customers.addModal.errorPasswordLength': 'رمز عبور باید حداقل ۸ کاراکتر باشد.',
+
+  'blog.page.subtitle': 'مطالب و دسته‌بندی‌های بلاگ را ایجاد و مدیریت کنید.',
+  'blog.card.list.desc': 'همه مطالب بلاگ را مشاهده، ویرایش و مدیریت کنید.',
+  'blog.card.list.link': 'مشاهده بلاگ‌ها',
+  'blog.card.new.desc': 'یک مطلب بلاگ جدید ایجاد و منتشر کنید.',
+  'blog.card.new.link': 'افزودن بلاگ',
+  'blog.card.categories.title': 'دسته‌بندی‌های بلاگ',
+  'blog.card.categories.desc': 'مطالب بلاگ را در دسته‌بندی‌ها و زیردسته‌ها سازماندهی کنید.',
+  'blog.card.categories.link': 'مشاهده دسته‌بندی‌ها',
+  'blog.card.settings.desc': 'تأیید نظرات بلاگ و گزینه‌های نمایش را پیکربندی کنید.',
+  'blog.card.settings.link': 'مشاهده تنظیمات',
+
+  'blog.list.subtitle': '{count} مطلب · مشاهده، ویرایش و مدیریت محتوای بلاگ.',
+  'blog.list.loading': 'در حال بارگذاری مطالب بلاگ...',
+  'blog.list.empty': 'مطلب بلاگی یافت نشد.',
+  'blog.list.errorLoad': 'بارگذاری مطالب بلاگ ممکن نشد.',
+  'blog.list.errorDelete': 'حذف مطلب بلاگ ممکن نشد.',
+  'blog.list.errorVerify': 'به‌روزرسانی وضعیت تأیید بلاگ ممکن نشد.',
+  'blog.list.toast.removed': 'مطلب بلاگ حذف شد.',
+  'blog.list.toast.verified': 'بلاگ تأیید شد.',
+  'blog.list.toast.unverified': 'تأیید بلاگ لغو شد.',
+  'blog.list.deleteTitle': 'حذف مطلب بلاگ',
+  'blog.list.deleteMessage':
+    'آیا از حذف «{name}» مطمئن هستید؟ این عمل قابل بازگشت نیست.',
+  'blog.list.addNew': 'افزودن بلاگ',
+
+  'blog.card.edit': 'ویرایش بلاگ',
+  'blog.card.verify': 'تأیید بلاگ',
+  'blog.card.unverify': 'لغو تأیید بلاگ',
+  'blog.card.comments': 'مشاهده نظرات',
+  'blog.card.remove': 'حذف بلاگ',
+  'blog.card.waiting': 'در انتظار',
+  'blog.card.verified': 'تأییدشده',
+  'blog.card.noSummary': 'هنوز خلاصه‌ای نیست.',
+
+  'blog.settings.title': 'تنظیمات بلاگ',
+  'blog.settings.subtitle': 'نحوه تأیید نظرات بلاگ را پیکربندی کنید.',
+  'blog.settings.commentsAuto': 'تأیید خودکار نظرات',
+  'blog.settings.commentsAutoDesc':
+    'نظرات جدید بلاگ بلافاصله پس از ارسال منتشر می‌شوند. در صورت نیاز می‌توانید بعداً آن‌ها را رد کنید.',
+  'blog.settings.commentsAutoAria': 'تأیید خودکار نظرات بلاگ',
+
+  'blog.categories.title': 'دسته‌بندی‌های بلاگ',
+  'blog.categories.subtitle': 'مطالب بلاگ را در دسته‌بندی‌ها و زیردسته‌ها سازماندهی کنید.',
+  'blog.categories.empty': 'هنوز دسته‌بندی‌ای نیست. برای افزودن روی + کلیک کنید.',
+  'blog.categories.errorLoad': 'بارگذاری دسته‌بندی‌ها ممکن نشد.',
+  'blog.categories.errorSave': 'ذخیره دسته‌بندی ممکن نشد.',
+  'blog.categories.errorDelete': 'حذف دسته‌بندی ممکن نشد.',
+
+  'blog.form.add.subtitle': 'یک مطلب بلاگ جدید ایجاد و منتشر کنید.',
+  'blog.form.edit.subtitle': 'جزئیات مطلب بلاگ را به‌روزرسانی و ذخیره کنید.',
+  'blog.form.cancel': 'انصراف',
+  'blog.form.saving': 'در حال ذخیره...',
+  'blog.form.save': 'ذخیره بلاگ',
+  'blog.form.update': 'به‌روزرسانی بلاگ',
+  'blog.form.errorSave': 'ذخیره مطلب بلاگ ممکن نشد.',
+  'blog.form.toast.created': 'مطلب بلاگ ایجاد شد.',
+  'blog.form.toast.updated': 'مطلب بلاگ به‌روزرسانی شد.',
+  'blog.form.titleImage': 'تصویر عنوان',
+  'blog.form.uploadTitleImage': 'آپلود تصویر عنوان',
+  'blog.form.changeTitleImage': 'تغییر تصویر عنوان',
+  'blog.form.cropHint': 'برای انتخاب کلیک کنید، سپس برش دهید',
+  'blog.form.type': 'نوع',
+  'blog.form.category': 'دسته‌بندی',
+  'blog.form.categoryPlaceholder': 'جستجو و انتخاب دسته‌بندی...',
+  'blog.form.title': 'عنوان',
+  'blog.form.titlePlaceholder': 'عنوان مطلب بلاگ',
+  'blog.form.abstract': 'خلاصه',
+  'blog.form.abstractPlaceholder': 'خلاصه کوتاه برای نمایش در فهرست بلاگ',
+  'blog.form.mainText': 'متن اصلی',
+  'blog.form.mainTextPlaceholder': 'محتوای کامل بلاگ با قالب‌بندی و تصاویر...',
+  'blog.form.tags': 'برچسب‌ها',
+  'blog.form.type.article': 'مقاله',
+  'blog.form.type.news': 'خبر',
+  'blog.form.type.blog': 'بلاگ',
+
+  'blog.details.loading': 'در حال بارگذاری مطلب بلاگ...',
+  'blog.details.notFound': 'مطلب بلاگ یافت نشد.',
+  'blog.details.errorLoad': 'بارگذاری مطلب بلاگ ممکن نشد.',
+  'blog.details.back': 'بازگشت به بلاگ‌های من',
+  'blog.details.noContent': 'هنوز محتوایی نیست.',
+  'blog.details.author': 'نویسنده',
+
+  'portfolio.page.subtitle': 'نمونه کارها را مدیریت کنید و پروژه‌ها را به نمایش بگذارید.',
+  'portfolio.card.list.desc': 'همه نمونه کارها را مشاهده، ویرایش و مدیریت کنید.',
+  'portfolio.card.list.link': 'مشاهده نمونه کارها',
+  'portfolio.card.new.desc': 'یک پروژه نمونه کار جدید ایجاد و منتشر کنید.',
+  'portfolio.card.new.link': 'افزودن نمونه کار',
+  'portfolio.card.categories.title': 'دسته‌بندی‌های نمونه کار',
+  'portfolio.card.categories.desc':
+    'نمونه کارها را در دسته‌بندی‌ها و زیردسته‌ها سازماندهی کنید.',
+  'portfolio.card.categories.link': 'مشاهده دسته‌بندی‌ها',
+  'portfolio.card.settings.desc': 'تأیید نظرات نمونه کار و گزینه‌های نمایش را پیکربندی کنید.',
+  'portfolio.card.settings.link': 'مشاهده تنظیمات',
+
+  'portfolio.list.subtitle': '{count} مورد · مشاهده، ویرایش و مدیریت محتوای نمونه کار.',
+  'portfolio.list.loading': 'در حال بارگذاری نمونه کارها...',
+  'portfolio.list.empty': 'نمونه کاری یافت نشد.',
+  'portfolio.list.errorLoad': 'بارگذاری نمونه کارها ممکن نشد.',
+  'portfolio.list.errorDelete': 'حذف نمونه کار ممکن نشد.',
+  'portfolio.list.errorMove': 'جابه‌جایی نمونه کار ممکن نشد.',
+  'portfolio.list.toast.removed': 'نمونه کار حذف شد.',
+  'portfolio.list.toast.movedUp': 'نمونه کار به بالا منتقل شد.',
+  'portfolio.list.deleteTitle': 'حذف نمونه کار',
+  'portfolio.list.deleteMessage':
+    'آیا از حذف «{name}» مطمئن هستید؟ این عمل قابل بازگشت نیست.',
+  'portfolio.list.addNew': 'افزودن نمونه کار',
+
+  'portfolio.card.moveUp': 'انتقال به بالا',
+  'portfolio.card.edit': 'ویرایش نمونه کار',
+  'portfolio.card.comments': 'مشاهده نظرات',
+  'portfolio.card.remove': 'حذف نمونه کار',
+  'portfolio.card.noSummary': 'هنوز خلاصه‌ای نیست.',
+
+  'portfolio.settings.title': 'تنظیمات نمونه کار',
+  'portfolio.settings.subtitle': 'نحوه تأیید نظرات نمونه کار را پیکربندی کنید.',
+  'portfolio.settings.commentsAuto': 'تأیید خودکار نظرات',
+  'portfolio.settings.commentsAutoDesc':
+    'نظرات جدید نمونه کار بلافاصله پس از ارسال منتشر می‌شوند. در صورت نیاز می‌توانید بعداً آن‌ها را رد کنید.',
+  'portfolio.settings.commentsAutoAria': 'تأیید خودکار نظرات نمونه کار',
+
+  'portfolio.categories.title': 'دسته‌بندی‌های نمونه کار',
+  'portfolio.categories.subtitle':
+    'نمونه کارها را در دسته‌بندی‌ها و زیردسته‌ها سازماندهی کنید.',
+  'portfolio.categories.empty': 'هنوز دسته‌بندی‌ای نیست. برای افزودن روی + کلیک کنید.',
+  'portfolio.categories.errorLoad': 'بارگذاری دسته‌بندی‌ها ممکن نشد.',
+  'portfolio.categories.errorSave': 'ذخیره دسته‌بندی ممکن نشد.',
+  'portfolio.categories.errorDelete': 'حذف دسته‌بندی ممکن نشد.',
+
+  'portfolio.form.add.subtitle': 'یک پروژه نمونه کار جدید ایجاد و منتشر کنید.',
+  'portfolio.form.edit.subtitle': 'جزئیات نمونه کار را به‌روزرسانی و ذخیره کنید.',
+  'portfolio.form.cancel': 'انصراف',
+  'portfolio.form.saving': 'در حال ذخیره...',
+  'portfolio.form.save': 'ذخیره نمونه کار',
+  'portfolio.form.update': 'به‌روزرسانی نمونه کار',
+  'portfolio.form.errorSave': 'ذخیره نمونه کار ممکن نشد.',
+  'portfolio.form.toast.created': 'نمونه کار ایجاد شد.',
+  'portfolio.form.toast.updated': 'نمونه کار به‌روزرسانی شد.',
+  'portfolio.form.titleImage': 'تصویر عنوان',
+  'portfolio.form.aspectAria': 'نسبت تصویر عنوان',
+  'portfolio.form.aspect.square': 'مربع',
+  'portfolio.form.aspect.reel': '۹:۱۶ (ریل)',
+  'portfolio.form.uploadTitleImage': 'آپلود تصویر عنوان',
+  'portfolio.form.changeTitleImage': 'تغییر تصویر عنوان',
+  'portfolio.form.cropHint': 'برای انتخاب کلیک کنید، سپس برش دهید',
+  'portfolio.form.category': 'دسته‌بندی',
+  'portfolio.form.categoryPlaceholder': 'جستجو و انتخاب دسته‌بندی...',
+  'portfolio.form.titleFa': 'عنوان (فارسی)',
+  'portfolio.form.titleFaPlaceholder': 'عنوان فارسی',
+  'portfolio.form.titleEn': 'عنوان (انگلیسی)',
+  'portfolio.form.titleEnPlaceholder': 'English title',
+  'portfolio.form.abstract': 'خلاصه',
+  'portfolio.form.abstractPlaceholder': 'خلاصه کوتاه برای نمایش در فهرست نمونه کارها',
+  'portfolio.form.mainText': 'متن اصلی',
+  'portfolio.form.mainTextPlaceholder': 'محتوای کامل نمونه کار با قالب‌بندی و تصاویر...',
+  'portfolio.form.gallery': 'گالری تصاویر',
+  'portfolio.form.tags': 'برچسب‌ها',
+
+  'portfolio.details.loading': 'در حال بارگذاری نمونه کار...',
+  'portfolio.details.notFound': 'نمونه کار یافت نشد.',
+  'portfolio.details.errorLoad': 'بارگذاری نمونه کار ممکن نشد.',
+  'portfolio.details.back': 'بازگشت به نمونه کارهای من',
+  'portfolio.details.noContent': 'هنوز محتوایی نیست.',
+  'portfolio.details.gallery': 'گالری',
+  'portfolio.details.galleryImage': 'مشاهده تصویر گالری {index}',
+
+  'website.page.subtitle':
+    'محتوای عمومی وب‌سایت، فرم‌ها و تنظیمات مشتری‌محور را مدیریت کنید.',
+  'website.card.sliders.desc': 'اسلایدرهای بنر صفحه اصلی و کاروسل‌های تبلیغاتی را مدیریت کنید.',
+  'website.card.sliders.link': 'مدیریت اسلایدرها',
+  'website.card.specialCategories.desc':
+    'دسته‌بندی‌های منتخب محصول را در صفحه اصلی وب‌سایت برجسته کنید.',
+  'website.card.specialCategories.link': 'مدیریت دسته‌بندی‌ها',
+  'website.card.specialBrands.desc': 'برندهای شریک یا ویژه را در صفحه اصلی وب‌سایت نمایش دهید.',
+  'website.card.specialBrands.link': 'مدیریت برندها',
+  'website.card.specialItems.desc':
+    'اقلام فروشگاه ویژه را در دسته‌ها برای کاروسل‌های وب‌سایت گردآوری کنید.',
+  'website.card.specialItems.link': 'مدیریت اقلام ویژه',
+  'website.card.contact.desc': 'ارسال‌های فرم تماس وب‌سایت را مشاهده کنید.',
+  'website.card.contact.link': 'مشاهده ارسال‌ها',
+  'website.card.subscriptions.desc': 'عضویت خبرنامه و گزینه‌های اشتراک بازدیدکنندگان را مدیریت کنید.',
+  'website.card.subscriptions.link': 'مدیریت عضویت‌ها',
+  'website.card.faq.desc': 'سوالات متداول وب‌سایت را ایجاد و سازماندهی کنید.',
+  'website.card.faq.link': 'مدیریت سوالات متداول',
+  'website.card.badges.desc': 'نشان‌های اعتماد، گواهی‌ها و برجسته‌ها را در وب‌سایت نمایش دهید.',
+  'website.card.badges.link': 'مدیریت نشان‌ها',
+  'website.card.ePayment.desc': 'درگاه‌های پرداخت آنلاین و گزینه‌های تسویه حساب را پیکربندی کنید.',
+  'website.card.ePayment.link': 'مدیریت پرداخت الکترونیک',
+
+  'website.scrollLeft': 'اسکرول به چپ',
+  'website.scrollRight': 'اسکرول به راست',
+  'website.editGroup': 'ویرایش گروه',
+  'website.deleteGroup': 'حذف گروه',
+  'website.removeFromGroup': 'حذف از گروه',
+  'website.save': 'ذخیره',
+  'website.create': 'ایجاد',
+  'website.adding': 'در حال افزودن...',
+  'website.saving': 'در حال ذخیره...',
+  'website.groupTitle': 'عنوان گروه',
+  'website.groupTitlePlaceholder': 'مثلاً: ویژه، پرفروش‌ترین‌ها',
+  'website.groupKey': 'کلید (انگلیسی)',
+  'website.groupKeyPlaceholder': 'مثلاً: top-selling',
+  'website.groupKeyHint':
+    'فقط انگلیسی — حروف، اعداد، خط تیره و زیرخط. برای استفاده وب‌سایت.',
+  'website.groupValue': 'عنوان نمایشی',
+  'website.groupValuePlaceholder': 'عنوانی که در وب‌سایت نمایش داده می‌شود (هر زبانی)',
+  'website.removeFromGroupTitle': 'حذف از گروه',
+  'website.removeFromGroupMessage': '«{name}» از «{group}» حذف شود؟',
+  'website.pick.addTo': 'افزودن به {title}',
+  'website.pick.addOneCategory': 'افزودن ۱ دسته‌بندی',
+  'website.pick.addCategories': 'افزودن {count} دسته‌بندی',
+  'website.pick.addOneBrand': 'افزودن ۱ برند',
+  'website.pick.addBrands': 'افزودن {count} برند',
+
+  'website.sliders.subtitle': 'اسلایدهای بنر صفحه اصلی را در گالری ۹:۴ مدیریت کنید.',
+  'website.sliders.loading': 'در حال بارگذاری اسلایدها...',
+  'website.sliders.errorLoad': 'بارگذاری اسلایدها ممکن نشد.',
+  'website.sliders.errorUpload': 'آپلود تصویر اسلاید ممکن نشد.',
+  'website.sliders.errorAdd': 'افزودن اسلاید ممکن نشد.',
+  'website.sliders.errorRemove': 'حذف اسلاید ممکن نشد.',
+  'website.sliders.toastAdded': 'اسلاید افزوده شد.',
+  'website.sliders.toastRemoved': 'اسلاید حذف شد.',
+  'website.sliders.removeTitle': 'حذف اسلاید',
+  'website.sliders.removeMessage': 'این اسلاید از اسلایدر صفحه اصلی حذف شود؟',
+  'website.sliders.defaultTitle': 'اسلایدر صفحه اصلی',
+  'website.sliders.addSlide': 'افزودن اسلاید',
+  'website.sliders.removeSlide': 'حذف اسلاید',
+  'website.sliders.untitled': 'اسلاید بدون عنوان',
+  'website.sliders.slideAlt': 'اسلاید',
+  'website.sliders.modal.title': 'افزودن اسلاید',
+  'website.sliders.modal.image': 'تصویر اسلاید',
+  'website.sliders.modal.upload': 'آپلود تصویر اسلاید',
+  'website.sliders.modal.hint': 'نسبت بنر ۹:۴ توصیه می‌شود',
+  'website.sliders.modal.changeImage': 'تغییر تصویر',
+  'website.sliders.modal.titleOptional': 'عنوان (اختیاری)',
+  'website.sliders.modal.titlePlaceholder': 'مثلاً: حراج تابستان',
+  'website.sliders.modal.linkOptional': 'آدرس لینک (اختیاری)',
+  'website.sliders.modal.addSlide': 'افزودن اسلاید',
+
+  'website.specialCategories.subtitle':
+    'دسته‌بندی‌های ویژه محصول را برای صفحه اصلی وب‌سایت در گروه‌ها گردآوری کنید.',
+  'website.specialCategories.loading': 'در حال بارگذاری گروه‌های دسته ویژه...',
+  'website.specialCategories.empty':
+    'هنوز گروه دسته ویژه‌ای نیست. با دکمه + یکی بسازید، سپس دسته‌ها را به هر کاروسل اضافه کنید.',
+  'website.specialCategories.errorLoad': 'بارگذاری گروه‌های دسته ویژه ممکن نشد.',
+  'website.specialCategories.errorCreate': 'ایجاد گروه دسته ویژه ممکن نشد.',
+  'website.specialCategories.errorUpdate': 'به‌روزرسانی گروه دسته ویژه ممکن نشد.',
+  'website.specialCategories.errorDelete': 'حذف گروه دسته ویژه ممکن نشد.',
+  'website.specialCategories.errorAdd': 'افزودن دسته‌بندی‌ها ممکن نشد.',
+  'website.specialCategories.errorRemove': 'حذف دسته‌بندی ممکن نشد.',
+  'website.specialCategories.toastCreated': 'گروه دسته ویژه ایجاد شد.',
+  'website.specialCategories.toastUpdated': 'گروه دسته ویژه به‌روزرسانی شد.',
+  'website.specialCategories.toastDeleted': 'گروه دسته ویژه حذف شد.',
+  'website.specialCategories.toastAdded': 'دسته‌بندی‌ها به گروه افزوده شد.',
+  'website.specialCategories.toastRemoved': 'از گروه دسته ویژه حذف شد.',
+  'website.specialCategories.addFab': 'افزودن گروه دسته ویژه',
+  'website.specialCategories.addTooltip': 'افزودن دسته‌بندی به {title}',
+  'website.specialCategories.createTitle': 'افزودن گروه دسته ویژه',
+  'website.specialCategories.editTitle': 'ویرایش گروه دسته ویژه',
+  'website.specialCategories.deleteTitle': 'حذف گروه دسته ویژه',
+  'website.specialCategories.deleteMessage':
+    '«{title}» حذف شود؟ دسته‌بندی‌های محصول در کاتالوگ باقی می‌مانند.',
+  'website.specialCategories.pickSubtitle':
+    'دسته‌بندی‌های محصول را برای نمایش در این گروه انتخاب کنید.',
+  'website.specialCategories.pickLoading': 'در حال بارگذاری دسته‌بندی‌ها...',
+  'website.specialCategories.pickEmpty': 'همه دسته‌بندی‌ها قبلاً در این گروه هستند.',
+  'website.specialCategories.pickSearch': 'حداقل ۳ حرف برای جستجوی دسته‌بندی تایپ کنید',
+  'website.specialCategories.pickErrorLoad': 'بارگذاری دسته‌بندی‌ها ممکن نشد.',
+
+  'website.specialBrands.subtitle': 'برندهای ویژه را برای صفحه اصلی وب‌سایت در گروه‌ها گردآوری کنید.',
+  'website.specialBrands.loading': 'در حال بارگذاری گروه‌های برند ویژه...',
+  'website.specialBrands.empty':
+    'هنوز گروه برند ویژه‌ای نیست. با دکمه + یکی بسازید، سپس برندها را به هر کاروسل اضافه کنید.',
+  'website.specialBrands.errorLoad': 'بارگذاری گروه‌های برند ویژه ممکن نشد.',
+  'website.specialBrands.errorCreate': 'ایجاد گروه برند ویژه ممکن نشد.',
+  'website.specialBrands.errorUpdate': 'به‌روزرسانی گروه برند ویژه ممکن نشد.',
+  'website.specialBrands.errorDelete': 'حذف گروه برند ویژه ممکن نشد.',
+  'website.specialBrands.errorAdd': 'افزودن برندها ممکن نشد.',
+  'website.specialBrands.errorRemove': 'حذف برند ممکن نشد.',
+  'website.specialBrands.toastCreated': 'گروه برند ویژه ایجاد شد.',
+  'website.specialBrands.toastUpdated': 'گروه برند ویژه به‌روزرسانی شد.',
+  'website.specialBrands.toastDeleted': 'گروه برند ویژه حذف شد.',
+  'website.specialBrands.toastAdded': 'برندها به گروه افزوده شد.',
+  'website.specialBrands.toastRemoved': 'از گروه برند ویژه حذف شد.',
+  'website.specialBrands.addFab': 'افزودن گروه برند ویژه',
+  'website.specialBrands.addTooltip': 'افزودن برند به {title}',
+  'website.specialBrands.createTitle': 'افزودن گروه برند ویژه',
+  'website.specialBrands.editTitle': 'ویرایش گروه برند ویژه',
+  'website.specialBrands.deleteTitle': 'حذف گروه برند ویژه',
+  'website.specialBrands.deleteMessage': '«{title}» حذف شود؟ برندها در کاتالوگ باقی می‌مانند.',
+  'website.specialBrands.pickSubtitle': 'برندها را برای نمایش در این گروه انتخاب کنید.',
+  'website.specialBrands.pickLoading': 'در حال بارگذاری برندها...',
+  'website.specialBrands.pickEmpty': 'همه برندها قبلاً در این گروه هستند.',
+  'website.specialBrands.pickSearch': 'حداقل ۳ حرف برای جستجوی برند تایپ کنید',
+  'website.specialBrands.pickErrorLoad': 'بارگذاری برندها ممکن نشد.',
+
+  'website.specialItems.subtitle':
+    'اقلام فروشگاه ویژه را برای کاروسل‌های وب‌سایت در دسته‌ها گردآوری کنید.',
+  'website.specialItems.loading': 'در حال بارگذاری دسته‌های ویژه...',
+  'website.specialItems.empty':
+    'هنوز دسته ویژه‌ای نیست. با دکمه + یکی بسازید، سپس اقلام فروشگاه را به هر کاروسل اضافه کنید.',
+  'website.specialItems.errorLoad': 'بارگذاری دسته‌های ویژه ممکن نشد.',
+  'website.specialItems.errorCreate': 'ایجاد دسته ویژه ممکن نشد.',
+  'website.specialItems.errorUpdate': 'به‌روزرسانی دسته ویژه ممکن نشد.',
+  'website.specialItems.errorDelete': 'حذف دسته ویژه ممکن نشد.',
+  'website.specialItems.errorAdd': 'افزودن اقلام فروشگاه ممکن نشد.',
+  'website.specialItems.errorRemove': 'حذف قلم فروشگاه ممکن نشد.',
+  'website.specialItems.toastCreated': 'دسته ویژه ایجاد شد.',
+  'website.specialItems.toastUpdated': 'دسته ویژه به‌روزرسانی شد.',
+  'website.specialItems.toastDeleted': 'دسته ویژه حذف شد.',
+  'website.specialItems.toastAdded': 'اقلام فروشگاه به دسته ویژه افزوده شد.',
+  'website.specialItems.toastRemoved': 'از دسته ویژه حذف شد.',
+  'website.specialItems.addFab': 'افزودن دسته ویژه',
+  'website.specialItems.createTitle': 'افزودن دسته ویژه',
+  'website.specialItems.editTitle': 'ویرایش دسته ویژه',
+  'website.specialItems.deleteTitle': 'حذف دسته ویژه',
+  'website.specialItems.deleteMessage':
+    '«{title}» حذف شود؟ اقلام فروشگاه در کاتالوگ باقی می‌مانند.',
+  'website.specialItems.removeTitle': 'حذف از ویژه',
+  'website.specialItems.removeMessage': '«{name}» از «{group}» حذف شود؟',
+  'website.specialItems.editCategory': 'ویرایش دسته',
+  'website.specialItems.deleteCategory': 'حذف دسته',
+  'website.specialItems.scrollLeft': 'اسکرول به چپ',
+  'website.specialItems.scrollRight': 'اسکرول به راست',
+  'website.specialItems.addItemsTo': 'افزودن اقلام فروشگاه به {title}',
+  'website.specialItems.removeFromSpecial': 'حذف از ویژه',
+  'website.specialItems.pickSubtitle': 'اقلام فروشگاه را برای نمایش در این دسته انتخاب کنید.',
+  'website.specialItems.pickLoading': 'در حال بارگذاری اقلام فروشگاه...',
+  'website.specialItems.pickEmpty': 'همه اقلام فروشگاه قبلاً در این دسته هستند.',
+  'website.specialItems.pickSearch': 'حداقل ۳ حرف برای جستجوی اقلام فروشگاه تایپ کنید',
+  'website.specialItems.pickErrorLoad': 'بارگذاری اقلام فروشگاه ممکن نشد.',
+  'website.pick.addOneItem': 'افزودن ۱ قلم',
+  'website.pick.addItems': 'افزودن {count} قلم',
+
+  'website.contact.subtitle': 'ارسال‌های دریافتی از فرم تماس وب‌سایت.',
+  'website.contact.filters': 'فیلترها',
+  'website.contact.searchPlaceholder': 'عنوان، نام، ایمیل، موبایل یا پیام',
+  'website.contact.search': 'جستجو',
+  'website.contact.clearFilters': 'پاک کردن فیلترها',
+  'website.contact.listTitle': 'ارسال‌ها',
+  'website.contact.showing': 'نمایش {from} تا {to} از {total}',
+  'website.contact.none': 'بدون ارسال',
+  'website.contact.empty': 'ارسالی یافت نشد.',
+  'website.contact.loading': 'در حال بارگذاری...',
+  'website.contact.errorLoad': 'بارگذاری ارسال‌های تماس ممکن نشد.',
+  'website.contact.pageMeta': 'صفحه {page} / {totalPages} · {pageSize} در هر صفحه · {total} کل',
+  'website.contact.col.title': 'عنوان',
+  'website.contact.col.name': 'نام',
+  'website.contact.col.email': 'ایمیل',
+  'website.contact.col.cell': 'شماره موبایل',
+  'website.contact.col.date': 'تاریخ',
+  'website.contact.col.time': 'ساعت',
+  'website.contact.viewSubmission': 'مشاهده ارسال از {name}',
+  'website.contact.detailTitle': 'ارسال تماس',
+  'website.contact.detailMessage': 'پیام',
+
+  'website.subscriptions.subtitle': 'عضویت خبرنامه و اشتراک‌ها در وب‌سایت را مدیریت کنید.',
+  'website.subscriptions.lead': 'نحوه عضویت بازدیدکنندگان برای دریافت به‌روزرسانی‌ها را کنترل کنید.',
+  'website.subscriptions.note': 'مدیریت عضویت به‌زودی اینجا متصل می‌شود. گزینه‌های برنامه‌ریزی‌شده:',
+  'website.subscriptions.feature.enable': 'فعال یا غیرفعال کردن فرم‌های عضویت',
+  'website.subscriptions.feature.welcome': 'پیام خوش‌آمد و متن رضایت سفارشی',
+  'website.subscriptions.feature.export': 'خروجی گرفتن یا مشاهده فهرست مشترکین',
+
+  'website.faq.subtitle': 'سوالات متداول وب‌سایت را ایجاد و سازماندهی کنید.',
+  'website.faq.lead':
+    'بخش سوالات متداول بسازید تا پیش از تماس، پرسش‌های رایج مشتریان پاسخ داده شود.',
+  'website.faq.note': 'ویرایشگر سوالات متداول به‌زودی اینجا متصل می‌شود. گزینه‌های برنامه‌ریزی‌شده:',
+  'website.faq.feature.crud': 'افزودن، ویرایش و مرتب‌سازی پرسش و پاسخ',
+  'website.faq.feature.groups': 'گروه‌بندی موارد بر اساس دسته',
+  'website.faq.feature.publish': 'انتشار یا مخفی کردن هر مورد',
+
+  'website.badges.subtitle': 'نشان‌های اعتماد و برجسته‌ها را در وب‌سایت عمومی نمایش دهید.',
+  'website.badges.lead': 'گواهی‌ها، تضمین‌ها و نشانه‌های اعتماد را به بازدیدکنندگان نشان دهید.',
+  'website.badges.note': 'مدیریت نشان‌ها به‌زودی اینجا متصل می‌شود. گزینه‌های برنامه‌ریزی‌شده:',
+  'website.badges.feature.upload': 'آپلود تصویر نشان با عنوان و لینک',
+  'website.badges.feature.reorder': 'مرتب‌سازی نشان‌ها برای صفحه اصلی یا پاورقی',
+  'website.badges.feature.toggle': 'نمایش یا مخفی کردن هر نشان',
+
+  'website.ePayment.subtitle': 'روش‌های پرداخت آنلاین برای تسویه حساب وب‌سایت را پیکربندی کنید.',
+  'website.ePayment.lead':
+    'درگاه‌های پرداخت را متصل کنید تا مشتریان از طریق فروشگاه آنلاین پرداخت کنند.',
+  'website.ePayment.note': 'تنظیمات پرداخت الکترونیک به‌زودی اینجا متصل می‌شود. گزینه‌های برنامه‌ریزی‌شده:',
+  'website.ePayment.feature.enable': 'فعال یا غیرفعال کردن پرداخت آنلاین',
+  'website.ePayment.feature.credentials': 'پیکربندی اطلاعات درگاه پرداخت',
+  'website.ePayment.feature.methods': 'تنظیم روش‌های پرداخت و حالت آزمایشی',
+
   'title.signIn': 'ورود',
   'title.home': 'خانه',
   'title.businessProfile': 'پروفایل کسب‌وکار',
diff --git a/apps/business/src/pages/AddNewBlogPage.tsx b/apps/business/src/pages/AddNewBlogPage.tsx
index 90016f1..4e593db 100644
--- a/apps/business/src/pages/AddNewBlogPage.tsx
+++ b/apps/business/src/pages/AddNewBlogPage.tsx
@@ -6,6 +6,7 @@ import { TagInput } from '../components/TagInput'
 import { RichTextEditor } from '../components/RichTextEditor'
 import { Breadcrumbs } from '../components/Breadcrumbs'
 import { useToast } from '../context/ToastContext'
+import { useT } from '../i18n/useT'
 import { ApiError } from '../lib/api'
 import {
   listBlogCategories,
@@ -32,6 +33,7 @@ export function AddNewBlogPage() {
   const { id } = useParams()
   const navigate = useNavigate()
   const { showToast } = useToast()
+  const t = useT()
   const isEdit = Boolean(id)
 
   const [categories, setCategories] = useState<Category[]>([])
@@ -61,7 +63,7 @@ export function AddNewBlogPage() {
         if (err instanceof ApiError) {
           setError(err.message)
         } else {
-          setError('Unable to load categories.')
+          setError(t('blog.categories.errorLoad'))
         }
       }
     }
@@ -131,10 +133,10 @@ export function AddNewBlogPage() {
           categoryId: categoryId || null,
           featuredMediaId: nextFeaturedMediaId,
         })
-        showToast('Blog post updated.', 'success')
+        showToast(t('blog.form.toast.updated'), 'success')
       } else {
         await createBlog(payload)
-        showToast('Blog post created.', 'success')
+        showToast(t('blog.form.toast.created'), 'success')
       }
 
       navigate('/blog/list')
@@ -144,7 +146,7 @@ export function AddNewBlogPage() {
       } else if (err instanceof Error) {
         setError(err.message)
       } else {
-        setError('Unable to save blog post.')
+        setError(t('blog.form.errorSave'))
       }
     } finally {
       setIsSubmitting(false)
@@ -172,12 +174,10 @@ export function AddNewBlogPage() {
       <div className={pageStyles.pageHeader}>
         <div>
           <h2 className={pageStyles.pageTitle}>
-            {isEdit ? 'Edit Blog' : 'Add New Blog'}
+            {isEdit ? t('title.editBlog') : t('title.addBlog')}
           </h2>
           <p className={pageStyles.pageSubtitle}>
-            {isEdit
-              ? 'Update blog post details and save changes.'
-              : 'Create and publish a new blog post.'}
+            {isEdit ? t('blog.form.edit.subtitle') : t('blog.form.add.subtitle')}
           </p>
         </div>
       </div>
@@ -191,19 +191,19 @@ export function AddNewBlogPage() {
       <form className={styles.form} onSubmit={handleSubmit}>
         <div className={styles.formGrid}>
           <div className={`${styles.field} ${styles.col3} ${styles.rowSpan3}`}>
-            <label>Title Image</label>
+            <label>{t('blog.form.titleImage')}</label>
             <ImageCropper
               value={titleImage}
               onChange={setTitleImage}
               aspect={3 / 2}
-              uploadLabel="Upload title image"
-              hint="Click to select, then crop"
-              changeLabel="Change title image"
+              uploadLabel={t('blog.form.uploadTitleImage')}
+              hint={t('blog.form.cropHint')}
+              changeLabel={t('blog.form.changeTitleImage')}
             />
           </div>
 
           <div className={`${styles.field} ${styles.col3}`}>
-            <label htmlFor="blog-type">Type</label>
+            <label htmlFor="blog-type">{t('blog.form.type')}</label>
             <select
               id="blog-type"
               value={type}
@@ -212,29 +212,35 @@ export function AddNewBlogPage() {
             >
               {BLOG_TYPE_OPTIONS.map((option) => (
                 <option key={option.value} value={option.value}>
-                  {option.label}
+                  {t(
+                    option.value === 'news'
+                      ? 'blog.form.type.news'
+                      : option.value === 'article'
+                        ? 'blog.form.type.article'
+                        : 'blog.form.type.blog',
+                  )}
                 </option>
               ))}
             </select>
           </div>
 
           <div className={`${styles.field} ${styles.col6Span}`}>
-            <label>Category</label>
+            <label>{t('blog.form.category')}</label>
             <SearchableSelect
               options={categoryOptions}
               value={categoryId}
               onChange={setCategoryId}
-              placeholder="Search and select category..."
+              placeholder={t('blog.form.categoryPlaceholder')}
             />
           </div>
 
           <div className={`${styles.field} ${styles.col9}`}>
-            <label htmlFor="blog-title">Title</label>
+            <label htmlFor="blog-title">{t('blog.form.title')}</label>
             <input
               id="blog-title"
               name="title"
               type="text"
-              placeholder="Blog post title"
+              placeholder={t('blog.form.titlePlaceholder')}
               value={title}
               onChange={(e) => setTitle(e.target.value)}
               required
@@ -243,12 +249,12 @@ export function AddNewBlogPage() {
           </div>
 
           <div className={`${styles.field} ${styles.col9}`}>
-            <label htmlFor="blog-abstract">Abstract</label>
+            <label htmlFor="blog-abstract">{t('blog.form.abstract')}</label>
             <textarea
               id="blog-abstract"
               name="abstract"
               rows={4}
-              placeholder="Short summary shown in blog listings"
+              placeholder={t('blog.form.abstractPlaceholder')}
               value={abstract}
               onChange={(e) => setAbstract(e.target.value)}
               required
@@ -257,28 +263,32 @@ export function AddNewBlogPage() {
           </div>
 
           <div className={`${styles.field} ${styles.col12}`}>
-            <label>Main Text</label>
+            <label>{t('blog.form.mainText')}</label>
             <RichTextEditor
               value={mainTextHtml}
               onChange={setMainTextHtml}
-              placeholder="Full blog content with formatting and images..."
+              placeholder={t('blog.form.mainTextPlaceholder')}
               allowImages
               editorMinHeight={320}
             />
           </div>
 
           <div className={`${styles.field} ${styles.col12}`}>
-            <label>Tags</label>
+            <label>{t('blog.form.tags')}</label>
             <TagInput tags={tags} onChange={setTags} />
           </div>
         </div>
 
         <div className={styles.actions}>
           <Link to="/blog/list" className={styles.cancelBtn}>
-            Cancel
+            {t('blog.form.cancel')}
           </Link>
           <button type="submit" className={styles.submitBtn} disabled={isSubmitting}>
-            {isSubmitting ? 'Saving...' : isEdit ? 'Update Blog' : 'Save Blog'}
+            {isSubmitting
+              ? t('blog.form.saving')
+              : isEdit
+                ? t('blog.form.update')
+                : t('blog.form.save')}
           </button>
         </div>
       </form>
diff --git a/apps/business/src/pages/AddNewPortfolioPage.tsx b/apps/business/src/pages/AddNewPortfolioPage.tsx
index da76c40..ac76744 100644
--- a/apps/business/src/pages/AddNewPortfolioPage.tsx
+++ b/apps/business/src/pages/AddNewPortfolioPage.tsx
@@ -7,6 +7,7 @@ import { TagInput } from '../components/TagInput'
 import { RichTextEditor } from '../components/RichTextEditor'
 import { Breadcrumbs } from '../components/Breadcrumbs'
 import { useToast } from '../context/ToastContext'
+import { useT } from '../i18n/useT'
 import { ApiError } from '../lib/api'
 import {
   listPortfolioCategories,
@@ -32,19 +33,19 @@ type TitleImageAspectId = 'square' | '3:2' | '16:9' | '9:16'
 
 const TITLE_IMAGE_ASPECTS: {
   id: TitleImageAspectId
-  label: string
   aspect: number
 }[] = [
-  { id: 'square', label: 'Square', aspect: 1 },
-  { id: '3:2', label: '3:2', aspect: 3 / 2 },
-  { id: '16:9', label: '16:9', aspect: 16 / 9 },
-  { id: '9:16', label: '9:16 (Reel)', aspect: 9 / 16 },
+  { id: 'square', aspect: 1 },
+  { id: '3:2', aspect: 3 / 2 },
+  { id: '16:9', aspect: 16 / 9 },
+  { id: '9:16', aspect: 9 / 16 },
 ]
 
 export function AddNewPortfolioPage() {
   const { id } = useParams()
   const navigate = useNavigate()
   const { showToast } = useToast()
+  const t = useT()
   const isEdit = Boolean(id)
 
   const [categories, setCategories] = useState<Category[]>([])
@@ -79,7 +80,7 @@ export function AddNewPortfolioPage() {
         if (err instanceof ApiError) {
           setError(err.message)
         } else {
-          setError('Unable to load categories.')
+          setError(t('portfolio.categories.errorLoad'))
         }
       }
     }
@@ -159,10 +160,10 @@ export function AddNewPortfolioPage() {
           categoryId: categoryId || null,
           featuredMediaId: nextFeaturedMediaId,
         })
-        showToast('Portfolio updated.', 'success')
+        showToast(t('portfolio.form.toast.updated'), 'success')
       } else {
         await createPortfolio(payload)
-        showToast('Portfolio created.', 'success')
+        showToast(t('portfolio.form.toast.created'), 'success')
       }
 
       navigate('/portfolios/list')
@@ -172,7 +173,7 @@ export function AddNewPortfolioPage() {
       } else if (err instanceof Error) {
         setError(err.message)
       } else {
-        setError('Unable to save portfolio.')
+        setError(t('portfolio.form.errorSave'))
       }
     } finally {
       setIsSubmitting(false)
@@ -200,12 +201,10 @@ export function AddNewPortfolioPage() {
       <div className={pageStyles.pageHeader}>
         <div>
           <h2 className={pageStyles.pageTitle}>
-            {isEdit ? 'Edit Portfolio' : 'Add New Portfolio'}
+            {isEdit ? t('title.editPortfolio') : t('title.addPortfolio')}
           </h2>
           <p className={pageStyles.pageSubtitle}>
-            {isEdit
-              ? 'Update portfolio details and save changes.'
-              : 'Create and publish a new portfolio project.'}
+            {isEdit ? t('portfolio.form.edit.subtitle') : t('portfolio.form.add.subtitle')}
           </p>
         </div>
       </div>
@@ -219,11 +218,11 @@ export function AddNewPortfolioPage() {
       <form className={styles.form} onSubmit={handleSubmit}>
         <div className={styles.formGrid}>
           <div className={`${styles.field} ${styles.col3} ${styles.thumbnailField}`}>
-            <label>Title Image</label>
+            <label>{t('portfolio.form.titleImage')}</label>
             <div
               className={styles.aspectOptions}
               role="radiogroup"
-              aria-label="Title image aspect ratio"
+              aria-label={t('portfolio.form.aspectAria')}
             >
               {TITLE_IMAGE_ASPECTS.map((option) => (
                 <button
@@ -245,7 +244,11 @@ export function AddNewPortfolioPage() {
                   }}
                   disabled={isSubmitting}
                 >
-                  {option.label}
+                  {option.id === 'square'
+                    ? t('portfolio.form.aspect.square')
+                    : option.id === '9:16'
+                      ? t('portfolio.form.aspect.reel')
+                      : option.id}
                 </button>
               ))}
             </div>
@@ -253,26 +256,26 @@ export function AddNewPortfolioPage() {
               value={titleImage}
               onChange={setTitleImage}
               aspect={selectedAspect}
-              uploadLabel="Upload title image"
-              hint="Click to select, then crop"
-              changeLabel="Change title image"
+              uploadLabel={t('portfolio.form.uploadTitleImage')}
+              hint={t('portfolio.form.cropHint')}
+              changeLabel={t('portfolio.form.changeTitleImage')}
             />
           </div>
 
           <div className={styles.formColumn}>
             <div className={styles.field}>
-              <label>Category</label>
+              <label>{t('portfolio.form.category')}</label>
               <SearchableSelect
                 options={categoryOptions}
                 value={categoryId}
                 onChange={setCategoryId}
-                placeholder="Search and select category..."
+                placeholder={t('portfolio.form.categoryPlaceholder')}
               />
             </div>
 
             <div className={styles.titleRow}>
               <div className={styles.field}>
-                <label htmlFor="portfolio-title-fa">Title (FA)</label>
+                <label htmlFor="portfolio-title-fa">{t('portfolio.form.titleFa')}</label>
                 <input
                   id="portfolio-title-fa"
                   name="titleFa"
@@ -280,7 +283,7 @@ export function AddNewPortfolioPage() {
                   dir="rtl"
                   lang="fa"
                   className="faText"
-                  placeholder="عنوان فارسی"
+                  placeholder={t('portfolio.form.titleFaPlaceholder')}
                   value={titleFa}
                   onChange={(e) => setTitleFa(e.target.value)}
                   required
@@ -289,13 +292,13 @@ export function AddNewPortfolioPage() {
               </div>
 
               <div className={styles.field}>
-                <label htmlFor="portfolio-title-en">Title (EN)</label>
+                <label htmlFor="portfolio-title-en">{t('portfolio.form.titleEn')}</label>
                 <input
                   id="portfolio-title-en"
                   name="titleEn"
                   type="text"
                   dir="ltr"
-                  placeholder="English title"
+                  placeholder={t('portfolio.form.titleEnPlaceholder')}
                   value={titleEn}
                   onChange={(e) => setTitleEn(e.target.value)}
                   disabled={isSubmitting}
@@ -304,12 +307,12 @@ export function AddNewPortfolioPage() {
             </div>
 
             <div className={styles.field}>
-              <label htmlFor="portfolio-abstract">Abstract</label>
+              <label htmlFor="portfolio-abstract">{t('portfolio.form.abstract')}</label>
               <textarea
                 id="portfolio-abstract"
                 name="abstract"
                 rows={4}
-                placeholder="Short summary shown in portfolio listings"
+                placeholder={t('portfolio.form.abstractPlaceholder')}
                 value={abstract}
                 onChange={(e) => setAbstract(e.target.value)}
                 required
@@ -318,11 +321,11 @@ export function AddNewPortfolioPage() {
             </div>
 
             <div className={styles.field}>
-              <label>Main Text</label>
+              <label>{t('portfolio.form.mainText')}</label>
               <RichTextEditor
                 value={mainTextHtml}
                 onChange={setMainTextHtml}
-                placeholder="Full portfolio content with formatting and images..."
+                placeholder={t('portfolio.form.mainTextPlaceholder')}
                 allowImages
                 editorMinHeight={280}
               />
@@ -330,22 +333,26 @@ export function AddNewPortfolioPage() {
           </div>
 
           <div className={`${styles.field} ${styles.col12}`}>
-            <label>Image Gallery</label>
+            <label>{t('portfolio.form.gallery')}</label>
             <ImageUploader images={images} onChange={setImages} />
           </div>
 
           <div className={`${styles.field} ${styles.col12}`}>
-            <label>Tags</label>
+            <label>{t('portfolio.form.tags')}</label>
             <TagInput tags={tags} onChange={setTags} />
           </div>
         </div>
 
         <div className={styles.actions}>
           <Link to="/portfolios/list" className={styles.cancelBtn}>
-            Cancel
+            {t('portfolio.form.cancel')}
           </Link>
           <button type="submit" className={styles.submitBtn} disabled={isSubmitting}>
-            {isSubmitting ? 'Saving...' : isEdit ? 'Update Portfolio' : 'Save Portfolio'}
+            {isSubmitting
+              ? t('portfolio.form.saving')
+              : isEdit
+                ? t('portfolio.form.update')
+                : t('portfolio.form.save')}
           </button>
         </div>
       </form>
diff --git a/apps/business/src/pages/AddNewProductPage.tsx b/apps/business/src/pages/AddNewProductPage.tsx
index 1795f12..0814103 100644
--- a/apps/business/src/pages/AddNewProductPage.tsx
+++ b/apps/business/src/pages/AddNewProductPage.tsx
@@ -66,14 +66,14 @@ export function AddNewProductPage() {
         if (err instanceof ApiError) {
           setError(err.message)
         } else {
-          setError('Unable to load form options.')
+          setError(t('products.form.errorOptions'))
         }
       }
     }
 
     void loadFormOptions()
     return () => controller.abort()
-  }, [])
+  }, [t])
 
   useEffect(() => {
     if (!isEdit || !id) return
@@ -157,7 +157,7 @@ export function AddNewProductPage() {
       } else if (err instanceof Error) {
         setError(err.message)
       } else {
-        setError('Unable to save product.')
+        setError(t('products.form.errorSave'))
       }
     } finally {
       setIsSubmitting(false)
@@ -202,43 +202,44 @@ export function AddNewProductPage() {
       <form className={styles.form} onSubmit={handleSubmit}>
         <div className={styles.formGrid}>
           <div className={`${styles.field} ${styles.col2} ${styles.thumbnailField}`}>
-            <label>Thumbnail Image</label>
+            <label>{t('products.form.thumbnail')}</label>
             <ImageCropper value={thumbnail} onChange={setThumbnail} />
           </div>
 
           <div className={styles.col10}>
             <div className={styles.topFields}>
               <div className={`${styles.field} ${styles.fieldCategory}`}>
-                <label>Category</label>
+                <label>{t('products.form.category')}</label>
                 <SearchableSelect
                   options={categoryOptions}
                   value={categoryId}
                   onChange={setCategoryId}
-                  placeholder="Search and select category..."
+                  placeholder={t('products.form.categoryPlaceholder')}
                 />
               </div>
 
               <div className={`${styles.field} ${styles.fieldBrand}`}>
                 <label>
-                  Brand <span className={styles.optional}>(optional)</span>
+                  {t('products.form.brand')}{' '}
+                  <span className={styles.optional}>{t('products.form.optional')}</span>
                 </label>
                 <SearchableSelect
                   options={brandOptions}
                   value={brandId}
                   onChange={setBrandId}
-                  placeholder="Search and select brand..."
+                  placeholder={t('products.form.brandPlaceholder')}
                 />
               </div>
 
               <div className={`${styles.field} ${styles.fieldHalf}`}>
-                <label htmlFor="nameFa">Name (FA)</label>
+                <label htmlFor="nameFa">{t('products.form.nameFa')}</label>
                 <input
                   id="nameFa"
                   name="nameFa"
                   type="text"
                   dir="rtl"
                   className="faText"
-                  placeholder="نام محصول"
+                  placeholder={t('products.form.nameFaPlaceholder')}
                   value={nameFa}
                   onChange={(e) => setNameFa(e.target.value)}
                   required
@@ -247,13 +248,13 @@ export function AddNewProductPage() {
               </div>
 
               <div className={`${styles.field} ${styles.fieldHalf}`}>
-                <label htmlFor="nameEn">Name (EN)</label>
+                <label htmlFor="nameEn">{t('products.form.nameEn')}</label>
                 <input
                   id="nameEn"
                   name="nameEn"
                   type="text"
                   dir="ltr"
-                  placeholder="Product name"
+                  placeholder={t('products.form.nameEnPlaceholder')}
                   value={nameEn}
                   onChange={(e) => setNameEn(e.target.value)}
                   required
@@ -262,12 +263,12 @@ export function AddNewProductPage() {
               </div>
 
               <div className={`${styles.field} ${styles.fieldFull} ${styles.summaryField}`}>
-                <label htmlFor="summary">Summary</label>
+                <label htmlFor="summary">{t('products.form.summary')}</label>
                 <textarea
                   id="summary"
                   name="summary"
                   rows={4}
-                  placeholder="Short summary shown in product listings"
+                  placeholder={t('products.form.summaryPlaceholder')}
                   value={summary}
                   onChange={(e) => setSummary(e.target.value)}
                   required
@@ -278,31 +279,39 @@ export function AddNewProductPage() {
           </div>
 
           <div className={`${styles.field} ${styles.col12}`}>
-            <label>Description</label>
+            <label>{t('products.form.description')}</label>
             <RichTextEditor
               value={description}
               onChange={setDescription}
-              placeholder="Full product description with formatting..."
+              placeholder={t('products.form.descriptionPlaceholder')}
             />
           </div>
 
           <div className={`${styles.field} ${styles.col12}`}>
-            <label>Product Images</label>
+            <label>{t('products.form.images')}</label>
             <ImageUploader images={images} onChange={setImages} />
           </div>
 
           <div className={`${styles.field} ${styles.col12}`}>
-            <label>Tags</label>
-            <TagInput tags={tags} onChange={setTags} />
+            <label>{t('products.form.tags')}</label>
+            <TagInput
+              tags={tags}
+              onChange={setTags}
+              placeholder={t('products.form.tagsPlaceholder')}
+            />
           </div>
         </div>
 
         <div className={styles.actions}>
           <Link to="/products/list" className={styles.cancelBtn}>
-            Cancel
+            {t('products.form.cancel')}
           </Link>
           <button type="submit" className={styles.submitBtn} disabled={isSubmitting}>
-            {isSubmitting ? 'Saving...' : isEdit ? 'Update Product' : 'Save Product'}
+            {isSubmitting
+              ? t('products.form.saving')
+              : isEdit
+                ? t('products.form.update')
+                : t('products.form.save')}
           </button>
         </div>
       </form>
diff --git a/apps/business/src/pages/BlogCategoriesPage.tsx b/apps/business/src/pages/BlogCategoriesPage.tsx
index c8a9e34..6759f99 100644
--- a/apps/business/src/pages/BlogCategoriesPage.tsx
+++ b/apps/business/src/pages/BlogCategoriesPage.tsx
@@ -6,6 +6,7 @@ import { Breadcrumbs } from '../components/Breadcrumbs'
 import { ConfirmDeleteModal } from '../components/ConfirmDeleteModal'
 import type { Category, CategoryFormData } from '../types/category'
 import { ApiError } from '../lib/api'
+import { useT } from '../i18n/useT'
 import {
   createBlogCategory,
   deleteBlogCategory,
@@ -18,11 +19,12 @@ import pageStyles from '../components/PageContent.module.css'
 import styles from './CategoriesPage.module.css'
 
 export function BlogCategoriesPage() {
+  const t = useT()
   const [categories, setCategories] = useState<Category[]>([])
   const [expandedIds, setExpandedIds] = useState<Set<string>>(() => new Set())
   const [modalOpen, setModalOpen] = useState(false)
   const [defaultParentId, setDefaultParentId] = useState('')
-  const [modalTitle, setModalTitle] = useState('Add Category')
+  const [modalTitle, setModalTitle] = useState(() => t('categories.add'))
   const [editingCategory, setEditingCategory] = useState<Category | null>(null)
   const [isLoading, setIsLoading] = useState(true)
   const [isSubmitting, setIsSubmitting] = useState(false)
@@ -46,17 +48,17 @@ export function BlogCategoriesPage() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load categories.')
+        setError(t('blog.categories.errorLoad'))
       }
     } finally {
       setIsLoading(false)
     }
   }
 
-  function openCreateModal(parentId = '', title = 'Add Category') {
+  function openCreateModal(parentId = '', title?: string) {
     setEditingCategory(null)
     setDefaultParentId(parentId)
-    setModalTitle(title)
+    setModalTitle(title ?? t('categories.add'))
     setModalOpen(true)
     if (parentId) {
       setExpandedIds((prev) => new Set(prev).add(parentId))
@@ -66,7 +68,7 @@ export function BlogCategoriesPage() {
   function openEditModal(category: Category) {
     setEditingCategory(category)
     setDefaultParentId(category.parentId ?? '')
-    setModalTitle('Edit Category')
+    setModalTitle(t('categories.edit'))
     setModalOpen(true)
   }
 
@@ -112,7 +114,7 @@ export function BlogCategoriesPage() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to save category.')
+        setError(t('blog.categories.errorSave'))
       }
     } finally {
       setIsSubmitting(false)
@@ -139,7 +141,7 @@ export function BlogCategoriesPage() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to delete category.')
+        setError(t('blog.categories.errorDelete'))
       }
     } finally {
       setIsSubmitting(false)
@@ -157,10 +159,8 @@ export function BlogCategoriesPage() {
       />
       <div className={pageStyles.pageHeader}>
         <div>
-          <h2 className={pageStyles.pageTitle}>Blog Categories</h2>
-          <p className={pageStyles.pageSubtitle}>
-            Organize your blog posts into categories and subcategories.
-          </p>
+          <h2 className={pageStyles.pageTitle}>{t('blog.categories.title')}</h2>
+          <p className={pageStyles.pageSubtitle}>{t('blog.categories.subtitle')}</p>
         </div>
       </div>
 
@@ -172,15 +172,15 @@ export function BlogCategoriesPage() {
 
       <div className={styles.list}>
         {isLoading ? (
-          <p className={styles.empty}>Loading categories...</p>
+          <p className={styles.empty}>{t('categories.loading')}</p>
         ) : categories.length === 0 ? (
-          <p className={styles.empty}>No categories yet. Click + to add one.</p>
+          <p className={styles.empty}>{t('blog.categories.empty')}</p>
         ) : (
           <BlogCategoryTree
             categories={categories}
             expandedIds={expandedIds}
             onToggle={toggleExpanded}
-            onAddSub={(id) => openCreateModal(id, 'Add Sub Category')}
+            onAddSub={(id) => openCreateModal(id, t('categories.addSub'))}
             onEdit={(id) => {
               const category = categories.find((item) => item.id === id)
               if (category) openEditModal(category)
@@ -211,10 +211,10 @@ export function BlogCategoriesPage() {
 
       <ConfirmDeleteModal
         open={!!deleteTarget}
-        title="Delete Category"
+        title={t('categories.deleteTitle')}
         message={
           deleteTarget
-            ? `Are you sure you want to delete "${deleteTarget.nameEn}"? Subcategories will also be removed.`
+            ? t('categories.deleteMessage', { name: deleteTarget.nameEn })
             : ''
         }
         onConfirm={confirmDelete}
@@ -226,7 +226,7 @@ export function BlogCategoriesPage() {
           type="button"
           className={styles.addFab}
           onClick={() => openCreateModal()}
-          aria-label="Add category"
+          aria-label={t('categories.add')}
         >
           <Plus size={24} />
         </button>
diff --git a/apps/business/src/pages/BlogDetailsPage.tsx b/apps/business/src/pages/BlogDetailsPage.tsx
index 6d1e8b3..33fce94 100644
--- a/apps/business/src/pages/BlogDetailsPage.tsx
+++ b/apps/business/src/pages/BlogDetailsPage.tsx
@@ -1,8 +1,10 @@
 import { useEffect, useState } from 'react'
 import { Link, useParams } from 'react-router-dom'
 import { CalendarDays, User } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
 import { Breadcrumbs } from '../components/Breadcrumbs'
 import { BlogCommentsSection } from '../components/BlogCommentsSection'
+import { useT } from '../i18n/useT'
 import { ApiError } from '../lib/api'
 import {
   formatBlogAuthor,
@@ -16,6 +18,8 @@ import pageStyles from '../components/PageContent.module.css'
 import styles from './BlogDetailsPage.module.css'
 
 export function BlogDetailsPage() {
+  const t = useT()
+  const { locale } = useLocale()
   const { id } = useParams()
   const [blog, setBlog] = useState<BlogDetail | null>(null)
   const [isLoading, setIsLoading] = useState(true)
@@ -38,7 +42,7 @@ export function BlogDetailsPage() {
         if (err instanceof ApiError) {
           setError(err.message)
         } else {
-          setError('Unable to load blog post.')
+          setError(t('blog.details.errorLoad'))
         }
         setBlog(null)
       } finally {
@@ -53,7 +57,7 @@ export function BlogDetailsPage() {
   if (isLoading) {
     return (
       <main className={pageStyles.content}>
-        <p className={styles.status}>Loading blog post...</p>
+        <p className={styles.status}>{t('blog.details.loading')}</p>
       </main>
     )
   }
@@ -61,17 +65,28 @@ export function BlogDetailsPage() {
   if (error || !blog || !id) {
     return (
       <main className={pageStyles.content}>
-        <p className={styles.error}>{error || 'Blog post not found.'}</p>
+        <p className={styles.error}>{error || t('blog.details.notFound')}</p>
         <Link to="/blog/list" className={styles.backLink}>
-          Back to My Blogs
+          {t('blog.details.back')}
         </Link>
       </main>
     )
   }
 
-  const displayDate = formatBlogDate(blog.publishedAt ?? blog.createdAt)
-  const typeLabel =
-    BLOG_TYPE_OPTIONS.find((option) => option.value === blog.type)?.label ?? blog.type
+  const displayDate = formatBlogDate(
+    blog.publishedAt ?? blog.createdAt,
+    locale === 'fa' ? 'fa' : 'en',
+  )
+  const typeValue = BLOG_TYPE_OPTIONS.find((option) => option.value === blog.type)?.value
+  const typeLabel = typeValue
+    ? t(
+        typeValue === 'news'
+          ? 'blog.form.type.news'
+          : typeValue === 'article'
+            ? 'blog.form.type.article'
+            : 'blog.form.type.blog',
+      )
+    : blog.type
   const titleLocale = textLocaleAttrs(blog.title)
   const abstractLocale = textLocaleAttrs(blog.abstract)
   const contentLocale = textLocaleAttrs(
@@ -155,13 +170,13 @@ export function BlogDetailsPage() {
             />
           ) : (
             <p className={styles.content} lang="en" dir="ltr">
-              No content yet.
+              {t('blog.details.noContent')}
             </p>
           )}
 
           <div className={styles.authorRow}>
             <User size={16} />
-            <span className={styles.authorLabel}>Author</span>
+            <span className={styles.authorLabel}>{t('blog.details.author')}</span>
             <span className={styles.authorName}>{formatBlogAuthor(blog.author)}</span>
           </div>
         </div>
diff --git a/apps/business/src/pages/BlogListPage.tsx b/apps/business/src/pages/BlogListPage.tsx
index 9cf8c83..be97066 100644
--- a/apps/business/src/pages/BlogListPage.tsx
+++ b/apps/business/src/pages/BlogListPage.tsx
@@ -7,6 +7,7 @@ import { BlogCommentsModal } from '../components/BlogCommentsModal'
 import { ConfirmDeleteModal } from '../components/ConfirmDeleteModal'
 import { Pagination } from '../components/Pagination'
 import { useToast } from '../context/ToastContext'
+import { useT } from '../i18n/useT'
 import { ApiError } from '../lib/api'
 import {
   BLOGS_PER_PAGE,
@@ -23,6 +24,7 @@ import styles from './BlogPage.module.css'
 export function BlogListPage() {
   const navigate = useNavigate()
   const { showToast } = useToast()
+  const t = useT()
   const [blogs, setBlogs] = useState<Blog[]>([])
   const [totalBlogs, setTotalBlogs] = useState(0)
   const [currentPage, setCurrentPage] = useState(1)
@@ -58,7 +60,7 @@ export function BlogListPage() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load blog posts.')
+        setError(t('blog.list.errorLoad'))
       }
     } finally {
       setIsLoading(false)
@@ -91,7 +93,7 @@ export function BlogListPage() {
 
     try {
       await deleteBlog(deleteTarget.id)
-      showToast('Blog post removed.', 'success')
+      showToast(t('blog.list.toast.removed'), 'success')
       const nextTotal = totalBlogs - 1
       const nextTotalPages = Math.max(1, Math.ceil(nextTotal / BLOGS_PER_PAGE))
       const nextPage = currentPage > nextTotalPages ? nextTotalPages : currentPage
@@ -102,7 +104,7 @@ export function BlogListPage() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to delete blog post.')
+        setError(t('blog.list.errorDelete'))
       }
     } finally {
       setIsDeleting(false)
@@ -135,12 +137,15 @@ export function BlogListPage() {
       setBlogs((prev) =>
         prev.map((item) => (item.id === id ? mapBlogApiToUi(result.blog) : item)),
       )
-      showToast(nextVerified ? 'Blog verified.' : 'Blog unverified.', 'success')
+      showToast(
+        nextVerified ? t('blog.list.toast.verified') : t('blog.list.toast.unverified'),
+        'success',
+      )
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to update blog verification.')
+        setError(t('blog.list.errorVerify'))
       }
     } finally {
       setVerifyingId(null)
@@ -159,9 +164,9 @@ export function BlogListPage() {
 
       <div className={pageStyles.pageHeader}>
         <div>
-          <h2 className={pageStyles.pageTitle}>My Blogs</h2>
+          <h2 className={pageStyles.pageTitle}>{t('title.myBlogs')}</h2>
           <p className={pageStyles.pageSubtitle}>
-            {totalBlogs} posts · View, edit and manage your blog content.
+            {t('blog.list.subtitle', { count: totalBlogs })}
           </p>
         </div>
       </div>
@@ -173,9 +178,9 @@ export function BlogListPage() {
       )}
 
       {isLoading ? (
-        <p className={styles.empty}>Loading blog posts...</p>
+        <p className={styles.empty}>{t('blog.list.loading')}</p>
       ) : blogs.length === 0 ? (
-        <p className={styles.empty}>No blog posts found.</p>
+        <p className={styles.empty}>{t('blog.list.empty')}</p>
       ) : (
         <>
           <div className={pageStyles.grid}>
@@ -205,17 +210,17 @@ export function BlogListPage() {
         type="button"
         className={styles.addFab}
         onClick={() => navigate('/blog/new')}
-        aria-label="Add new blog"
+        aria-label={t('blog.list.addNew')}
       >
         <Plus size={26} strokeWidth={2.5} />
       </button>
 
       <ConfirmDeleteModal
         open={!!deleteTarget}
-        title="Delete Blog Post"
+        title={t('blog.list.deleteTitle')}
         message={
           deleteTarget
-            ? `Are you sure you want to delete "${deleteTarget.title}"? This action cannot be undone.`
+            ? t('blog.list.deleteMessage', { name: deleteTarget.title })
             : ''
         }
         onConfirm={confirmDelete}
diff --git a/apps/business/src/pages/BlogPage.module.css b/apps/business/src/pages/BlogPage.module.css
index 03103c8..eb26e0f 100644
--- a/apps/business/src/pages/BlogPage.module.css
+++ b/apps/business/src/pages/BlogPage.module.css
@@ -20,7 +20,8 @@
 
 .addFab {
   position: fixed;
-  right: 32px;
+  inset-inline-end: 32px;
+  inset-inline-start: auto;
   bottom: 32px;
   width: 56px;
   height: 56px;
@@ -32,7 +33,7 @@
   background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
   box-shadow: 0 8px 24px rgba(var(--primary-rgb) / 0.4);
   transition: transform 0.2s, box-shadow 0.2s;
-  z-index: 50;
+  z-index: 110;
 }
 
 .addFab:hover {
@@ -42,7 +43,8 @@
 
 @media (max-width: 768px) {
   .addFab {
-    right: 20px;
+    inset-inline-end: 20px;
+    inset-inline-start: auto;
     bottom: 20px;
     width: 52px;
     height: 52px;
diff --git a/apps/business/src/pages/BlogPage.tsx b/apps/business/src/pages/BlogPage.tsx
index 1de5a09..be46c92 100644
--- a/apps/business/src/pages/BlogPage.tsx
+++ b/apps/business/src/pages/BlogPage.tsx
@@ -1,40 +1,50 @@
 import { FileText, PlusCircle, FolderTree, Settings } from 'lucide-react'
 import { SectionCard } from '../components/SectionCard'
 import { Breadcrumbs } from '../components/Breadcrumbs'
+import { useT } from '../i18n/useT'
+import type { BusinessMessageKey } from '../i18n/messages'
 import styles from '../components/PageContent.module.css'
 
-const blogSections = [
+const blogSections: {
+  icon: typeof FileText
+  titleKey: BusinessMessageKey
+  descKey: BusinessMessageKey
+  linkKey: BusinessMessageKey
+  href: string
+}[] = [
   {
     icon: FileText,
-    title: 'My Blogs',
-    description: 'View, edit and manage all your blog posts.',
-    linkText: 'View blogs',
+    titleKey: 'nav.blog.list',
+    descKey: 'blog.card.list.desc',
+    linkKey: 'blog.card.list.link',
     href: '/blog/list',
   },
   {
     icon: PlusCircle,
-    title: 'Add New Blog',
-    description: 'Create and publish a new blog post.',
-    linkText: 'Add blog',
+    titleKey: 'nav.blog.new',
+    descKey: 'blog.card.new.desc',
+    linkKey: 'blog.card.new.link',
     href: '/blog/new',
   },
   {
     icon: FolderTree,
-    title: 'Blog Categories',
-    description: 'Organize your blog posts into categories and subcategories.',
-    linkText: 'View categories',
+    titleKey: 'blog.card.categories.title',
+    descKey: 'blog.card.categories.desc',
+    linkKey: 'blog.card.categories.link',
     href: '/blog/categories',
   },
   {
     icon: Settings,
-    title: 'Settings',
-    description: 'Configure blog comment moderation and display options.',
-    linkText: 'View settings',
+    titleKey: 'nav.blog.settings',
+    descKey: 'blog.card.settings.desc',
+    linkKey: 'blog.card.settings.link',
     href: '/blog/settings',
   },
 ]
 
 export function BlogPage() {
+  const t = useT()
+
   return (
     <main className={styles.content}>
       <Breadcrumbs
@@ -45,16 +55,21 @@ export function BlogPage() {
       />
       <div className={styles.pageHeader}>
         <div>
-          <h2 className={styles.pageTitle}>Blog</h2>
-          <p className={styles.pageSubtitle}>
-            Create and manage blog posts and categories.
-          </p>
+          <h2 className={styles.pageTitle}>{t('title.blog')}</h2>
+          <p className={styles.pageSubtitle}>{t('blog.page.subtitle')}</p>
         </div>
       </div>
 
       <div className={styles.gridHome}>
         {blogSections.map((section) => (
-          <SectionCard key={section.title} {...section} />
+          <SectionCard
+            key={section.href}
+            icon={section.icon}
+            title={t(section.titleKey)}
+            description={t(section.descKey)}
+            linkText={t(section.linkKey)}
+            href={section.href}
+          />
         ))}
       </div>
     </main>
diff --git a/apps/business/src/pages/BlogSettingsPage.tsx b/apps/business/src/pages/BlogSettingsPage.tsx
index f7b376a..8eb6891 100644
--- a/apps/business/src/pages/BlogSettingsPage.tsx
+++ b/apps/business/src/pages/BlogSettingsPage.tsx
@@ -2,6 +2,7 @@ import { useEffect, useState } from 'react'
 import { Breadcrumbs } from '../components/Breadcrumbs'
 import { Switch } from '../components/Switch'
 import { useToast } from '../context/ToastContext'
+import { useT } from '../i18n/useT'
 import { ApiError } from '../lib/api'
 import {
   getSettings,
@@ -17,6 +18,7 @@ const DEFAULT_SETTINGS: DashboardSettings = {
 }
 
 export function BlogSettingsPage() {
+  const t = useT()
   const { showToast } = useToast()
   const [settings, setSettings] = useState<DashboardSettings>(DEFAULT_SETTINGS)
   const [isLoading, setIsLoading] = useState(true)
@@ -41,7 +43,7 @@ export function BlogSettingsPage() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load settings.')
+        setError(t('productSettings.errorLoad'))
       }
     } finally {
       setIsLoading(false)
@@ -57,12 +59,12 @@ export function BlogSettingsPage() {
         comments: { autoApprove: checked },
       })
       setSettings(data.settings.dashboard)
-      showToast('Settings saved.', 'success')
+      showToast(t('productSettings.saved'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to save settings.')
+        setError(t('productSettings.errorSave'))
       }
     } finally {
       setSavingKey(null)
@@ -81,10 +83,8 @@ export function BlogSettingsPage() {
 
       <div className={pageStyles.pageHeader}>
         <div>
-          <h2 className={pageStyles.pageTitle}>Blog settings</h2>
-          <p className={pageStyles.pageSubtitle}>
-            Configure how blog comments are moderated.
-          </p>
+          <h2 className={pageStyles.pageTitle}>{t('blog.settings.title')}</h2>
+          <p className={pageStyles.pageSubtitle}>{t('blog.settings.subtitle')}</p>
         </div>
       </div>
 
@@ -95,27 +95,24 @@ export function BlogSettingsPage() {
       )}
 
       <section className={styles.panel}>
-        <h3 className={styles.sectionTitle}>Moderation</h3>
+        <h3 className={styles.sectionTitle}>{t('productSettings.moderation')}</h3>
 
         {isLoading ? (
-          <p className={styles.status}>Loading settings...</p>
+          <p className={styles.status}>{t('productSettings.loading')}</p>
         ) : (
           <div className={styles.list}>
             <div className={styles.row}>
               <div className={styles.rowText}>
                 <label htmlFor="blog-comments-auto-approve" className={styles.rowLabel}>
-                  Auto-approve comments
+                  {t('blog.settings.commentsAuto')}
                 </label>
-                <p className={styles.rowDescription}>
-                  New blog comments are published immediately when submitted. You can still
-                  reject them later if needed.
-                </p>
+                <p className={styles.rowDescription}>{t('blog.settings.commentsAutoDesc')}</p>
               </div>
               <Switch
                 id="blog-comments-auto-approve"
                 checked={settings.comments.autoApprove}
                 disabled={savingKey === 'comments'}
-                aria-label="Auto-approve blog comments"
+                aria-label={t('blog.settings.commentsAutoAria')}
                 onChange={(checked) => void handleCommentsAutoApprove(checked)}
               />
             </div>
diff --git a/apps/business/src/pages/BrandsPage.module.css b/apps/business/src/pages/BrandsPage.module.css
index 0d43b2b..514ea82 100644
--- a/apps/business/src/pages/BrandsPage.module.css
+++ b/apps/business/src/pages/BrandsPage.module.css
@@ -27,9 +27,10 @@
 
 .fabDock {
   position: fixed;
-  right: 32px;
+  inset-inline-end: 32px;
+  inset-inline-start: auto;
   bottom: 32px;
-  z-index: 50;
+  z-index: 110;
 }
 
 .addFab {
@@ -52,7 +53,8 @@
 
 @media (max-width: 768px) {
   .fabDock {
-    right: 20px;
+    inset-inline-end: 20px;
+    inset-inline-start: auto;
     bottom: 20px;
   }
 }
diff --git a/apps/business/src/pages/BrandsPage.tsx b/apps/business/src/pages/BrandsPage.tsx
index e884884..87f9819 100644
--- a/apps/business/src/pages/BrandsPage.tsx
+++ b/apps/business/src/pages/BrandsPage.tsx
@@ -16,14 +16,16 @@ import {
   toBrandFormPayload,
   updateBrand,
 } from '../services/brandService'
+import { useT } from '../i18n/useT'
 import pageStyles from '../components/PageContent.module.css'
 import styles from './BrandsPage.module.css'
 
 export function BrandsPage() {
+  const t = useT()
   const { showToast } = useToast()
   const [brands, setBrands] = useState<Brand[]>([])
   const [modalOpen, setModalOpen] = useState(false)
-  const [modalTitle, setModalTitle] = useState('Add Brand')
+  const [modalTitle, setModalTitle] = useState(() => t('brands.add'))
   const [editingBrand, setEditingBrand] = useState<Brand | null>(null)
   const [isLoading, setIsLoading] = useState(true)
   const [isSubmitting, setIsSubmitting] = useState(false)
@@ -47,7 +49,7 @@ export function BrandsPage() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load brands.')
+        setError(t('brands.errorLoad'))
       }
     } finally {
       setIsLoading(false)
@@ -56,13 +58,13 @@ export function BrandsPage() {
 
   function openCreateModal() {
     setEditingBrand(null)
-    setModalTitle('Add Brand')
+    setModalTitle(t('brands.add'))
     setModalOpen(true)
   }
 
   function openEditModal(brand: Brand) {
     setEditingBrand(brand)
-    setModalTitle('Edit Brand')
+    setModalTitle(t('brands.edit'))
     setModalOpen(true)
   }
 
@@ -87,11 +89,11 @@ export function BrandsPage() {
             brand.id === editingBrand.id ? mapBrandApiToUi(result.brand) : brand,
           ),
         )
-        showToast('Brand updated.', 'success')
+        showToast(t('brands.toast.updated'), 'success')
       } else {
         const result = await createBrand(toBrandFormPayload(data, resolvedImageMediaId))
         setBrands((prev) => [...prev, mapBrandApiToUi(result.brand)])
-        showToast('Brand created.', 'success')
+        showToast(t('brands.toast.created'), 'success')
       }
 
       setModalOpen(false)
@@ -100,7 +102,7 @@ export function BrandsPage() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to save brand.')
+        setError(t('brands.errorSave'))
       }
     } finally {
       setIsSubmitting(false)
@@ -117,12 +119,12 @@ export function BrandsPage() {
       await deleteBrand(deleteTarget.id)
       setBrands((prev) => prev.filter((brand) => brand.id !== deleteTarget.id))
       setDeleteTarget(null)
-      showToast('Brand deleted.', 'success')
+      showToast(t('brands.toast.deleted'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to delete brand.')
+        setError(t('brands.errorDelete'))
       }
     } finally {
       setIsSubmitting(false)
@@ -140,10 +142,8 @@ export function BrandsPage() {
       />
       <div className={pageStyles.pageHeader}>
         <div>
-          <h2 className={pageStyles.pageTitle}>Brands</h2>
-          <p className={pageStyles.pageSubtitle}>
-            Manage product brands for your store catalog.
-          </p>
+          <h2 className={pageStyles.pageTitle}>{t('title.brands')}</h2>
+          <p className={pageStyles.pageSubtitle}>{t('brands.page.subtitle')}</p>
         </div>
       </div>
 
@@ -155,9 +155,9 @@ export function BrandsPage() {
 
       <div className={styles.list}>
         {isLoading ? (
-          <p className={styles.empty}>Loading brands...</p>
+          <p className={styles.empty}>{t('brands.loading')}</p>
         ) : brands.length === 0 ? (
-          <p className={styles.empty}>No brands yet. Click + to add one.</p>
+          <p className={styles.empty}>{t('brands.empty')}</p>
         ) : (
           brands.map((brand) => (
             <BrandRow
@@ -192,10 +192,12 @@ export function BrandsPage() {
 
       <ConfirmDeleteModal
         open={!!deleteTarget}
-        title="Delete Brand"
+        title={t('brands.deleteTitle')}
         message={
           deleteTarget
-            ? `Are you sure you want to delete "${deleteTarget.nameEn}"? Products linked to this brand will have their brand cleared.`
+            ? t('brands.deleteMessage', {
+                name: deleteTarget.nameFa || deleteTarget.nameEn,
+              })
             : ''
         }
         onConfirm={confirmDelete}
@@ -207,7 +209,7 @@ export function BrandsPage() {
           type="button"
           className={styles.addFab}
           onClick={openCreateModal}
-          aria-label="Add brand"
+          aria-label={t('brands.add')}
         >
           <Plus size={24} />
         </button>
diff --git a/apps/business/src/pages/CategoriesPage.module.css b/apps/business/src/pages/CategoriesPage.module.css
index 307354d..fd62592 100644
--- a/apps/business/src/pages/CategoriesPage.module.css
+++ b/apps/business/src/pages/CategoriesPage.module.css
@@ -27,12 +27,13 @@
 
 .fabDock {
   position: fixed;
-  right: 32px;
+  inset-inline-end: 32px;
+  inset-inline-start: auto;
   bottom: 32px;
   display: flex;
   align-items: center;
   gap: 10px;
-  z-index: 50;
+  z-index: 110;
 }
 
 .addFab {
@@ -56,7 +57,8 @@
 
 @media (max-width: 768px) {
   .fabDock {
-    right: 20px;
+    inset-inline-end: 20px;
+    inset-inline-start: auto;
     bottom: 20px;
     gap: 8px;
   }
diff --git a/apps/business/src/pages/CategoriesPage.tsx b/apps/business/src/pages/CategoriesPage.tsx
index 89f1a3d..72d00ee 100644
--- a/apps/business/src/pages/CategoriesPage.tsx
+++ b/apps/business/src/pages/CategoriesPage.tsx
@@ -33,17 +33,19 @@ import {
   toCategoryFormPayload,
   updateProductCategory,
 } from '../services/productCategoryService'
+import { useT } from '../i18n/useT'
 import pageStyles from '../components/PageContent.module.css'
 import aiStyles from '../styles/ai.module.css'
 import styles from './CategoriesPage.module.css'
 
 export function CategoriesPage() {
+  const t = useT()
   const { showToast } = useToast()
   const [categories, setCategories] = useState<Category[]>([])
   const [expandedIds, setExpandedIds] = useState<Set<string>>(() => new Set())
   const [modalOpen, setModalOpen] = useState(false)
   const [defaultParentId, setDefaultParentId] = useState('')
-  const [modalTitle, setModalTitle] = useState('Add Category')
+  const [modalTitle, setModalTitle] = useState(() => t('categories.add'))
   const [editingCategory, setEditingCategory] = useState<Category | null>(null)
   const [isLoading, setIsLoading] = useState(true)
   const [isSubmitting, setIsSubmitting] = useState(false)
@@ -95,10 +97,10 @@ export function CategoriesPage() {
     }
   }
 
-  function openCreateModal(parentId = '', title = 'Add Category') {
+  function openCreateModal(parentId = '', title?: string) {
     setEditingCategory(null)
     setDefaultParentId(parentId)
-    setModalTitle(title)
+    setModalTitle(title ?? t('categories.add'))
     setModalOpen(true)
     if (parentId) {
       setExpandedIds((prev) => new Set(prev).add(parentId))
@@ -108,7 +110,7 @@ export function CategoriesPage() {
   function openEditModal(category: Category) {
     setEditingCategory(category)
     setDefaultParentId(category.parentId ?? '')
-    setModalTitle('Edit Category')
+    setModalTitle(t('categories.edit'))
     setModalOpen(true)
   }
 
@@ -224,7 +226,9 @@ export function CategoriesPage() {
 
     setVariationsTarget({
       categoryId,
-      categoryName: `${category.nameEn} · ${category.nameFa}`,
+      categoryName: category.nameFa
+        ? `${category.nameFa} · ${category.nameEn}`
+        : category.nameEn,
     })
     setVariationsLoading(true)
     setError('')
@@ -263,7 +267,9 @@ export function CategoriesPage() {
 
     setTechnicalTarget({
       categoryId,
-      categoryName: `${category.nameEn} · ${category.nameFa}`,
+      categoryName: category.nameFa
+        ? `${category.nameFa} · ${category.nameEn}`
+        : category.nameEn,
     })
     setTechnicalLoading(true)
     setTechnicalError('')
@@ -421,10 +427,8 @@ export function CategoriesPage() {
       />
       <div className={pageStyles.pageHeader}>
         <div>
-          <h2 className={pageStyles.pageTitle}>Categories</h2>
-          <p className={pageStyles.pageSubtitle}>
-            Manage your digital product categories and subcategories.
-          </p>
+          <h2 className={pageStyles.pageTitle}>{t('title.categories')}</h2>
+          <p className={pageStyles.pageSubtitle}>{t('categories.page.subtitle')}</p>
         </div>
       </div>
 
@@ -436,9 +440,9 @@ export function CategoriesPage() {
 
       <div className={styles.list}>
         {isLoading ? (
-          <p className={styles.empty}>Loading categories...</p>
+          <p className={styles.empty}>{t('categories.loading')}</p>
         ) : categories.length === 0 ? (
-          <p className={styles.empty}>No categories yet. Use + or AI to add categories.</p>
+          <p className={styles.empty}>{t('categories.empty')}</p>
         ) : (
           <CategoryTree
             categories={categories}
@@ -446,7 +450,7 @@ export function CategoriesPage() {
             variationCounts={variationCountsMap()}
             technicalFieldCounts={technicalFieldCountsMap()}
             onToggle={toggleExpanded}
-            onAddSub={(id) => openCreateModal(id, 'Add Sub Category')}
+            onAddSub={(id) => openCreateModal(id, t('categories.addSub'))}
             onVariations={openVariations}
             onTechnicalForm={openTechnicalForm}
             onOptions={(id) => {
@@ -479,10 +483,12 @@ export function CategoriesPage() {
 
       <ConfirmDeleteModal
         open={!!deleteTarget}
-        title="Delete Category"
+        title={t('categories.deleteTitle')}
         message={
           deleteTarget
-            ? `Are you sure you want to delete "${deleteTarget.nameEn}"? Subcategories will also be removed.`
+            ? t('categories.deleteMessage', {
+                name: deleteTarget.nameFa || deleteTarget.nameEn,
+              })
             : ''
         }
         onConfirm={confirmDelete}
@@ -558,13 +564,13 @@ export function CategoriesPage() {
           onClick={() => setAiModalOpen(true)}
         >
           <Sparkles size={18} />
-          <span>Fill categories by AI</span>
+          <span>{t('categories.addByAi')}</span>
         </button>
         <button
           type="button"
           className={styles.addFab}
           onClick={() => openCreateModal()}
-          aria-label="Add category"
+          aria-label={t('categories.add')}
         >
           <Plus size={24} />
         </button>
diff --git a/apps/business/src/pages/CustomersPage.module.css b/apps/business/src/pages/CustomersPage.module.css
index baa137e..903b5ce 100644
--- a/apps/business/src/pages/CustomersPage.module.css
+++ b/apps/business/src/pages/CustomersPage.module.css
@@ -41,27 +41,23 @@
 }
 
 .colName {
-  width: 16%;
+  width: 22%;
 }
 
 .colCell {
-  width: 11%;
-}
-
-.colEmail {
   width: 14%;
 }
 
 .colOrders {
-  width: 9%;
+  width: 12%;
 }
 
 .colTransactions {
-  width: 11%;
+  width: 14%;
 }
 
 .colDate {
-  width: 10%;
+  width: 12%;
 }
 
 .colActions {
@@ -71,7 +67,7 @@
 .th,
 .td {
   padding: 10px 12px;
-  text-align: left;
+  text-align: start;
   border-bottom: 1px solid rgba(148, 163, 184, 0.16);
   vertical-align: middle;
 }
@@ -104,15 +100,10 @@
 
 .customerName[dir='rtl'] {
   font-weight: 400;
-  text-align: left;
 }
 
-.emailCell {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  font-size: 12px;
-  max-width: 0;
+.nameAlignFa {
+  text-align: right;
 }
 
 .dateCell {
@@ -126,14 +117,14 @@
 }
 
 .thActions {
-  text-align: center;
+  text-align: right;
   white-space: nowrap;
 }
 
 .tdActions {
   text-align: right;
   white-space: nowrap;
-  padding-right: 10px;
+  padding-inline-end: 10px;
 }
 
 .rowActions {
@@ -141,6 +132,19 @@
   align-items: center;
   justify-content: flex-end;
   gap: 0;
+  direction: ltr;
+}
+
+/* FA: عملیات column is on the physical left — pin controls to that edge. */
+.tableFa .thActions,
+.tableFa .tdActions {
+  text-align: left;
+  padding-left: 10px;
+  padding-right: 10px;
+}
+
+.tableFa .rowActions {
+  justify-content: flex-start;
 }
 
 .toggleInActions {
@@ -243,9 +247,10 @@
 
 .fab {
   position: fixed;
-  right: 32px;
+  inset-inline-end: 32px;
+  inset-inline-start: auto;
   bottom: 32px;
-  z-index: 50;
+  z-index: 110;
   width: 56px;
   height: 56px;
   display: flex;
@@ -265,7 +270,8 @@
 
 @media (max-width: 768px) {
   .fab {
-    right: 20px;
+    inset-inline-end: 20px;
+    inset-inline-start: auto;
     bottom: 20px;
     width: 52px;
     height: 52px;
diff --git a/apps/business/src/pages/CustomersPage.tsx b/apps/business/src/pages/CustomersPage.tsx
index d3b80bb..169d583 100644
--- a/apps/business/src/pages/CustomersPage.tsx
+++ b/apps/business/src/pages/CustomersPage.tsx
@@ -1,5 +1,6 @@
 import { useEffect, useMemo, useState } from 'react'
 import { MessageSquare, Pencil, Plus, RotateCcw, Search, Ticket, Trash2 } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
 import { AddCustomerModal } from '../components/AddCustomerModal'
 import { Breadcrumbs } from '../components/Breadcrumbs'
 import { ConfirmDeleteModal } from '../components/ConfirmDeleteModal'
@@ -8,6 +9,7 @@ import { Pagination } from '../components/Pagination'
 import { ToggleSwitch } from '../components/ToggleSwitch'
 import { Tooltip } from '../components/Tooltip'
 import { useToast } from '../context/ToastContext'
+import { useT } from '../i18n/useT'
 import { ApiError, isAbortError } from '../lib/api'
 import { formatCellForDisplay } from '../lib/cellNumber'
 import {
@@ -24,12 +26,13 @@ import pageStyles from '../components/PageContent.module.css'
 import styles from './CustomersPage.module.css'
 
 const PAGE_SIZE = 24
-const COLUMN_COUNT = 7
+const COLUMN_COUNT = 6
 
-function formatDate(value: string) {
+function formatDate(value: string, locale: 'en' | 'fa') {
   const d = new Date(value)
   if (Number.isNaN(d.getTime())) return value
-  return d.toLocaleDateString('en-US', { year: 'numeric', month: 'short', day: '2-digit' })
+  const intlLocale = locale === 'fa' ? 'fa-IR' : 'en-US'
+  return d.toLocaleDateString(intlLocale, { year: 'numeric', month: 'short', day: '2-digit' })
 }
 
 function displayName(customer: BusinessCustomerListItem) {
@@ -37,13 +40,6 @@ function displayName(customer: BusinessCustomerListItem) {
   return name || '—'
 }
 
-function formatOrderCount(count: number | null | undefined) {
-  if (count == null || count === 0) {
-    return <span className={styles.subText}>No order yet</span>
-  }
-  return count
-}
-
 function formatTransactionTotal(total: number | null | undefined) {
   if (total == null || total === 0) {
     return <span className={styles.subText}>—</span>
@@ -52,6 +48,8 @@ function formatTransactionTotal(total: number | null | undefined) {
 }
 
 export function CustomersPage() {
+  const t = useT()
+  const { locale } = useLocale()
   const { showToast } = useToast()
   const [data, setData] = useState<CustomersListResponse | null>(null)
   const [loading, setLoading] = useState(false)
@@ -88,7 +86,7 @@ export function CustomersPage() {
         setData(result)
       } catch (err) {
         if (isAbortError(err) || controller.signal.aborted) return
-        setError(err instanceof ApiError ? err.message : 'Unable to load customers.')
+        setError(err instanceof ApiError ? err.message : t('customers.error.load'))
       } finally {
         if (!controller.signal.aborted) setLoading(false)
       }
@@ -99,7 +97,7 @@ export function CustomersPage() {
     return () => {
       controller.abort()
     }
-  }, [page, appliedFilters.name, appliedFilters.cellNumber])
+  }, [page, appliedFilters.name, appliedFilters.cellNumber, t])
 
   const totalPages = useMemo(() => {
     const total = data?.total ?? 0
@@ -147,12 +145,12 @@ export function CustomersPage() {
       })
       showToast(
         isEnabled
-          ? `"${displayName(customer)}" has been enabled.`
-          : `"${displayName(customer)}" has been disabled.`,
+          ? t('customers.toast.enabled', { name: displayName(customer) })
+          : t('customers.toast.disabled', { name: displayName(customer) }),
         'success',
       )
     } catch (err) {
-      setError(err instanceof ApiError ? err.message : 'Unable to update customer.')
+      setError(err instanceof ApiError ? err.message : t('customers.error.update'))
     } finally {
       setTogglingId(null)
     }
@@ -172,21 +170,24 @@ export function CustomersPage() {
           items: prev.items.filter((item) => item.id !== removeTarget.id),
         }
       })
-      showToast(`"${displayName(removeTarget)}" has been removed.`, 'success')
+      showToast(t('customers.toast.removed', { name: displayName(removeTarget) }), 'success')
       setRemoveTarget(null)
     } catch (err) {
-      setError(err instanceof ApiError ? err.message : 'Unable to remove customer.')
+      setError(err instanceof ApiError ? err.message : t('customers.error.remove'))
     } finally {
       setRemoving(false)
     }
   }
 
   function handleSendSms(customer: BusinessCustomerListItem) {
-    showToast(`SMS to ${formatCellForDisplay(customer.cellNumber)} is not available yet.`, 'info')
+    showToast(
+      t('customers.toast.smsSoon', { phone: formatCellForDisplay(customer.cellNumber) }),
+      'info',
+    )
   }
 
   function handleTickets(customer: BusinessCustomerListItem) {
-    showToast(`Tickets for "${displayName(customer)}" are not available yet.`, 'info')
+    showToast(t('customers.toast.ticketsSoon', { name: displayName(customer) }), 'info')
   }
 
   function handleCustomerSaved(updated: BusinessCustomerListItem) {
@@ -197,7 +198,7 @@ export function CustomersPage() {
         items: prev.items.map((item) => (item.id === updated.id ? updated : item)),
       }
     })
-    showToast(`"${displayName(updated)}" has been updated.`, 'success')
+    showToast(t('customers.toast.updated', { name: displayName(updated) }), 'success')
   }
 
   function handleCustomerCreated(customer: BusinessCustomerListItem) {
@@ -221,7 +222,7 @@ export function CustomersPage() {
         ),
       }
     })
-    showToast(`"${displayName(customer)}" has been added.`, 'success')
+    showToast(t('customers.toast.added', { name: displayName(customer) }), 'success')
   }
 
   return (
@@ -235,33 +236,31 @@ export function CustomersPage() {
 
       <div className={pageStyles.pageHeader}>
         <div>
-          <h2 className={pageStyles.pageTitle}>Customers</h2>
-          <p className={pageStyles.pageSubtitle}>
-            View customers who have registered or ordered from your business.
-          </p>
+          <h2 className={pageStyles.pageTitle}>{t('customers.title')}</h2>
+          <p className={pageStyles.pageSubtitle}>{t('customers.subtitle')}</p>
         </div>
       </div>
 
       <div className={filterStyles.filtersPanel}>
-        <div className={filterStyles.filtersTitle}>Filters</div>
+        <div className={filterStyles.filtersTitle}>{t('customers.filters')}</div>
         <div className={filterStyles.filtersGrid}>
           <div className={filterStyles.filtersInputs}>
             <div className={`${filterStyles.field} ${filterStyles.fieldCol3}`}>
-              <label htmlFor="filter-customer-name">Name</label>
               <input
                 id="filter-customer-name"
                 value={draftName}
                 onChange={(e) => setDraftName(e.target.value)}
-                placeholder="Search by name"
+                placeholder={t('customers.filter.name')}
+                aria-label={t('customers.filter.name')}
               />
             </div>
             <div className={`${filterStyles.field} ${styles.filterCellNarrow}`}>
-              <label htmlFor="filter-customer-cell">Cell number</label>
               <input
                 id="filter-customer-cell"
                 value={draftCell}
                 onChange={(e) => setDraftCell(e.target.value)}
-                placeholder="0912..."
+                placeholder={t('customers.filter.cell')}
+                aria-label={t('customers.filter.cell')}
                 autoComplete="off"
               />
             </div>
@@ -272,8 +271,8 @@ export function CustomersPage() {
               className={`${filterStyles.iconActionBtn} ${filterStyles.iconActionBtnPrimary}`}
               onClick={applyFilters}
               disabled={loading}
-              aria-label="Search"
-              title="Search"
+              aria-label={t('customers.search')}
+              title={t('customers.search')}
             >
               <Search size={18} />
             </button>
@@ -282,8 +281,8 @@ export function CustomersPage() {
               className={`${filterStyles.iconActionBtn} ${filterStyles.iconActionBtnGhost}`}
               onClick={clearFilters}
               disabled={loading}
-              aria-label="Clear filters"
-              title="Clear filters"
+              aria-label={t('customers.clearFilters')}
+              title={t('customers.clearFilters')}
             >
               <RotateCcw size={18} />
             </button>
@@ -294,15 +293,17 @@ export function CustomersPage() {
       <div className={styles.tablePanel}>
         <div className={styles.tableWrap}>
           <div className={styles.tableHeader}>
-            <div className={styles.tableHeaderTitle}>Customer list</div>
+            <div className={styles.tableHeaderTitle}>{t('customers.listTitle')}</div>
             <div className={styles.meta}>
               {data ? (
                 data.total > 0 ? (
-                  <>
-                    Showing {showingFrom} - {showingTo} of {data.total}
-                  </>
+                  t('customers.showing', {
+                    from: showingFrom,
+                    to: showingTo,
+                    total: data.total,
+                  })
                 ) : (
-                  'No customers'
+                  t('customers.none')
                 )
               ) : (
                 ' '
@@ -312,11 +313,13 @@ export function CustomersPage() {
 
           {error && <div className={styles.errorBanner}>{error}</div>}
 
-          <table className={styles.table}>
+          <table
+            className={`${styles.table}${locale === 'fa' ? ` ${styles.tableFa}` : ''}`}
+            dir={locale === 'fa' ? 'rtl' : 'ltr'}
+          >
             <colgroup>
               <col className={styles.colName} />
               <col className={styles.colCell} />
-              <col className={styles.colEmail} />
               <col className={styles.colOrders} />
               <col className={styles.colTransactions} />
               <col className={styles.colDate} />
@@ -324,123 +327,133 @@ export function CustomersPage() {
             </colgroup>
             <thead>
               <tr>
-                <th className={styles.th}>Name</th>
-                <th className={styles.th}>Cell number</th>
-                <th className={styles.th}>Email</th>
-                <th className={styles.th}>Orders</th>
-                <th className={styles.th}>Transactions</th>
-                <th className={styles.th}>Date joined</th>
-                <th className={`${styles.th} ${styles.thActions}`}>Actions</th>
+                <th className={styles.th}>{t('customers.col.name')}</th>
+                <th className={styles.th}>{t('customers.col.cell')}</th>
+                <th className={styles.th}>{t('customers.col.orders')}</th>
+                <th className={styles.th}>{t('customers.col.transactions')}</th>
+                <th className={styles.th}>{t('customers.col.date')}</th>
+                <th className={`${styles.th} ${styles.thActions}`}>{t('customers.col.actions')}</th>
               </tr>
             </thead>
             <tbody>
-                {loading && (
-                  <tr>
-                    <td className={styles.td} colSpan={COLUMN_COUNT}>
-                      Loading...
-                    </td>
-                  </tr>
-                )}
+              {loading && (
+                <tr>
+                  <td className={styles.td} colSpan={COLUMN_COUNT}>
+                    {t('customers.loading')}
+                  </td>
+                </tr>
+              )}
 
-                {!loading && data?.items?.length === 0 && (
-                  <tr>
-                    <td className={styles.td} colSpan={COLUMN_COUNT}>
-                      No results found.
-                    </td>
-                  </tr>
-                )}
+              {!loading && data?.items?.length === 0 && (
+                <tr>
+                  <td className={styles.td} colSpan={COLUMN_COUNT}>
+                    {t('customers.empty')}
+                  </td>
+                </tr>
+              )}
 
-                {!loading &&
-                  data?.items?.map((customer) => (
+              {!loading &&
+                data?.items?.map((customer) => {
+                  const name = displayName(customer)
+                  const nameLocale = textLocaleAttrs(name)
+                  return (
                     <tr
                       key={customer.id}
                       className={!customer.isEnabled ? styles.inactiveRow : undefined}
                     >
                       <td className={styles.td}>
-                        {(() => {
-                          const name = displayName(customer)
-                          const locale = textLocaleAttrs(name)
-                          return (
-                            <div
-                              className={[
-                                styles.customerName,
-                                locale.className,
-                              ]
-                                .filter(Boolean)
-                                .join(' ')}
-                              lang={locale.lang}
-                              dir={locale.dir}
-                            >
-                              {name}
-                            </div>
-                          )
-                        })()}
+                        <div
+                          className={[
+                            styles.customerName,
+                            nameLocale.className,
+                            locale === 'fa' ? styles.nameAlignFa : '',
+                          ]
+                            .filter(Boolean)
+                            .join(' ')}
+                          lang={nameLocale.lang}
+                          dir={nameLocale.dir}
+                        >
+                          {name}
+                        </div>
                         {!customer.isEnabled && (
-                          <div className={styles.statusDisabled}>Disabled</div>
+                          <div className={styles.statusDisabled}>{t('customers.disabled')}</div>
                         )}
                       </td>
                       <td className={styles.td}>{formatCellForDisplay(customer.cellNumber)}</td>
-                      <td className={`${styles.td} ${styles.emailCell}`}>
-                        {customer.email ?? <span className={styles.subText}>—</span>}
+                      <td className={styles.td}>
+                        {customer.orderCount == null || customer.orderCount === 0 ? (
+                          <span className={styles.subText}>{t('customers.noOrders')}</span>
+                        ) : (
+                          customer.orderCount
+                        )}
                       </td>
-                      <td className={styles.td}>{formatOrderCount(customer.orderCount)}</td>
                       <td className={styles.td}>
                         {formatTransactionTotal(customer.totalTransactionsIrt)}
                       </td>
                       <td className={`${styles.td} ${styles.dateCell}`}>
-                        {formatDate(customer.createdAt)}
+                        {formatDate(customer.createdAt, locale)}
                       </td>
                       <td className={`${styles.td} ${styles.tdActions}`}>
                         <div className={styles.rowActions}>
                           <Tooltip
-                            label={`${customer.isEnabled ? 'Disable' : 'Enable'} customer`}
+                            label={
+                              customer.isEnabled
+                                ? t('customers.disable')
+                                : t('customers.enable')
+                            }
                           >
                             <span className={styles.toggleInActions}>
                               <ToggleSwitch
                                 checked={customer.isEnabled}
                                 disabled={togglingId === customer.id || removing}
                                 size="compact"
-                                ariaLabel={`${customer.isEnabled ? 'Disable' : 'Enable'} ${displayName(customer)}`}
-                                onChange={(isEnabled) => void handleToggleEnabled(customer, isEnabled)}
+                                ariaLabel={
+                                  customer.isEnabled
+                                    ? t('customers.disableAria', { name })
+                                    : t('customers.enableAria', { name })
+                                }
+                                onChange={(isEnabled) =>
+                                  void handleToggleEnabled(customer, isEnabled)
+                                }
                               />
                             </span>
                           </Tooltip>
-                          <Tooltip label="Edit customer">
+                          <Tooltip label={t('customers.edit')}>
                             <button
                               type="button"
                               className={styles.actionBtn}
                               onClick={() => setEditTarget(customer)}
-                              aria-label="Edit customer"
+                              aria-label={t('customers.edit')}
                             >
                               <Pencil size={15} />
                             </button>
                           </Tooltip>
-                          <Tooltip label="Send SMS">
+                          <Tooltip label={t('customers.sms')}>
                             <button
                               type="button"
                               className={styles.actionBtn}
                               onClick={() => handleSendSms(customer)}
-                              aria-label="Send SMS"
+                              aria-label={t('customers.sms')}
                             >
                               <MessageSquare size={15} />
                             </button>
                           </Tooltip>
-                          <Tooltip label="Tickets">
+                          <Tooltip label={t('customers.tickets')}>
                             <button
                               type="button"
                               className={styles.actionBtn}
                               onClick={() => handleTickets(customer)}
-                              aria-label="Tickets"
+                              aria-label={t('customers.tickets')}
                             >
                               <Ticket size={15} />
                             </button>
                           </Tooltip>
-                          <Tooltip label="Remove customer">
+                          <Tooltip label={t('customers.remove')}>
                             <button
                               type="button"
                               className={`${styles.actionBtn} ${styles.actionBtnDanger}`}
                               onClick={() => setRemoveTarget(customer)}
-                              aria-label="Remove customer"
+                              aria-label={t('customers.remove')}
                               disabled={removing}
                             >
                               <Trash2 size={15} />
@@ -449,13 +462,19 @@ export function CustomersPage() {
                         </div>
                       </td>
                     </tr>
-                  ))}
-              </tbody>
-            </table>
+                  )
+                })}
+            </tbody>
+          </table>
 
           <div className={styles.pagination}>
             <div>
-              Page {page} / {totalPages} · {PAGE_SIZE} per page · {data?.total ?? 0} total
+              {t('customers.pageMeta', {
+                page,
+                totalPages,
+                pageSize: PAGE_SIZE,
+                total: data?.total ?? 0,
+              })}
             </div>
             <Pagination
               currentPage={page}
@@ -483,10 +502,10 @@ export function CustomersPage() {
 
       <ConfirmDeleteModal
         open={removeTarget !== null}
-        title="Remove customer?"
+        title={t('customers.deleteTitle')}
         message={
           removeTarget
-            ? `Remove "${displayName(removeTarget)}" from your business? Their account will not be deleted.`
+            ? t('customers.deleteMessage', { name: displayName(removeTarget) })
             : ''
         }
         onCancel={() => setRemoveTarget(null)}
@@ -497,7 +516,7 @@ export function CustomersPage() {
         type="button"
         className={styles.fab}
         onClick={() => setCreateOpen(true)}
-        aria-label="Add customer"
+        aria-label={t('customers.add')}
       >
         <Plus size={24} />
       </button>
diff --git a/apps/business/src/pages/MyProductsPage.module.css b/apps/business/src/pages/MyProductsPage.module.css
index 2deded0..ee8ab61 100644
--- a/apps/business/src/pages/MyProductsPage.module.css
+++ b/apps/business/src/pages/MyProductsPage.module.css
@@ -33,14 +33,23 @@
   color: var(--text-secondary);
   font-weight: 600;
   font-size: 12px;
+  direction: ltr;
 }
 
-.pagination > div:first-child {
-  justify-self: start;
+.paginationMeta {
+  grid-column: 3;
+  justify-self: end;
+  display: flex;
+  align-items: center;
+  height: 38px;
+  line-height: 1;
+  font-family: var(--font-ui);
 }
 
 .pagination > nav {
+  grid-column: 2;
   justify-self: center;
+  align-self: center;
 }
 
 @media (min-width: 640px) {
@@ -83,17 +92,19 @@
 
 .fabDock {
   position: fixed;
-  right: 32px;
+  inset-inline-end: 32px;
+  inset-inline-start: auto;
   bottom: 32px;
   display: flex;
   align-items: center;
   gap: 10px;
-  z-index: 50;
+  z-index: 110;
 }
 
 @media (max-width: 768px) {
   .fabDock {
-    right: 20px;
+    inset-inline-end: 20px;
+    inset-inline-start: auto;
     bottom: 20px;
     gap: 8px;
   }
diff --git a/apps/business/src/pages/MyProductsPage.tsx b/apps/business/src/pages/MyProductsPage.tsx
index 35ef6e8..37ded2f 100644
--- a/apps/business/src/pages/MyProductsPage.tsx
+++ b/apps/business/src/pages/MyProductsPage.tsx
@@ -9,6 +9,7 @@ import { ProductVariantsModal } from '../components/ProductVariantsModal'
 import { ProductTechnicalInfoModal } from '../components/ProductTechnicalInfoModal'
 import { ProductCommentsModal } from '../components/ProductCommentsModal'
 import { Breadcrumbs } from '../components/Breadcrumbs'
+import { useT } from '../i18n/useT'
 import { ApiError } from '../lib/api'
 import {
   deleteProduct,
@@ -22,6 +23,7 @@ import styles from './MyProductsPage.module.css'
 import aiStyles from '../styles/ai.module.css'
 
 export function MyProductsPage() {
+  const t = useT()
   const navigate = useNavigate()
   const [products, setProducts] = useState<Product[]>([])
   const [totalProducts, setTotalProducts] = useState(0)
@@ -75,7 +77,7 @@ export function MyProductsPage() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load products.')
+        setError(t('products.list.errorLoad'))
       }
     } finally {
       setIsLoading(false)
@@ -89,7 +91,7 @@ export function MyProductsPage() {
   function handleComments(id: string) {
     const product = products.find((p) => p.id === id)
     if (product) {
-      setCommentsTarget({ id, name: product.nameEn })
+      setCommentsTarget({ id, name: product.nameFa || product.nameEn })
     }
   }
 
@@ -98,7 +100,7 @@ export function MyProductsPage() {
     if (product) {
       setVariantsTarget({
         id,
-        name: product.nameEn,
+        name: product.nameFa || product.nameEn,
         categoryId: product.categoryId,
       })
     }
@@ -109,7 +111,7 @@ export function MyProductsPage() {
     if (product) {
       setTechnicalTarget({
         id,
-        name: product.nameEn,
+        name: product.nameFa || product.nameEn,
         categoryId: product.categoryId,
       })
     }
@@ -118,7 +120,7 @@ export function MyProductsPage() {
   function handleRemoveRequest(id: string) {
     const product = products.find((p) => p.id === id)
     if (product) {
-      setDeleteTarget({ id, name: product.nameEn })
+      setDeleteTarget({ id, name: product.nameFa || product.nameEn })
     }
   }
 
@@ -140,7 +142,7 @@ export function MyProductsPage() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to delete product.')
+        setError(t('products.list.errorDelete'))
       }
     } finally {
       setIsDeleting(false)
@@ -182,24 +184,24 @@ export function MyProductsPage() {
       />
       <div className={pageStyles.pageHeader}>
         <div>
-          <h2 className={pageStyles.pageTitle}>My Products</h2>
+          <h2 className={pageStyles.pageTitle}>{t('title.myProducts')}</h2>
           <p className={pageStyles.pageSubtitle}>
-            {totalProducts} products · View, edit and manage your catalog.
+            {t('products.list.subtitle', { count: totalProducts })}
           </p>
         </div>
       </div>
 
       <div className={filterStyles.filtersPanel}>
-        <div className={filterStyles.filtersTitle}>Filters</div>
+        <div className={filterStyles.filtersTitle}>{t('products.list.filters')}</div>
         <div className={filterStyles.filtersGrid}>
           <div className={filterStyles.filtersInputs}>
             <div className={`${filterStyles.field} ${filterStyles.fieldCol4}`}>
-              <label htmlFor="filter-product-name">Name</label>
               <input
                 id="filter-product-name"
                 value={draftName}
                 onChange={(e) => setDraftName(e.target.value)}
-                placeholder="Search by product name"
+                placeholder={t('products.list.filterNamePlaceholder')}
+                aria-label={t('products.list.filterName')}
                 disabled={isLoading}
               />
             </div>
@@ -210,8 +212,8 @@ export function MyProductsPage() {
               className={`${filterStyles.iconActionBtn} ${filterStyles.iconActionBtnPrimary}`}
               onClick={applyFilters}
               disabled={isLoading}
-              aria-label="Search"
-              title="Search"
+              aria-label={t('products.list.search')}
+              title={t('products.list.search')}
             >
               <Search size={18} />
             </button>
@@ -220,8 +222,8 @@ export function MyProductsPage() {
               className={`${filterStyles.iconActionBtn} ${filterStyles.iconActionBtnGhost}`}
               onClick={clearFilters}
               disabled={isLoading}
-              aria-label="Clear filters"
-              title="Clear filters"
+              aria-label={t('products.list.clearFilters')}
+              title={t('products.list.clearFilters')}
             >
               <RotateCcw size={18} />
             </button>
@@ -236,10 +238,10 @@ export function MyProductsPage() {
       )}
 
       {isLoading ? (
-        <p className={styles.empty}>Loading products...</p>
+        <p className={styles.empty}>{t('products.list.loading')}</p>
       ) : products.length === 0 ? (
         <p className={styles.empty}>
-          {appliedName ? 'No products match your filters.' : 'No products found.'}
+          {appliedName ? t('products.list.emptyFiltered') : t('products.list.empty')}
         </p>
       ) : (
         <>
@@ -261,9 +263,13 @@ export function MyProductsPage() {
           </div>
 
           <div className={styles.pagination}>
-            <div>
-              Page {currentPage} / {totalPages} · {PRODUCTS_PER_PAGE} per page ·{' '}
-              {totalProducts} total
+            <div className={styles.paginationMeta}>
+              {t('products.list.pagination', {
+                page: currentPage,
+                totalPages,
+                perPage: PRODUCTS_PER_PAGE,
+                total: totalProducts,
+              })}
             </div>
             <Pagination
               currentPage={currentPage}
@@ -278,10 +284,10 @@ export function MyProductsPage() {
 
       <ConfirmDeleteModal
         open={!!deleteTarget}
-        title="Delete Product"
+        title={t('products.list.deleteTitle')}
         message={
           deleteTarget
-            ? `Are you sure you want to delete "${deleteTarget.name}"? This action cannot be undone.`
+            ? t('products.list.deleteMessage', { name: deleteTarget.name })
             : ''
         }
         onConfirm={confirmDelete}
@@ -337,9 +343,9 @@ export function MyProductsPage() {
           onClick={() => setAiModalOpen(true)}
         >
           <Sparkles size={18} />
-          <span>Add product by AI</span>
+          <span>{t('products.list.addByAi')}</span>
         </button>
-        <Link to="/products/new" className={styles.addFab} aria-label="Add new product">
+        <Link to="/products/new" className={styles.addFab} aria-label={t('products.list.addNew')}>
           <Plus size={24} />
         </Link>
       </div>
diff --git a/apps/business/src/pages/OrdersPage.module.css b/apps/business/src/pages/OrdersPage.module.css
index 2da82c6..170bc0a 100644
--- a/apps/business/src/pages/OrdersPage.module.css
+++ b/apps/business/src/pages/OrdersPage.module.css
@@ -75,7 +75,7 @@
 .th,
 .td {
   padding: 10px 12px;
-  text-align: left;
+  text-align: start;
   border-bottom: 1px solid rgba(148, 163, 184, 0.16);
   vertical-align: middle;
 }
@@ -226,9 +226,9 @@
 }
 
 .tdActions {
-  text-align: right;
+  text-align: end;
   white-space: nowrap;
-  padding-right: 10px;
+  padding-inline-end: 10px;
 }
 
 .rowActions {
diff --git a/apps/business/src/pages/OrdersPage.tsx b/apps/business/src/pages/OrdersPage.tsx
index 4e5e120..422b762 100644
--- a/apps/business/src/pages/OrdersPage.tsx
+++ b/apps/business/src/pages/OrdersPage.tsx
@@ -1,5 +1,6 @@
 import { useEffect, useMemo, useState } from 'react'
 import { CreditCard, Eye, RotateCcw, Search, Trash2 } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
 import { Breadcrumbs } from '../components/Breadcrumbs'
 import { ConfirmDeleteModal } from '../components/ConfirmDeleteModal'
 import { OrderItemsModal } from '../components/OrderItemsModal'
@@ -8,6 +9,7 @@ import { OrderTransactionsModal } from '../components/OrderTransactionsModal'
 import { Pagination } from '../components/Pagination'
 import { Tooltip } from '../components/Tooltip'
 import { useToast } from '../context/ToastContext'
+import { useT } from '../i18n/useT'
 import { ApiError, isAbortError } from '../lib/api'
 import { formatCellForDisplay } from '../lib/cellNumber'
 import {
@@ -45,12 +47,13 @@ function displayName(order: Order) {
   return name || '—'
 }
 
-function formatDateTime(value: string) {
+function formatDateTime(value: string, locale: 'en' | 'fa') {
   const d = new Date(value)
   if (Number.isNaN(d.getTime())) return { date: value, time: '' }
+  const intlLocale = locale === 'fa' ? 'fa-IR' : 'en-US'
   return {
-    date: d.toLocaleDateString('en-US', { year: 'numeric', month: 'short', day: '2-digit' }),
-    time: d.toLocaleTimeString('en-US', { hour: '2-digit', minute: '2-digit' }),
+    date: d.toLocaleDateString(intlLocale, { year: 'numeric', month: 'short', day: '2-digit' }),
+    time: d.toLocaleTimeString(intlLocale, { hour: '2-digit', minute: '2-digit' }),
   }
 }
 
@@ -58,16 +61,39 @@ function totalItemQuantity(order: Order) {
   return order.items.reduce((sum, item) => sum + item.quantity, 0)
 }
 
-function sourceLabel(source: OrderSource) {
-  switch (source) {
-    case 'admin':
-      return 'Operator'
-    case 'app':
-      return 'Application'
-    case 'website':
-    default:
-      return 'Website'
+function defaultFaForLabel(label: string | null | undefined) {
+  const trimmed = label?.trim()
+  if (!trimmed) return undefined
+  return DEFAULT_ORDER_PROCESS_STEPS.find(
+    (step) => step.label.toLowerCase() === trimmed.toLowerCase(),
+  )?.labelFa
+}
+
+function stepLabel(
+  steps: OrderProcessStep[],
+  processStepId: string,
+  processStepLabel?: string | null,
+  processStepLabelFa?: string | null,
+  locale: 'en' | 'fa' = 'en',
+) {
+  const step =
+    steps.find((item) => item.id === processStepId) ??
+    DEFAULT_ORDER_PROCESS_STEPS.find((item) => item.id === processStepId)
+
+  if (locale === 'fa') {
+    let fa = processStepLabelFa?.trim() || step?.labelFa?.trim()
+
+    if (fa && processStepLabel?.trim() && fa === processStepLabel.trim()) {
+      fa = undefined
+    }
+
+    fa = fa || defaultFaForLabel(processStepLabel) || defaultFaForLabel(step?.label)
+
+    if (fa) return fa
   }
+
+  if (processStepLabel?.trim()) return processStepLabel.trim()
+  return step?.label ?? processStepId
 }
 
 function sourceClass(source: OrderSource) {
@@ -82,15 +108,6 @@ function sourceClass(source: OrderSource) {
   }
 }
 
-function stepLabel(
-  steps: OrderProcessStep[],
-  processStepId: string,
-  processStepLabel?: string | null,
-) {
-  if (processStepLabel?.trim()) return processStepLabel.trim()
-  return steps.find((step) => step.id === processStepId)?.label ?? processStepId
-}
-
 function stepColor(
   steps: OrderProcessStep[],
   processStepId: string,
@@ -112,6 +129,8 @@ function stepColor(
 }
 
 export function OrdersPage() {
+  const t = useT()
+  const { locale } = useLocale()
   const { showToast } = useToast()
   const [data, setData] = useState<OrdersListResponse | null>(null)
   const [loading, setLoading] = useState(false)
@@ -134,6 +153,18 @@ export function OrdersPage() {
   const [removeTarget, setRemoveTarget] = useState<Order | null>(null)
   const [removing, setRemoving] = useState(false)
 
+  function sourceLabel(source: OrderSource) {
+    switch (source) {
+      case 'admin':
+        return t('orders.source.operator')
+      case 'app':
+        return t('orders.source.app')
+      case 'website':
+      default:
+        return t('orders.source.website')
+    }
+  }
+
   useEffect(() => {
     const controller = new AbortController()
 
@@ -169,7 +200,7 @@ export function OrdersPage() {
         setData(result)
       } catch (err) {
         if (isAbortError(err) || controller.signal.aborted) return
-        setError(err instanceof ApiError ? err.message : 'Unable to load orders.')
+        setError(err instanceof ApiError ? err.message : t('orders.error.load'))
       } finally {
         if (!controller.signal.aborted) setLoading(false)
       }
@@ -188,6 +219,7 @@ export function OrdersPage() {
     appliedFilters.dateTo,
     appliedFilters.minTotal,
     appliedFilters.maxTotal,
+    t,
   ])
 
   const totalPages = useMemo(() => {
@@ -210,7 +242,7 @@ export function OrdersPage() {
     const maxTotal = parseIrtInput(draftMaxCost)
 
     if (minTotal !== null && maxTotal !== null && minTotal > maxTotal) {
-      setError('Minimum cost cannot be greater than maximum cost.')
+      setError(t('orders.error.minMax'))
       return
     }
 
@@ -261,10 +293,10 @@ export function OrdersPage() {
           items: prev.items.filter((item) => item.id !== removeTarget.id),
         }
       })
-      showToast(`Order ${removeTarget.orderNumber} has been removed.`, 'success')
+      showToast(t('orders.removed', { orderNumber: removeTarget.orderNumber }), 'success')
       setRemoveTarget(null)
     } catch (err) {
-      setError(err instanceof ApiError ? err.message : 'Unable to remove order.')
+      setError(err instanceof ApiError ? err.message : t('orders.error.remove'))
     } finally {
       setRemoving(false)
     }
@@ -282,75 +314,75 @@ export function OrdersPage() {
 
       <div className={pageStyles.pageHeader}>
         <div>
-          <h2 className={pageStyles.pageTitle}>Orders</h2>
-          <p className={pageStyles.pageSubtitle}>
-            Track customer orders placed through your website, application, or by operators.
-          </p>
+          <h2 className={pageStyles.pageTitle}>{t('orders.title')}</h2>
+          <p className={pageStyles.pageSubtitle}>{t('orders.subtitle')}</p>
         </div>
       </div>
 
       <div className={filterStyles.filtersPanel}>
-        <div className={filterStyles.filtersTitle}>Filters</div>
+        <div className={filterStyles.filtersTitle}>{t('orders.filters')}</div>
         <div className={filterStyles.filtersGrid}>
           <div className={styles.ordersFiltersRow}>
             <div className={`${filterStyles.field} ${styles.filterOrderId}`}>
-              <label htmlFor="filter-order-id">Order ID</label>
               <input
                 id="filter-order-id"
                 value={draftOrderId}
                 onChange={(e) => setDraftOrderId(e.target.value)}
-                placeholder="ORD-..."
+                placeholder={t('orders.filter.orderId')}
+                aria-label={t('orders.filter.orderId')}
               />
             </div>
             <div className={`${filterStyles.field} ${styles.filterCustomer}`}>
-              <label htmlFor="filter-order-customer">Customer name or number</label>
               <input
                 id="filter-order-customer"
                 value={draftCustomer}
                 onChange={(e) => setDraftCustomer(e.target.value)}
-                placeholder="Name or phone"
+                placeholder={t('orders.filter.customer')}
+                aria-label={t('orders.filter.customer')}
                 autoComplete="off"
               />
             </div>
             <div className={`${filterStyles.field} ${styles.filterDate}`}>
-              <label htmlFor="filter-order-date-from">Date from</label>
               <input
                 id="filter-order-date-from"
                 type="date"
                 value={draftDateFrom}
                 onChange={(e) => setDraftDateFrom(e.target.value)}
+                aria-label={t('orders.filter.dateFrom')}
+                title={t('orders.filter.dateFrom')}
               />
             </div>
             <div className={`${filterStyles.field} ${styles.filterDate}`}>
-              <label htmlFor="filter-order-date-to">Date to</label>
               <input
                 id="filter-order-date-to"
                 type="date"
                 value={draftDateTo}
                 onChange={(e) => setDraftDateTo(e.target.value)}
+                aria-label={t('orders.filter.dateTo')}
+                title={t('orders.filter.dateTo')}
               />
             </div>
             <div className={`${filterStyles.field} ${styles.filterCost}`}>
-              <label htmlFor="filter-order-min-cost">Min cost (IRT)</label>
               <input
                 id="filter-order-min-cost"
                 type="text"
                 inputMode="numeric"
                 value={draftMinCost}
                 onChange={(e) => setDraftMinCost(formatIrtInput(e.target.value))}
-                placeholder="0"
+                placeholder={t('orders.filter.minCost')}
+                aria-label={t('orders.filter.minCost')}
                 autoComplete="off"
               />
             </div>
             <div className={`${filterStyles.field} ${styles.filterCost}`}>
-              <label htmlFor="filter-order-max-cost">Max cost (IRT)</label>
               <input
                 id="filter-order-max-cost"
                 type="text"
                 inputMode="numeric"
                 value={draftMaxCost}
                 onChange={(e) => setDraftMaxCost(formatIrtInput(e.target.value))}
-                placeholder="0"
+                placeholder={t('orders.filter.maxCost')}
+                aria-label={t('orders.filter.maxCost')}
                 autoComplete="off"
               />
             </div>
@@ -361,8 +393,8 @@ export function OrdersPage() {
               className={`${filterStyles.iconActionBtn} ${filterStyles.iconActionBtnPrimary}`}
               onClick={applyFilters}
               disabled={loading}
-              aria-label="Search"
-              title="Search"
+              aria-label={t('orders.search')}
+              title={t('orders.search')}
             >
               <Search size={18} />
             </button>
@@ -371,8 +403,8 @@ export function OrdersPage() {
               className={`${filterStyles.iconActionBtn} ${filterStyles.iconActionBtnGhost}`}
               onClick={clearFilters}
               disabled={loading}
-              aria-label="Clear filters"
-              title="Clear filters"
+              aria-label={t('orders.clearFilters')}
+              title={t('orders.clearFilters')}
             >
               <RotateCcw size={18} />
             </button>
@@ -383,15 +415,17 @@ export function OrdersPage() {
       <div className={styles.tablePanel}>
         <div className={styles.tableWrap}>
           <div className={styles.tableHeader}>
-            <div className={styles.tableHeaderTitle}>Order list</div>
+            <div className={styles.tableHeaderTitle}>{t('orders.listTitle')}</div>
             <div className={styles.meta}>
               {data ? (
                 data.total > 0 ? (
-                  <>
-                    Showing {showingFrom} - {showingTo} of {data.total}
-                  </>
+                  t('orders.showing', {
+                    from: showingFrom,
+                    to: showingTo,
+                    total: data.total,
+                  })
                 ) : (
-                  'No orders'
+                  t('orders.none')
                 )
               ) : (
                 ' '
@@ -401,7 +435,7 @@ export function OrdersPage() {
 
           {error && <div className={styles.errorBanner}>{error}</div>}
 
-          <table className={styles.table}>
+          <table className={styles.table} dir={locale === 'fa' ? 'rtl' : 'ltr'}>
             <colgroup>
               <col className={styles.colOrderId} />
               <col className={styles.colCustomer} />
@@ -414,21 +448,21 @@ export function OrdersPage() {
             </colgroup>
             <thead>
               <tr>
-                <th className={styles.th}>Order ID</th>
-                <th className={styles.th}>Customer</th>
-                <th className={styles.th}>Items</th>
-                <th className={styles.th}>Total cost</th>
-                <th className={styles.th}>Date & time</th>
-                <th className={styles.th}>Step</th>
-                <th className={styles.th}>Registered by</th>
-                <th className={`${styles.th} ${styles.thActions}`}>Actions</th>
+                <th className={styles.th}>{t('orders.col.orderId')}</th>
+                <th className={styles.th}>{t('orders.col.customer')}</th>
+                <th className={styles.th}>{t('orders.col.items')}</th>
+                <th className={styles.th}>{t('orders.col.total')}</th>
+                <th className={styles.th}>{t('orders.col.date')}</th>
+                <th className={styles.th}>{t('orders.col.step')}</th>
+                <th className={styles.th}>{t('orders.col.source')}</th>
+                <th className={`${styles.th} ${styles.thActions}`}>{t('orders.col.actions')}</th>
               </tr>
             </thead>
             <tbody>
               {loading && (
                 <tr>
                   <td className={styles.td} colSpan={COLUMN_COUNT}>
-                    Loading...
+                    {t('orders.loading')}
                   </td>
                 </tr>
               )}
@@ -436,15 +470,22 @@ export function OrdersPage() {
               {!loading && data?.items?.length === 0 && (
                 <tr>
                   <td className={styles.td} colSpan={COLUMN_COUNT}>
-                    No results found.
+                    {t('orders.empty')}
                   </td>
                 </tr>
               )}
 
               {!loading &&
                 data?.items?.map((order) => {
-                  const { date, time } = formatDateTime(order.createdAt)
+                  const { date, time } = formatDateTime(order.createdAt, locale)
                   const itemQty = totalItemQuantity(order)
+                  const currentStepLabel = stepLabel(
+                    processSteps,
+                    order.processStepId ?? processSteps[0]?.id ?? 'processing',
+                    order.processStepLabel,
+                    order.processStepLabelFa,
+                    locale,
+                  )
 
                   return (
                     <tr key={order.id}>
@@ -477,17 +518,9 @@ export function OrdersPage() {
                             ),
                           )}
                           onClick={() => setStepOrder(order)}
-                          aria-label={`Change step: ${stepLabel(
-                            processSteps,
-                            order.processStepId ?? processSteps[0]?.id ?? 'processing',
-                            order.processStepLabel,
-                          )}`}
+                          aria-label={t('orders.changeStep', { step: currentStepLabel })}
                         >
-                          {stepLabel(
-                            processSteps,
-                            order.processStepId ?? processSteps[0]?.id ?? 'processing',
-                            order.processStepLabel,
-                          )}
+                          {currentStepLabel}
                         </button>
                       </td>
                       <td className={styles.td}>
@@ -497,32 +530,32 @@ export function OrdersPage() {
                       </td>
                       <td className={`${styles.td} ${styles.tdActions}`}>
                         <div className={styles.rowActions}>
-                          <Tooltip label="View items">
+                          <Tooltip label={t('orders.viewItems')}>
                             <button
                               type="button"
                               className={styles.actionBtn}
                               onClick={() => setViewOrder(order)}
-                              aria-label="View items"
+                              aria-label={t('orders.viewItems')}
                             >
                               <Eye size={15} />
                             </button>
                           </Tooltip>
-                          <Tooltip label="Transaction details">
+                          <Tooltip label={t('orders.transactions')}>
                             <button
                               type="button"
                               className={styles.actionBtn}
                               onClick={() => setTransactionsOrder(order)}
-                              aria-label="Transaction details"
+                              aria-label={t('orders.transactions')}
                             >
                               <CreditCard size={15} />
                             </button>
                           </Tooltip>
-                          <Tooltip label="Remove order">
+                          <Tooltip label={t('orders.remove')}>
                             <button
                               type="button"
                               className={`${styles.actionBtn} ${styles.actionBtnDanger}`}
                               onClick={() => setRemoveTarget(order)}
-                              aria-label="Remove order"
+                              aria-label={t('orders.remove')}
                               disabled={removing}
                             >
                               <Trash2 size={15} />
@@ -538,7 +571,12 @@ export function OrdersPage() {
 
           <div className={styles.pagination}>
             <div>
-              Page {page} / {totalPages} · {PAGE_SIZE} per page · {data?.total ?? 0} total
+              {t('orders.pageMeta', {
+                page,
+                totalPages,
+                pageSize: PAGE_SIZE,
+                total: data?.total ?? 0,
+              })}
             </div>
             <Pagination
               currentPage={page}
@@ -573,10 +611,10 @@ export function OrdersPage() {
 
       <ConfirmDeleteModal
         open={removeTarget !== null}
-        title="Remove order?"
+        title={t('orders.deleteTitle')}
         message={
           removeTarget
-            ? `Remove order ${removeTarget.orderNumber}? This cannot be undone.`
+            ? t('orders.deleteMessage', { orderNumber: removeTarget.orderNumber })
             : ''
         }
         onCancel={() => setRemoveTarget(null)}
diff --git a/apps/business/src/pages/PortfolioCategoriesPage.tsx b/apps/business/src/pages/PortfolioCategoriesPage.tsx
index 621c7c1..5c5fc4b 100644
--- a/apps/business/src/pages/PortfolioCategoriesPage.tsx
+++ b/apps/business/src/pages/PortfolioCategoriesPage.tsx
@@ -6,6 +6,7 @@ import { Breadcrumbs } from '../components/Breadcrumbs'
 import { ConfirmDeleteModal } from '../components/ConfirmDeleteModal'
 import type { Category, CategoryFormData } from '../types/category'
 import { ApiError } from '../lib/api'
+import { useT } from '../i18n/useT'
 import {
   createPortfolioCategory,
   deletePortfolioCategory,
@@ -18,11 +19,12 @@ import pageStyles from '../components/PageContent.module.css'
 import styles from './CategoriesPage.module.css'
 
 export function PortfolioCategoriesPage() {
+  const t = useT()
   const [categories, setCategories] = useState<Category[]>([])
   const [expandedIds, setExpandedIds] = useState<Set<string>>(() => new Set())
   const [modalOpen, setModalOpen] = useState(false)
   const [defaultParentId, setDefaultParentId] = useState('')
-  const [modalTitle, setModalTitle] = useState('Add Category')
+  const [modalTitle, setModalTitle] = useState(() => t('categories.add'))
   const [editingCategory, setEditingCategory] = useState<Category | null>(null)
   const [isLoading, setIsLoading] = useState(true)
   const [isSubmitting, setIsSubmitting] = useState(false)
@@ -46,17 +48,17 @@ export function PortfolioCategoriesPage() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load categories.')
+        setError(t('portfolio.categories.errorLoad'))
       }
     } finally {
       setIsLoading(false)
     }
   }
 
-  function openCreateModal(parentId = '', title = 'Add Category') {
+  function openCreateModal(parentId = '', title?: string) {
     setEditingCategory(null)
     setDefaultParentId(parentId)
-    setModalTitle(title)
+    setModalTitle(title ?? t('categories.add'))
     setModalOpen(true)
     if (parentId) {
       setExpandedIds((prev) => new Set(prev).add(parentId))
@@ -66,7 +68,7 @@ export function PortfolioCategoriesPage() {
   function openEditModal(category: Category) {
     setEditingCategory(category)
     setDefaultParentId(category.parentId ?? '')
-    setModalTitle('Edit Category')
+    setModalTitle(t('categories.edit'))
     setModalOpen(true)
   }
 
@@ -112,7 +114,7 @@ export function PortfolioCategoriesPage() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to save category.')
+        setError(t('portfolio.categories.errorSave'))
       }
     } finally {
       setIsSubmitting(false)
@@ -139,7 +141,7 @@ export function PortfolioCategoriesPage() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to delete category.')
+        setError(t('portfolio.categories.errorDelete'))
       }
     } finally {
       setIsSubmitting(false)
@@ -157,10 +159,8 @@ export function PortfolioCategoriesPage() {
       />
       <div className={pageStyles.pageHeader}>
         <div>
-          <h2 className={pageStyles.pageTitle}>Portfolio Categories</h2>
-          <p className={pageStyles.pageSubtitle}>
-            Organize your portfolio items into categories and subcategories.
-          </p>
+          <h2 className={pageStyles.pageTitle}>{t('portfolio.categories.title')}</h2>
+          <p className={pageStyles.pageSubtitle}>{t('portfolio.categories.subtitle')}</p>
         </div>
       </div>
 
@@ -172,15 +172,15 @@ export function PortfolioCategoriesPage() {
 
       <div className={styles.list}>
         {isLoading ? (
-          <p className={styles.empty}>Loading categories...</p>
+          <p className={styles.empty}>{t('categories.loading')}</p>
         ) : categories.length === 0 ? (
-          <p className={styles.empty}>No categories yet. Click + to add one.</p>
+          <p className={styles.empty}>{t('portfolio.categories.empty')}</p>
         ) : (
           <BlogCategoryTree
             categories={categories}
             expandedIds={expandedIds}
             onToggle={toggleExpanded}
-            onAddSub={(id) => openCreateModal(id, 'Add Sub Category')}
+            onAddSub={(id) => openCreateModal(id, t('categories.addSub'))}
             onEdit={(id) => {
               const category = categories.find((item) => item.id === id)
               if (category) openEditModal(category)
@@ -211,10 +211,10 @@ export function PortfolioCategoriesPage() {
 
       <ConfirmDeleteModal
         open={!!deleteTarget}
-        title="Delete Category"
+        title={t('categories.deleteTitle')}
         message={
           deleteTarget
-            ? `Are you sure you want to delete "${deleteTarget.nameEn}"? Subcategories will also be removed.`
+            ? t('categories.deleteMessage', { name: deleteTarget.nameEn })
             : ''
         }
         onConfirm={confirmDelete}
@@ -226,7 +226,7 @@ export function PortfolioCategoriesPage() {
           type="button"
           className={styles.addFab}
           onClick={() => openCreateModal()}
-          aria-label="Add category"
+          aria-label={t('categories.add')}
         >
           <Plus size={24} />
         </button>
diff --git a/apps/business/src/pages/PortfolioDetailsPage.tsx b/apps/business/src/pages/PortfolioDetailsPage.tsx
index a4be60b..0f03485 100644
--- a/apps/business/src/pages/PortfolioDetailsPage.tsx
+++ b/apps/business/src/pages/PortfolioDetailsPage.tsx
@@ -1,9 +1,11 @@
 import { useEffect, useMemo, useState } from 'react'
 import { Link, useParams } from 'react-router-dom'
 import { CalendarDays } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
 import { Breadcrumbs } from '../components/Breadcrumbs'
 import { ImageLightbox } from '../components/ImageLightbox'
 import { PortfolioCommentsSection } from '../components/PortfolioCommentsSection'
+import { useT } from '../i18n/useT'
 import { ApiError } from '../lib/api'
 import { formatPortfolioDate, getPortfolioDetail } from '../services/portfolioService'
 import type { PortfolioDetail } from '../types/portfolio'
@@ -11,6 +13,8 @@ import pageStyles from '../components/PageContent.module.css'
 import styles from './PortfolioDetailsPage.module.css'
 
 export function PortfolioDetailsPage() {
+  const t = useT()
+  const { locale } = useLocale()
   const { id } = useParams()
   const [portfolio, setPortfolio] = useState<PortfolioDetail | null>(null)
   const [isLoading, setIsLoading] = useState(true)
@@ -35,7 +39,7 @@ export function PortfolioDetailsPage() {
         if (err instanceof ApiError) {
           setError(err.message)
         } else {
-          setError('Unable to load portfolio.')
+          setError(t('portfolio.details.errorLoad'))
         }
         setPortfolio(null)
       } finally {
@@ -60,7 +64,7 @@ export function PortfolioDetailsPage() {
   if (isLoading) {
     return (
       <main className={pageStyles.content}>
-        <p className={styles.status}>Loading portfolio...</p>
+        <p className={styles.status}>{t('portfolio.details.loading')}</p>
       </main>
     )
   }
@@ -68,15 +72,18 @@ export function PortfolioDetailsPage() {
   if (error || !portfolio || !id) {
     return (
       <main className={pageStyles.content}>
-        <p className={styles.error}>{error || 'Portfolio not found.'}</p>
+        <p className={styles.error}>{error || t('portfolio.details.notFound')}</p>
         <Link to="/portfolios/list" className={styles.backLink}>
-          Back to My Portfolios
+          {t('portfolio.details.back')}
         </Link>
       </main>
     )
   }
 
-  const displayDate = formatPortfolioDate(portfolio.publishedAt ?? portfolio.createdAt)
+  const displayDate = formatPortfolioDate(
+    portfolio.publishedAt ?? portfolio.createdAt,
+    locale === 'fa' ? 'fa' : 'en',
+  )
 
   return (
     <>
@@ -145,16 +152,16 @@ export function PortfolioDetailsPage() {
                 dangerouslySetInnerHTML={{ __html: portfolio.mainTextHtml }}
               />
             ) : (
-              <p className={styles.content}>No content yet.</p>
+              <p className={styles.content}>{t('portfolio.details.noContent')}</p>
             )}
           </div>
         </article>
       </div>
 
       {galleryImages.length > 0 && (
-        <section className={styles.galleryBand} aria-label="Portfolio gallery">
+        <section className={styles.galleryBand} aria-label={t('portfolio.details.gallery')}>
           <div className={styles.galleryInner}>
-            <h3 className={styles.galleryTitle}>Gallery</h3>
+            <h3 className={styles.galleryTitle}>{t('portfolio.details.gallery')}</h3>
             <div className={styles.galleryGrid}>
               {galleryImages.map((src, index) => (
                 <button
@@ -162,7 +169,7 @@ export function PortfolioDetailsPage() {
                   type="button"
                   className={styles.galleryItem}
                   onClick={() => openLightbox(index)}
-                  aria-label={`View gallery image ${index + 1}`}
+                  aria-label={t('portfolio.details.galleryImage', { index: index + 1 })}
                 >
                   <img src={src} alt={`${portfolio.title} gallery ${index + 1}`} loading="lazy" />
                 </button>
diff --git a/apps/business/src/pages/PortfolioListPage.tsx b/apps/business/src/pages/PortfolioListPage.tsx
index cd53d36..1d9b552 100644
--- a/apps/business/src/pages/PortfolioListPage.tsx
+++ b/apps/business/src/pages/PortfolioListPage.tsx
@@ -7,6 +7,7 @@ import { PortfolioCommentsModal } from '../components/PortfolioCommentsModal'
 import { ConfirmDeleteModal } from '../components/ConfirmDeleteModal'
 import { Pagination } from '../components/Pagination'
 import { useToast } from '../context/ToastContext'
+import { useT } from '../i18n/useT'
 import { ApiError } from '../lib/api'
 import {
   PORTFOLIOS_PER_PAGE,
@@ -21,6 +22,7 @@ import styles from './BlogPage.module.css'
 export function PortfolioListPage() {
   const navigate = useNavigate()
   const { showToast } = useToast()
+  const t = useT()
   const [portfolios, setPortfolios] = useState<Portfolio[]>([])
   const [totalPortfolios, setTotalPortfolios] = useState(0)
   const [currentPage, setCurrentPage] = useState(1)
@@ -58,7 +60,7 @@ export function PortfolioListPage() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load portfolios.')
+        setError(t('portfolio.list.errorLoad'))
       }
     } finally {
       setIsLoading(false)
@@ -94,7 +96,6 @@ export function PortfolioListPage() {
 
     try {
       if (index === 0) {
-        // First on this page, but not global first — bump above the current band.
         await updatePortfolio(current.id, { sortOrder: current.sortOrder - 1 })
       } else {
         const previous = portfolios[index - 1]
@@ -107,13 +108,13 @@ export function PortfolioListPage() {
           ])
         }
       }
-      showToast('Portfolio moved up.', 'success')
+      showToast(t('portfolio.list.toast.movedUp'), 'success')
       await loadPortfolios(currentPage)
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to move portfolio.')
+        setError(t('portfolio.list.errorMove'))
       }
     } finally {
       setMovingUpId(null)
@@ -128,7 +129,7 @@ export function PortfolioListPage() {
 
     try {
       await deletePortfolio(deleteTarget.id)
-      showToast('Portfolio removed.', 'success')
+      showToast(t('portfolio.list.toast.removed'), 'success')
       const nextTotal = totalPortfolios - 1
       const nextTotalPages = Math.max(1, Math.ceil(nextTotal / PORTFOLIOS_PER_PAGE))
       const nextPage = currentPage > nextTotalPages ? nextTotalPages : currentPage
@@ -139,7 +140,7 @@ export function PortfolioListPage() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to delete portfolio.')
+        setError(t('portfolio.list.errorDelete'))
       }
     } finally {
       setIsDeleting(false)
@@ -171,9 +172,9 @@ export function PortfolioListPage() {
 
       <div className={pageStyles.pageHeader}>
         <div>
-          <h2 className={pageStyles.pageTitle}>My Portfolios</h2>
+          <h2 className={pageStyles.pageTitle}>{t('title.myPortfolios')}</h2>
           <p className={pageStyles.pageSubtitle}>
-            {totalPortfolios} items · View, edit and manage your portfolio content.
+            {t('portfolio.list.subtitle', { count: totalPortfolios })}
           </p>
         </div>
       </div>
@@ -185,9 +186,9 @@ export function PortfolioListPage() {
       )}
 
       {isLoading ? (
-        <p className={styles.empty}>Loading portfolios...</p>
+        <p className={styles.empty}>{t('portfolio.list.loading')}</p>
       ) : portfolios.length === 0 ? (
-        <p className={styles.empty}>No portfolio items found.</p>
+        <p className={styles.empty}>{t('portfolio.list.empty')}</p>
       ) : (
         <>
           <div className={pageStyles.gridCols4}>
@@ -218,17 +219,17 @@ export function PortfolioListPage() {
         type="button"
         className={styles.addFab}
         onClick={() => navigate('/portfolios/new')}
-        aria-label="Add new portfolio"
+        aria-label={t('portfolio.list.addNew')}
       >
         <Plus size={26} strokeWidth={2.5} />
       </button>
 
       <ConfirmDeleteModal
         open={!!deleteTarget}
-        title="Delete Portfolio"
+        title={t('portfolio.list.deleteTitle')}
         message={
           deleteTarget
-            ? `Are you sure you want to delete "${deleteTarget.title}"? This action cannot be undone.`
+            ? t('portfolio.list.deleteMessage', { name: deleteTarget.title })
             : ''
         }
         onConfirm={confirmDelete}
diff --git a/apps/business/src/pages/PortfolioSettingsPage.tsx b/apps/business/src/pages/PortfolioSettingsPage.tsx
index ae6aeb2..ae14971 100644
--- a/apps/business/src/pages/PortfolioSettingsPage.tsx
+++ b/apps/business/src/pages/PortfolioSettingsPage.tsx
@@ -2,6 +2,7 @@ import { useEffect, useState } from 'react'
 import { Breadcrumbs } from '../components/Breadcrumbs'
 import { Switch } from '../components/Switch'
 import { useToast } from '../context/ToastContext'
+import { useT } from '../i18n/useT'
 import { ApiError } from '../lib/api'
 import {
   getSettings,
@@ -17,6 +18,7 @@ const DEFAULT_SETTINGS: DashboardSettings = {
 }
 
 export function PortfolioSettingsPage() {
+  const t = useT()
   const { showToast } = useToast()
   const [settings, setSettings] = useState<DashboardSettings>(DEFAULT_SETTINGS)
   const [isLoading, setIsLoading] = useState(true)
@@ -41,7 +43,7 @@ export function PortfolioSettingsPage() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load settings.')
+        setError(t('productSettings.errorLoad'))
       }
     } finally {
       setIsLoading(false)
@@ -57,12 +59,12 @@ export function PortfolioSettingsPage() {
         comments: { autoApprove: checked },
       })
       setSettings(data.settings.dashboard)
-      showToast('Settings saved.', 'success')
+      showToast(t('productSettings.saved'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to save settings.')
+        setError(t('productSettings.errorSave'))
       }
     } finally {
       setSavingKey(null)
@@ -81,10 +83,8 @@ export function PortfolioSettingsPage() {
 
       <div className={pageStyles.pageHeader}>
         <div>
-          <h2 className={pageStyles.pageTitle}>Portfolio settings</h2>
-          <p className={pageStyles.pageSubtitle}>
-            Configure how portfolio comments are moderated.
-          </p>
+          <h2 className={pageStyles.pageTitle}>{t('portfolio.settings.title')}</h2>
+          <p className={pageStyles.pageSubtitle}>{t('portfolio.settings.subtitle')}</p>
         </div>
       </div>
 
@@ -95,27 +95,24 @@ export function PortfolioSettingsPage() {
       )}
 
       <section className={styles.panel}>
-        <h3 className={styles.sectionTitle}>Moderation</h3>
+        <h3 className={styles.sectionTitle}>{t('productSettings.moderation')}</h3>
 
         {isLoading ? (
-          <p className={styles.status}>Loading settings...</p>
+          <p className={styles.status}>{t('productSettings.loading')}</p>
         ) : (
           <div className={styles.list}>
             <div className={styles.row}>
               <div className={styles.rowText}>
                 <label htmlFor="portfolio-comments-auto-approve" className={styles.rowLabel}>
-                  Auto-approve comments
+                  {t('portfolio.settings.commentsAuto')}
                 </label>
-                <p className={styles.rowDescription}>
-                  New portfolio comments are published immediately when submitted. You can still
-                  reject them later if needed.
-                </p>
+                <p className={styles.rowDescription}>{t('portfolio.settings.commentsAutoDesc')}</p>
               </div>
               <Switch
                 id="portfolio-comments-auto-approve"
                 checked={settings.comments.autoApprove}
                 disabled={savingKey === 'comments'}
-                aria-label="Auto-approve portfolio comments"
+                aria-label={t('portfolio.settings.commentsAutoAria')}
                 onChange={(checked) => void handleCommentsAutoApprove(checked)}
               />
             </div>
diff --git a/apps/business/src/pages/PortfoliosPage.tsx b/apps/business/src/pages/PortfoliosPage.tsx
index 578b6cf..5852d93 100644
--- a/apps/business/src/pages/PortfoliosPage.tsx
+++ b/apps/business/src/pages/PortfoliosPage.tsx
@@ -1,40 +1,50 @@
 import { Briefcase, PlusCircle, FolderTree, Settings } from 'lucide-react'
 import { SectionCard } from '../components/SectionCard'
 import { Breadcrumbs } from '../components/Breadcrumbs'
+import { useT } from '../i18n/useT'
+import type { BusinessMessageKey } from '../i18n/messages'
 import styles from '../components/PageContent.module.css'
 
-const portfolioSections = [
+const portfolioSections: {
+  icon: typeof Briefcase
+  titleKey: BusinessMessageKey
+  descKey: BusinessMessageKey
+  linkKey: BusinessMessageKey
+  href: string
+}[] = [
   {
     icon: Briefcase,
-    title: 'My Portfolios',
-    description: 'View, edit and manage all your portfolio items.',
-    linkText: 'View portfolios',
+    titleKey: 'nav.portfolios.list',
+    descKey: 'portfolio.card.list.desc',
+    linkKey: 'portfolio.card.list.link',
     href: '/portfolios/list',
   },
   {
     icon: PlusCircle,
-    title: 'Add New Portfolio',
-    description: 'Create and publish a new portfolio project.',
-    linkText: 'Add portfolio',
+    titleKey: 'nav.portfolios.new',
+    descKey: 'portfolio.card.new.desc',
+    linkKey: 'portfolio.card.new.link',
     href: '/portfolios/new',
   },
   {
     icon: FolderTree,
-    title: 'Portfolio Categories',
-    description: 'Organize portfolio items into categories and subcategories.',
-    linkText: 'View categories',
+    titleKey: 'portfolio.card.categories.title',
+    descKey: 'portfolio.card.categories.desc',
+    linkKey: 'portfolio.card.categories.link',
     href: '/portfolios/categories',
   },
   {
     icon: Settings,
-    title: 'Settings',
-    description: 'Configure portfolio comment moderation and display options.',
-    linkText: 'View settings',
+    titleKey: 'nav.portfolios.settings',
+    descKey: 'portfolio.card.settings.desc',
+    linkKey: 'portfolio.card.settings.link',
     href: '/portfolios/settings',
   },
 ]
 
 export function PortfoliosPage() {
+  const t = useT()
+
   return (
     <main className={styles.content}>
       <Breadcrumbs
@@ -45,16 +55,21 @@ export function PortfoliosPage() {
       />
       <div className={styles.pageHeader}>
         <div>
-          <h2 className={styles.pageTitle}>Portfolios</h2>
-          <p className={styles.pageSubtitle}>
-            Manage your portfolio items and showcase projects.
-          </p>
+          <h2 className={styles.pageTitle}>{t('title.portfolios')}</h2>
+          <p className={styles.pageSubtitle}>{t('portfolio.page.subtitle')}</p>
         </div>
       </div>
 
       <div className={styles.gridHome}>
         {portfolioSections.map((section) => (
-          <SectionCard key={section.title} {...section} />
+          <SectionCard
+            key={section.href}
+            icon={section.icon}
+            title={t(section.titleKey)}
+            description={t(section.descKey)}
+            linkText={t(section.linkKey)}
+            href={section.href}
+          />
         ))}
       </div>
     </main>
diff --git a/apps/business/src/pages/ProductSettingsPage.tsx b/apps/business/src/pages/ProductSettingsPage.tsx
index 66c55d6..536c1f3 100644
--- a/apps/business/src/pages/ProductSettingsPage.tsx
+++ b/apps/business/src/pages/ProductSettingsPage.tsx
@@ -2,6 +2,7 @@ import { useEffect, useState } from 'react'
 import { Breadcrumbs } from '../components/Breadcrumbs'
 import { Switch } from '../components/Switch'
 import { useToast } from '../context/ToastContext'
+import { useT } from '../i18n/useT'
 import { ApiError } from '../lib/api'
 import {
   getSettings,
@@ -17,6 +18,7 @@ const DEFAULT_SETTINGS: DashboardSettings = {
 }
 
 export function ProductSettingsPage() {
+  const t = useT()
   const { showToast } = useToast()
   const [settings, setSettings] = useState<DashboardSettings>(DEFAULT_SETTINGS)
   const [isLoading, setIsLoading] = useState(true)
@@ -41,7 +43,7 @@ export function ProductSettingsPage() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load settings.')
+        setError(t('productSettings.errorLoad'))
       }
     } finally {
       setIsLoading(false)
@@ -57,12 +59,12 @@ export function ProductSettingsPage() {
         comments: { autoApprove: checked },
       })
       setSettings(data.settings.dashboard)
-      showToast('Settings saved.', 'success')
+      showToast(t('productSettings.saved'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to save settings.')
+        setError(t('productSettings.errorSave'))
       }
     } finally {
       setSavingKey(null)
@@ -78,12 +80,12 @@ export function ProductSettingsPage() {
         expertReviews: { autoApprove: checked },
       })
       setSettings(data.settings.dashboard)
-      showToast('Settings saved.', 'success')
+      showToast(t('productSettings.saved'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to save settings.')
+        setError(t('productSettings.errorSave'))
       }
     } finally {
       setSavingKey(null)
@@ -102,10 +104,8 @@ export function ProductSettingsPage() {
 
       <div className={pageStyles.pageHeader}>
         <div>
-          <h2 className={pageStyles.pageTitle}>Product settings</h2>
-          <p className={pageStyles.pageSubtitle}>
-            Configure how comments and expert reviews are moderated.
-          </p>
+          <h2 className={pageStyles.pageTitle}>{t('productSettings.title')}</h2>
+          <p className={pageStyles.pageSubtitle}>{t('productSettings.subtitle')}</p>
         </div>
       </div>
 
@@ -116,27 +116,24 @@ export function ProductSettingsPage() {
       )}
 
       <section className={styles.panel}>
-        <h3 className={styles.sectionTitle}>Moderation</h3>
+        <h3 className={styles.sectionTitle}>{t('productSettings.moderation')}</h3>
 
         {isLoading ? (
-          <p className={styles.status}>Loading settings...</p>
+          <p className={styles.status}>{t('productSettings.loading')}</p>
         ) : (
           <div className={styles.list}>
             <div className={styles.row}>
               <div className={styles.rowText}>
                 <label htmlFor="comments-auto-approve" className={styles.rowLabel}>
-                  Auto-approve comments
+                  {t('productSettings.commentsAuto')}
                 </label>
-                <p className={styles.rowDescription}>
-                  New comments are published immediately when submitted. You can still reject
-                  them later if needed.
-                </p>
+                <p className={styles.rowDescription}>{t('productSettings.commentsAutoDesc')}</p>
               </div>
               <Switch
                 id="comments-auto-approve"
                 checked={settings.comments.autoApprove}
                 disabled={savingKey === 'comments'}
-                aria-label="Auto-approve comments"
+                aria-label={t('productSettings.commentsAuto')}
                 onChange={(checked) => void handleCommentsAutoApprove(checked)}
               />
             </div>
@@ -144,18 +141,15 @@ export function ProductSettingsPage() {
             <div className={styles.row}>
               <div className={styles.rowText}>
                 <label htmlFor="expert-reviews-auto-approve" className={styles.rowLabel}>
-                  Auto-approve expert reviews
+                  {t('productSettings.reviewsAuto')}
                 </label>
-                <p className={styles.rowDescription}>
-                  New expert reviews are published immediately when submitted. You can still
-                  reject them later if needed.
-                </p>
+                <p className={styles.rowDescription}>{t('productSettings.reviewsAutoDesc')}</p>
               </div>
               <Switch
                 id="expert-reviews-auto-approve"
                 checked={settings.expertReviews.autoApprove}
                 disabled={savingKey === 'expertReviews'}
-                aria-label="Auto-approve expert reviews"
+                aria-label={t('productSettings.reviewsAuto')}
                 onChange={(checked) => void handleExpertReviewsAutoApprove(checked)}
               />
             </div>
diff --git a/apps/business/src/pages/ShoppingCardsPage.tsx b/apps/business/src/pages/ShoppingCardsPage.tsx
index e5bd80b..4a4b4de 100644
--- a/apps/business/src/pages/ShoppingCardsPage.tsx
+++ b/apps/business/src/pages/ShoppingCardsPage.tsx
@@ -1,11 +1,13 @@
 import { useEffect, useMemo, useState } from 'react'
 import { Play, RotateCcw, Search, Trash2 } from 'lucide-react'
 import { useNavigate } from 'react-router-dom'
+import { useLocale } from '@meshkee/dashboard-ui'
 import { Breadcrumbs } from '../components/Breadcrumbs'
 import { ConfirmDeleteModal } from '../components/ConfirmDeleteModal'
 import { Pagination } from '../components/Pagination'
 import { Tooltip } from '../components/Tooltip'
 import { useToast } from '../context/ToastContext'
+import { useT } from '../i18n/useT'
 import { ApiError, isAbortError } from '../lib/api'
 import { formatCellForDisplay } from '../lib/cellNumber'
 import {
@@ -40,12 +42,13 @@ function displayName(card: ShoppingCard) {
   return name || '—'
 }
 
-function formatDateTime(value: string) {
+function formatDateTime(value: string, locale: 'en' | 'fa') {
   const d = new Date(value)
   if (Number.isNaN(d.getTime())) return { date: value, time: '' }
+  const intlLocale = locale === 'fa' ? 'fa-IR' : 'en-US'
   return {
-    date: d.toLocaleDateString('en-US', { year: 'numeric', month: 'short', day: '2-digit' }),
-    time: d.toLocaleTimeString('en-US', { hour: '2-digit', minute: '2-digit' }),
+    date: d.toLocaleDateString(intlLocale, { year: 'numeric', month: 'short', day: '2-digit' }),
+    time: d.toLocaleTimeString(intlLocale, { hour: '2-digit', minute: '2-digit' }),
   }
 }
 
@@ -54,6 +57,8 @@ function totalItemQuantity(card: ShoppingCard) {
 }
 
 export function ShoppingCardsPage() {
+  const t = useT()
+  const { locale } = useLocale()
   const navigate = useNavigate()
   const { showToast } = useToast()
   const [data, setData] = useState<ShoppingCardsListResponse | null>(null)
@@ -91,7 +96,7 @@ export function ShoppingCardsPage() {
         setData(result)
       } catch (err) {
         if (isAbortError(err) || controller.signal.aborted) return
-        setError(err instanceof ApiError ? err.message : 'Unable to load shopping cards.')
+        setError(err instanceof ApiError ? err.message : t('shoppingCards.error.load'))
       } finally {
         if (!controller.signal.aborted) setLoading(false)
       }
@@ -109,6 +114,7 @@ export function ShoppingCardsPage() {
     appliedFilters.dateTo,
     appliedFilters.minTotal,
     appliedFilters.maxTotal,
+    t,
   ])
 
   const totalPages = useMemo(() => {
@@ -131,7 +137,7 @@ export function ShoppingCardsPage() {
     const maxTotal = parseIrtInput(draftMaxCost)
 
     if (minTotal !== null && maxTotal !== null && minTotal > maxTotal) {
-      setError('Minimum cost cannot be greater than maximum cost.')
+      setError(t('orders.error.minMax'))
       return
     }
 
@@ -175,10 +181,10 @@ export function ShoppingCardsPage() {
           items: prev.items.filter((item) => item.id !== removeTarget.id),
         }
       })
-      showToast('Shopping card removed.', 'success')
+      showToast(t('shoppingCards.removed'), 'success')
       setRemoveTarget(null)
     } catch (err) {
-      setError(err instanceof ApiError ? err.message : 'Unable to remove shopping card.')
+      setError(err instanceof ApiError ? err.message : t('shoppingCards.error.remove'))
     } finally {
       setRemoving(false)
     }
@@ -196,66 +202,66 @@ export function ShoppingCardsPage() {
 
       <div className={pageStyles.pageHeader}>
         <div>
-          <h2 className={pageStyles.pageTitle}>Shopping cards</h2>
-          <p className={pageStyles.pageSubtitle}>
-            Saved operator carts waiting to be completed as orders.
-          </p>
+          <h2 className={pageStyles.pageTitle}>{t('shoppingCards.title')}</h2>
+          <p className={pageStyles.pageSubtitle}>{t('shoppingCards.subtitle')}</p>
         </div>
       </div>
 
       <div className={filterStyles.filtersPanel}>
-        <div className={filterStyles.filtersTitle}>Filters</div>
+        <div className={filterStyles.filtersTitle}>{t('orders.filters')}</div>
         <div className={filterStyles.filtersGrid}>
           <div className={styles.filtersRow}>
             <div className={`${filterStyles.field} ${styles.filterCustomer}`}>
-              <label htmlFor="filter-card-customer">Customer name or number</label>
               <input
                 id="filter-card-customer"
                 value={draftCustomer}
                 onChange={(e) => setDraftCustomer(e.target.value)}
-                placeholder="Name or phone"
+                placeholder={t('orders.filter.customer')}
+                aria-label={t('orders.filter.customer')}
                 autoComplete="off"
               />
             </div>
             <div className={`${filterStyles.field} ${styles.filterDate}`}>
-              <label htmlFor="filter-card-date-from">Date from</label>
               <input
                 id="filter-card-date-from"
                 type="date"
                 value={draftDateFrom}
                 onChange={(e) => setDraftDateFrom(e.target.value)}
+                aria-label={t('orders.filter.dateFrom')}
+                title={t('orders.filter.dateFrom')}
               />
             </div>
             <div className={`${filterStyles.field} ${styles.filterDate}`}>
-              <label htmlFor="filter-card-date-to">Date to</label>
               <input
                 id="filter-card-date-to"
                 type="date"
                 value={draftDateTo}
                 onChange={(e) => setDraftDateTo(e.target.value)}
+                aria-label={t('orders.filter.dateTo')}
+                title={t('orders.filter.dateTo')}
               />
             </div>
             <div className={`${filterStyles.field} ${styles.filterCost}`}>
-              <label htmlFor="filter-card-min-cost">Min cost (IRT)</label>
               <input
                 id="filter-card-min-cost"
                 type="text"
                 inputMode="numeric"
                 value={draftMinCost}
                 onChange={(e) => setDraftMinCost(formatIrtInput(e.target.value))}
-                placeholder="0"
+                placeholder={t('orders.filter.minCost')}
+                aria-label={t('orders.filter.minCost')}
                 autoComplete="off"
               />
             </div>
             <div className={`${filterStyles.field} ${styles.filterCost}`}>
-              <label htmlFor="filter-card-max-cost">Max cost (IRT)</label>
               <input
                 id="filter-card-max-cost"
                 type="text"
                 inputMode="numeric"
                 value={draftMaxCost}
                 onChange={(e) => setDraftMaxCost(formatIrtInput(e.target.value))}
-                placeholder="0"
+                placeholder={t('orders.filter.maxCost')}
+                aria-label={t('orders.filter.maxCost')}
                 autoComplete="off"
               />
             </div>
@@ -266,8 +272,8 @@ export function ShoppingCardsPage() {
               className={`${filterStyles.iconActionBtn} ${filterStyles.iconActionBtnPrimary}`}
               onClick={applyFilters}
               disabled={loading}
-              aria-label="Search"
-              title="Search"
+              aria-label={t('orders.search')}
+              title={t('orders.search')}
             >
               <Search size={18} />
             </button>
@@ -276,8 +282,8 @@ export function ShoppingCardsPage() {
               className={`${filterStyles.iconActionBtn} ${filterStyles.iconActionBtnGhost}`}
               onClick={clearFilters}
               disabled={loading}
-              aria-label="Clear filters"
-              title="Clear filters"
+              aria-label={t('orders.clearFilters')}
+              title={t('orders.clearFilters')}
             >
               <RotateCcw size={18} />
             </button>
@@ -288,15 +294,17 @@ export function ShoppingCardsPage() {
       <div className={tableStyles.tablePanel}>
         <div className={tableStyles.tableWrap}>
           <div className={tableStyles.tableHeader}>
-            <div className={tableStyles.tableHeaderTitle}>Shopping card list</div>
+            <div className={tableStyles.tableHeaderTitle}>{t('shoppingCards.listTitle')}</div>
             <div className={tableStyles.meta}>
               {data ? (
                 data.total > 0 ? (
-                  <>
-                    Showing {showingFrom} - {showingTo} of {data.total}
-                  </>
+                  t('orders.showing', {
+                    from: showingFrom,
+                    to: showingTo,
+                    total: data.total,
+                  })
                 ) : (
-                  'No shopping cards'
+                  t('shoppingCards.none')
                 )
               ) : (
                 ' '
@@ -306,7 +314,7 @@ export function ShoppingCardsPage() {
 
           {error && <div className={tableStyles.errorBanner}>{error}</div>}
 
-          <table className={tableStyles.table}>
+          <table className={tableStyles.table} dir={locale === 'fa' ? 'rtl' : 'ltr'}>
             <colgroup>
               <col className={styles.colCustomer} />
               <col className={styles.colItems} />
@@ -316,18 +324,20 @@ export function ShoppingCardsPage() {
             </colgroup>
             <thead>
               <tr>
-                <th className={tableStyles.th}>Customer</th>
-                <th className={tableStyles.th}>Items</th>
-                <th className={tableStyles.th}>Total cost</th>
-                <th className={tableStyles.th}>Date & time</th>
-                <th className={`${tableStyles.th} ${tableStyles.thActions}`}>Actions</th>
+                <th className={tableStyles.th}>{t('orders.col.customer')}</th>
+                <th className={tableStyles.th}>{t('orders.col.items')}</th>
+                <th className={tableStyles.th}>{t('orders.col.total')}</th>
+                <th className={tableStyles.th}>{t('orders.col.date')}</th>
+                <th className={`${tableStyles.th} ${tableStyles.thActions}`}>
+                  {t('orders.col.actions')}
+                </th>
               </tr>
             </thead>
             <tbody>
               {loading && (
                 <tr>
                   <td className={tableStyles.td} colSpan={COLUMN_COUNT}>
-                    Loading...
+                    {t('shoppingCards.loading')}
                   </td>
                 </tr>
               )}
@@ -335,14 +345,14 @@ export function ShoppingCardsPage() {
               {!loading && data?.items?.length === 0 && (
                 <tr>
                   <td className={tableStyles.td} colSpan={COLUMN_COUNT}>
-                    No results found.
+                    {t('shoppingCards.empty')}
                   </td>
                 </tr>
               )}
 
               {!loading &&
                 data?.items?.map((card) => {
-                  const { date, time } = formatDateTime(card.createdAt)
+                  const { date, time } = formatDateTime(card.createdAt, locale)
                   const itemQty = totalItemQuantity(card)
 
                   return (
@@ -363,22 +373,22 @@ export function ShoppingCardsPage() {
                       </td>
                       <td className={`${tableStyles.td} ${tableStyles.tdActions}`}>
                         <div className={tableStyles.rowActions}>
-                          <Tooltip label="Continue">
+                          <Tooltip label={t('shoppingCards.continue')}>
                             <button
                               type="button"
                               className={tableStyles.actionBtn}
                               onClick={() => handleContinue(card)}
-                              aria-label="Continue shopping card"
+                              aria-label={t('shoppingCards.continueAria')}
                             >
                               <Play size={15} />
                             </button>
                           </Tooltip>
-                          <Tooltip label="Remove card">
+                          <Tooltip label={t('shoppingCards.remove')}>
                             <button
                               type="button"
                               className={`${tableStyles.actionBtn} ${tableStyles.actionBtnDanger}`}
                               onClick={() => setRemoveTarget(card)}
-                              aria-label="Remove shopping card"
+                              aria-label={t('shoppingCards.removeAria')}
                               disabled={removing}
                             >
                               <Trash2 size={15} />
@@ -394,7 +404,12 @@ export function ShoppingCardsPage() {
 
           <div className={tableStyles.pagination}>
             <div>
-              Page {page} / {totalPages} · {PAGE_SIZE} per page · {data?.total ?? 0} total
+              {t('orders.pageMeta', {
+                page,
+                totalPages,
+                pageSize: PAGE_SIZE,
+                total: data?.total ?? 0,
+              })}
             </div>
             <Pagination
               currentPage={page}
@@ -409,10 +424,10 @@ export function ShoppingCardsPage() {
 
       <ConfirmDeleteModal
         open={removeTarget !== null}
-        title="Remove shopping card?"
+        title={t('shoppingCards.deleteTitle')}
         message={
           removeTarget
-            ? `Remove this shopping card for ${displayName(removeTarget)}? This cannot be undone.`
+            ? t('shoppingCards.deleteMessage', { name: displayName(removeTarget) })
             : ''
         }
         onCancel={() => setRemoveTarget(null)}
diff --git a/apps/business/src/pages/StoreItemsPage.module.css b/apps/business/src/pages/StoreItemsPage.module.css
index 3033b09..aef67f8 100644
--- a/apps/business/src/pages/StoreItemsPage.module.css
+++ b/apps/business/src/pages/StoreItemsPage.module.css
@@ -26,12 +26,13 @@
 
 .fabDock {
   position: fixed;
-  right: 32px;
+  inset-inline-end: 32px;
+  inset-inline-start: auto;
   bottom: 32px;
   display: flex;
   align-items: center;
   gap: 10px;
-  z-index: 50;
+  z-index: 110;
 }
 
 .cartFabStrip {
@@ -118,7 +119,8 @@
 
 @media (max-width: 768px) {
   .fabDock {
-    right: 20px;
+    inset-inline-end: 20px;
+    inset-inline-start: auto;
     bottom: 20px;
     gap: 8px;
   }
diff --git a/apps/business/src/pages/StoreItemsPage.tsx b/apps/business/src/pages/StoreItemsPage.tsx
index 8d8d31d..eb2a420 100644
--- a/apps/business/src/pages/StoreItemsPage.tsx
+++ b/apps/business/src/pages/StoreItemsPage.tsx
@@ -31,6 +31,8 @@ import {
   type StoreProductListing,
 } from '../utils/storeProductGroups'
 import { formatIrtInput, parseIrtInput } from '../utils/irtPrice'
+import { useLocale } from '@meshkee/dashboard-ui'
+import { useT } from '../i18n/useT'
 import filterStyles from '../components/ListFiltersPanel.module.css'
 import pageStyles from '../components/PageContent.module.css'
 import styles from './StoreItemsPage.module.css'
@@ -40,6 +42,8 @@ export function StoreItemsPage() {
 }
 
 function StoreItemsPageContent() {
+  const t = useT()
+  const { locale } = useLocale()
   const { itemCount, hasItems, addVariant, loadShoppingCard } = useDraftCart()
   const { showToast } = useToast()
   const [items, setItems] = useState<StoreItem[]>([])
@@ -139,7 +143,7 @@ function StoreItemsPageContent() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load store items.')
+        setError(t('storeItems.errorLoad'))
       }
     } finally {
       setIsLoading(false)
@@ -188,7 +192,7 @@ function StoreItemsPageContent() {
       return
     }
 
-    showToast('Added to shopping cart.', 'success')
+    showToast(t('storeItems.addedToCart'), 'success')
   }
 
   function handleVariantPicked(variant: StoreItem) {
@@ -198,7 +202,7 @@ function StoreItemsPageContent() {
       showToast(feedback, 'error')
       return
     }
-    showToast('Added to shopping cart.', 'success')
+    showToast(t('storeItems.addedToCart'), 'success')
   }
 
   async function confirmDelete() {
@@ -215,7 +219,7 @@ function StoreItemsPageContent() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to remove store item.')
+        setError(t('storeItems.errorRemove'))
       }
     } finally {
       setIsDeleting(false)
@@ -234,65 +238,60 @@ function StoreItemsPageContent() {
 
       <div className={pageStyles.pageHeader}>
         <div>
-          <h2 className={pageStyles.pageTitle}>My Store Items</h2>
-          <p className={pageStyles.pageSubtitle}>
-            Products for sale with one or more priced variants.
-          </p>
+          <h2 className={pageStyles.pageTitle}>{t('title.storeItems')}</h2>
+          <p className={pageStyles.pageSubtitle}>{t('storeItems.subtitle')}</p>
         </div>
       </div>
 
       <div className={filterStyles.filtersPanel}>
-        <div className={filterStyles.filtersTitle}>Filters</div>
+        <div className={filterStyles.filtersTitle}>{t('storeItems.filters')}</div>
         <div className={filterStyles.filtersGrid}>
           <div className={filterStyles.filtersInputs}>
             <div className={`${filterStyles.field} ${filterStyles.fieldCol3}`}>
-              <label htmlFor="filter-store-name">Name</label>
               <input
                 id="filter-store-name"
                 value={draftName}
                 onChange={(e) => setDraftName(e.target.value)}
-                placeholder="Search by product name"
+                placeholder={t('storeItems.filterNamePlaceholder')}
+                aria-label={t('storeItems.filterName')}
                 disabled={isLoading}
               />
             </div>
             <div className={`${filterStyles.field} ${filterStyles.fieldCol2} ${filterStyles.fieldHalfWidth}`}>
-              <label htmlFor="filter-store-min-price">Min price (IRT)</label>
               <input
                 id="filter-store-min-price"
                 inputMode="numeric"
                 value={draftMinPrice}
                 onChange={(e) => setDraftMinPrice(formatIrtInput(e.target.value))}
-                placeholder="0"
+                placeholder={t('storeItems.minPrice')}
+                aria-label={t('storeItems.minPrice')}
                 disabled={isLoading}
               />
             </div>
             <div className={`${filterStyles.field} ${filterStyles.fieldCol2} ${filterStyles.fieldHalfWidth}`}>
-              <label htmlFor="filter-store-max-price">Max price (IRT)</label>
               <input
                 id="filter-store-max-price"
                 inputMode="numeric"
                 value={draftMaxPrice}
                 onChange={(e) => setDraftMaxPrice(formatIrtInput(e.target.value))}
-                placeholder="0"
+                placeholder={t('storeItems.maxPrice')}
+                aria-label={t('storeItems.maxPrice')}
                 disabled={isLoading}
               />
             </div>
             <div className={`${filterStyles.switchField} ${filterStyles.fieldCol3}`}>
-              <span className={filterStyles.switchFieldSpacer} aria-hidden="true">
-                Only discounted
-              </span>
               <div className={filterStyles.switchInline}>
                 <ToggleSwitch
                   checked={draftOnlyDiscounted}
                   onChange={setDraftOnlyDiscounted}
                   disabled={isLoading}
-                  ariaLabel="Only discounted"
+                  ariaLabel={t('storeItems.onlyDiscounted')}
                 />
                 <span
                   className={filterStyles.switchLabel}
                   onClick={() => !isLoading && setDraftOnlyDiscounted(!draftOnlyDiscounted)}
                 >
-                  Only discounted
+                  {t('storeItems.onlyDiscounted')}
                 </span>
               </div>
             </div>
@@ -303,8 +302,8 @@ function StoreItemsPageContent() {
               className={`${filterStyles.iconActionBtn} ${filterStyles.iconActionBtnPrimary}`}
               onClick={applyFilters}
               disabled={isLoading}
-              aria-label="Search"
-              title="Search"
+              aria-label={t('storeItems.search')}
+              title={t('storeItems.search')}
             >
               <Search size={18} />
             </button>
@@ -313,8 +312,8 @@ function StoreItemsPageContent() {
               className={`${filterStyles.iconActionBtn} ${filterStyles.iconActionBtnGhost}`}
               onClick={clearFilters}
               disabled={isLoading}
-              aria-label="Clear filters"
-              title="Clear filters"
+              aria-label={t('storeItems.clearFilters')}
+              title={t('storeItems.clearFilters')}
             >
               <RotateCcw size={18} />
             </button>
@@ -325,13 +324,11 @@ function StoreItemsPageContent() {
       {error && <p className={styles.error}>{error}</p>}
 
       {isLoading ? (
-        <p className={styles.empty}>Loading store items...</p>
+        <p className={styles.empty}>{t('storeItems.loading')}</p>
       ) : listings.length === 0 ? (
-        <p className={styles.empty}>
-          No store items yet. Use the + button to add products from your catalog.
-        </p>
+        <p className={styles.empty}>{t('storeItems.empty')}</p>
       ) : filteredListings.length === 0 ? (
-        <p className={styles.empty}>No store items match your filters.</p>
+        <p className={styles.empty}>{t('storeItems.emptyFiltered')}</p>
       ) : (
         <div className={styles.grid}>
           {filteredListings.map((listing) => (
@@ -355,11 +352,11 @@ function StoreItemsPageContent() {
             type="button"
             className={styles.cartFabStrip}
             onClick={() => setCartOpen(true)}
-            aria-label={`Open shopping cart, ${itemCount} items`}
+            aria-label={t('storeItems.cartOpen', { count: itemCount })}
           >
             <span className={styles.cartFabCount}>{itemCount}</span>
             <span className={styles.cartFabLabel}>
-              {itemCount === 1 ? 'item in cart' : 'items in cart'}
+              {itemCount === 1 ? t('storeItems.cartOne') : t('storeItems.cartMany')}
             </span>
           </button>
         )}
@@ -367,7 +364,7 @@ function StoreItemsPageContent() {
           type="button"
           className={styles.addFab}
           onClick={() => setCreateOpen(true)}
-          aria-label="Add store items"
+          aria-label={t('storeItems.add')}
         >
           <Plus size={24} />
         </button>
@@ -408,10 +405,13 @@ function StoreItemsPageContent() {
 
       <ConfirmDeleteModal
         open={!!deleteTarget}
-        title="Remove from Store"
+        title={t('storeItems.deleteTitle')}
         message={
           deleteTarget
-            ? `Remove "${deleteTarget.productTitle}" and all ${formatVariantCount(deleteTarget.variantCount)} from your store? This cannot be undone.`
+            ? t('storeItems.deleteMessage', {
+                name: deleteTarget.productNameFa || deleteTarget.productTitle,
+                variants: formatVariantCount(deleteTarget.variantCount, locale),
+              })
             : ''
         }
         onConfirm={() => void confirmDelete()}
diff --git a/apps/business/src/pages/StorePage.tsx b/apps/business/src/pages/StorePage.tsx
index 84b7559..813f964 100644
--- a/apps/business/src/pages/StorePage.tsx
+++ b/apps/business/src/pages/StorePage.tsx
@@ -7,47 +7,51 @@ import {
 } from 'lucide-react'
 import { SectionCard } from '../components/SectionCard'
 import { Breadcrumbs } from '../components/Breadcrumbs'
+import { useT } from '../i18n/useT'
+import type { BusinessMessageKey } from '../i18n/messages'
 import styles from '../components/PageContent.module.css'
 
-const storeSections = [
+const storeSections: {
+  icon: typeof Package
+  titleKey: BusinessMessageKey
+  descKey: BusinessMessageKey
+  href: string
+}[] = [
   {
     icon: Package,
-    title: 'My Store Items',
-    description: 'View and manage all items listed in your store.',
-    linkText: 'View items',
+    titleKey: 'nav.store.items',
+    descKey: 'store.card.items.desc',
     href: '/store/items',
   },
   {
     icon: ShoppingCart,
-    title: 'My Orders',
-    description: 'Track and manage customer orders and fulfillment.',
-    linkText: 'View orders',
+    titleKey: 'nav.store.orders',
+    descKey: 'store.card.orders.desc',
     href: '/store/orders',
   },
   {
     icon: Truck,
-    title: 'Shipping Fees',
-    description: 'Configure shipping rates, zones and delivery options.',
-    linkText: 'Manage shipping',
+    titleKey: 'nav.store.shipping',
+    descKey: 'store.card.shipping.desc',
     href: '/store/shipping',
   },
   {
     icon: CreditCard,
-    title: 'Shopping Cards',
-    description: 'Manage saved shopping cards and payment methods.',
-    linkText: 'View cards',
+    titleKey: 'nav.store.cards',
+    descKey: 'store.card.cards.desc',
     href: '/store/cards',
   },
   {
     icon: Settings,
-    title: 'Settings',
-    description: 'Configure store preferences, pages and themes.',
-    linkText: 'View settings',
+    titleKey: 'nav.store.settings',
+    descKey: 'store.card.settings.desc',
     href: '/store/settings',
   },
 ]
 
 export function StorePage() {
+  const t = useT()
+
   return (
     <main className={styles.content}>
       <Breadcrumbs
@@ -58,16 +62,20 @@ export function StorePage() {
       />
       <div className={styles.pageHeader}>
         <div>
-          <h2 className={styles.pageTitle}>Store</h2>
-          <p className={styles.pageSubtitle}>
-            Manage your store items, orders and settings.
-          </p>
+          <h2 className={styles.pageTitle}>{t('title.store')}</h2>
+          <p className={styles.pageSubtitle}>{t('store.page.subtitle')}</p>
         </div>
       </div>
 
       <div className={styles.gridHome}>
         {storeSections.map((section) => (
-          <SectionCard key={section.title} {...section} />
+          <SectionCard
+            key={section.href}
+            icon={section.icon}
+            title={t(section.titleKey)}
+            description={t(section.descKey)}
+            href={section.href}
+          />
         ))}
       </div>
     </main>
diff --git a/apps/business/src/pages/StoreSettingsPage.tsx b/apps/business/src/pages/StoreSettingsPage.tsx
index b29ce73..a111ad0 100644
--- a/apps/business/src/pages/StoreSettingsPage.tsx
+++ b/apps/business/src/pages/StoreSettingsPage.tsx
@@ -5,6 +5,7 @@ import { StepColorPicker } from '../components/StepColorPicker'
 import { Switch } from '../components/Switch'
 import { Tooltip } from '../components/Tooltip'
 import { useToast } from '../context/ToastContext'
+import { useT } from '../i18n/useT'
 import { ApiError } from '../lib/api'
 import {
   getSettings,
@@ -53,6 +54,7 @@ function stepsAreEqual(a: OrderProcessStep[], b: OrderProcessStep[]) {
 }
 
 export function StoreSettingsPage() {
+  const t = useT()
   const { showToast } = useToast()
   const [settings, setSettings] = useState<StoreSettings>(DEFAULT_STORE_SETTINGS)
   const [draftSteps, setDraftSteps] = useState<OrderProcessStep[]>(
@@ -81,7 +83,7 @@ export function StoreSettingsPage() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load settings.')
+        setError(t('productSettings.errorLoad'))
       }
     } finally {
       setIsLoading(false)
@@ -95,12 +97,12 @@ export function StoreSettingsPage() {
     try {
       const data = await updateStoreSettings({ onlineSellEnabled: checked })
       setSettings(data.settings.store)
-      showToast('Settings saved.', 'success')
+      showToast(t('productSettings.saved'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to save settings.')
+        setError(t('productSettings.errorSave'))
       }
     } finally {
       setSavingKey(null)
@@ -163,11 +165,11 @@ export function StoreSettingsPage() {
     const normalized = normalizeSteps(draftSteps)
     const hasEmptyLabel = normalized.some((step) => !step.label || !step.labelFa)
     if (!normalized.length) {
-      setError('Add at least one order process step.')
+      setError(t('storeSettings.error.minSteps'))
       return
     }
     if (hasEmptyLabel) {
-      setError('Every order step needs an English and Farsi label.')
+      setError(t('storeSettings.error.labels'))
       return
     }
 
@@ -178,12 +180,12 @@ export function StoreSettingsPage() {
       const data = await updateStoreSettings({ orderProcessSteps: normalized })
       setSettings(data.settings.store)
       setDraftSteps(data.settings.store.orderProcessSteps)
-      showToast('Order process steps saved.', 'success')
+      showToast(t('storeSettings.stepsSaved'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to save order process steps.')
+        setError(t('storeSettings.error.saveSteps'))
       }
     } finally {
       setSavingKey(null)
@@ -213,10 +215,8 @@ export function StoreSettingsPage() {
 
       <div className={pageStyles.pageHeader}>
         <div>
-          <h2 className={pageStyles.pageTitle}>Store settings</h2>
-          <p className={pageStyles.pageSubtitle}>
-            Control online sales and define how orders move through fulfillment.
-          </p>
+          <h2 className={pageStyles.pageTitle}>{t('storeSettings.title')}</h2>
+          <p className={pageStyles.pageSubtitle}>{t('storeSettings.subtitle')}</p>
         </div>
       </div>
 
@@ -227,27 +227,26 @@ export function StoreSettingsPage() {
       )}
 
       <section className={sharedStyles.panel}>
-        <h3 className={sharedStyles.sectionTitle}>Sales</h3>
+        <h3 className={sharedStyles.sectionTitle}>{t('storeSettings.sales')}</h3>
 
         {isLoading ? (
-          <p className={sharedStyles.status}>Loading settings...</p>
+          <p className={sharedStyles.status}>{t('productSettings.loading')}</p>
         ) : (
           <div className={sharedStyles.list}>
             <div className={sharedStyles.row}>
               <div className={sharedStyles.rowText}>
                 <label htmlFor="online-sell" className={sharedStyles.rowLabel}>
-                  Online sell
+                  {t('storeSettings.onlineSell')}
                 </label>
                 <p className={sharedStyles.rowDescription}>
-                  When disabled, all sales on your website are turned off. Customers
-                  will not be able to place new orders online.
+                  {t('storeSettings.onlineSellDesc')}
                 </p>
               </div>
               <Switch
                 id="online-sell"
                 checked={settings.onlineSellEnabled}
                 disabled={savingKey === 'onlineSell'}
-                aria-label="Online sell"
+                aria-label={t('storeSettings.onlineSell')}
                 onChange={(checked) => void handleOnlineSellChange(checked)}
               />
             </div>
@@ -258,16 +257,13 @@ export function StoreSettingsPage() {
       <section className={`${sharedStyles.panel} ${styles.stepsPanel}`}>
         <div className={styles.stepsHeader}>
           <div>
-            <h3 className={sharedStyles.sectionTitle}>Order process</h3>
-            <p className={styles.stepsDescription}>
-              Define the steps an order can move through — for example: under
-              processing, ready for shipping, shipped, delivered.
-            </p>
+            <h3 className={sharedStyles.sectionTitle}>{t('storeSettings.orderProcess')}</h3>
+            <p className={styles.stepsDescription}>{t('storeSettings.orderProcessDesc')}</p>
           </div>
         </div>
 
         {isLoading ? (
-          <p className={sharedStyles.status}>Loading settings...</p>
+          <p className={sharedStyles.status}>{t('productSettings.loading')}</p>
         ) : (
           <>
             <div className={styles.stepsList}>
@@ -277,14 +273,14 @@ export function StoreSettingsPage() {
                   <StepColorPicker
                     value={normalizeStepColor(step.color, defaultStepColorForId(step.id, index))}
                     onChange={(color) => updateStepColor(step.id, color)}
-                    ariaLabel={`Color for step ${index + 1}`}
+                    ariaLabel={t('storeSettings.stepColorAria', { index: index + 1 })}
                   />
                   <input
                     type="text"
                     className={styles.stepInput}
                     value={step.label}
-                    placeholder="Label (EN)"
-                    aria-label={`Order step ${index + 1} English label`}
+                    placeholder={t('storeSettings.labelEn')}
+                    aria-label={t('storeSettings.stepEnAria', { index: index + 1 })}
                     dir="ltr"
                     lang="en"
                     onChange={(e) => updateStepLabel(step.id, e.target.value)}
@@ -293,42 +289,42 @@ export function StoreSettingsPage() {
                     type="text"
                     className={`${styles.stepInput} ${styles.stepInputFa}`}
                     value={step.labelFa ?? ''}
-                    placeholder="عنوان (فارسی)"
-                    aria-label={`Order step ${index + 1} Farsi label`}
+                    placeholder={t('storeSettings.labelFa')}
+                    aria-label={t('storeSettings.stepFaAria', { index: index + 1 })}
                     dir="rtl"
                     lang="fa"
                     onChange={(e) => updateStepLabelFa(step.id, e.target.value)}
                   />
                   <div className={styles.stepControls}>
-                    <Tooltip label="Move step up">
+                    <Tooltip label={t('storeSettings.moveUp')}>
                       <button
                         type="button"
                         className={controlStyles.controlBtn}
                         onClick={() => moveStep(step.id, -1)}
                         disabled={index === 0}
-                        aria-label="Move step up"
+                        aria-label={t('storeSettings.moveUp')}
                       >
                         <ChevronUp size={16} />
                       </button>
                     </Tooltip>
-                    <Tooltip label="Move step down">
+                    <Tooltip label={t('storeSettings.moveDown')}>
                       <button
                         type="button"
                         className={controlStyles.controlBtn}
                         onClick={() => moveStep(step.id, 1)}
                         disabled={index === draftSteps.length - 1}
-                        aria-label="Move step down"
+                        aria-label={t('storeSettings.moveDown')}
                       >
                         <ChevronDown size={16} />
                       </button>
                     </Tooltip>
-                    <Tooltip label="Remove step">
+                    <Tooltip label={t('storeSettings.removeStep')}>
                       <button
                         type="button"
                         className={removeStyles.removeRowBtn}
                         onClick={() => removeStep(step.id)}
                         disabled={draftSteps.length <= 1}
-                        aria-label="Remove step"
+                        aria-label={t('storeSettings.removeStep')}
                       >
                         <Trash2 size={15} />
                       </button>
@@ -338,15 +334,13 @@ export function StoreSettingsPage() {
               ))}
 
               {!draftSteps.length && (
-                <p className={styles.emptyText}>
-                  No order steps yet. Add the first step to define your workflow.
-                </p>
+                <p className={styles.emptyText}>{t('storeSettings.emptySteps')}</p>
               )}
             </div>
 
             <button type="button" className={styles.addStepBtn} onClick={addStep}>
               <Plus size={18} />
-              Add step
+              {t('storeSettings.addStep')}
             </button>
 
             <div className={styles.stepsActions}>
@@ -356,7 +350,9 @@ export function StoreSettingsPage() {
                 onClick={() => void handleSaveSteps()}
                 disabled={!canSaveSteps || savingKey === 'orderSteps'}
               >
-                {savingKey === 'orderSteps' ? 'Saving...' : 'Save steps'}
+                {savingKey === 'orderSteps'
+                  ? t('storeSettings.saving')
+                  : t('storeSettings.saveSteps')}
               </button>
             </div>
           </>
diff --git a/apps/business/src/pages/StoreSpecialsPage.tsx b/apps/business/src/pages/StoreSpecialsPage.tsx
index 6b45d77..2f9fecc 100644
--- a/apps/business/src/pages/StoreSpecialsPage.tsx
+++ b/apps/business/src/pages/StoreSpecialsPage.tsx
@@ -12,6 +12,7 @@ import { StoreSpecialCarousel } from '../components/StoreSpecialCarousel'
 import { StoreSpecialModal } from '../components/StoreSpecialModal'
 import { useDraftCart } from '../context/DraftCartContext'
 import { useToast } from '../context/ToastContext'
+import { useT } from '../i18n/useT'
 import { ApiError } from '../lib/api'
 import {
   createStoreSpecial,
@@ -27,6 +28,7 @@ import fabStyles from './StoreItemsPage.module.css'
 import styles from './StoreSpecialsPage.module.css'
 
 export function StoreSpecialsPage() {
+  const t = useT()
   const { itemCount, hasItems, addVariant } = useDraftCart()
   const { showToast } = useToast()
   const [specials, setSpecials] = useState<StoreSpecial[]>([])
@@ -73,7 +75,7 @@ export function StoreSpecialsPage() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load special categories.')
+        setError(t('website.specialItems.errorLoad'))
       }
     } finally {
       setIsLoading(false)
@@ -141,45 +143,49 @@ export function StoreSpecialsPage() {
     )
   }
 
-  async function handleCreateSpecial(title: string) {
+  async function handleCreateSpecial(values: { key: string; title: string }) {
     setIsSaving(true)
     setError('')
 
     try {
       const result = await createStoreSpecial({
-        title,
+        key: values.key,
+        title: values.title,
         sortOrder: specials.length,
       })
       setSpecials((prev) => [...prev, result.special])
       setCreateOpen(false)
-      showToast('Special category created.', 'success')
+      showToast(t('website.specialItems.toastCreated'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to create special category.')
+        setError(t('website.specialItems.errorCreate'))
       }
     } finally {
       setIsSaving(false)
     }
   }
 
-  async function handleEditSpecial(title: string) {
+  async function handleEditSpecial(values: { key: string; title: string }) {
     if (!editSpecialTarget) return
 
     setIsSaving(true)
     setError('')
 
     try {
-      const result = await updateStoreSpecial(editSpecialTarget.id, { title })
+      const result = await updateStoreSpecial(editSpecialTarget.id, {
+        key: values.key,
+        title: values.title,
+      })
       replaceSpecial(result.special)
       setEditSpecialTarget(null)
-      showToast('Special category updated.', 'success')
+      showToast(t('website.specialItems.toastUpdated'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to update special category.')
+        setError(t('website.specialItems.errorUpdate'))
       }
     } finally {
       setIsSaving(false)
@@ -196,12 +202,12 @@ export function StoreSpecialsPage() {
       await deleteStoreSpecial(deleteSpecialTarget.id)
       setSpecials((prev) => prev.filter((entry) => entry.id !== deleteSpecialTarget.id))
       setDeleteSpecialTarget(null)
-      showToast('Special category deleted.', 'success')
+      showToast(t('website.specialItems.toastDeleted'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to delete special category.')
+        setError(t('website.specialItems.errorDelete'))
       }
     } finally {
       setIsSaving(false)
@@ -223,12 +229,12 @@ export function StoreSpecialsPage() {
       })
       replaceSpecial(result.special)
       setPickItemsTarget(null)
-      showToast('Store items added to special category.', 'success')
+      showToast(t('website.specialItems.toastAdded'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to add store items.')
+        setError(t('website.specialItems.errorAdd'))
       }
     } finally {
       setIsSaving(false)
@@ -253,12 +259,12 @@ export function StoreSpecialsPage() {
       })
       replaceSpecial(result.special)
       setRemoveTarget(null)
-      showToast('Removed from special category.', 'success')
+      showToast(t('website.specialItems.toastRemoved'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to remove store item.')
+        setError(t('website.specialItems.errorRemove'))
       }
     } finally {
       setIsSaving(false)
@@ -280,7 +286,7 @@ export function StoreSpecialsPage() {
       return
     }
 
-    showToast('Added to shopping cart.', 'success')
+    showToast(t('storeItems.addedToCart'), 'success')
   }
 
   function handleVariantPicked(variant: StoreItem) {
@@ -290,7 +296,7 @@ export function StoreSpecialsPage() {
       showToast(feedback, 'error')
       return
     }
-    showToast('Added to shopping cart.', 'success')
+    showToast(t('storeItems.addedToCart'), 'success')
   }
 
   return (
@@ -305,22 +311,17 @@ export function StoreSpecialsPage() {
 
       <div className={pageStyles.pageHeader}>
         <div>
-          <h2 className={pageStyles.pageTitle}>Special Items</h2>
-          <p className={pageStyles.pageSubtitle}>
-            Curate featured store items into categories for your website carousels.
-          </p>
+          <h2 className={pageStyles.pageTitle}>{t('title.specialItems')}</h2>
+          <p className={pageStyles.pageSubtitle}>{t('website.specialItems.subtitle')}</p>
         </div>
       </div>
 
       {error && <p className={styles.error}>{error}</p>}
 
       {isLoading ? (
-        <p className={styles.empty}>Loading special categories...</p>
+        <p className={styles.empty}>{t('website.specialItems.loading')}</p>
       ) : specials.length === 0 ? (
-        <p className={styles.empty}>
-          No special categories yet. Use the + button to create one, then add store items to each
-          carousel.
-        </p>
+        <p className={styles.empty}>{t('website.specialItems.empty')}</p>
       ) : (
         <div className={styles.carousels}>
           {specials.map((special) => (
@@ -349,11 +350,11 @@ export function StoreSpecialsPage() {
             type="button"
             className={fabStyles.cartFabStrip}
             onClick={() => setCartOpen(true)}
-            aria-label={`Open shopping cart, ${itemCount} items`}
+            aria-label={t('storeItems.cartOpen', { count: itemCount })}
           >
             <span className={fabStyles.cartFabCount}>{itemCount}</span>
             <span className={fabStyles.cartFabLabel}>
-              {itemCount === 1 ? 'item in cart' : 'items in cart'}
+              {itemCount === 1 ? t('storeItems.cartOne') : t('storeItems.cartMany')}
             </span>
           </button>
         )}
@@ -361,7 +362,7 @@ export function StoreSpecialsPage() {
           type="button"
           className={fabStyles.addFab}
           onClick={() => setCreateOpen(true)}
-          aria-label="Add special category"
+          aria-label={t('website.specialItems.addFab')}
         >
           <Plus size={24} />
         </button>
@@ -371,6 +372,8 @@ export function StoreSpecialsPage() {
         open={createOpen}
         onClose={() => !isSaving && setCreateOpen(false)}
         onSubmit={handleCreateSpecial}
+        title={t('website.specialItems.createTitle')}
+        submitLabel={t('website.create')}
         isSubmitting={isSaving}
       />
 
@@ -378,9 +381,10 @@ export function StoreSpecialsPage() {
         open={!!editSpecialTarget}
         onClose={() => !isSaving && setEditSpecialTarget(null)}
         onSubmit={handleEditSpecial}
+        initialKey={editSpecialTarget?.key ?? ''}
         initialTitle={editSpecialTarget?.title ?? ''}
-        title="Edit Special Category"
-        submitLabel="Save"
+        title={t('website.specialItems.editTitle')}
+        submitLabel={t('website.save')}
         isSubmitting={isSaving}
       />
 
@@ -420,10 +424,10 @@ export function StoreSpecialsPage() {
 
       <ConfirmDeleteModal
         open={!!deleteSpecialTarget}
-        title="Delete Special Category"
+        title={t('website.specialItems.deleteTitle')}
         message={
           deleteSpecialTarget
-            ? `Delete "${deleteSpecialTarget.title}"? Store items will remain in your catalog.`
+            ? t('website.specialItems.deleteMessage', { title: deleteSpecialTarget.title })
             : ''
         }
         onConfirm={() => void confirmDeleteSpecial()}
@@ -432,10 +436,13 @@ export function StoreSpecialsPage() {
 
       <ConfirmDeleteModal
         open={!!removeTarget}
-        title="Remove from Special"
+        title={t('website.specialItems.removeTitle')}
         message={
           removeTarget
-            ? `Remove "${removeTarget.listing.productTitle}" from "${removeTarget.special.title}"?`
+            ? t('website.specialItems.removeMessage', {
+                name: removeTarget.listing.productTitle,
+                group: removeTarget.special.title,
+              })
             : ''
         }
         onConfirm={() => void confirmRemoveFromSpecial()}
diff --git a/apps/business/src/pages/WebsiteBadgesPage.tsx b/apps/business/src/pages/WebsiteBadgesPage.tsx
index fffa659..cc23534 100644
--- a/apps/business/src/pages/WebsiteBadgesPage.tsx
+++ b/apps/business/src/pages/WebsiteBadgesPage.tsx
@@ -1,23 +1,22 @@
 import { WebsiteSectionShell } from '../components/WebsiteSectionShell'
+import { useT } from '../i18n/useT'
 import styles from './WebsitePage.module.css'
 
 export function WebsiteBadgesPage() {
+  const t = useT()
+
   return (
     <WebsiteSectionShell
       sectionLabel="Badges"
-      title="Badges"
-      subtitle="Show trust badges and highlights on your public website."
+      title={t('title.badges')}
+      subtitle={t('website.badges.subtitle')}
     >
-      <p className={styles.placeholderLead}>
-        Display certifications, guarantees, and trust signals to website visitors.
-      </p>
-      <p className={styles.placeholderNote}>
-        Badge management will be connected here. Planned options include:
-      </p>
+      <p className={styles.placeholderLead}>{t('website.badges.lead')}</p>
+      <p className={styles.placeholderNote}>{t('website.badges.note')}</p>
       <ul className={styles.featureList}>
-        <li>Upload badge images with title and link</li>
-        <li>Reorder badges for homepage or footer display</li>
-        <li>Toggle visibility per badge</li>
+        <li>{t('website.badges.feature.upload')}</li>
+        <li>{t('website.badges.feature.reorder')}</li>
+        <li>{t('website.badges.feature.toggle')}</li>
       </ul>
     </WebsiteSectionShell>
   )
diff --git a/apps/business/src/pages/WebsiteContactPage.tsx b/apps/business/src/pages/WebsiteContactPage.tsx
index 2298e34..670d03b 100644
--- a/apps/business/src/pages/WebsiteContactPage.tsx
+++ b/apps/business/src/pages/WebsiteContactPage.tsx
@@ -1,13 +1,13 @@
 import { useEffect, useMemo, useState } from 'react'
 import { RotateCcw, Search } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
 import { Breadcrumbs } from '../components/Breadcrumbs'
 import { ContactSubmissionDetailModal } from '../components/ContactSubmissionDetailModal'
 import { Pagination } from '../components/Pagination'
+import { useT } from '../i18n/useT'
 import { ApiError, isAbortError } from '../lib/api'
 import { formatCellForDisplay } from '../lib/cellNumber'
-import {
-  listContactSubmissions,
-} from '../services/contactSubmissionService'
+import { listContactSubmissions } from '../services/contactSubmissionService'
 import type {
   ContactSubmission,
   ContactSubmissionsListResponse,
@@ -19,16 +19,19 @@ import styles from './WebsiteContactPage.module.css'
 const PAGE_SIZE = 20
 const COLUMN_COUNT = 6
 
-function formatDateTime(value: string) {
+function formatDateTime(value: string, locale: 'en' | 'fa') {
   const d = new Date(value)
   if (Number.isNaN(d.getTime())) return { date: value, time: '' }
+  const intlLocale = locale === 'fa' ? 'fa-IR' : 'en-US'
   return {
-    date: d.toLocaleDateString('en-US', { year: 'numeric', month: 'short', day: '2-digit' }),
-    time: d.toLocaleTimeString('en-US', { hour: '2-digit', minute: '2-digit' }),
+    date: d.toLocaleDateString(intlLocale, { year: 'numeric', month: 'short', day: '2-digit' }),
+    time: d.toLocaleTimeString(intlLocale, { hour: '2-digit', minute: '2-digit' }),
   }
 }
 
 export function WebsiteContactPage() {
+  const t = useT()
+  const { locale } = useLocale()
   const [data, setData] = useState<ContactSubmissionsListResponse | null>(null)
   const [loading, setLoading] = useState(false)
   const [error, setError] = useState('')
@@ -58,7 +61,7 @@ export function WebsiteContactPage() {
         setData(result)
       } catch (err) {
         if (isAbortError(err) || controller.signal.aborted) return
-        setError(err instanceof ApiError ? err.message : 'Unable to load contact submissions.')
+        setError(err instanceof ApiError ? err.message : t('website.contact.errorLoad'))
       } finally {
         if (!controller.signal.aborted) setLoading(false)
       }
@@ -109,24 +112,22 @@ export function WebsiteContactPage() {
 
       <div className={pageStyles.pageHeader}>
         <div>
-          <h2 className={pageStyles.pageTitle}>Contact us form</h2>
-          <p className={pageStyles.pageSubtitle}>
-            Submissions received from your website contact form.
-          </p>
+          <h2 className={pageStyles.pageTitle}>{t('title.contactForm')}</h2>
+          <p className={pageStyles.pageSubtitle}>{t('website.contact.subtitle')}</p>
         </div>
       </div>
 
       <div className={filterStyles.filtersPanel}>
-        <div className={filterStyles.filtersTitle}>Filters</div>
+        <div className={filterStyles.filtersTitle}>{t('website.contact.filters')}</div>
         <div className={filterStyles.filtersGrid}>
           <div className={filterStyles.filtersInputs}>
             <div className={`${filterStyles.field} ${filterStyles.fieldCol4}`}>
-              <label htmlFor="filter-contact-q">Search</label>
               <input
                 id="filter-contact-q"
                 value={draftQuery}
                 onChange={(e) => setDraftQuery(e.target.value)}
-                placeholder="Title, name, email, cell number, or message"
+                placeholder={t('website.contact.searchPlaceholder')}
+                aria-label={t('website.contact.search')}
                 onKeyDown={(e) => {
                   if (e.key === 'Enter') applyFilters()
                 }}
@@ -139,8 +140,8 @@ export function WebsiteContactPage() {
               className={`${filterStyles.iconActionBtn} ${filterStyles.iconActionBtnPrimary}`}
               onClick={applyFilters}
               disabled={loading}
-              aria-label="Search"
-              title="Search"
+              aria-label={t('website.contact.search')}
+              title={t('website.contact.search')}
             >
               <Search size={18} />
             </button>
@@ -149,8 +150,8 @@ export function WebsiteContactPage() {
               className={`${filterStyles.iconActionBtn} ${filterStyles.iconActionBtnGhost}`}
               onClick={clearFilters}
               disabled={loading}
-              aria-label="Clear filters"
-              title="Clear filters"
+              aria-label={t('website.contact.clearFilters')}
+              title={t('website.contact.clearFilters')}
             >
               <RotateCcw size={18} />
             </button>
@@ -161,15 +162,19 @@ export function WebsiteContactPage() {
       <div className={styles.tablePanel}>
         <div className={styles.tableWrap}>
           <div className={styles.tableHeader}>
-            <div className={styles.tableHeaderTitle}>Submissions</div>
+            <div className={styles.tableHeaderTitle}>{t('website.contact.listTitle')}</div>
             <div className={styles.meta}>
               {data ? (
                 data.total > 0 ? (
                   <>
-                    Showing {showingFrom} - {showingTo} of {data.total}
+                    {t('website.contact.showing', {
+                      from: showingFrom,
+                      to: showingTo,
+                      total: data.total,
+                    })}
                   </>
                 ) : (
-                  'No submissions'
+                  t('website.contact.none')
                 )
               ) : (
                 ' '
@@ -183,19 +188,19 @@ export function WebsiteContactPage() {
             <table className={styles.table}>
               <thead>
                 <tr>
-                  <th className={styles.th}>Title</th>
-                  <th className={styles.th}>Name</th>
-                  <th className={styles.th}>Email</th>
-                  <th className={styles.th}>Cell number</th>
-                  <th className={styles.th}>Date</th>
-                  <th className={styles.th}>Time</th>
+                  <th className={styles.th}>{t('website.contact.col.title')}</th>
+                  <th className={styles.th}>{t('website.contact.col.name')}</th>
+                  <th className={styles.th}>{t('website.contact.col.email')}</th>
+                  <th className={styles.th}>{t('website.contact.col.cell')}</th>
+                  <th className={styles.th}>{t('website.contact.col.date')}</th>
+                  <th className={styles.th}>{t('website.contact.col.time')}</th>
                 </tr>
               </thead>
               <tbody>
                 {loading && (
                   <tr>
                     <td className={styles.td} colSpan={COLUMN_COUNT}>
-                      Loading...
+                      {t('website.contact.loading')}
                     </td>
                   </tr>
                 )}
@@ -203,14 +208,14 @@ export function WebsiteContactPage() {
                 {!loading && data?.items.length === 0 && (
                   <tr>
                     <td className={styles.td} colSpan={COLUMN_COUNT}>
-                      No submissions found.
+                      {t('website.contact.empty')}
                     </td>
                   </tr>
                 )}
 
                 {!loading &&
                   data?.items.map((item) => {
-                    const { date, time } = formatDateTime(item.createdAt)
+                    const { date, time } = formatDateTime(item.createdAt, locale)
                     return (
                       <tr
                         key={item.id}
@@ -224,7 +229,7 @@ export function WebsiteContactPage() {
                         }}
                         tabIndex={0}
                         role="button"
-                        aria-label={`View submission from ${item.name}`}
+                        aria-label={t('website.contact.viewSubmission', { name: item.name })}
                       >
                         <td className={styles.td}>{item.title}</td>
                         <td className={styles.td}>{item.name}</td>
@@ -243,7 +248,12 @@ export function WebsiteContactPage() {
 
           <div className={styles.pagination}>
             <div>
-              Page {page} / {totalPages} · {PAGE_SIZE} per page · {data?.total ?? 0} total
+              {t('website.contact.pageMeta', {
+                page,
+                totalPages,
+                pageSize: PAGE_SIZE,
+                total: data?.total ?? 0,
+              })}
             </div>
             <Pagination
               currentPage={page}
diff --git a/apps/business/src/pages/WebsiteEPaymentPage.tsx b/apps/business/src/pages/WebsiteEPaymentPage.tsx
index d1a5383..69278c9 100644
--- a/apps/business/src/pages/WebsiteEPaymentPage.tsx
+++ b/apps/business/src/pages/WebsiteEPaymentPage.tsx
@@ -1,23 +1,22 @@
 import { WebsiteSectionShell } from '../components/WebsiteSectionShell'
+import { useT } from '../i18n/useT'
 import styles from './WebsitePage.module.css'
 
 export function WebsiteEPaymentPage() {
+  const t = useT()
+
   return (
     <WebsiteSectionShell
       sectionLabel="E-Payment"
-      title="E-Payment"
-      subtitle="Configure online payment methods for your website checkout."
+      title={t('title.ePayment')}
+      subtitle={t('website.ePayment.subtitle')}
     >
-      <p className={styles.placeholderLead}>
-        Connect payment gateways so customers can pay online through your store.
-      </p>
-      <p className={styles.placeholderNote}>
-        E-payment settings will be connected here. Planned options include:
-      </p>
+      <p className={styles.placeholderLead}>{t('website.ePayment.lead')}</p>
+      <p className={styles.placeholderNote}>{t('website.ePayment.note')}</p>
       <ul className={styles.featureList}>
-        <li>Enable or disable online payments</li>
-        <li>Configure payment provider credentials</li>
-        <li>Set supported payment methods and test mode</li>
+        <li>{t('website.ePayment.feature.enable')}</li>
+        <li>{t('website.ePayment.feature.credentials')}</li>
+        <li>{t('website.ePayment.feature.methods')}</li>
       </ul>
     </WebsiteSectionShell>
   )
diff --git a/apps/business/src/pages/WebsiteFaqPage.tsx b/apps/business/src/pages/WebsiteFaqPage.tsx
index 6737929..8e087b3 100644
--- a/apps/business/src/pages/WebsiteFaqPage.tsx
+++ b/apps/business/src/pages/WebsiteFaqPage.tsx
@@ -1,23 +1,22 @@
 import { WebsiteSectionShell } from '../components/WebsiteSectionShell'
+import { useT } from '../i18n/useT'
 import styles from './WebsitePage.module.css'
 
 export function WebsiteFaqPage() {
+  const t = useT()
+
   return (
     <WebsiteSectionShell
       sectionLabel="FAQ"
-      title="FAQ"
-      subtitle="Create and organize frequently asked questions for your website."
+      title={t('title.faq')}
+      subtitle={t('website.faq.subtitle')}
     >
-      <p className={styles.placeholderLead}>
-        Build an FAQ section to answer common customer questions before they contact you.
-      </p>
-      <p className={styles.placeholderNote}>
-        FAQ editor will be connected here. Planned options include:
-      </p>
+      <p className={styles.placeholderLead}>{t('website.faq.lead')}</p>
+      <p className={styles.placeholderNote}>{t('website.faq.note')}</p>
       <ul className={styles.featureList}>
-        <li>Add, edit, and reorder questions and answers</li>
-        <li>Group items by category</li>
-        <li>Publish or hide individual entries</li>
+        <li>{t('website.faq.feature.crud')}</li>
+        <li>{t('website.faq.feature.groups')}</li>
+        <li>{t('website.faq.feature.publish')}</li>
       </ul>
     </WebsiteSectionShell>
   )
diff --git a/apps/business/src/pages/WebsitePage.tsx b/apps/business/src/pages/WebsitePage.tsx
index d64577f..1c6de4d 100644
--- a/apps/business/src/pages/WebsitePage.tsx
+++ b/apps/business/src/pages/WebsitePage.tsx
@@ -11,75 +11,85 @@ import {
 } from 'lucide-react'
 import { SectionCard } from '../components/SectionCard'
 import { Breadcrumbs } from '../components/Breadcrumbs'
+import { useT } from '../i18n/useT'
+import type { BusinessMessageKey } from '../i18n/messages'
 import styles from '../components/PageContent.module.css'
 
-const websiteSections = [
+const websiteSections: {
+  icon: typeof Images
+  titleKey: BusinessMessageKey
+  descKey: BusinessMessageKey
+  linkKey: BusinessMessageKey
+  href: string
+}[] = [
   {
     icon: Images,
-    title: 'Sliders',
-    description: 'Manage homepage banner sliders and promotional image carousels.',
-    linkText: 'Manage sliders',
+    titleKey: 'nav.website.sliders',
+    descKey: 'website.card.sliders.desc',
+    linkKey: 'website.card.sliders.link',
     href: '/website/sliders',
   },
   {
     icon: LayoutGrid,
-    title: 'Special Categories',
-    description: 'Highlight selected product categories on your website homepage.',
-    linkText: 'Manage categories',
+    titleKey: 'nav.website.specialCategories',
+    descKey: 'website.card.specialCategories.desc',
+    linkKey: 'website.card.specialCategories.link',
     href: '/website/special-categories',
   },
   {
     icon: Building2,
-    title: 'Special Brands',
-    description: 'Showcase partner or featured brands on your website homepage.',
-    linkText: 'Manage brands',
+    titleKey: 'nav.website.specialBrands',
+    descKey: 'website.card.specialBrands.desc',
+    linkKey: 'website.card.specialBrands.link',
     href: '/website/special-brands',
   },
   {
     icon: Sparkles,
-    title: 'Special Items',
-    description: 'Curate featured store items into categories for your website carousels.',
-    linkText: 'Manage special items',
+    titleKey: 'nav.website.specialItems',
+    descKey: 'website.card.specialItems.desc',
+    linkKey: 'website.card.specialItems.link',
     href: '/website/special-items',
   },
   {
     icon: Mail,
-    title: 'Contact Us Form',
-    description: 'View submissions from your website contact form.',
-    linkText: 'View submissions',
+    titleKey: 'nav.website.contact',
+    descKey: 'website.card.contact.desc',
+    linkKey: 'website.card.contact.link',
     href: '/website/contact',
   },
   {
     icon: BellRing,
-    title: 'Subscriptions',
-    description: 'Manage newsletter sign-ups and subscription options for visitors.',
-    linkText: 'Manage subscriptions',
+    titleKey: 'nav.website.subscriptions',
+    descKey: 'website.card.subscriptions.desc',
+    linkKey: 'website.card.subscriptions.link',
     href: '/website/subscriptions',
   },
   {
     icon: CircleHelp,
-    title: 'FAQ',
-    description: 'Create and organize frequently asked questions for your website.',
-    linkText: 'Manage FAQ',
+    titleKey: 'nav.website.faq',
+    descKey: 'website.card.faq.desc',
+    linkKey: 'website.card.faq.link',
     href: '/website/faq',
   },
   {
     icon: Award,
-    title: 'Badges',
-    description: 'Show trust badges, certifications, and highlights on your website.',
-    linkText: 'Manage badges',
+    titleKey: 'nav.website.badges',
+    descKey: 'website.card.badges.desc',
+    linkKey: 'website.card.badges.link',
     href: '/website/badges',
   },
   {
     icon: CreditCard,
-    title: 'E-Payment',
-    description: 'Configure online payment gateways and checkout payment options.',
-    linkText: 'Manage e-payment',
+    titleKey: 'nav.website.ePayment',
+    descKey: 'website.card.ePayment.desc',
+    linkKey: 'website.card.ePayment.link',
     href: '/website/e-payment',
   },
 ]
 
 export function WebsitePage() {
+  const t = useT()
+
   return (
     <main className={styles.content}>
       <Breadcrumbs
@@ -90,16 +100,21 @@ export function WebsitePage() {
       />
       <div className={styles.pageHeader}>
         <div>
-          <h2 className={styles.pageTitle}>Website</h2>
-          <p className={styles.pageSubtitle}>
-            Manage public website content, forms, and customer-facing settings.
-          </p>
+          <h2 className={styles.pageTitle}>{t('title.website')}</h2>
+          <p className={styles.pageSubtitle}>{t('website.page.subtitle')}</p>
         </div>
       </div>
 
       <div className={styles.gridHome}>
         {websiteSections.map((section) => (
-          <SectionCard key={section.title} {...section} />
+          <SectionCard
+            key={section.href}
+            icon={section.icon}
+            title={t(section.titleKey)}
+            description={t(section.descKey)}
+            linkText={t(section.linkKey)}
+            href={section.href}
+          />
         ))}
       </div>
     </main>
diff --git a/apps/business/src/pages/WebsiteSlidersPage.tsx b/apps/business/src/pages/WebsiteSlidersPage.tsx
index 5368bea..817132c 100644
--- a/apps/business/src/pages/WebsiteSlidersPage.tsx
+++ b/apps/business/src/pages/WebsiteSlidersPage.tsx
@@ -7,6 +7,7 @@ import { Breadcrumbs } from '../components/Breadcrumbs'
 import { ConfirmDeleteModal } from '../components/ConfirmDeleteModal'
 import { WebsiteSliderGallery } from '../components/WebsiteSliderGallery'
 import { useToast } from '../context/ToastContext'
+import { useT } from '../i18n/useT'
 import { ApiError } from '../lib/api'
 import { resolveDataUrlToMediaId } from '../services/mediaService'
 import {
@@ -19,9 +20,8 @@ import type { WebsiteSlider, WebsiteSliderSlide } from '../types/websiteSlider'
 import pageStyles from '../components/PageContent.module.css'
 import styles from './StoreSpecialsPage.module.css'
 
-const DEFAULT_SLIDER_TITLE = 'Homepage slider'
-
 export function WebsiteSlidersPage() {
+  const t = useT()
   const { showToast } = useToast()
   const [slider, setSlider] = useState<WebsiteSlider | null>(null)
   const [isLoading, setIsLoading] = useState(true)
@@ -48,7 +48,7 @@ export function WebsiteSlidersPage() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load slides.')
+        setError(t('website.sliders.errorLoad'))
       }
     } finally {
       setIsLoading(false)
@@ -62,7 +62,7 @@ export function WebsiteSlidersPage() {
     try {
       const imageMediaId = await resolveDataUrlToMediaId(data.image, 'slider-slide.jpg')
       if (!imageMediaId) {
-        throw new Error('Unable to upload slide image.')
+        throw new Error(t('website.sliders.errorUpload'))
       }
 
       const slideInput = {
@@ -79,21 +79,21 @@ export function WebsiteSlidersPage() {
         setSlider(result.slider)
       } else {
         const result = await createWebsiteSlider({
-          title: DEFAULT_SLIDER_TITLE,
+          title: t('website.sliders.defaultTitle'),
           slides: [slideInput],
         })
         setSlider(result.slider)
       }
 
       setAddSlideOpen(false)
-      showToast('Slide added.', 'success')
+      showToast(t('website.sliders.toastAdded'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else if (err instanceof Error) {
         setError(err.message)
       } else {
-        setError('Unable to add slide.')
+        setError(t('website.sliders.errorAdd'))
       }
     } finally {
       setIsSaving(false)
@@ -114,12 +114,12 @@ export function WebsiteSlidersPage() {
       const result = await updateWebsiteSlider(slider.id, { slides: nextSlides })
       setSlider(result.slider)
       setRemoveTarget(null)
-      showToast('Slide removed.', 'success')
+      showToast(t('website.sliders.toastRemoved'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to remove slide.')
+        setError(t('website.sliders.errorRemove'))
       }
     } finally {
       setIsSaving(false)
@@ -138,17 +138,15 @@ export function WebsiteSlidersPage() {
 
       <div className={pageStyles.pageHeader}>
         <div>
-          <h2 className={pageStyles.pageTitle}>Sliders</h2>
-          <p className={pageStyles.pageSubtitle}>
-            Manage homepage banner slides in a 9:4 gallery.
-          </p>
+          <h2 className={pageStyles.pageTitle}>{t('title.sliders')}</h2>
+          <p className={pageStyles.pageSubtitle}>{t('website.sliders.subtitle')}</p>
         </div>
       </div>
 
       {error && <p className={styles.error}>{error}</p>}
 
       {isLoading ? (
-        <p className={styles.empty}>Loading slides...</p>
+        <p className={styles.empty}>{t('website.sliders.loading')}</p>
       ) : (
         <WebsiteSliderGallery
           slides={slider?.slides ?? []}
@@ -166,8 +164,8 @@ export function WebsiteSlidersPage() {
 
       <ConfirmDeleteModal
         open={!!removeTarget}
-        title="Remove Slide"
-        message="Remove this slide from the homepage slider?"
+        title={t('website.sliders.removeTitle')}
+        message={t('website.sliders.removeMessage')}
         onConfirm={() => void confirmRemoveSlide()}
         onCancel={() => !isSaving && setRemoveTarget(null)}
       />
diff --git a/apps/business/src/pages/WebsiteSpecialBrandsPage.tsx b/apps/business/src/pages/WebsiteSpecialBrandsPage.tsx
index e62227f..11fb3da 100644
--- a/apps/business/src/pages/WebsiteSpecialBrandsPage.tsx
+++ b/apps/business/src/pages/WebsiteSpecialBrandsPage.tsx
@@ -7,6 +7,7 @@ import { StoreSpecialModal } from '../components/StoreSpecialModal'
 import { WebsiteGroupCarousel } from '../components/WebsiteGroupCarousel'
 import { WebsiteGroupItemCard } from '../components/WebsiteGroupItemCard'
 import { useToast } from '../context/ToastContext'
+import { useT } from '../i18n/useT'
 import { ApiError } from '../lib/api'
 import {
   createWebsiteBrandGroup,
@@ -20,6 +21,7 @@ import fabStyles from './StoreItemsPage.module.css'
 import styles from './StoreSpecialsPage.module.css'
 
 export function WebsiteSpecialBrandsPage() {
+  const t = useT()
   const { showToast } = useToast()
   const [groups, setGroups] = useState<WebsiteBrandGroup[]>([])
   const [isLoading, setIsLoading] = useState(true)
@@ -54,7 +56,7 @@ export function WebsiteSpecialBrandsPage() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load special brand groups.')
+        setError(t('website.specialBrands.errorLoad'))
       }
     } finally {
       setIsLoading(false)
@@ -65,45 +67,49 @@ export function WebsiteSpecialBrandsPage() {
     setGroups((prev) => prev.map((entry) => (entry.id === updated.id ? updated : entry)))
   }
 
-  async function handleCreateGroup(title: string) {
+  async function handleCreateGroup(values: { key: string; title: string }) {
     setIsSaving(true)
     setError('')
 
     try {
       const result = await createWebsiteBrandGroup({
-        title,
+        key: values.key,
+        title: values.title,
         sortOrder: groups.length,
       })
       setGroups((prev) => [...prev, result.group])
       setCreateOpen(false)
-      showToast('Special brand group created.', 'success')
+      showToast(t('website.specialBrands.toastCreated'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to create special brand group.')
+        setError(t('website.specialBrands.errorCreate'))
       }
     } finally {
       setIsSaving(false)
     }
   }
 
-  async function handleEditGroup(title: string) {
+  async function handleEditGroup(values: { key: string; title: string }) {
     if (!editGroupTarget) return
 
     setIsSaving(true)
     setError('')
 
     try {
-      const result = await updateWebsiteBrandGroup(editGroupTarget.id, { title })
+      const result = await updateWebsiteBrandGroup(editGroupTarget.id, {
+        key: values.key,
+        title: values.title,
+      })
       replaceGroup(result.group)
       setEditGroupTarget(null)
-      showToast('Special brand group updated.', 'success')
+      showToast(t('website.specialBrands.toastUpdated'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to update special brand group.')
+        setError(t('website.specialBrands.errorUpdate'))
       }
     } finally {
       setIsSaving(false)
@@ -120,12 +126,12 @@ export function WebsiteSpecialBrandsPage() {
       await deleteWebsiteBrandGroup(deleteGroupTarget.id)
       setGroups((prev) => prev.filter((entry) => entry.id !== deleteGroupTarget.id))
       setDeleteGroupTarget(null)
-      showToast('Special brand group deleted.', 'success')
+      showToast(t('website.specialBrands.toastDeleted'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to delete special brand group.')
+        setError(t('website.specialBrands.errorDelete'))
       }
     } finally {
       setIsSaving(false)
@@ -147,12 +153,12 @@ export function WebsiteSpecialBrandsPage() {
       })
       replaceGroup(result.group)
       setPickItemsTarget(null)
-      showToast('Brands added to group.', 'success')
+      showToast(t('website.specialBrands.toastAdded'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to add brands.')
+        setError(t('website.specialBrands.errorAdd'))
       }
     } finally {
       setIsSaving(false)
@@ -174,12 +180,12 @@ export function WebsiteSpecialBrandsPage() {
       })
       replaceGroup(result.group)
       setRemoveTarget(null)
-      showToast('Removed from special brand group.', 'success')
+      showToast(t('website.specialBrands.toastRemoved'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to remove brand.')
+        setError(t('website.specialBrands.errorRemove'))
       }
     } finally {
       setIsSaving(false)
@@ -198,22 +204,17 @@ export function WebsiteSpecialBrandsPage() {
 
       <div className={pageStyles.pageHeader}>
         <div>
-          <h2 className={pageStyles.pageTitle}>Special Brands</h2>
-          <p className={pageStyles.pageSubtitle}>
-            Curate featured brands into groups for your website homepage.
-          </p>
+          <h2 className={pageStyles.pageTitle}>{t('title.specialBrands')}</h2>
+          <p className={pageStyles.pageSubtitle}>{t('website.specialBrands.subtitle')}</p>
         </div>
       </div>
 
       {error && <p className={styles.error}>{error}</p>}
 
       {isLoading ? (
-        <p className={styles.empty}>Loading special brand groups...</p>
+        <p className={styles.empty}>{t('website.specialBrands.loading')}</p>
       ) : groups.length === 0 ? (
-        <p className={styles.empty}>
-          No special brand groups yet. Use the + button to create one, then add brands to each
-          carousel.
-        </p>
+        <p className={styles.empty}>{t('website.specialBrands.empty')}</p>
       ) : (
         <div className={styles.carousels}>
           {groups.map((group) => (
@@ -225,9 +226,7 @@ export function WebsiteSpecialBrandsPage() {
               onAddItems={() => setPickItemsTarget(group)}
               onEditGroup={() => setEditGroupTarget(group)}
               onDeleteGroup={() => setDeleteGroupTarget(group)}
-              addTooltip={`Add brands to ${group.title}`}
-              editTooltip="Edit group"
-              deleteTooltip="Delete group"
+              addTooltip={t('website.specialBrands.addTooltip', { title: group.title })}
               renderItem={(item) => (
                 <WebsiteGroupItemCard
                   title={item.nameEn}
@@ -240,7 +239,6 @@ export function WebsiteSpecialBrandsPage() {
                       brandName: item.nameEn,
                     })
                   }
-                  removeTooltip="Remove from group"
                 />
               )}
             />
@@ -253,7 +251,7 @@ export function WebsiteSpecialBrandsPage() {
           type="button"
           className={fabStyles.addFab}
           onClick={() => setCreateOpen(true)}
-          aria-label="Add special brand group"
+          aria-label={t('website.specialBrands.addFab')}
         >
           <Plus size={24} />
         </button>
@@ -263,7 +261,8 @@ export function WebsiteSpecialBrandsPage() {
         open={createOpen}
         onClose={() => !isSaving && setCreateOpen(false)}
         onSubmit={handleCreateGroup}
-        title="Add Special Brand Group"
+        title={t('website.specialBrands.createTitle')}
+        submitLabel={t('website.create')}
         isSubmitting={isSaving}
       />
 
@@ -271,9 +270,10 @@ export function WebsiteSpecialBrandsPage() {
         open={!!editGroupTarget}
         onClose={() => !isSaving && setEditGroupTarget(null)}
         onSubmit={handleEditGroup}
+        initialKey={editGroupTarget?.key ?? ''}
         initialTitle={editGroupTarget?.title ?? ''}
-        title="Edit Special Brand Group"
-        submitLabel="Save"
+        title={t('website.specialBrands.editTitle')}
+        submitLabel={t('website.save')}
         isSubmitting={isSaving}
       />
 
@@ -288,10 +288,10 @@ export function WebsiteSpecialBrandsPage() {
 
       <ConfirmDeleteModal
         open={!!deleteGroupTarget}
-        title="Delete Special Brand Group"
+        title={t('website.specialBrands.deleteTitle')}
         message={
           deleteGroupTarget
-            ? `Delete "${deleteGroupTarget.title}"? Brands will remain in your catalog.`
+            ? t('website.specialBrands.deleteMessage', { title: deleteGroupTarget.title })
             : ''
         }
         onConfirm={() => void confirmDeleteGroup()}
@@ -300,10 +300,13 @@ export function WebsiteSpecialBrandsPage() {
 
       <ConfirmDeleteModal
         open={!!removeTarget}
-        title="Remove from Group"
+        title={t('website.removeFromGroupTitle')}
         message={
           removeTarget
-            ? `Remove "${removeTarget.brandName}" from "${removeTarget.group.title}"?`
+            ? t('website.removeFromGroupMessage', {
+                name: removeTarget.brandName,
+                group: removeTarget.group.title,
+              })
             : ''
         }
         onConfirm={() => void confirmRemoveFromGroup()}
diff --git a/apps/business/src/pages/WebsiteSpecialCategoriesPage.tsx b/apps/business/src/pages/WebsiteSpecialCategoriesPage.tsx
index ccb6cc1..f8aa8ec 100644
--- a/apps/business/src/pages/WebsiteSpecialCategoriesPage.tsx
+++ b/apps/business/src/pages/WebsiteSpecialCategoriesPage.tsx
@@ -7,6 +7,7 @@ import { StoreSpecialModal } from '../components/StoreSpecialModal'
 import { WebsiteGroupCarousel } from '../components/WebsiteGroupCarousel'
 import { WebsiteGroupItemCard } from '../components/WebsiteGroupItemCard'
 import { useToast } from '../context/ToastContext'
+import { useT } from '../i18n/useT'
 import { ApiError } from '../lib/api'
 import {
   createWebsiteCategoryGroup,
@@ -20,6 +21,7 @@ import fabStyles from './StoreItemsPage.module.css'
 import styles from './StoreSpecialsPage.module.css'
 
 export function WebsiteSpecialCategoriesPage() {
+  const t = useT()
   const { showToast } = useToast()
   const [groups, setGroups] = useState<WebsiteCategoryGroup[]>([])
   const [isLoading, setIsLoading] = useState(true)
@@ -54,7 +56,7 @@ export function WebsiteSpecialCategoriesPage() {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load special category groups.')
+        setError(t('website.specialCategories.errorLoad'))
       }
     } finally {
       setIsLoading(false)
@@ -65,45 +67,49 @@ export function WebsiteSpecialCategoriesPage() {
     setGroups((prev) => prev.map((entry) => (entry.id === updated.id ? updated : entry)))
   }
 
-  async function handleCreateGroup(title: string) {
+  async function handleCreateGroup(values: { key: string; title: string }) {
     setIsSaving(true)
     setError('')
 
     try {
       const result = await createWebsiteCategoryGroup({
-        title,
+        key: values.key,
+        title: values.title,
         sortOrder: groups.length,
       })
       setGroups((prev) => [...prev, result.group])
       setCreateOpen(false)
-      showToast('Special category group created.', 'success')
+      showToast(t('website.specialCategories.toastCreated'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to create special category group.')
+        setError(t('website.specialCategories.errorCreate'))
       }
     } finally {
       setIsSaving(false)
     }
   }
 
-  async function handleEditGroup(title: string) {
+  async function handleEditGroup(values: { key: string; title: string }) {
     if (!editGroupTarget) return
 
     setIsSaving(true)
     setError('')
 
     try {
-      const result = await updateWebsiteCategoryGroup(editGroupTarget.id, { title })
+      const result = await updateWebsiteCategoryGroup(editGroupTarget.id, {
+        key: values.key,
+        title: values.title,
+      })
       replaceGroup(result.group)
       setEditGroupTarget(null)
-      showToast('Special category group updated.', 'success')
+      showToast(t('website.specialCategories.toastUpdated'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to update special category group.')
+        setError(t('website.specialCategories.errorUpdate'))
       }
     } finally {
       setIsSaving(false)
@@ -120,12 +126,12 @@ export function WebsiteSpecialCategoriesPage() {
       await deleteWebsiteCategoryGroup(deleteGroupTarget.id)
       setGroups((prev) => prev.filter((entry) => entry.id !== deleteGroupTarget.id))
       setDeleteGroupTarget(null)
-      showToast('Special category group deleted.', 'success')
+      showToast(t('website.specialCategories.toastDeleted'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to delete special category group.')
+        setError(t('website.specialCategories.errorDelete'))
       }
     } finally {
       setIsSaving(false)
@@ -147,12 +153,12 @@ export function WebsiteSpecialCategoriesPage() {
       })
       replaceGroup(result.group)
       setPickItemsTarget(null)
-      showToast('Categories added to group.', 'success')
+      showToast(t('website.specialCategories.toastAdded'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to add categories.')
+        setError(t('website.specialCategories.errorAdd'))
       }
     } finally {
       setIsSaving(false)
@@ -174,12 +180,12 @@ export function WebsiteSpecialCategoriesPage() {
       })
       replaceGroup(result.group)
       setRemoveTarget(null)
-      showToast('Removed from special category group.', 'success')
+      showToast(t('website.specialCategories.toastRemoved'), 'success')
     } catch (err) {
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to remove category.')
+        setError(t('website.specialCategories.errorRemove'))
       }
     } finally {
       setIsSaving(false)
@@ -198,22 +204,17 @@ export function WebsiteSpecialCategoriesPage() {
 
       <div className={pageStyles.pageHeader}>
         <div>
-          <h2 className={pageStyles.pageTitle}>Special Categories</h2>
-          <p className={pageStyles.pageSubtitle}>
-            Curate featured product categories into groups for your website homepage.
-          </p>
+          <h2 className={pageStyles.pageTitle}>{t('title.specialCategories')}</h2>
+          <p className={pageStyles.pageSubtitle}>{t('website.specialCategories.subtitle')}</p>
         </div>
       </div>
 
       {error && <p className={styles.error}>{error}</p>}
 
       {isLoading ? (
-        <p className={styles.empty}>Loading special category groups...</p>
+        <p className={styles.empty}>{t('website.specialCategories.loading')}</p>
       ) : groups.length === 0 ? (
-        <p className={styles.empty}>
-          No special category groups yet. Use the + button to create one, then add categories to
-          each carousel.
-        </p>
+        <p className={styles.empty}>{t('website.specialCategories.empty')}</p>
       ) : (
         <div className={styles.carousels}>
           {groups.map((group) => (
@@ -225,9 +226,7 @@ export function WebsiteSpecialCategoriesPage() {
               onAddItems={() => setPickItemsTarget(group)}
               onEditGroup={() => setEditGroupTarget(group)}
               onDeleteGroup={() => setDeleteGroupTarget(group)}
-              addTooltip={`Add categories to ${group.title}`}
-              editTooltip="Edit group"
-              deleteTooltip="Delete group"
+              addTooltip={t('website.specialCategories.addTooltip', { title: group.title })}
               renderItem={(item) => (
                 <WebsiteGroupItemCard
                   title={item.name}
@@ -240,7 +239,6 @@ export function WebsiteSpecialCategoriesPage() {
                       categoryName: item.name,
                     })
                   }
-                  removeTooltip="Remove from group"
                 />
               )}
             />
@@ -253,7 +251,7 @@ export function WebsiteSpecialCategoriesPage() {
           type="button"
           className={fabStyles.addFab}
           onClick={() => setCreateOpen(true)}
-          aria-label="Add special category group"
+          aria-label={t('website.specialCategories.addFab')}
         >
           <Plus size={24} />
         </button>
@@ -263,7 +261,8 @@ export function WebsiteSpecialCategoriesPage() {
         open={createOpen}
         onClose={() => !isSaving && setCreateOpen(false)}
         onSubmit={handleCreateGroup}
-        title="Add Special Category Group"
+        title={t('website.specialCategories.createTitle')}
+        submitLabel={t('website.create')}
         isSubmitting={isSaving}
       />
 
@@ -271,9 +270,10 @@ export function WebsiteSpecialCategoriesPage() {
         open={!!editGroupTarget}
         onClose={() => !isSaving && setEditGroupTarget(null)}
         onSubmit={handleEditGroup}
+        initialKey={editGroupTarget?.key ?? ''}
         initialTitle={editGroupTarget?.title ?? ''}
-        title="Edit Special Category Group"
-        submitLabel="Save"
+        title={t('website.specialCategories.editTitle')}
+        submitLabel={t('website.save')}
         isSubmitting={isSaving}
       />
 
@@ -288,10 +288,10 @@ export function WebsiteSpecialCategoriesPage() {
 
       <ConfirmDeleteModal
         open={!!deleteGroupTarget}
-        title="Delete Special Category Group"
+        title={t('website.specialCategories.deleteTitle')}
         message={
           deleteGroupTarget
-            ? `Delete "${deleteGroupTarget.title}"? Product categories will remain in your catalog.`
+            ? t('website.specialCategories.deleteMessage', { title: deleteGroupTarget.title })
             : ''
         }
         onConfirm={() => void confirmDeleteGroup()}
@@ -300,10 +300,13 @@ export function WebsiteSpecialCategoriesPage() {
 
       <ConfirmDeleteModal
         open={!!removeTarget}
-        title="Remove from Group"
+        title={t('website.removeFromGroupTitle')}
         message={
           removeTarget
-            ? `Remove "${removeTarget.categoryName}" from "${removeTarget.group.title}"?`
+            ? t('website.removeFromGroupMessage', {
+                name: removeTarget.categoryName,
+                group: removeTarget.group.title,
+              })
             : ''
         }
         onConfirm={() => void confirmRemoveFromGroup()}
diff --git a/apps/business/src/pages/WebsiteSubscriptionsPage.tsx b/apps/business/src/pages/WebsiteSubscriptionsPage.tsx
index 42efd98..cea00fa 100644
--- a/apps/business/src/pages/WebsiteSubscriptionsPage.tsx
+++ b/apps/business/src/pages/WebsiteSubscriptionsPage.tsx
@@ -1,23 +1,22 @@
 import { WebsiteSectionShell } from '../components/WebsiteSectionShell'
+import { useT } from '../i18n/useT'
 import styles from './WebsitePage.module.css'
 
 export function WebsiteSubscriptionsPage() {
+  const t = useT()
+
   return (
     <WebsiteSectionShell
       sectionLabel="Subscriptions"
-      title="Subscriptions"
-      subtitle="Manage newsletter and subscription sign-ups on your website."
+      title={t('title.subscriptions')}
+      subtitle={t('website.subscriptions.subtitle')}
     >
-      <p className={styles.placeholderLead}>
-        Control how visitors subscribe to updates from your business.
-      </p>
-      <p className={styles.placeholderNote}>
-        Subscription management will be connected here. Planned options include:
-      </p>
+      <p className={styles.placeholderLead}>{t('website.subscriptions.lead')}</p>
+      <p className={styles.placeholderNote}>{t('website.subscriptions.note')}</p>
       <ul className={styles.featureList}>
-        <li>Enable or disable subscription forms</li>
-        <li>Custom welcome message and consent text</li>
-        <li>Export or view subscriber list</li>
+        <li>{t('website.subscriptions.feature.enable')}</li>
+        <li>{t('website.subscriptions.feature.welcome')}</li>
+        <li>{t('website.subscriptions.feature.export')}</li>
       </ul>
     </WebsiteSectionShell>
   )
diff --git a/apps/business/src/services/blogService.ts b/apps/business/src/services/blogService.ts
index f7a44cb..158cd4a 100644
--- a/apps/business/src/services/blogService.ts
+++ b/apps/business/src/services/blogService.ts
@@ -111,22 +111,28 @@ export function formatBlogAuthor(author: BlogAuthor | null): string {
   return name || author.email || 'Unknown author'
 }
 
-export function formatBlogDate(value: string | null): string {
+export function formatBlogDate(
+  value: string | null,
+  locale: 'en' | 'fa' = 'en',
+): string {
   if (!value) return '—'
   const date = new Date(value)
   if (Number.isNaN(date.getTime())) return value
-  return date.toLocaleDateString('en-US', {
+  return date.toLocaleDateString(locale === 'fa' ? 'fa-IR' : 'en-US', {
     year: 'numeric',
     month: 'long',
     day: 'numeric',
   })
 }
 
-export function formatBlogCardDate(value: string | null): string {
-  if (!value) return 'Not published'
+export function formatBlogCardDate(
+  value: string | null,
+  locale: 'en' | 'fa' = 'en',
+): string {
+  if (!value) return locale === 'fa' ? 'منتشر نشده' : 'Not published'
   const date = new Date(value)
   if (Number.isNaN(date.getTime())) return value
-  return date.toLocaleDateString('en-US', {
+  return date.toLocaleDateString(locale === 'fa' ? 'fa-IR' : 'en-US', {
     year: 'numeric',
     month: 'short',
     day: 'numeric',
diff --git a/apps/business/src/services/expertReviewService.ts b/apps/business/src/services/expertReviewService.ts
index af4fe27..291d31a 100644
--- a/apps/business/src/services/expertReviewService.ts
+++ b/apps/business/src/services/expertReviewService.ts
@@ -50,8 +50,8 @@ export function mapExpertReviewApiToUi(review: ExpertReviewApi): ProductExpertRe
   }
 }
 
-export function formatReviewDate(iso: string): string {
-  return new Date(iso).toLocaleDateString('en-US', {
+export function formatReviewDate(iso: string, locale: 'en' | 'fa' = 'en'): string {
+  return new Date(iso).toLocaleDateString(locale === 'fa' ? 'fa-IR' : 'en-US', {
     year: 'numeric',
     month: 'short',
     day: 'numeric',
diff --git a/apps/business/src/services/portfolioService.ts b/apps/business/src/services/portfolioService.ts
index a505d02..aeed02e 100644
--- a/apps/business/src/services/portfolioService.ts
+++ b/apps/business/src/services/portfolioService.ts
@@ -113,22 +113,28 @@ export function mapPortfolioApiToUi(portfolio: PortfolioApi): Portfolio {
   }
 }
 
-export function formatPortfolioCardDate(value: string | null): string {
-  if (!value) return 'Not published'
+export function formatPortfolioCardDate(
+  value: string | null,
+  locale: 'en' | 'fa' = 'en',
+): string {
+  if (!value) return locale === 'fa' ? 'منتشر نشده' : 'Not published'
   const date = new Date(value)
   if (Number.isNaN(date.getTime())) return value
-  return date.toLocaleDateString('en-US', {
+  return date.toLocaleDateString(locale === 'fa' ? 'fa-IR' : 'en-US', {
     year: 'numeric',
     month: 'short',
     day: 'numeric',
   })
 }
 
-export function formatPortfolioDate(value: string | null): string {
+export function formatPortfolioDate(
+  value: string | null,
+  locale: 'en' | 'fa' = 'en',
+): string {
   if (!value) return '—'
   const date = new Date(value)
   if (Number.isNaN(date.getTime())) return value
-  return date.toLocaleDateString('en-US', {
+  return date.toLocaleDateString(locale === 'fa' ? 'fa-IR' : 'en-US', {
     year: 'numeric',
     month: 'long',
     day: 'numeric',
diff --git a/apps/business/src/services/productService.ts b/apps/business/src/services/productService.ts
index da8109a..c17eb40 100644
--- a/apps/business/src/services/productService.ts
+++ b/apps/business/src/services/productService.ts
@@ -15,6 +15,7 @@ export interface ProductApi {
   status: 'draft' | 'published' | 'archived'
   categoryId: string | null
   categoryName: string
+  categoryNameFa?: string
   brandId: string | null
   brand: {
     id: string
@@ -84,6 +85,7 @@ export function mapProductApiToUi(product: ProductApi): Product {
     nameFa: product.nameFa,
     categoryId: product.categoryId ?? '',
     category: product.categoryName,
+    categoryFa: product.categoryNameFa || '',
     summary: product.summary,
     description: product.descriptionHtml,
     image: product.image || product.thumbnail || '',
diff --git a/apps/business/src/services/storeSpecialService.ts b/apps/business/src/services/storeSpecialService.ts
index caadd17..b3440d4 100644
--- a/apps/business/src/services/storeSpecialService.ts
+++ b/apps/business/src/services/storeSpecialService.ts
@@ -10,6 +10,7 @@ export interface StoreSpecialsListResponse {
 }
 
 export interface CreateStoreSpecialPayload {
+  key: string
   title: string
   storeItemIds?: string[]
   sortOrder?: number
@@ -17,6 +18,7 @@ export interface CreateStoreSpecialPayload {
 }
 
 export interface UpdateStoreSpecialPayload {
+  key?: string
   title?: string
   storeItemIds?: string[]
   sortOrder?: number
diff --git a/apps/business/src/types/product.ts b/apps/business/src/types/product.ts
index d9f0993..ce5fc80 100644
--- a/apps/business/src/types/product.ts
+++ b/apps/business/src/types/product.ts
@@ -4,6 +4,7 @@ export interface Product {
   nameFa: string
   categoryId: string
   category: string
+  categoryFa?: string
   summary: string
   description: string
   image: string
diff --git a/apps/business/src/types/storeSpecial.ts b/apps/business/src/types/storeSpecial.ts
index d91bb2c..2e3847b 100644
--- a/apps/business/src/types/storeSpecial.ts
+++ b/apps/business/src/types/storeSpecial.ts
@@ -25,6 +25,7 @@ export interface StoreSpecialStoreItem {
 
 export interface StoreSpecial {
   id: string
+  key: string
   title: string
   sortOrder: number
   isActive: boolean
diff --git a/apps/business/src/types/websiteBrandGroup.ts b/apps/business/src/types/websiteBrandGroup.ts
index acefb20..44113f1 100644
--- a/apps/business/src/types/websiteBrandGroup.ts
+++ b/apps/business/src/types/websiteBrandGroup.ts
@@ -11,6 +11,7 @@ export interface WebsiteBrandGroupItem {
 
 export interface WebsiteBrandGroup {
   id: string
+  key: string
   title: string
   sortOrder: number
   isActive: boolean
@@ -27,6 +28,7 @@ export interface WebsiteBrandGroupsListResponse {
 }
 
 export interface CreateWebsiteBrandGroupPayload {
+  key: string
   title: string
   brandIds?: string[]
   sortOrder?: number
@@ -34,6 +36,7 @@ export interface CreateWebsiteBrandGroupPayload {
 }
 
 export interface UpdateWebsiteBrandGroupPayload {
+  key?: string
   title?: string
   brandIds?: string[]
   sortOrder?: number
diff --git a/apps/business/src/types/websiteCategoryGroup.ts b/apps/business/src/types/websiteCategoryGroup.ts
index 08f8dcc..fe74923 100644
--- a/apps/business/src/types/websiteCategoryGroup.ts
+++ b/apps/business/src/types/websiteCategoryGroup.ts
@@ -9,6 +9,7 @@ export interface WebsiteCategoryGroupItem {
 
 export interface WebsiteCategoryGroup {
   id: string
+  key: string
   title: string
   sortOrder: number
   isActive: boolean
@@ -25,6 +26,7 @@ export interface WebsiteCategoryGroupsListResponse {
 }
 
 export interface CreateWebsiteCategoryGroupPayload {
+  key: string
   title: string
   categoryIds?: string[]
   sortOrder?: number
@@ -32,6 +34,7 @@ export interface CreateWebsiteCategoryGroupPayload {
 }
 
 export interface UpdateWebsiteCategoryGroupPayload {
+  key?: string
   title?: string
   categoryIds?: string[]
   sortOrder?: number
diff --git a/apps/business/src/utils/storeProductGroups.ts b/apps/business/src/utils/storeProductGroups.ts
index 9894b28..5a537df 100644
--- a/apps/business/src/utils/storeProductGroups.ts
+++ b/apps/business/src/utils/storeProductGroups.ts
@@ -93,6 +93,9 @@ export function groupStoreItemsByProduct(items: StoreItem[]): StoreProductListin
     )
 }
 
-export function formatVariantCount(count: number): string {
+export function formatVariantCount(count: number, locale: 'en' | 'fa' = 'en'): string {
+  if (locale === 'fa') {
+    return count === 1 ? '۱ تنوع' : `${count} تنوع`
+  }
   return count === 1 ? '1 variant' : `${count} variants`
 }
diff --git a/apps/super-admin/src/pages/WebsitesPage.tsx b/apps/super-admin/src/pages/WebsitesPage.tsx
index fd70cba..cb31ddc 100644
--- a/apps/super-admin/src/pages/WebsitesPage.tsx
+++ b/apps/super-admin/src/pages/WebsitesPage.tsx
@@ -5,6 +5,7 @@ import {
   Loader2,
   Lock,
   Pencil,
+  RefreshCw,
   Rocket,
   RotateCcw,
   Search,
@@ -23,6 +24,7 @@ import {
   removeDomain,
   setDomainActive,
   setDomainSsl,
+  syncSsl,
   updateDomain,
 } from '../services/domainService'
 import { useToast } from '../context/ToastContext'
@@ -102,6 +104,7 @@ export function WebsitesPage() {
   const [togglingActiveId, setTogglingActiveId] = useState<number | null>(null)
   const [togglingSslId, setTogglingSslId] = useState<number | null>(null)
   const [deployingId, setDeployingId] = useState<DomainListItem['id'] | null>(null)
+  const [syncingSsl, setSyncingSsl] = useState(false)
 
   useEffect(() => {
     const controller = new AbortController()
@@ -260,6 +263,27 @@ export function WebsitesPage() {
     }
   }
 
+  async function handleSyncSsl() {
+    if (syncingSsl) return
+
+    flushSync(() => {
+      setSyncingSsl(true)
+    })
+    setError('')
+    showToast('Starting SSL sync…', 'info')
+
+    try {
+      const result = await syncSsl()
+      showToast(result.message || 'SSL sync started.', 'success')
+    } catch (err) {
+      const message = err instanceof ApiError ? err.message : 'Unable to start SSL sync.'
+      setError(message)
+      showToast(message, 'error')
+    } finally {
+      setSyncingSsl(false)
+    }
+  }
+
   async function handleDeploy(domain: DomainListItem) {
     if (!domain.deploySlug) return
     if (deployingId != null) return
@@ -342,6 +366,22 @@ export function WebsitesPage() {
             Monitor and manage all domains across the platform.
           </p>
         </div>
+        <button
+          type="button"
+          className={`${tableStyles.btn} ${tableStyles.btnPrimary} ${
+            syncingSsl ? styles.deployBusy : ''
+          }`}
+          onClick={() => void handleSyncSsl()}
+          disabled={syncingSsl}
+          aria-busy={syncingSsl}
+        >
+          {syncingSsl ? (
+            <Loader2 size={16} className={styles.spin} aria-hidden />
+          ) : (
+            <RefreshCw size={16} aria-hidden />
+          )}
+          {syncingSsl ? 'Syncing SSL…' : 'Sync SSL now'}
+        </button>
       </div>
 
       <div className={tableStyles.filtersPanel}>
diff --git a/apps/super-admin/src/services/domainService.ts b/apps/super-admin/src/services/domainService.ts
index ac2e0f1..2e82e59 100644
--- a/apps/super-admin/src/services/domainService.ts
+++ b/apps/super-admin/src/services/domainService.ts
@@ -1,5 +1,5 @@
 import { apiRequest } from '../lib/api'
-import type { DeployDomainResponse, DomainsListResponse } from '../types/domain'
+import type { DeployDomainResponse, DomainsListResponse, SyncSslResponse } from '../types/domain'
 
 export interface ListDomainsParams {
   page?: number
@@ -60,3 +60,10 @@ export async function deployDomain(domainId: number | string) {
     auth: true,
   })
 }
+
+export async function syncSsl() {
+  return apiRequest<SyncSslResponse>('/domains/ssl-sync', {
+    method: 'POST',
+    auth: true,
+  })
+}
diff --git a/apps/super-admin/src/types/domain.ts b/apps/super-admin/src/types/domain.ts
index e45f863..2f41da1 100644
--- a/apps/super-admin/src/types/domain.ts
+++ b/apps/super-admin/src/types/domain.ts
@@ -30,3 +30,8 @@ export interface DeployDomainResponse {
   lastDeployedAt: string | null
   lastDeployStatus: DomainDeployStatus | null
 }
+
+export interface SyncSslResponse {
+  status: 'accepted'
+  message: string
+}
diff --git a/deploy/meshkee-ssl-sync-agent.service b/deploy/meshkee-ssl-sync-agent.service
new file mode 100644
index 0000000..30f2696
--- /dev/null
+++ b/deploy/meshkee-ssl-sync-agent.service
@@ -0,0 +1,14 @@
+[Unit]
+Description=Meshkee dashboards SSL sync agent
+After=network.target
+
+[Service]
+Type=simple
+EnvironmentFile=/etc/meshkee/ssl-sync-agent.env
+ExecStart=/usr/bin/node /opt/meshkee/dashboards/deploy/ssl-sync-agent.mjs
+Restart=on-failure
+RestartSec=3
+User=root
+
+[Install]
+WantedBy=multi-user.target
diff --git a/deploy/ssl-sync-agent.mjs b/deploy/ssl-sync-agent.mjs
new file mode 100644
index 0000000..277b4e2
--- /dev/null
+++ b/deploy/ssl-sync-agent.mjs
@@ -0,0 +1,93 @@
+#!/usr/bin/env node
+/**
+ * Tiny HTTP agent on the dashboards VPS.
+ * Super Admin → Nest API → POST here → runs ssl-sync.sh in the background.
+ *
+ * Env (/etc/meshkee/ssl-sync-agent.env):
+ *   SSL_SYNC_AGENT_TOKEN=...
+ *   SSL_SYNC_SCRIPT=/opt/meshkee/dashboards/deploy/ssl-sync.sh
+ *   PORT=9051
+ *   BIND=0.0.0.0
+ */
+import { createServer } from 'node:http'
+import { spawn } from 'node:child_process'
+import { accessSync, constants } from 'node:fs'
+
+const TOKEN = (process.env.SSL_SYNC_AGENT_TOKEN || '').trim()
+const SCRIPT =
+  (process.env.SSL_SYNC_SCRIPT || '/opt/meshkee/dashboards/deploy/ssl-sync.sh').trim()
+const PORT = Number(process.env.PORT || 9051)
+const BIND = (process.env.BIND || '0.0.0.0').trim()
+
+if (!TOKEN) {
+  console.error('SSL_SYNC_AGENT_TOKEN is required')
+  process.exit(1)
+}
+
+try {
+  accessSync(SCRIPT, constants.X_OK)
+} catch {
+  console.error(`SSL sync script missing or not executable: ${SCRIPT}`)
+  process.exit(1)
+}
+
+let running = false
+
+function json(res, status, body) {
+  const payload = JSON.stringify(body)
+  res.writeHead(status, {
+    'Content-Type': 'application/json',
+    'Content-Length': Buffer.byteLength(payload),
+  })
+  res.end(payload)
+}
+
+function startSync() {
+  running = true
+  const child = spawn(SCRIPT, [], {
+    detached: true,
+    stdio: 'ignore',
+    env: process.env,
+  })
+  child.on('error', (err) => {
+    console.error(`${new Date().toISOString()} spawn error:`, err.message)
+    running = false
+  })
+  child.on('exit', (code, signal) => {
+    console.log(
+      `${new Date().toISOString()} ssl-sync finished code=${code} signal=${signal ?? ''}`,
+    )
+    running = false
+  })
+  child.unref()
+}
+
+const server = createServer((req, res) => {
+  if (req.method === 'GET' && req.url === '/health') {
+    return json(res, 200, { ok: true, running })
+  }
+
+  if (req.method !== 'POST' || req.url !== '/ssl-sync') {
+    return json(res, 404, { error: 'not found' })
+  }
+
+  const provided = String(req.headers['x-ssl-sync-agent-token'] ?? '').trim()
+  if (!provided || provided !== TOKEN) {
+    return json(res, 401, { error: 'unauthorized' })
+  }
+
+  if (running) {
+    return json(res, 409, { error: 'ssl sync already running' })
+  }
+
+  startSync()
+  console.log(`${new Date().toISOString()} ssl-sync accepted`)
+  return json(res, 202, {
+    status: 'accepted',
+    message: 'SSL sync started',
+  })
+})
+
+server.listen(PORT, BIND, () => {
+  console.log(`ssl-sync-agent listening on ${BIND}:${PORT}`)
+})
diff --git a/deploy/ssl-sync.sh b/deploy/ssl-sync.sh
index 71552f6..d58bda2 100644
--- a/deploy/ssl-sync.sh
+++ b/deploy/ssl-sync.sh
@@ -1,6 +1,6 @@
 #!/usr/bin/env bash
 # Sync Let's Encrypt cert SANs with dashboard hosts from the API.
-# Cron: 0 */2 * * * /opt/meshkee/dashboards/scripts/ssl-sync.sh >> /var/log/meshkee-ssl-sync.log 2>&1
+# Cron: 0 */2 * * * /opt/meshkee/dashboards/deploy/ssl-sync.sh >> /var/log/meshkee-ssl-sync.log 2>&1
 set -euo pipefail
 
 CONF=/etc/meshkee/ssl-sync.env
diff --git a/docs/DEPLOY.md b/docs/DEPLOY.md
index 89149dd..ffc2376 100644
--- a/docs/DEPLOY.md
+++ b/docs/DEPLOY.md
@@ -15,10 +15,48 @@ API: `https://api.meshkee.com/api/v1` (separate server).
 
 1. Add business + domain in Super Admin (apex, e.g. `sanihome.ir`)
 2. Add Arvan **A** records (DNS-only): `business` + `customer` → dashboards VPS IP
-3. Within ~2 hours, `/opt/meshkee/dashboards/scripts/ssl-sync.sh` expands the cert via  
-   `GET https://api.meshkee.com/api/v1/internal/ssl/hosts` (`X-SSL-Sync-Token`)
+3. In Super Admin → **Websites** → **Sync SSL now** (or wait for cron ~2h)
 
-Manual: `sudo /opt/meshkee/dashboards/scripts/ssl-sync.sh`
+Manual on the VPS: `sudo /opt/meshkee/dashboards/deploy/ssl-sync.sh`
+
+Cron (root):
+
+```
+0 */2 * * * /opt/meshkee/dashboards/deploy/ssl-sync.sh >> /var/log/meshkee-ssl-sync.log 2>&1
+```
+
+### SSL sync agent (on-demand from Super Admin)
+
+Small Node agent on the dashboards VPS; Nest calls it after the button is clicked.
+
+1. Files under `/opt/meshkee/dashboards/deploy/`: `ssl-sync.sh`, `ssl-sync-agent.mjs`, `meshkee-ssl-sync-agent.service`
+2. Make the script executable: `chmod +x /opt/meshkee/dashboards/deploy/ssl-sync.sh`
+3. Agent env `/etc/meshkee/ssl-sync-agent.env`:
+
+```
+SSL_SYNC_AGENT_TOKEN=<secret>
+SSL_SYNC_SCRIPT=/opt/meshkee/dashboards/deploy/ssl-sync.sh
+PORT=9051
+BIND=0.0.0.0
+```
+
+4. Install + start:
+
+```bash
+cp /opt/meshkee/dashboards/deploy/meshkee-ssl-sync-agent.service /etc/systemd/system/
+systemctl daemon-reload
+systemctl enable --now meshkee-ssl-sync-agent
+ufw allow from 185.164.72.119 to any port 9051 proto tcp comment 'SSL sync agent from API'
+```
+
+5. API `.env`:
+
+```
+SSL_SYNC_AGENT_URL=http://45.149.76.52:9051/ssl-sync
+SSL_SYNC_AGENT_TOKEN=<same secret>
+```
+
+Endpoint used by the UI: `POST /api/v1/domains/ssl-sync` (super-admin JWT).
 
 ## Redeploy frontends
 
diff --git a/docs/PROJECT_CONTEXT.md b/docs/PROJECT_CONTEXT.md
index f71e373..03f00e2 100644
--- a/docs/PROJECT_CONTEXT.md
+++ b/docs/PROJECT_CONTEXT.md
@@ -492,7 +492,7 @@ Migration: `database/migrations/033_business_favicon.sql`
 | API | `https://api.meshkee.com/api/v1` (host `185.164.72.119`) |
 | Docs | `docs/DEPLOY.md` |
 
-SSL: Certbot cert `meshkee-dashboards` + cron `ssl-sync.sh` every 2h (option A: `GET /api/v1/internal/ssl/hosts`).
+SSL: Certbot cert `meshkee-dashboards` + cron `ssl-sync.sh` every 2h + Super Admin **Sync SSL now** (`POST /domains/ssl-sync` → dashboards agent).
 
 ---
 
diff --git a/packages/dashboard-ui/src/components/Pagination.module.css b/packages/dashboard-ui/src/components/Pagination.module.css
index c48c905..ebde6eb 100644
--- a/packages/dashboard-ui/src/components/Pagination.module.css
+++ b/packages/dashboard-ui/src/components/Pagination.module.css
@@ -16,9 +16,12 @@
 .navBtn {
   width: 38px;
   height: 38px;
-  display: flex;
+  box-sizing: border-box;
+  display: inline-flex;
   align-items: center;
   justify-content: center;
+  padding: 0;
+  line-height: 0;
   border-radius: var(--radius-sm);
   color: var(--text-secondary);
   background: var(--glass-bg);
@@ -26,6 +29,11 @@
   transition: background 0.2s, color 0.2s, opacity 0.2s;
 }
 
+.navBtn svg {
+  display: block;
+  flex-shrink: 0;
+}
+
 .navBtn:hover:not(:disabled) {
   background: rgba(var(--primary-rgb) / 0.1);
   color: var(--primary);
@@ -45,9 +53,15 @@
 .pageBtn {
   min-width: 38px;
   height: 38px;
-  padding: 0 10px;
+  box-sizing: border-box;
+  padding: 0;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  line-height: 1;
   font-size: 14px;
   font-weight: 500;
+  font-family: var(--font-ui, inherit);
   color: var(--text-secondary);
   background: var(--glass-bg);
   border: 1px solid var(--glass-border);
diff --git a/packages/dashboard-ui/src/components/Pagination.tsx b/packages/dashboard-ui/src/components/Pagination.tsx
index 86f01b6..5a35bb7 100644
--- a/packages/dashboard-ui/src/components/Pagination.tsx
+++ b/packages/dashboard-ui/src/components/Pagination.tsx
@@ -1,4 +1,6 @@
+import { useContext } from 'react'
 import { ChevronLeft, ChevronRight, ChevronsLeft, ChevronsRight } from 'lucide-react'
+import { LocaleContext } from '../context/LocaleContext'
 import styles from './Pagination.module.css'
 
 export interface PaginationProps {
@@ -38,6 +40,12 @@ export function Pagination({
   variant = 'default',
   className,
 }: PaginationProps) {
+  const locale = useContext(LocaleContext)
+  const dir =
+    locale?.dir ??
+    (typeof document !== 'undefined' && document.documentElement.dir === 'rtl' ? 'rtl' : 'ltr')
+  const isRtl = dir === 'rtl'
+
   if (totalPages <= 1) return null
 
   const pages = buildPageWindow(currentPage, totalPages, siblingCount)
@@ -49,8 +57,13 @@ export function Pagination({
     .filter(Boolean)
     .join(' ')
 
+  const FirstIcon = isRtl ? ChevronsRight : ChevronsLeft
+  const PrevIcon = isRtl ? ChevronRight : ChevronLeft
+  const NextIcon = isRtl ? ChevronLeft : ChevronRight
+  const LastIcon = isRtl ? ChevronsLeft : ChevronsRight
+
   return (
-    <nav className={rootClass} aria-label={ariaLabel}>
+    <nav className={rootClass} aria-label={ariaLabel} dir={dir}>
       <button
         type="button"
         className={styles.navBtn}
@@ -58,7 +71,7 @@ export function Pagination({
         disabled={disabled || currentPage === 1}
         aria-label="First page"
       >
-        <ChevronsLeft size={18} />
+        <FirstIcon size={18} />
       </button>
 
       <button
@@ -68,7 +81,7 @@ export function Pagination({
         disabled={disabled || currentPage === 1}
         aria-label="Previous page"
       >
-        <ChevronLeft size={18} />
+        <PrevIcon size={18} />
       </button>
 
       <div className={styles.pages}>
@@ -94,7 +107,7 @@ export function Pagination({
         disabled={disabled || currentPage === totalPages}
         aria-label="Next page"
       >
-        <ChevronRight size={18} />
+        <NextIcon size={18} />
       </button>
 
       <button
@@ -104,7 +117,7 @@ export function Pagination({
         disabled={disabled || currentPage === totalPages}
         aria-label="Last page"
       >
-        <ChevronsRight size={18} />
+        <LastIcon size={18} />
       </button>
     </nav>
   )
diff --git a/packages/dashboard-ui/src/context/LocaleContext.tsx b/packages/dashboard-ui/src/context/LocaleContext.tsx
index ec9b18a..76b4358 100644
--- a/packages/dashboard-ui/src/context/LocaleContext.tsx
+++ b/packages/dashboard-ui/src/context/LocaleContext.tsx
@@ -24,6 +24,8 @@ interface LocaleContextValue {
 
 const LocaleContext = createContext<LocaleContextValue | null>(null)
 
+export { LocaleContext }
+
 export function LocaleProvider({
   children,
   defaultLocale = 'fa',