feat: email receipts and repair estimates

Backend:
- Server-side HTML email templates (receipt + estimate) with inline CSS
- POST /v1/transactions/:id/email-receipt with per-transaction rate limiting
- POST /v1/repair-tickets/:id/email-estimate with per-ticket rate limiting
- customerEmail field added to receipt and ticket detail responses
- Test email provider for API tests (logs instead of sending)

Frontend:
- POS payment dialog Email button enabled with inline email input
- Pre-fills customer email from linked account
- Repair ticket detail page has Email Estimate button with dialog
- Pre-fills from account email

Tests:
- 12 unit tests for email template renderers
- 8 API tests for email receipt/estimate endpoints and validation

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

packages/admin/src/components/pos/pos-payment-dialog.tsx

@@ -84,6 +84,7 @@ export function POSPaymentDialog({ open, onOpenChange, paymentMethod, transactio
     queryKey: ['pos', 'receipt', result?.id],
     queryFn: () => api.get<{
       transaction: Transaction & { lineItems: { description: string; qty: number; unitPrice: string; taxAmount: string; lineTotal: string; discountAmount: string }[] }
+      customerEmail: string | null
       company: { name: string; phone: string | null; email: string | null; address: { street?: string; city?: string; state?: string; zip?: string } | null }
       location: { name: string; phone: string | null; email: string | null; address: { street?: string; city?: string; state?: string; zip?: string } | null }
     }>(`/v1/transactions/${result!.id}/receipt`),
@@ -91,6 +92,19 @@ export function POSPaymentDialog({ open, onOpenChange, paymentMethod, transactio
   })
 
   const [showReceipt, setShowReceipt] = useState(false)
+  const [emailMode, setEmailMode] = useState(false)
+  const [emailAddress, setEmailAddress] = useState('')
+  const [emailSent, setEmailSent] = useState(false)
+
+  const emailReceiptMutation = useMutation({
+    mutationFn: () => api.post<{ message: string }>(`/v1/transactions/${result!.id}/email-receipt`, { email: emailAddress }),
+    onSuccess: () => {
+      toast.success('Receipt emailed')
+      setEmailMode(false)
+      setEmailSent(true)
+    },
+    onError: (err) => toast.error(err.message),
+  })
 
   if (completed && result) {
     const changeGiven = parseFloat(result.changeGiven ?? '0')
@@ -140,14 +154,47 @@ export function POSPaymentDialog({ open, onOpenChange, paymentMethod, transactio
               )}
             </div>
 
+            {emailMode ? (
+              <div className="w-full space-y-2">
+                <Label className="text-xs text-muted-foreground">Email receipt to:</Label>
+                <div className="flex gap-2">
+                  <Input
+                    type="email"
+                    value={emailAddress}
+                    onChange={(e) => setEmailAddress(e.target.value)}
+                    placeholder="customer@example.com"
+                    className="h-9"
+                    autoFocus
+                  />
+                  <Button
+                    size="sm"
+                    className="h-9 px-4"
+                    onClick={() => emailReceiptMutation.mutate()}
+                    disabled={!emailAddress || emailReceiptMutation.isPending}
+                  >
+                    {emailReceiptMutation.isPending ? 'Sending...' : 'Send'}
+                  </Button>
+                </div>
+                <Button variant="ghost" size="sm" className="text-xs" onClick={() => setEmailMode(false)}>Cancel</Button>
+              </div>
+            ) : (
               <div className="w-full grid grid-cols-2 gap-2">
                 <Button variant="outline" className="h-11 gap-2" onClick={() => setShowReceipt(true)}>
                   <Printer className="h-4 w-4" />Receipt
                 </Button>
-              <Button variant="outline" className="h-11 gap-2" disabled>
+                <Button
-                <Mail className="h-4 w-4" />Email
+                  variant="outline"
+                  className="h-11 gap-2"
+                  onClick={() => {
+                    setEmailAddress(receiptData?.customerEmail ?? '')
+                    setEmailMode(true)
+                  }}
+                  disabled={emailSent}
+                >
+                  <Mail className="h-4 w-4" />{emailSent ? 'Sent' : 'Email'}
                 </Button>
               </div>
+            )}
 
             <Button className="w-full h-12 text-base" onClick={handleDone}>
               New Sale

packages/admin/src/routes/_authenticated/repairs/$ticketId.tsx

@@ -21,7 +21,7 @@ import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
 import { Skeleton } from '@/components/ui/skeleton'
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'
 import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogTrigger } from '@/components/ui/dialog'
-import { ArrowLeft, Plus, Trash2, RotateCcw, Save, Search } from 'lucide-react'
+import { ArrowLeft, Plus, Trash2, RotateCcw, Save, Search, Mail } from 'lucide-react'
 import { PdfModal } from '@/components/repairs/pdf-modal'
 import { toast } from 'sonner'
 import { useAuthStore } from '@/stores/auth.store'
@@ -78,6 +78,17 @@ function RepairTicketDetailPage() {
   const { data: lineItemsData, isLoading: itemsLoading } = useQuery(repairLineItemListOptions(ticketId, params))
 
   const [editFields, setEditFields] = useState<Record<string, string>>({})
+  const [emailEstimateOpen, setEmailEstimateOpen] = useState(false)
+  const [estimateEmail, setEstimateEmail] = useState('')
+
+  const emailEstimateMutation = useMutation({
+    mutationFn: () => api.post<{ message: string }>(`/v1/repair-tickets/${ticketId}/email-estimate`, { email: estimateEmail }),
+    onSuccess: () => {
+      toast.success('Estimate emailed')
+      setEmailEstimateOpen(false)
+    },
+    onError: (err) => toast.error(err.message),
+  })
 
   const statusMutation = useMutation({
     mutationFn: (status: string) => repairTicketMutations.updateStatus(ticketId, status),
@@ -188,6 +199,37 @@ function RepairTicketDetailPage() {
           <h1 className="text-2xl font-bold">Ticket #{ticket.ticketNumber}</h1>
           <p className="text-sm text-muted-foreground">{ticket.customerName} — {ticket.itemDescription ?? 'No item description'}</p>
         </div>
+        <Dialog open={emailEstimateOpen} onOpenChange={setEmailEstimateOpen}>
+          <DialogTrigger asChild>
+            <Button variant="outline" size="sm" className="gap-2" onClick={() => setEstimateEmail((ticket as any).customerEmail ?? '')}>
+              <Mail className="h-4 w-4" />Email Estimate
+            </Button>
+          </DialogTrigger>
+          <DialogContent className="max-w-sm">
+            <DialogHeader>
+              <DialogTitle>Email Estimate</DialogTitle>
+            </DialogHeader>
+            <div className="space-y-4">
+              <div className="space-y-2">
+                <Label>Send to</Label>
+                <Input
+                  type="email"
+                  value={estimateEmail}
+                  onChange={(e) => setEstimateEmail(e.target.value)}
+                  placeholder="customer@example.com"
+                  autoFocus
+                />
+              </div>
+              <Button
+                className="w-full"
+                onClick={() => emailEstimateMutation.mutate()}
+                disabled={!estimateEmail || emailEstimateMutation.isPending}
+              >
+                {emailEstimateMutation.isPending ? 'Sending...' : 'Send Estimate'}
+              </Button>
+            </div>
+          </DialogContent>
+        </Dialog>
         <PdfModal ticket={ticket} lineItems={lineItemsData?.data ?? []} ticketId={ticketId} />
       </div>
 

packages/backend/__tests__/utils/email-templates.test.ts

@@ -0,0 +1,144 @@
+import { describe, it, expect } from 'bun:test'
+import {
+  renderReceiptEmailHtml,
+  renderReceiptEmailText,
+  renderEstimateEmailHtml,
+  renderEstimateEmailText,
+} from '../../src/utils/email-templates.js'
+
+const mockReceipt = {
+  transaction: {
+    transactionNumber: 'TXN-20260405-001',
+    subtotal: '100.00',
+    discountTotal: '10.00',
+    taxTotal: '7.43',
+    total: '97.43',
+    paymentMethod: 'cash',
+    amountTendered: '100.00',
+    changeGiven: '2.57',
+    roundingAdjustment: null,
+    completedAt: '2026-04-05T12:00:00Z',
+    lineItems: [
+      { description: 'Guitar Strings', qty: 2, unitPrice: '12.99', taxAmount: '2.14', lineTotal: '25.98', discountAmount: null },
+      { description: 'Tuner', qty: 1, unitPrice: '74.02', taxAmount: '5.29', lineTotal: '74.02', discountAmount: null },
+    ],
+  },
+  company: { name: 'Test Store', phone: '555-1234', email: 'store@test.com', address: { street: '123 Main St', city: 'Austin', state: 'TX', zip: '78701' } },
+  location: null,
+}
+
+const mockTicket = {
+  ticketNumber: 'RPR-001',
+  customerName: 'Jane Doe',
+  customerPhone: '555-5678',
+  itemDescription: 'Acoustic Guitar',
+  serialNumber: 'AG-12345',
+  problemDescription: 'Cracked neck joint',
+  estimatedCost: '250.00',
+  promisedDate: '2026-04-12',
+  status: 'pending_approval',
+}
+
+const mockLineItems = [
+  { itemType: 'labor', description: 'Neck repair', qty: 1, unitPrice: '150.00', totalPrice: '150.00' },
+  { itemType: 'part', description: 'Wood glue & clamps', qty: 1, unitPrice: '25.00', totalPrice: '25.00' },
+  { itemType: 'flat_rate', description: 'Setup & restring', qty: 1, unitPrice: '75.00', totalPrice: '75.00' },
+]
+
+const mockCompany = { name: 'Test Store', phone: '555-1234', email: 'store@test.com', address: null }
+
+describe('renderReceiptEmailHtml', () => {
+  it('renders HTML with transaction details', () => {
+    const html = renderReceiptEmailHtml(mockReceipt as any)
+    expect(html).toContain('TXN-20260405-001')
+    expect(html).toContain('Test Store')
+    expect(html).toContain('Guitar Strings')
+    expect(html).toContain('Tuner')
+    expect(html).toContain('$97.43')
+    expect(html).toContain('$100.00')
+    expect(html).toContain('Powered by LunarFront')
+  })
+
+  it('includes discount when present', () => {
+    const html = renderReceiptEmailHtml(mockReceipt as any)
+    expect(html).toContain('Discount')
+    expect(html).toContain('$10.00')
+  })
+
+  it('includes payment details for cash', () => {
+    const html = renderReceiptEmailHtml(mockReceipt as any)
+    expect(html).toContain('Cash')
+    expect(html).toContain('$2.57')
+  })
+
+  it('includes receipt config when provided', () => {
+    const config = { receipt_footer: 'Thank you!', receipt_return_policy: '30-day returns' }
+    const html = renderReceiptEmailHtml(mockReceipt as any, config)
+    expect(html).toContain('Thank you!')
+    expect(html).toContain('30-day returns')
+  })
+
+  it('includes company address', () => {
+    const html = renderReceiptEmailHtml(mockReceipt as any)
+    expect(html).toContain('123 Main St')
+    expect(html).toContain('Austin')
+  })
+})
+
+describe('renderReceiptEmailText', () => {
+  it('renders plain text with transaction details', () => {
+    const text = renderReceiptEmailText(mockReceipt as any)
+    expect(text).toContain('TXN-20260405-001')
+    expect(text).toContain('Guitar Strings')
+    expect(text).toContain('Total: $97.43')
+    expect(text).toContain('Cash')
+  })
+})
+
+describe('renderEstimateEmailHtml', () => {
+  it('renders HTML with ticket details', () => {
+    const html = renderEstimateEmailHtml(mockTicket as any, mockLineItems as any, mockCompany as any)
+    expect(html).toContain('RPR-001')
+    expect(html).toContain('Jane Doe')
+    expect(html).toContain('Acoustic Guitar')
+    expect(html).toContain('AG-12345')
+    expect(html).toContain('Cracked neck joint')
+    expect(html).toContain('$250.00')
+    expect(html).toContain('Powered by LunarFront')
+  })
+
+  it('renders line items with types', () => {
+    const html = renderEstimateEmailHtml(mockTicket as any, mockLineItems as any, mockCompany as any)
+    expect(html).toContain('Labor')
+    expect(html).toContain('Neck repair')
+    expect(html).toContain('Part')
+    expect(html).toContain('Flat Rate')
+    expect(html).toContain('Setup & restring')
+  })
+
+  it('includes promised date', () => {
+    const html = renderEstimateEmailHtml(mockTicket as any, mockLineItems as any, mockCompany as any)
+    expect(html).toContain('Estimated completion')
+    expect(html).toContain('Apr')
+  })
+
+  it('renders without line items using estimatedCost', () => {
+    const html = renderEstimateEmailHtml(mockTicket as any, [], mockCompany as any)
+    expect(html).toContain('$250.00')
+  })
+
+  it('includes company phone', () => {
+    const html = renderEstimateEmailHtml(mockTicket as any, mockLineItems as any, mockCompany as any)
+    expect(html).toContain('555-1234')
+  })
+})
+
+describe('renderEstimateEmailText', () => {
+  it('renders plain text with ticket details', () => {
+    const text = renderEstimateEmailText(mockTicket as any, mockLineItems as any, mockCompany as any)
+    expect(text).toContain('RPR-001')
+    expect(text).toContain('Jane Doe')
+    expect(text).toContain('Neck repair')
+    expect(text).toContain('$250.00')
+  })
+})

packages/backend/api-tests/run.ts

@@ -114,6 +114,10 @@ async function setupDatabase() {
     await testSql`INSERT INTO module_config (slug, name, description, licensed, enabled) VALUES (${m.slug}, ${m.name}, ${m.description}, true, ${m.enabled}) ON CONFLICT (slug) DO NOTHING`
   }
 
+  // Seed test email provider so email endpoints work without real provider
+  await testSql`INSERT INTO app_settings (key, value, is_encrypted) VALUES ('email.provider', 'test', false) ON CONFLICT (key) DO NOTHING`
+  await testSql`INSERT INTO app_settings (key, value, is_encrypted) VALUES ('email.from_address', 'Test Store <noreply@test.com>', false) ON CONFLICT (key) DO NOTHING`
+
   await testSql.end()
   console.log('  Database ready')
 }

packages/backend/api-tests/suites/pos.ts

@@ -1051,4 +1051,48 @@ suite('POS', { tags: ['pos'] }, (t) => {
     // Cleanup
     await t.api.post(`/v1/drawer/${drawer.data.id}/close`, { closingBalance: 100 })
   })
+
+  // ─── Email Receipt ──────────────────────────────────────────────────────────
+
+  t.test('emails a receipt for a completed transaction', { tags: ['transactions', 'email'] }, async () => {
+    // Create and complete a transaction
+    const txn = await t.api.post('/v1/transactions', { transactionType: 'sale', locationId: LOCATION_ID })
+    await t.api.post(`/v1/transactions/${txn.data.id}/line-items`, { description: 'Email Test Item', qty: 1, unitPrice: 25 })
+    await t.api.post(`/v1/transactions/${txn.data.id}/complete`, { paymentMethod: 'card_present' })
+
+    const res = await t.api.post(`/v1/transactions/${txn.data.id}/email-receipt`, { email: 'customer@test.com' })
+    t.assert.status(res, 200)
+    t.assert.equal(res.data.message, 'Receipt sent')
+    t.assert.equal(res.data.sentTo, 'customer@test.com')
+  })
+
+  t.test('rejects email receipt with invalid email', { tags: ['transactions', 'email', 'validation'] }, async () => {
+    const txn = await t.api.post('/v1/transactions', { transactionType: 'sale', locationId: LOCATION_ID })
+    await t.api.post(`/v1/transactions/${txn.data.id}/line-items`, { description: 'Bad Email Item', qty: 1, unitPrice: 10 })
+    await t.api.post(`/v1/transactions/${txn.data.id}/complete`, { paymentMethod: 'card_present' })
+
+    const res = await t.api.post(`/v1/transactions/${txn.data.id}/email-receipt`, { email: 'not-an-email' })
+    t.assert.status(res, 400)
+  })
+
+  t.test('rejects email receipt with missing body', { tags: ['transactions', 'email', 'validation'] }, async () => {
+    const txn = await t.api.post('/v1/transactions', { transactionType: 'sale', locationId: LOCATION_ID })
+    await t.api.post(`/v1/transactions/${txn.data.id}/line-items`, { description: 'No Body Item', qty: 1, unitPrice: 10 })
+    await t.api.post(`/v1/transactions/${txn.data.id}/complete`, { paymentMethod: 'card_present' })
+
+    const res = await t.api.post(`/v1/transactions/${txn.data.id}/email-receipt`, {})
+    t.assert.status(res, 400)
+  })
+
+  t.test('receipt response includes customerEmail', { tags: ['transactions', 'email'] }, async () => {
+    // Create account with email
+    const acct = await t.api.post('/v1/accounts', { name: 'Email Customer', email: 'acct@test.com', billingMode: 'consolidated' })
+    const txn = await t.api.post('/v1/transactions', { transactionType: 'sale', locationId: LOCATION_ID, accountId: acct.data.id })
+    await t.api.post(`/v1/transactions/${txn.data.id}/line-items`, { description: 'Account Item', qty: 1, unitPrice: 50 })
+    await t.api.post(`/v1/transactions/${txn.data.id}/complete`, { paymentMethod: 'card_present' })
+
+    const receipt = await t.api.get(`/v1/transactions/${txn.data.id}/receipt`)
+    t.assert.status(receipt, 200)
+    t.assert.equal(receipt.data.customerEmail, 'acct@test.com')
+  })
 })

packages/backend/api-tests/suites/repairs.ts

@@ -510,4 +510,55 @@ suite('Repairs', { tags: ['repairs'] }, (t) => {
     const fileRes = await fetch(`${t.baseUrl}${signedRes.data.url}`)
     t.assert.equal(fileRes.status, 200)
   })
+
+  // ─── Email Estimate ─────────────────────────────────────────────────────────
+
+  t.test('emails a repair estimate', { tags: ['tickets', 'email'] }, async () => {
+    const ticket = await t.api.post('/v1/repair-tickets', {
+      customerName: 'Email Estimate Customer',
+      itemDescription: 'Broken Laptop',
+      problemDescription: 'Won\'t power on',
+      conditionIn: 'poor',
+      estimatedCost: 200,
+    })
+    await t.api.post(`/v1/repair-tickets/${ticket.data.id}/line-items`, {
+      itemType: 'labor',
+      description: 'Diagnostic fee',
+      qty: 1,
+      unitPrice: 50,
+    })
+
+    const res = await t.api.post(`/v1/repair-tickets/${ticket.data.id}/email-estimate`, { email: 'customer@test.com' })
+    t.assert.status(res, 200)
+    t.assert.equal(res.data.message, 'Estimate sent')
+    t.assert.equal(res.data.sentTo, 'customer@test.com')
+  })
+
+  t.test('rejects estimate email with invalid email', { tags: ['tickets', 'email', 'validation'] }, async () => {
+    const ticket = await t.api.post('/v1/repair-tickets', {
+      customerName: 'Bad Email Customer',
+      problemDescription: 'Test',
+      conditionIn: 'good',
+    })
+    const res = await t.api.post(`/v1/repair-tickets/${ticket.data.id}/email-estimate`, { email: 'bad' })
+    t.assert.status(res, 400)
+  })
+
+  t.test('returns 404 for estimate email on nonexistent ticket', { tags: ['tickets', 'email', 'validation'] }, async () => {
+    const res = await t.api.post('/v1/repair-tickets/00000000-0000-0000-0000-000000000000/email-estimate', { email: 'test@test.com' })
+    t.assert.status(res, 404)
+  })
+
+  t.test('ticket detail includes customerEmail from account', { tags: ['tickets', 'email'] }, async () => {
+    const acct = await t.api.post('/v1/accounts', { name: 'Repair Email Acct', email: 'repair@test.com', billingMode: 'consolidated' })
+    const ticket = await t.api.post('/v1/repair-tickets', {
+      customerName: 'Repair Email Acct',
+      accountId: acct.data.id,
+      problemDescription: 'Email test',
+      conditionIn: 'good',
+    })
+    const detail = await t.api.get(`/v1/repair-tickets/${ticket.data.id}`)
+    t.assert.status(detail, 200)
+    t.assert.equal(detail.data.customerEmail, 'repair@test.com')
+  })
 })

packages/backend/src/routes/v1/repairs.ts

@@ -13,7 +13,13 @@ import {
   RepairServiceTemplateCreateSchema,
   RepairServiceTemplateUpdateSchema,
 } from '@lunarfront/shared/schemas'
+import { eq } from 'drizzle-orm'
+import { z } from 'zod'
 import { RepairTicketService, RepairLineItemService, RepairBatchService, RepairNoteService, RepairServiceTemplateService } from '../../services/repair.service.js'
+import { accounts } from '../../db/schema/accounts.js'
+import { companies } from '../../db/schema/stores.js'
+import { EmailService } from '../../services/email.service.js'
+import { renderEstimateEmailHtml, renderEstimateEmailText } from '../../utils/email-templates.js'
 
 export const repairRoutes: FastifyPluginAsync = async (app) => {
   // --- Repair Tickets ---
@@ -59,7 +65,14 @@ export const repairRoutes: FastifyPluginAsync = async (app) => {
     const { id } = request.params as { id: string }
     const ticket = await RepairTicketService.getById(app.db, id)
     if (!ticket) return reply.status(404).send({ error: { message: 'Repair ticket not found', statusCode: 404 } })
-    return reply.send(ticket)
+
+    let customerEmail: string | null = null
+    if (ticket.accountId) {
+      const [acct] = await app.db.select({ email: accounts.email }).from(accounts).where(eq(accounts.id, ticket.accountId)).limit(1)
+      customerEmail = acct?.email ?? null
+    }
+
+    return reply.send({ ...ticket, customerEmail })
   })
 
   app.patch('/repair-tickets/:id', { preHandler: [app.authenticate, app.requirePermission('repairs.edit')] }, async (request, reply) => {
@@ -84,6 +97,42 @@ export const repairRoutes: FastifyPluginAsync = async (app) => {
     return reply.send(ticket)
   })
 
+  app.post('/repair-tickets/:id/email-estimate', { preHandler: [app.authenticate, app.requirePermission('repairs.view')] }, async (request, reply) => {
+    const { id } = request.params as { id: string }
+    const parsed = z.object({ email: z.string().email() }).safeParse(request.body)
+    if (!parsed.success) {
+      return reply.status(400).send({ error: { message: 'Valid email is required', statusCode: 400 } })
+    }
+
+    // Rate limit: max 5 emails per ticket per hour
+    const rateKey = `email-estimate:${id}`
+    const count = await app.redis.incr(rateKey)
+    if (count === 1) await app.redis.expire(rateKey, 3600)
+    if (count > 5) {
+      return reply.status(429).send({ error: { message: 'Too many emails for this estimate. Try again later.', statusCode: 429 } })
+    }
+
+    const ticket = await RepairTicketService.getById(app.db, id)
+    if (!ticket) return reply.status(404).send({ error: { message: 'Repair ticket not found', statusCode: 404 } })
+
+    const lineItemsResult = await RepairLineItemService.listByTicket(app.db, id, { page: 1, limit: 500 })
+    const [company] = await app.db.select().from(companies).limit(1)
+    if (!company) return reply.status(500).send({ error: { message: 'Store not configured', statusCode: 500 } })
+
+    const html = renderEstimateEmailHtml(ticket as any, lineItemsResult.data as any[], { name: company.name, phone: company.phone, email: company.email, address: company.address as any })
+    const text = renderEstimateEmailText(ticket as any, lineItemsResult.data as any[], { name: company.name, phone: company.phone, email: company.email, address: company.address as any })
+
+    await EmailService.send(app.db, {
+      to: parsed.data.email,
+      subject: `Repair Estimate — Ticket #${ticket.ticketNumber}`,
+      html,
+      text,
+    })
+
+    request.log.info({ ticketId: id, email: parsed.data.email, userId: request.user.id }, 'Estimate email sent')
+    return reply.send({ message: 'Estimate sent', sentTo: parsed.data.email })
+  })
+
   app.delete('/repair-tickets/:id', { preHandler: [app.authenticate, app.requirePermission('repairs.admin')] }, async (request, reply) => {
     const { id } = request.params as { id: string }
     const ticket = await RepairTicketService.delete(app.db, id)

packages/backend/src/routes/v1/transactions.ts

@@ -7,7 +7,11 @@ import {
   ApplyDiscountSchema,
   CompleteTransactionSchema,
 } from '@lunarfront/shared/schemas'
+import { inArray } from 'drizzle-orm'
 import { TransactionService } from '../../services/transaction.service.js'
+import { appConfig } from '../../db/schema/stores.js'
+import { EmailService } from '../../services/email.service.js'
+import { renderReceiptEmailHtml, renderReceiptEmailText } from '../../utils/email-templates.js'
 
 const FromRepairBodySchema = z.object({
   locationId: z.string().uuid().optional(),
@@ -64,6 +68,45 @@ export const transactionRoutes: FastifyPluginAsync = async (app) => {
     return reply.send(receipt)
   })
 
+  app.post('/transactions/:id/email-receipt', { preHandler: [app.authenticate, app.requirePermission('pos.view')] }, async (request, reply) => {
+    const { id } = request.params as { id: string }
+    const parsed = z.object({ email: z.string().email() }).safeParse(request.body)
+    if (!parsed.success) {
+      return reply.status(400).send({ error: { message: 'Valid email is required', statusCode: 400 } })
+    }
+
+    // Rate limit: max 5 emails per transaction per hour
+    const rateKey = `email-receipt:${id}`
+    const count = await app.redis.incr(rateKey)
+    if (count === 1) await app.redis.expire(rateKey, 3600)
+    if (count > 5) {
+      return reply.status(429).send({ error: { message: 'Too many emails for this receipt. Try again later.', statusCode: 429 } })
+    }
+
+    const receipt = await TransactionService.getReceipt(app.db, id)
+    const storeName = receipt.company?.name ?? 'Store'
+
+    // Fetch receipt config
+    const configRows = await app.db.select({ key: appConfig.key, value: appConfig.value })
+      .from(appConfig)
+      .where(inArray(appConfig.key, ['receipt_header', 'receipt_footer', 'receipt_return_policy', 'receipt_social']))
+    const config: Record<string, string> = {}
+    for (const row of configRows) if (row.value) config[row.key] = row.value
+
+    const html = renderReceiptEmailHtml(receipt as any, config)
+    const text = renderReceiptEmailText(receipt as any, config)
+
+    await EmailService.send(app.db, {
+      to: parsed.data.email,
+      subject: `Your receipt from ${storeName} — ${receipt.transaction.transactionNumber}`,
+      html,
+      text,
+    })
+
+    request.log.info({ transactionId: id, email: parsed.data.email, userId: request.user.id }, 'Receipt email sent')
+    return reply.send({ message: 'Receipt sent', sentTo: parsed.data.email })
+  })
+
   app.post('/transactions/:id/line-items', { preHandler: [app.authenticate, app.requirePermission('pos.edit')] }, async (request, reply) => {
     const { id } = request.params as { id: string }
     const parsed = TransactionLineItemCreateSchema.safeParse(request.body)

packages/backend/src/services/email.service.ts

@@ -87,6 +87,21 @@ class SmtpProvider implements EmailProvider {
   }
 }
 
+class TestProvider implements EmailProvider {
+  static lastEmail: SendOpts | null = null
+  static emails: SendOpts[] = []
+
+  async send(opts: SendOpts): Promise<void> {
+    TestProvider.lastEmail = opts
+    TestProvider.emails.push(opts)
+  }
+
+  static reset() {
+    TestProvider.lastEmail = null
+    TestProvider.emails = []
+  }
+}
+
 export const EmailService = {
   async send(db: PostgresJsDatabase<any>, opts: SendOpts): Promise<void> {
     const provider = await SettingsService.get(db, 'email.provider')
@@ -99,8 +114,14 @@ export const EmailService = {
         return new SendGridProvider(db).send(opts)
       case 'smtp':
         return new SmtpProvider().send(opts)
+      case 'test':
+        return new TestProvider().send(opts)
       default:
         throw new Error('Email provider not configured. Set email.provider in app_settings.')
     }
   },
+
+  getTestEmails: () => TestProvider.emails,
+  getLastTestEmail: () => TestProvider.lastEmail,
+  resetTestEmails: () => TestProvider.reset(),
 }

packages/backend/src/services/transaction.service.ts

@@ -10,6 +10,7 @@ import {
 import { products, inventoryUnits } from '../db/schema/inventory.js'
 import { repairTickets, repairLineItems } from '../db/schema/repairs.js'
 import { companies, locations } from '../db/schema/stores.js'
+import { accounts } from '../db/schema/accounts.js'
 import { NotFoundError, ValidationError, ConflictError } from '../lib/errors.js'
 import { TaxService } from './tax.service.js'
 import type {
@@ -473,8 +474,16 @@ export const TransactionService = {
       location = loc ?? null
     }
 
+    // Resolve customer email from linked account
+    let customerEmail: string | null = null
+    if (txn.accountId) {
+      const [acct] = await db.select({ email: accounts.email }).from(accounts).where(eq(accounts.id, txn.accountId)).limit(1)
+      customerEmail = acct?.email ?? null
+    }
+
     return {
       transaction: txn,
+      customerEmail,
       company: company
         ? {
             name: company.name,

packages/backend/src/utils/email-templates.ts

@@ -0,0 +1,319 @@
+/**
+ * Server-side HTML email template renderers for receipts and repair estimates.
+ * Uses inline CSS for email-client compatibility.
+ */
+
+interface Address {
+  street?: string
+  city?: string
+  state?: string
+  zip?: string
+}
+
+interface CompanyInfo {
+  name: string
+  phone?: string | null
+  email?: string | null
+  address?: Address | null
+}
+
+interface ReceiptLineItem {
+  description: string
+  qty: number
+  unitPrice: string
+  taxAmount: string
+  lineTotal: string
+  discountAmount?: string | null
+}
+
+interface ReceiptTransaction {
+  transactionNumber: string
+  subtotal: string
+  discountTotal: string
+  taxTotal: string
+  total: string
+  paymentMethod: string | null
+  amountTendered: string | null
+  changeGiven: string | null
+  roundingAdjustment: string | null
+  completedAt: string | null
+  lineItems: ReceiptLineItem[]
+}
+
+interface ReceiptConfig {
+  receipt_header?: string
+  receipt_footer?: string
+  receipt_return_policy?: string
+  receipt_social?: string
+}
+
+interface ReceiptData {
+  transaction: ReceiptTransaction
+  company: CompanyInfo | null
+  location: CompanyInfo | null
+}
+
+interface RepairLineItem {
+  itemType: string
+  description: string
+  qty: number
+  unitPrice: string
+  totalPrice: string
+}
+
+interface RepairTicket {
+  ticketNumber: string
+  customerName: string
+  customerPhone?: string | null
+  itemDescription?: string | null
+  serialNumber?: string | null
+  problemDescription?: string | null
+  estimatedCost?: string | null
+  promisedDate?: string | null
+  status: string
+}
+
+// ── Shared layout ──────────────────────────────────────────────────────────
+
+function wrapEmailLayout(storeName: string, bodyHtml: string): string {
+  return `
+    <div style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; max-width: 480px; margin: 0 auto; padding: 40px 20px; color: #333;">
+      <h2 style="color: #1a1a2e; margin: 0 0 24px 0; font-size: 20px;">${esc(storeName)}</h2>
+      ${bodyHtml}
+      <hr style="border: none; border-top: 1px solid #eee; margin: 32px 0;" />
+      <p style="color: #aaa; font-size: 11px; margin: 0;">Powered by LunarFront</p>
+    </div>
+  `
+}
+
+function esc(s: string): string {
+  return s.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;')
+}
+
+function formatAddress(addr?: Address | null): string {
+  if (!addr) return ''
+  const parts = [addr.street, [addr.city, addr.state].filter(Boolean).join(', '), addr.zip].filter(Boolean)
+  return parts.join('<br />')
+}
+
+function formatDate(dateStr: string | null): string {
+  if (!dateStr) return ''
+  const d = new Date(dateStr)
+  return d.toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric', hour: 'numeric', minute: '2-digit' })
+}
+
+function formatDateOnly(dateStr: string | null): string {
+  if (!dateStr) return ''
+  const d = new Date(dateStr)
+  return d.toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' })
+}
+
+const PAYMENT_LABELS: Record<string, string> = {
+  cash: 'Cash',
+  card_present: 'Card',
+  card_keyed: 'Card (Keyed)',
+  check: 'Check',
+  store_credit: 'Store Credit',
+  other: 'Other',
+}
+
+const TYPE_LABELS: Record<string, string> = {
+  labor: 'Labor',
+  part: 'Part',
+  flat_rate: 'Flat Rate',
+  misc: 'Misc',
+  consumable: 'Consumable',
+}
+
+// ── Receipt email ──────────────────────────────────────────────────────────
+
+export function renderReceiptEmailHtml(data: ReceiptData, config?: ReceiptConfig): string {
+  const txn = data.transaction
+  const storeName = data.company?.name ?? 'Store'
+
+  let companyBlock = ''
+  if (data.company) {
+    const addr = formatAddress(data.company.address)
+    companyBlock = `
+      <div style="font-size: 13px; color: #666; margin-bottom: 16px;">
+        ${addr ? `<div>${addr}</div>` : ''}
+        ${data.company.phone ? `<div>${esc(data.company.phone)}</div>` : ''}
+      </div>
+    `
+  }
+
+  const headerText = config?.receipt_header ? `<p style="font-size: 13px; color: #555; margin: 0 0 16px 0;">${esc(config.receipt_header)}</p>` : ''
+
+  const lineRows = txn.lineItems.map(item => `
+    <tr>
+      <td style="padding: 6px 0; border-bottom: 1px solid #f0f0f0; font-size: 13px;">${esc(item.description)}</td>
+      <td style="padding: 6px 8px; border-bottom: 1px solid #f0f0f0; font-size: 13px; text-align: center;">${item.qty}</td>
+      <td style="padding: 6px 0; border-bottom: 1px solid #f0f0f0; font-size: 13px; text-align: right;">$${item.unitPrice}</td>
+      <td style="padding: 6px 0; border-bottom: 1px solid #f0f0f0; font-size: 13px; text-align: right;">$${item.lineTotal}</td>
+    </tr>
+  `).join('')
+
+  const discountRow = parseFloat(txn.discountTotal) > 0
+    ? `<tr><td style="padding: 4px 0; font-size: 13px;">Discount</td><td style="padding: 4px 0; font-size: 13px; text-align: right; color: #e57373;">-$${txn.discountTotal}</td></tr>`
+    : ''
+
+  const roundingRow = txn.roundingAdjustment && parseFloat(txn.roundingAdjustment) !== 0
+    ? `<tr><td style="padding: 4px 0; font-size: 13px;">Rounding</td><td style="padding: 4px 0; font-size: 13px; text-align: right;">$${txn.roundingAdjustment}</td></tr>`
+    : ''
+
+  const paymentBlock = txn.paymentMethod ? `
+    <div style="margin-top: 16px; font-size: 13px; color: #666;">
+      <div>Paid by: ${PAYMENT_LABELS[txn.paymentMethod] ?? txn.paymentMethod}</div>
+      ${txn.amountTendered && txn.paymentMethod === 'cash' ? `<div>Tendered: $${txn.amountTendered}</div>` : ''}
+      ${txn.changeGiven && parseFloat(txn.changeGiven) > 0 ? `<div>Change: $${txn.changeGiven}</div>` : ''}
+    </div>
+  ` : ''
+
+  const footerText = config?.receipt_footer ? `<p style="font-size: 12px; color: #888; margin: 16px 0 0 0; text-align: center;">${esc(config.receipt_footer)}</p>` : ''
+  const policyText = config?.receipt_return_policy ? `<p style="font-size: 11px; color: #999; margin: 8px 0 0 0; text-align: center;">${esc(config.receipt_return_policy)}</p>` : ''
+  const socialText = config?.receipt_social ? `<p style="font-size: 11px; color: #999; margin: 4px 0 0 0; text-align: center;">${esc(config.receipt_social)}</p>` : ''
+
+  const body = `
+    ${companyBlock}
+    ${headerText}
+    <div style="background: #f9f9f9; border-radius: 8px; padding: 16px; margin-bottom: 16px;">
+      <div style="font-size: 13px; color: #666;">
+        <strong style="color: #333;">Receipt #${esc(txn.transactionNumber)}</strong><br />
+        ${formatDate(txn.completedAt)}
+      </div>
+    </div>
+    <table style="width: 100%; border-collapse: collapse; margin-bottom: 16px;">
+      <thead>
+        <tr style="border-bottom: 2px solid #eee;">
+          <th style="padding: 6px 0; font-size: 12px; text-align: left; color: #888; font-weight: 600;">Item</th>
+          <th style="padding: 6px 8px; font-size: 12px; text-align: center; color: #888; font-weight: 600;">Qty</th>
+          <th style="padding: 6px 0; font-size: 12px; text-align: right; color: #888; font-weight: 600;">Price</th>
+          <th style="padding: 6px 0; font-size: 12px; text-align: right; color: #888; font-weight: 600;">Total</th>
+        </tr>
+      </thead>
+      <tbody>
+        ${lineRows}
+      </tbody>
+    </table>
+    <table style="width: 50%; margin-left: auto; border-collapse: collapse;">
+      <tr><td style="padding: 4px 0; font-size: 13px;">Subtotal</td><td style="padding: 4px 0; font-size: 13px; text-align: right;">$${txn.subtotal}</td></tr>
+      ${discountRow}
+      <tr><td style="padding: 4px 0; font-size: 13px;">Tax</td><td style="padding: 4px 0; font-size: 13px; text-align: right;">$${txn.taxTotal}</td></tr>
+      ${roundingRow}
+      <tr style="border-top: 2px solid #333;"><td style="padding: 8px 0; font-size: 15px; font-weight: 700;">Total</td><td style="padding: 8px 0; font-size: 15px; font-weight: 700; text-align: right;">$${txn.total}</td></tr>
+    </table>
+    ${paymentBlock}
+    ${footerText}
+    ${policyText}
+    ${socialText}
+  `
+
+  return wrapEmailLayout(storeName, body)
+}
+
+export function renderReceiptEmailText(data: ReceiptData, config?: ReceiptConfig): string {
+  const txn = data.transaction
+  const storeName = data.company?.name ?? 'Store'
+  const lines = [
+    storeName,
+    `Receipt #${txn.transactionNumber}`,
+    formatDate(txn.completedAt),
+    '',
+    ...txn.lineItems.map(i => `${i.description} x${i.qty} — $${i.lineTotal}`),
+    '',
+    `Subtotal: $${txn.subtotal}`,
+    ...(parseFloat(txn.discountTotal) > 0 ? [`Discount: -$${txn.discountTotal}`] : []),
+    `Tax: $${txn.taxTotal}`,
+    `Total: $${txn.total}`,
+    '',
+    ...(txn.paymentMethod ? [`Paid by: ${PAYMENT_LABELS[txn.paymentMethod] ?? txn.paymentMethod}`] : []),
+    ...(config?.receipt_footer ? ['', config.receipt_footer] : []),
+  ]
+  return lines.join('\n')
+}
+
+// ── Repair estimate email ──────────────────────────────────────────────────
+
+export function renderEstimateEmailHtml(ticket: RepairTicket, lineItems: RepairLineItem[], company: CompanyInfo): string {
+  const storeName = company.name
+
+  const lineRows = lineItems.map(item => `
+    <tr>
+      <td style="padding: 6px 0; border-bottom: 1px solid #f0f0f0; font-size: 13px;">${TYPE_LABELS[item.itemType] ?? item.itemType}</td>
+      <td style="padding: 6px 0; border-bottom: 1px solid #f0f0f0; font-size: 13px;">${esc(item.description)}</td>
+      <td style="padding: 6px 8px; border-bottom: 1px solid #f0f0f0; font-size: 13px; text-align: center;">${item.qty}</td>
+      <td style="padding: 6px 0; border-bottom: 1px solid #f0f0f0; font-size: 13px; text-align: right;">$${item.unitPrice}</td>
+      <td style="padding: 6px 0; border-bottom: 1px solid #f0f0f0; font-size: 13px; text-align: right;">$${item.totalPrice}</td>
+    </tr>
+  `).join('')
+
+  const estimatedTotal = ticket.estimatedCost
+    ? `<tr style="border-top: 2px solid #333;"><td colspan="4" style="padding: 8px 0; font-size: 15px; font-weight: 700;">Estimated Total</td><td style="padding: 8px 0; font-size: 15px; font-weight: 700; text-align: right;">$${ticket.estimatedCost}</td></tr>`
+    : ''
+
+  const lineItemTotal = lineItems.reduce((sum, i) => sum + parseFloat(i.totalPrice), 0).toFixed(2)
+  const lineItemTotalRow = !ticket.estimatedCost && lineItems.length > 0
+    ? `<tr style="border-top: 2px solid #333;"><td colspan="4" style="padding: 8px 0; font-size: 15px; font-weight: 700;">Estimated Total</td><td style="padding: 8px 0; font-size: 15px; font-weight: 700; text-align: right;">$${lineItemTotal}</td></tr>`
+    : ''
+
+  const body = `
+    <div style="background: #f9f9f9; border-radius: 8px; padding: 16px; margin-bottom: 16px;">
+      <div style="font-size: 13px; color: #666;">
+        <strong style="color: #333;">Repair Estimate — Ticket #${esc(ticket.ticketNumber)}</strong><br />
+        ${esc(ticket.customerName)}
+      </div>
+    </div>
+
+    <div style="margin-bottom: 16px; font-size: 13px; color: #555;">
+      ${ticket.itemDescription ? `<div><strong>Item:</strong> ${esc(ticket.itemDescription)}${ticket.serialNumber ? ` (S/N: ${esc(ticket.serialNumber)})` : ''}</div>` : ''}
+      ${ticket.problemDescription ? `<div style="margin-top: 4px;"><strong>Issue:</strong> ${esc(ticket.problemDescription)}</div>` : ''}
+      ${ticket.promisedDate ? `<div style="margin-top: 4px;"><strong>Estimated completion:</strong> ${formatDateOnly(ticket.promisedDate)}</div>` : ''}
+    </div>
+
+    ${lineItems.length > 0 ? `
+      <table style="width: 100%; border-collapse: collapse; margin-bottom: 16px;">
+        <thead>
+          <tr style="border-bottom: 2px solid #eee;">
+            <th style="padding: 6px 0; font-size: 12px; text-align: left; color: #888; font-weight: 600;">Type</th>
+            <th style="padding: 6px 0; font-size: 12px; text-align: left; color: #888; font-weight: 600;">Description</th>
+            <th style="padding: 6px 8px; font-size: 12px; text-align: center; color: #888; font-weight: 600;">Qty</th>
+            <th style="padding: 6px 0; font-size: 12px; text-align: right; color: #888; font-weight: 600;">Price</th>
+            <th style="padding: 6px 0; font-size: 12px; text-align: right; color: #888; font-weight: 600;">Total</th>
+          </tr>
+        </thead>
+        <tbody>
+          ${lineRows}
+          ${estimatedTotal}
+          ${lineItemTotalRow}
+        </tbody>
+      </table>
+    ` : `
+      ${ticket.estimatedCost ? `<div style="font-size: 15px; font-weight: 700; margin-bottom: 16px;">Estimated Cost: $${ticket.estimatedCost}</div>` : ''}
+    `}
+
+    <p style="font-size: 12px; color: #888;">This is an estimate and the final cost may vary. Please contact us with any questions.</p>
+    ${company.phone ? `<p style="font-size: 12px; color: #888; margin-top: 4px;">Phone: ${esc(company.phone)}</p>` : ''}
+  `
+
+  return wrapEmailLayout(storeName, body)
+}
+
+export function renderEstimateEmailText(ticket: RepairTicket, lineItems: RepairLineItem[], company: CompanyInfo): string {
+  const lines = [
+    company.name,
+    `Repair Estimate — Ticket #${ticket.ticketNumber}`,
+    `Customer: ${ticket.customerName}`,
+    '',
+    ...(ticket.itemDescription ? [`Item: ${ticket.itemDescription}${ticket.serialNumber ? ` (S/N: ${ticket.serialNumber})` : ''}`] : []),
+    ...(ticket.problemDescription ? [`Issue: ${ticket.problemDescription}`] : []),
+    ...(ticket.promisedDate ? [`Estimated completion: ${formatDateOnly(ticket.promisedDate)}`] : []),
+    '',
+    ...lineItems.map(i => `${TYPE_LABELS[i.itemType] ?? i.itemType}: ${i.description} x${i.qty} — $${i.totalPrice}`),
+    '',
+    ...(ticket.estimatedCost ? [`Estimated Total: $${ticket.estimatedCost}`] : []),
+    '',
+    'This is an estimate and the final cost may vary.',
+    ...(company.phone ? [`Phone: ${company.phone}`] : []),
+  ]
+  return lines.join('\n')
+}