Implement complete autoparts catalog system (5 phases)

FASE 1: Parts Database
- Added part_categories, part_groups, parts, vehicle_parts tables
- 12 categories, 190 groups with Spanish translations
- API endpoints for categories, groups, parts CRUD

FASE 2: Cross-References & Aftermarket
- Added manufacturers, aftermarket_parts, part_cross_references tables
- 24 manufacturers, quality tier system (economy/standard/premium/oem)
- Part number search across OEM and aftermarket

FASE 3: Exploded Diagrams
- Added diagrams, vehicle_diagrams, diagram_hotspots tables
- SVG viewer with zoom controls and interactive hotspots
- 3 sample diagrams (brake, oil filter, suspension)

FASE 4: Search & VIN Decoder
- SQLite FTS5 full-text search with auto-sync triggers
- NHTSA VIN decoder API integration with 30-day cache
- Unified search endpoint

FASE 5: Optimization & UX
- API pagination (page/per_page, max 100 items)
- Dark mode with localStorage persistence
- Keyboard shortcuts (/, Ctrl+K, Escape, Backspace, Ctrl+D)
- Breadcrumb navigation
- ARIA accessibility (labels, roles, focus management)
- Skip link for keyboard users

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

dashboard/static/diagrams/suspension_assembly.svg

@@ -0,0 +1,84 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="600" height="400" viewBox="0 0 600 400" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="strutGrad" x1="0%" y1="0%" x2="100%" y2="0%">
+      <stop offset="0%" style="stop-color:#444"/>
+      <stop offset="50%" style="stop-color:#666"/>
+      <stop offset="100%" style="stop-color:#444"/>
+    </linearGradient>
+    <linearGradient id="springGrad" x1="0%" y1="0%" x2="100%" y2="0%">
+      <stop offset="0%" style="stop-color:#27ae60"/>
+      <stop offset="50%" style="stop-color:#2ecc71"/>
+      <stop offset="100%" style="stop-color:#27ae60"/>
+    </linearGradient>
+  </defs>
+
+  <!-- Background -->
+  <rect width="600" height="400" fill="#f5f5f5"/>
+
+  <!-- Title -->
+  <text x="300" y="30" text-anchor="middle" font-family="Arial, sans-serif" font-size="18" font-weight="bold" fill="#333">
+    Front Suspension / Suspension Delantera
+  </text>
+
+  <!-- Vehicle body mounting point -->
+  <rect x="180" y="50" width="240" height="30" fill="#555" stroke="#333" stroke-width="2"/>
+  <text x="300" y="70" text-anchor="middle" font-family="Arial" font-size="10" fill="#ccc">BODY / CARROCERIA</text>
+
+  <!-- Strut Mount (top) -->
+  <ellipse cx="300" cy="95" rx="35" ry="15" fill="#888" stroke="#555" stroke-width="2"/>
+
+  <!-- Strut Assembly -->
+  <rect x="285" y="95" width="30" height="150" fill="url(#strutGrad)" stroke="#333" stroke-width="2" id="strut"/>
+  <!-- Strut piston rod -->
+  <rect x="293" y="95" width="14" height="60" fill="#999" stroke="#777" stroke-width="1"/>
+
+  <!-- Coil Spring around strut -->
+  <path d="M275,120 Q310,130 275,140 Q240,150 275,160 Q310,170 275,180 Q240,190 275,200 Q310,210 275,220"
+        fill="none" stroke="url(#springGrad)" stroke-width="8" stroke-linecap="round"/>
+
+  <!-- Lower Control Arm -->
+  <path d="M150,320 L300,280 L450,320" fill="none" stroke="#444" stroke-width="12" stroke-linecap="round"/>
+  <rect x="140" y="310" width="30" height="30" fill="#666" stroke="#444" stroke-width="2" rx="5"/>
+  <rect x="430" y="310" width="30" height="30" fill="#666" stroke="#444" stroke-width="2" rx="5"/>
+
+  <!-- Ball Joint (connecting strut to control arm) -->
+  <circle cx="300" cy="280" r="20" fill="#c0392b" stroke="#922b21" stroke-width="3" id="ball-joint"/>
+  <circle cx="300" cy="280" r="8" fill="#333"/>
+
+  <!-- Steering Knuckle (simplified) -->
+  <rect x="280" y="250" width="40" height="25" fill="#777" stroke="#555" stroke-width="2"/>
+
+  <!-- Wheel hub representation -->
+  <circle cx="300" cy="340" r="40" fill="#444" stroke="#333" stroke-width="3"/>
+  <circle cx="300" cy="340" r="15" fill="#333"/>
+  <text x="300" y="345" text-anchor="middle" font-family="Arial" font-size="8" fill="#999">HUB</text>
+
+  <!-- Sway Bar Link -->
+  <line x1="350" y1="300" x2="420" y2="250" stroke="#555" stroke-width="6"/>
+  <circle cx="350" cy="300" r="6" fill="#777" stroke="#555" stroke-width="2"/>
+  <circle cx="420" cy="250" r="6" fill="#777" stroke="#555" stroke-width="2"/>
+
+  <!-- Callout 1: Strut Assembly -->
+  <line x1="320" y1="150" x2="420" y2="100" stroke="#333" stroke-width="1.5"/>
+  <circle cx="420" cy="100" r="15" fill="#3498db" stroke="#2980b9" stroke-width="2"/>
+  <text x="420" y="105" text-anchor="middle" font-family="Arial" font-size="14" font-weight="bold" fill="white">1</text>
+
+  <!-- Callout 2: Ball Joint -->
+  <line x1="280" y1="280" x2="180" y2="280" stroke="#333" stroke-width="1.5"/>
+  <line x1="180" y1="280" x2="150" y2="250" stroke="#333" stroke-width="1.5"/>
+  <circle cx="150" cy="250" r="15" fill="#3498db" stroke="#2980b9" stroke-width="2"/>
+  <text x="150" y="255" text-anchor="middle" font-family="Arial" font-size="14" font-weight="bold" fill="white">2</text>
+
+  <!-- Callout 3: Control Arm -->
+  <line x1="400" y1="320" x2="500" y2="350" stroke="#333" stroke-width="1.5"/>
+  <circle cx="500" cy="350" r="15" fill="#3498db" stroke="#2980b9" stroke-width="2"/>
+  <text x="500" y="355" text-anchor="middle" font-family="Arial" font-size="14" font-weight="bold" fill="white">3</text>
+
+  <!-- Legend -->
+  <rect x="440" y="50" width="150" height="100" fill="white" stroke="#ccc" stroke-width="1" rx="5"/>
+  <text x="515" y="70" text-anchor="middle" font-family="Arial" font-size="12" font-weight="bold" fill="#333">Parts / Partes</text>
+  <text x="450" y="90" font-family="Arial" font-size="10" fill="#333">1. Strut / Amortiguador</text>
+  <text x="450" y="108" font-family="Arial" font-size="10" fill="#333">2. Ball Joint / Rotula</text>
+  <text x="450" y="126" font-family="Arial" font-size="10" fill="#333">3. Control Arm / Brazo</text>
+</svg>