feat: complete multi-platform CMS phases 2-5

Phase 2 - OMS Migration & Integration:
- Fix platform_pages.py to use get_platform_page for marketing pages
- Fix shop_pages.py to pass platform_id to content page service calls

Phase 3 - Admin Interface:
- Add platform management API (app/api/v1/admin/platforms.py)
- Add platforms admin page with stats cards
- Add Platforms menu item to admin sidebar
- Update content pages admin with platform filter and four-tab tier system

Phase 4 - Documentation:
- Add comprehensive architecture docs (docs/architecture/multi-platform-cms.md)
- Update implementation plan with completion status

Phase 5 - Vendor Dashboard:
- Add CMS usage API endpoint with tier limits
- Add usage progress bar to vendor content pages
- Add platform-default/{slug} API for preview
- Add View Default button and modal in page editor

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

app/templates/vendor/content-pages.html

@@ -15,6 +15,50 @@
 
 {{ error_state('Error loading pages') }}
 
+<!-- CMS Usage Indicator -->
+<div x-show="!loading && cmsUsage" class="mb-6 bg-white dark:bg-gray-800 rounded-lg shadow-md p-4">
+    <div class="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">
+        <div class="flex-1">
+            <div class="flex items-center justify-between mb-2">
+                <span class="text-sm font-medium text-gray-700 dark:text-gray-300">CMS Usage</span>
+                <span class="text-sm text-gray-500 dark:text-gray-400">
+                    <span x-text="cmsUsage.total_pages"></span>
+                    <span x-show="cmsUsage.pages_limit"> / <span x-text="cmsUsage.pages_limit"></span></span>
+                    <span x-show="!cmsUsage.pages_limit"> (unlimited)</span>
+                    pages
+                </span>
+            </div>
+            <!-- Progress Bar -->
+            <div class="w-full bg-gray-200 dark:bg-gray-700 rounded-full h-2.5">
+                <div
+                    class="h-2.5 rounded-full transition-all duration-300"
+                    :class="{
+                        'bg-green-500': cmsUsage.usage_percent < 70,
+                        'bg-yellow-500': cmsUsage.usage_percent >= 70 && cmsUsage.usage_percent < 90,
+                        'bg-red-500': cmsUsage.usage_percent >= 90
+                    }"
+                    :style="`width: ${cmsUsage.pages_limit ? cmsUsage.usage_percent : 0}%`"
+                ></div>
+            </div>
+            <div class="flex justify-between mt-1 text-xs text-gray-500 dark:text-gray-400">
+                <span><span x-text="cmsUsage.override_pages"></span> overrides</span>
+                <span><span x-text="cmsUsage.custom_pages"></span> custom pages</span>
+            </div>
+        </div>
+
+        <!-- Upgrade Prompt (show when approaching limit) -->
+        <div x-show="cmsUsage.pages_limit && cmsUsage.usage_percent >= 80" class="flex-shrink-0">
+            <a
+                href="/vendor/{{ vendor_code }}/settings/billing"
+                class="inline-flex items-center px-3 py-1.5 text-xs font-medium text-amber-700 bg-amber-100 dark:bg-amber-900/30 dark:text-amber-300 rounded-lg hover:bg-amber-200 dark:hover:bg-amber-900/50 transition-colors"
+            >
+                <span x-html="$icon('arrow-trending-up', 'w-4 h-4 mr-1')"></span>
+                Upgrade for more pages
+            </a>
+        </div>
+    </div>
+</div>
+
 <!-- Tabs and Info -->
 <div x-show="!loading" class="mb-6 bg-white dark:bg-gray-800 rounded-lg shadow-md p-4">
     <div class="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">