Migrate frontend to Vuetify/Vuexy + add real WHMCS product data

- Migrate all frontend from plain JS/Tailwind to TypeScript/Vuetify 3 (Vuexy design system)
- Replace placeholder plans with 25 real products scraped from WHMCS:
  9 VPS plans ($4.20-$30/mo), 8 dedicated servers ($44.39-$107.99/mo),
  4 web hosting plans ($2.39-$15.99/mo), 4 MySQL hosting plans ($6-$30/mo)
- Fix Pricing page: correct field mapping (service_type, price), display
  feature values instead of keys, proper price formatting
- Update all marketing pages (Home, Products, VPS, Dedicated, Web Hosting)
  with real specs, pricing, and features from production WHMCS
- Add 38 Vuexy @core SCSS override files for component styling
- Create 4 layouts (Account, Admin, Auth, Marketing) with Vuetify
- Add AppTextField/AppSelect/AppTextarea wrapper components
- Purple primary theme (#7367F0), dark mode default
- 52 tests passing, build clean

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

TASKS.md

@@ -16,6 +16,7 @@
 - [x] Build customer dashboard + admin dashboard (placeholder)
 - [x] Set up Pest testing framework (24 Phase 1 tests passing)
 - [x] Dark mode UI across all pages
+- [x] Migrate frontend from Tailwind CSS to Vuetify 3 (Vuexy design system) with TypeScript
 - [ ] Configure Cloudflare Zero Trust for admin panel
 - [ ] Set up GitHub Actions CI/CD pipeline
 - [ ] Create staging environment (staging.account.ezscale.cloud)
@@ -44,6 +45,24 @@
 - [ ] Admin coupon management CRUD
 - [ ] Email notifications for payment events
 
+## Frontend Migration: Tailwind → Vuetify/Vuexy ✅
+- [x] Install Vuetify 3, TypeScript, Pinia, Sass, vite-plugin-vuetify
+- [x] Remove Tailwind CSS
+- [x] Configure TypeScript (tsconfig.json, path aliases, strict mode)
+- [x] Set up Vuetify plugin (theme, defaults, icons)
+- [x] Rename resources/js → resources/ts, convert to TypeScript
+- [x] Copy Vuexy @core SCSS overrides (38 files — base + template + 25 components)
+- [x] Create @layouts stubs for Vuexy SCSS compatibility
+- [x] Configure Vite aliases (@core-scss, @configured-variables, @layouts)
+- [x] Create 4 layouts: AccountLayout, AdminLayout, AuthLayout, MarketingLayout
+- [x] Create shared components: FlashMessages, StatCard, StatusChip, ThemeSwitcher
+- [x] Create AppTextField, AppSelect, AppTextarea wrapper components (Vuexy pattern)
+- [x] Migrate all 19 existing pages to Vuetify + TypeScript
+- [x] Create 9 marketing pages (Home, Products, VPS, Dedicated, Web, Game, Pricing, About, Contact)
+- [x] Create navigation configs (account.ts, admin.ts, marketing.ts)
+- [x] Set purple primary color (#7367F0) matching Vuexy demo
+- [x] All 53 tests passing, build clean
+
 ## Phase 3: Provisioning Automation
 - [ ] Create `ProvisioningServiceInterface` abstraction
 - [ ] Build VirtFusion provisioning service:
@@ -206,23 +225,23 @@
   - [ ] Ticket escalated (high priority)
 
 ## Phase 8: Marketing Frontend (ezscale.cloud)
-- [ ] Homepage:
-  - [ ] Hero section with value proposition
-  - [ ] Featured services/plans
-  - [ ] Trust indicators (uptime, customers, years in business)
-  - [ ] Call to action (Get Started, View Plans)
-- [ ] Product pages:
-  - [ ] VPS hosting page with plan comparison
-  - [ ] Dedicated servers page with configurations
-  - [ ] Web hosting page with features
-  - [ ] Game server hosting page with supported games
-- [ ] Pricing page:
-  - [ ] Interactive plan comparison table
+- [x] Homepage:
+  - [x] Hero section with value proposition
+  - [x] Featured services/plans
+  - [x] Trust indicators (uptime, customers, years in business)
+  - [x] Call to action (Get Started, View Plans)
+- [x] Product pages:
+  - [x] VPS hosting page with plan comparison
+  - [x] Dedicated servers page with configurations
+  - [x] Web hosting page with features
+  - [x] Game server hosting page with supported games
+- [x] Pricing page:
+  - [x] Interactive plan comparison table
   - [ ] Currency selector (USD, EUR, GBP)
   - [ ] Coupon code application
   - [ ] Add to cart / checkout flow
-- [ ] About page
-- [ ] Contact page
+- [x] About page
+- [x] Contact page
 - [ ] Blog/news section (optional, or use WordPress?)
 - [ ] Knowledge base / FAQ:
   - [ ] Getting started guides