Screen ID: CON-030
Flow: Home → Main Dashboard
Previous: CON-010 Login / CON-020 Address Setup
Next: Various (Search, Product, Cart, etc.)

Header (app-header--home): Dark green (#043F2D) header with two rows. Top row has address selector (tappable, opens address picker) and notification bell with red unread indicator dot. Second row is a search bar that navigates to the search screen on tap.

Delivery Slot Banner: Tappable card showing next available delivery slot. Tapping opens the delivery slot picker (CON-032). Displays truck icon, time slot, and "Change" action link.

Promo Carousel: Horizontally swipeable promo banners with CSS scroll-snap. Slider dots below indicate position. Each banner is tappable and navigates to promotion detail (CON-033).

Categories: Horizontally scrollable row of 8 category icons. Each taps through to a filtered product listing. Icons use emoji placeholders (replace with designed assets in production).

Quick Shops: Curated bundles/collections. Horizontal scroll with cards showing image, title, and item count. "See All" navigates to CON-034. Individual cards navigate to CON-035 collection detail.

On Special (Product Grid): 2x2 product grid using shared .product-card component. Products with discounts show a SAVE badge and struck-through original price. "+ Add" button adds item to cart (replaces with qty stepper when in cart).

Popular Right Now: Horizontally scrollable product row showing trending items. Uses same .product-card component in a narrower (150px) format.

Floating Cart Bar: Fixed at bottom above nav. Shows item count (with accent badge), text summary, and total. Tapping navigates to cart (CON-060). Only visible when cart has items.

States: Toggle between "populated" (full content) and "loading" (skeleton placeholders) using the state bar. The loading state matches the skeleton screen (CON-031).

Bottom Navigation: 4 tabs — Home (active), Discover, My Shop, Profile. Active tab determined by data-active-nav="home" on body.

Currency: South African Rand, formatted as "R XX.XX" with space after R. Thousands separator is comma (e.g., R 1,234.00).