# Koold Dashboard UI Kit

## Overview
High-fidelity recreation of the Koold cold chain monitoring dashboard — the primary product interface used by CSCO, CQO and operations teams.

## Design Language
- **Theme:** Dark — Deep Void (`#0F384D`) primary, Arctic Night (`#37657B`) surfaces
- **Accent:** Signal Ice (`#FEEC7E`) for CTAs and highlights (≤15% of frame)
- **Success/Compliance:** Pulse Green (`#B2DE7B`) and Compliance (`#589E84`)
- **Typography:** DM Sans for all UI; Cormorant Garamond for dashboard hero stats
- **Radius:** 4px throughout — sharp, precise
- **Shadows:** None on dark surfaces; `0 4px 16px rgba(15,56,77,0.12)` on light

## Components
| File | Description |
|------|-------------|
| `index.html` | Full interactive dashboard prototype |
| `Sidebar.jsx` | Left nav — logo, menu items, route list |
| `MetricCard.jsx` | KPI stat cards with trend indicators |
| `AlertBanner.jsx` | Top alert/notification strip |
| `SensorMap.jsx` | Route + sensor status grid |
| `ChartLine.jsx` | Temperature EKG-style line chart |

## Key Screens
1. **Dashboard Home** — Live route overview, KPI strip, active alerts
2. **Route Detail** — Temperature chart, sensor readings, compliance status
3. **Alert Center** — All active + resolved alerts, filter by severity
4. **Compliance Report** — Audit-ready GDP documentation view
