refactor: standardize admin templates with shared macros

Migrate all admin templates to use standardized components:
- Use tabs macros (tabs_nav, tab_button) for tab navigation
- Use number_stepper for quantity/numeric inputs
- Use headers macros for consistent page layouts
- Use modals macros for dialog components

Affected pages: dashboard, settings, logs, content-pages, companies,
vendors, users, imports, marketplace, code-quality, and more.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

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

app/templates/admin/vendor-theme.html

@@ -1,5 +1,7 @@
 {# app/templates/admin/vendor-theme.html #}
 {% extends "admin/base.html" %}
+{% from 'shared/macros/alerts.html' import loading_state, error_state %}
+{% from 'shared/macros/headers.html' import page_header_flex %}
 
 {% block title %}Theme Editor - {{ vendor_code }}{% endblock %}
 
@@ -7,35 +9,17 @@
 {% block alpine_data %}adminVendorTheme(){% endblock %}
 
 {% block content %}
-<!-- Page Header -->
-<div class="flex items-center justify-between my-6">
-    <div>
-        <h2 class="text-2xl font-semibold text-gray-700 dark:text-gray-200">
-            Theme Editor
-        </h2>
-        <p class="text-sm text-gray-600 dark:text-gray-400 mt-1">
-            Customize appearance for <span x-text="vendor?.name || '...'"></span>
-        </p>
-    </div>
-    <div class="flex space-x-2">
-        <a :href="`/admin/vendors/${vendorCode}`"
-           class="flex items-center px-4 py-2 text-sm font-medium leading-5 text-gray-700 transition-colors duration-150 bg-white border border-gray-300 rounded-lg hover:border-gray-400 dark:text-gray-400 dark:border-gray-600 dark:bg-gray-800">
-            <span x-html="$icon('arrow-left', 'w-4 h-4 mr-2')"></span>
-            Back to Vendor
-        </a>
-    </div>
-</div>
+{% call page_header_flex(title='Theme Editor', subtitle_var="'Customize appearance for ' + (vendor?.name || '...')") %}
+    <a :href="`/admin/vendors/${vendorCode}`"
+       class="flex items-center px-4 py-2 text-sm font-medium leading-5 text-gray-700 dark:text-gray-300 transition-colors duration-150 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-700 focus:outline-none focus:shadow-outline-gray">
+        <span x-html="$icon('arrow-left', 'w-4 h-4 mr-2')"></span>
+        Back to Vendor
+    </a>
+{% endcall %}
 
-<!-- Loading State -->
-<div x-show="loading" class="text-center py-12">
-    <span x-html="$icon('spinner', 'inline w-8 h-8 text-purple-600 animate-spin')"></span>
-    <p class="mt-2 text-gray-600 dark:text-gray-400">Loading theme...</p>
-</div>
+{{ loading_state('Loading theme...') }}
 
-<!-- Error State -->
-<div x-show="error && !loading" class="mb-6 p-4 bg-red-100 border border-red-400 text-red-700 rounded-lg">
-    <p x-text="error"></p>
-</div>
+{{ error_state('Error', show_condition='error && !loading') }}
 
 <!-- Main Content -->
 <div x-show="!loading" class="grid gap-6 mb-8 md:grid-cols-3">