# Back Office — Etiketlər (labels) modal

Bulk **label assign/remove** modal, built 1:1 from the reference screenshot with **general design-system components & tokens**.

## Composition (DS atoms)
- **Modal shell** — backdrop `--grey-100`, card 460px, radius 14, shadow; header (title `sub2/600` + close 32×32) + body + footer (top border).
- **Hərəkət Növü** — DS **Select** (trigger 44px, 1.5px `--grey-400`, r-sm; open → `--primary-500` + focus-ring; SelItem menu, selected = `--primary-50` + check). Options: «Etiketi təyin et» / «Etiketi sil».
- **Etiketlər** — DS **MultiSelect**: Input field (44px, wrap) with **Tag pills** (coloured per label: bolt `#37B24D`, getir `#7950F2`, yemeksepeti `#A61E4D`, each with × remove) + chevron. Dropdown option = **checkbox** (DS Checkbox atom, checked `--primary-500`) + name + **colour swatch** (36×18 r6).
- **Footer** — DS Buttons: «İmtina» (neutral) + «Saxla» (primary `--primary-500`), 40px r8.

## UX fix (the reported problem)
Original issue: in the MultiSelect the user picks tags, then must **click outside to close the dropdown before pressing Saxla** (two steps).

Fix: the MultiSelect dropdown is rendered **in-flow** — opening it **expands the modal** instead of overlaying the footer. So «Saxla» is always visible, and clicking it **applies the selection and saves in a single click** while the dropdown is still open (no click-outside first). Options toggle without closing the dropdown (multi-pick); pill × removes a tag.

## Notes
- Label colours are per-label swatches (user-defined); all structural colours/radii/type are DS tokens.