# KDS — Stop list (interaktiv prototip)

`KDS-Stop-List-Spec.md`-dən birə-bir — **mövcud komponentlərdən** yığılır, **Inter** tipoqrafiya,
yalnız **DS tokenləri**. Ekran 1024×880, navy `#10243C`.

## Layout
- **Sol header** 624×64 (`#23364C`) — geri ox + "Stop list".
- **Sol məzmun** 624×816 — **boş-vəziyyət** *və ya* **table**.
- **Sağ panel** (Kateqoriya list) left 624, 400×880 (`#23364C`) — header (geri/axtar/ev) + grid/məhsul/axtarış.

## İnteraktiv axın
1. Grid (2 sütun, 182×64 kart, 8 kateqoriya) → kateqoriyaya klik → **məhsul siyahısı** (368×64).
2. **Axtar ikonu** → axtarış paneli (canlı filter).
3. Məhsula klik → **modal** (500w, başlıq `#35325E`, stepper 64×64, keypad 4×3 h70, "Stop siyahısına əlavə et" qırmızı outline / "Limit təyin et" mavi).
4. Əlavə → sol **table**-a düşür (Məhsul 281 · Şöbə 160 · Limit 80 · Sil 70; kateqoriya+şöbə avtomatik).
5. Table filtrləri (Axtar + Kateqoriya + Şöbə dropdown) birlikdə işləyir; trash sətri silir; boşalanda boş-vəziyyət qayıdır.
6. Sağ panel: ev → grid, geri → 1 addım.

## Komponentlər
Kateqoriya kartı · məhsul kartı · search · table (header/rows) · select dropdown (interaktiv) ·
modal keypad + Extra Large 56 düymələr · ikonlar (redraw). Keypad: rəqəm əlavə (maks 4), `.` onluq,
`⌫` silir, −/+ dəyəri 1 azaldır/artırır (min 0).

## Qeyd
Rənglər KDS scale tokenlərinə bağlıdır (navy=text-500 · panel=text-400 · muted=text-200 · red-500 ·
white-500 · grey-400/500), `data-theme="light"` scope. Spec-ə uyğun fərqli dəyərlər literal
(blue `#2684FF` global primary · modal `#35325E` · keypad `#F2F4F5` · key `#F8FAFB`).