root = Card([header, thresholdCallout, searchForm, item1, item2, item3, item4, footnote], "card", "column", "m")
header = CardHeader("Low Inventory", "4 items at or below the reorder threshold")
thresholdCallout = Callout("info", "Reorder threshold: 20 units", "Items with 20 or fewer units on hand appear here. Reorder before they run out of stock.")
searchForm = Form("search-inventory", searchButtons, [searchControl])
searchControl = FormControl("Search items", searchInput, "Filter by item name, SKU, or category")
searchInput = Input("query", "Search low-inventory items…")
searchButtons = Buttons([searchBtn, clearBtn])
searchBtn = Button("Search", null, "primary")
clearBtn = Button("Clear", null, "tertiary")
item1 = Card([item1Info, item1Actions], "sunk", "row", "m", "center", "between")
item1Info = Card([item1Name, item1Meta], "clear", "column", "xs")
item1Name = TextContent("**Organic Cotton Tee**")
item1Meta = TextContent("SKU TEE-1002 · Apparel", "small")
item1Actions = Card([item1Units, item1Btn], "clear", "column", "s", "end")
item1Units = Tag("8 units remaining", null, "md", "danger")
item1Btn = Button("Reorder", null, "primary", null, "small")
item2 = Card([item2Info, item2Actions], "sunk", "row", "m", "center", "between")
item2Info = Card([item2Name, item2Meta], "clear", "column", "xs")
item2Name = TextContent("**Ceramic Pour-Over Set**")
item2Meta = TextContent("SKU CRM-2201 · Kitchen", "small")
item2Actions = Card([item2Units, item2Btn], "clear", "column", "s", "end")
item2Units = Tag("9 units remaining", null, "md", "danger")
item2Btn = Button("Reorder", null, "primary", null, "small")
item3 = Card([item3Info, item3Actions], "sunk", "row", "m", "center", "between")
item3Info = Card([item3Name, item3Meta], "clear", "column", "xs")
item3Name = TextContent("**Beeswax Candle Trio**")
item3Meta = TextContent("SKU CND-3307 · Home", "small")
item3Actions = Card([item3Units, item3Btn], "clear", "column", "s", "end")
item3Units = Tag("14 units remaining", null, "md", "warning")
item3Btn = Button("Reorder", null, "primary", null, "small")
item4 = Card([item4Info, item4Actions], "sunk", "row", "m", "center", "between")
item4Info = Card([item4Name, item4Meta], "clear", "column", "xs")
item4Name = TextContent("**Linen Napkin (Set of 4)**")
item4Meta = TextContent("SKU NAP-1104 · Dining", "small")
item4Actions = Card([item4Units, item4Btn], "clear", "column", "s", "end")
item4Units = Tag("19 units remaining", null, "md", "warning")
item4Btn = Button("Reorder", null, "primary", null, "small")
footnote = TextContent("Adjust the reorder threshold per product in **Settings → Inventory** to fine-tune alerts.", "small")