# Inventory Reports & Valuation Frontend Design

## Overview
Implement frontend for 3 resolved backend tickets:
- **#43** Inventory Reports API (movement-summary, slow-moving, warehouse-summary, expiry)
- **#38** Inventory Costing Engine (valuation endpoint only — product-cost and cost-layers return 404)
- **#71** Cost Layers integration (skipped — backend endpoints not implemented)

## Working API Endpoints

| Endpoint | Params | Response Shape |
|----------|--------|---------------|
| `GET /inventory/reports/movement-summary` | `date_from`, `date_to` | `{data: {date_from, date_to, items: [{product_id, product_name, product_code, opening_qty, receipts, issues, transfers_in, transfers_out, adjustments_in, adjustments_out, closing_qty}], summary: {total_products, total_receipts, total_issues}}}` |
| `GET /inventory/reports/slow-moving` | `days` (default 90) | `{data: {days_threshold, items: [], summary: {total_items, total_quantity, total_value}}}` |
| `GET /inventory/reports/warehouse-summary` | none | `{data: {warehouses: [{warehouse_id, warehouse_name, warehouse_code, total_products, total_quantity, total_value, last_activity}], summary: {total_warehouses, grand_total_quantity, grand_total_value}}}` |
| `GET /inventory/reports/expiry` | `as_of_date` | `{data: {days_ahead, items: [], summary: {total_items, already_expired, expiring_soon, total_value_at_risk}}}` |
| `GET /inventory/costing/valuation` | `as_of_date` (optional) | `{data: {summary: {total_items, total_quantity, total_value}, items: [{product_id, product_name, product_code, product_category_id, product_variant_id, warehouse_id, warehouse_name, quantity, average_cost, total_value}]}}` |

## Architecture

### New Files
1. `src/app/core/services/inventory-report.service.ts` — 5 API methods
2. `src/app/features/inventory-reports/inventory-reports.component.ts`
3. `src/app/features/inventory-reports/inventory-reports.component.html`
4. `src/app/features/inventory-reports/inventory-reports.component.scss`

### Modified Files
5. `src/app/app.routes.ts` — add route `/core/inventory-reports`
6. `src/app/layout/sidebar/sidebar.component.ts` — add nav item
7. `src/assets/i18n/ar.json` — add translation keys
8. `src/assets/i18n/en.json` — add translation keys

### Page Layout (5 tabs)
1. Movement Summary — date range → product movement table + summary stat cards
2. Warehouse Summary — no filter → warehouse cards + table
3. Slow Moving — days input → items table + summary
4. Expiry Tracking — date → items table + summary cards (expired/expiring/value at risk)
5. Inventory Valuation — date → grouped table + charts (value by product, value by warehouse)

### Design Patterns
- Reuse stat-card, chart-card, section-card SCSS from stock-card component
- Use PrimeNG Tabs, Table, DatePicker, Chart, Tag components
- Follow existing reports.component.ts pattern for tab switching
- Standalone component with lazy loading

### Stock Card Enhancement
- Add valuation data from `/inventory/costing/valuation` filtered by current productId
- Show as additional stat or section (if meaningful data exists)