# Nexus Autoparts — Design System

## Paleta de Colores

Colores primarios, accent, semánticos y neutrales para ambos temas.

### Superficies

BG Primary
--color-bg-primary
BG Secondary
--color-bg-secondary
BG Tertiary
--color-bg-tertiary
BG Elevated
--color-bg-elevated
BG Hover
--color-bg-hover

### Accent

Accent
--color-accent
Accent Hover
--color-accent-hover
Accent Active
--color-accent-active
Accent Subtle
--color-accent-subtle
Accent Muted
--color-accent-muted

### Semanticos

Success
--color-success
Warning
--color-warning
Error
--color-error
Info
--color-info

## Tipografia

Escala tipografica con heading font y body font segun el tema activo.

H1 / 60px
Nexus Autoparts
H2 / 48px
Catalogo de Refacciones
H3 / 36px
Punto de Venta
H4 / 30px
Inventario General
H5 / 24px
Clientes Registrados
H6 / 20px
Detalle de Factura
Body / 16px
Busca entre mas de 1.4 millones de partes OEM y 300K aftermarket con compatibilidad verificada para cada vehiculo.
Small / 14px
Compatible con: Toyota Corolla 2018-2023, Honda Civic 2020-2024
Caption / 12px
Ultima actualizacion: hace 2 horas | SKU: NX-BRK-4521
Mono / Price
$1,245.00 MXN

## Botones

Primary, secondary, danger, ghost e icon buttons en 3 tamanos.

## Inputs y Formularios

Text, search, select, checkbox, radio, toggle.

Nombre del Producto Ingresa el nombre o numero de parte
Precio (MXN)
Correo (con error) El correo no tiene un formato valido
Categoria
Barra de Busqueda
🔍
Checkbox En stock Solo ofertas Envio gratis
Radio Efectivo Tarjeta Transferencia
Toggle
Notificaciones
Modo oscuro

## Cards

Producto, cliente y resumen (dashboard).

### Tarjeta de Producto

⚙
Balata Delantera Ceramica
SKU: NX-BRK-4521
$845.00
Toyota Corolla 2018-2023
⚙
Filtro de Aceite Premium
SKU: NX-FLT-8832
$189.00
Honda Civic 2020-2024
⚙
Amortiguador Trasero
SKU: NX-SUS-2211
$1,650.00
Nissan Sentra 2019-2023

### Tarjeta de Cliente

JR
Juan Rodriguez
Taller Mecanico Rodriguez
ML
Maria Lopez
Refaccionaria La Central
CP
Carlos Perez
AutoServicio Express

### Tarjeta Resumen (Dashboard)

Ventas Hoy
$24,580
+12.5% vs ayer
Productos Vendidos
47
+8 unidades
Clientes Nuevos
5
+2 esta semana
Stock Bajo
12
Requiere atencion

## Tabla con Paginacion

Tabla de datos con sorting y paginacion para inventario, ventas, etc.

SKU ▲ | Producto ▼ | Categoria | Stock | Precio | Estado
--- | --- | --- | --- | --- | ---
NX-BRK-4521 | Balata Delantera Ceramica | Frenos | 124 | $845.00 | En stock
NX-FLT-8832 | Filtro de Aceite Premium | Motor | 58 | $189.00 | En stock
NX-SUS-2211 | Amortiguador Trasero | Suspension | 3 | $1,650.00 | Stock bajo
NX-ELC-1105 | Alternador Remanufacturado | Electrico | 0 | $3,200.00 | Agotado
NX-MTR-7744 | Junta de Cabeza | Motor | 22 | $520.00 | En stock

Mostrando 1-5 de 1,423,847 productos

## Modal / Dialog

Ventana modal para confirmaciones, formularios y alertas.

### Confirmar Venta

Estas a punto de procesar una venta por $3,284.00 MXN para el cliente Juan Rodriguez.

Metodo de pago

## Tabs / Navegacion

Tabs para secciones como Inventario (7 tabs) y Contabilidad.

Contenido de la tab "General" se muestra aqui. Cada tab carga su contenido correspondiente.

## Badges y Tags

Indicadores de estado, categorias y etiquetas removibles.

### Badges

Nuevo En stock Stock bajo Agotado Pedido Inactivo

### Tags

Frenos × Toyota × 2020-2024 × OEM × Ceramica ×

## Toasts / Notificaciones

Mensajes de feedback para acciones del usuario.

✔
Venta completada
Folio #NX-2024-0847 generado exitosamente
❌
Error al procesar
No se pudo conectar con el servidor de facturacion
⚠
Stock insuficiente
Solo quedan 3 unidades de NX-SUS-2211
ℹ
Actualizacion disponible
Hay 247 nuevas partes en el catalogo

## Sidebar y Header

Navegacion principal de la aplicacion POS.

⚙ Nexus Autoparts
IA

## PIN Pad

Acceso rapido por PIN numerico para login.

🔒 Ingresa tu PIN

## Numpad

Teclado numerico para cantidades y precios en POS.

$1,245.00

## Listas (Carrito / Inventario)

Items de lista con cantidad, precio y acciones.

Carrito de Venta 3 items
⚙
Balata Delantera Ceramica
NX-BRK-4521 | Toyota Corolla
2
$1,690.00
⚙
Filtro de Aceite Premium
NX-FLT-8832 | Honda Civic
1
$189.00
⚙
Amortiguador Trasero
NX-SUS-2211 | Nissan Sentra
1
$1,650.00

## Avatares

Iniciales de usuario en diferentes tamanos.

I
IA
IA
IA
XS (24) / SM (32) / MD (40) / LG (56)

## Breadcrumbs

Navegacion jerárquica para secciones profundas.

## Dropdown

Menu contextual para acciones secundarias.

## Tooltips

Informacion contextual al hover.

Hover aqui
Balata ceramica de alto rendimiento
Stock info
124 unidades disponibles en almacen

## Barras de Progreso

Indicadores de progreso para stock, metas y procesos.

Meta de ventas diaria 78%
Stock balatas 92%
Stock amortiguadores 15%
Stock alternadores 0%

## Empty States

Estados vacios cuando no hay datos que mostrar.

🔍

### No se encontraron resultados

No hay productos que coincidan con tu busqueda. Intenta con otro termino o revisa los filtros aplicados.

## Loading States / Skeleton

Placeholders de carga mientras se obtienen datos.

## Iconografia POS

Set de iconos consistente para el sistema POS.

🛒
Carrito
⚙
Producto
👤
Cliente
📄
Factura
📦
Inventario
📈
Dashboard
⚙
Config
🔍
Buscar
💰
Ventas
📊
Reportes
🔒
Login
🔔
Alertas
Nota: En produccion, reemplazar emojis por un set SVG consistente (Lucide Icons, Phosphor, o iconos custom). Los emojis son solo placeholder.

## Referencia de Espaciado

Grid base de 4px para mantener consistencia visual.

4px (space-1)
8px (space-2)
16px (space-4)
24px (space-6)
32px (space-8)
48px (space-12)
64px (space-16)