Output:
Chunk ID: d24bf5
Wall time: 0.0000 seconds
Process exited with code 0
Original token count: 2742
Output:
# 03 - Admin Panel UI/UX Specification

This document defines every view, component, and interaction for the admin panel. The admin is entirely server-rendered using Laravel 12 + Livewire v4 + Flux UI Free components + Tailwind CSS v4. There is no SPA or client-side router.

**Flux UI Free components available:** avatar, badge, brand, breadcrumbs, button, callout, checkbox, dropdown, field, heading, icon, input, modal, navbar, profile, radio, select, separator, switch, text, textarea, tooltip

Anything not covered by Flux UI Free uses plain Tailwind CSS v4 markup with Livewire directives.

---

## 1. Admin Layout Shell

The admin layout is a persistent shell that wraps every admin page. It consists of a left sidebar, a top bar, and a main content area.

### 1.1 Route Prefix

All admin routes live under `/admin` and are protected by authentication middleware plus store-scoping middleware. The store is resolved from the session or a store-selector in the top bar.

### 1.2 Sidebar Navigation

**Livewire component:** `App\Livewire\Admin\Layout\Sidebar`

**Blade view:** `resources/views/livewire/admin/layout/sidebar.blade.php`

#### Component Requirements

| Property | Type | Purpose |
|----------|------|---------|
| `collapsed` | `bool` | Whether the sidebar is collapsed (mobile state) |
| `currentRoute` | `string` | The current route name for active highlighting |

| Action | Behavior |
|--------|----------|
| `toggle()` | Toggles the `collapsed` state |

#### Wireframe

```
+-------------------------------+
|  [BRAND LOGO]  Platform Name  |
|-------------------------------|
|  [separator]                  |
|                               |
|  [chart-bar]    Dashboard     |
|                               |
|  PRODUCTS                     |
|  [cube]         Products      |
|  [rect-stack]   Collections   |
|  [archive-box]  Inventory     |
|                               |
|  [separator]                  |
|  ORDERS                       |
|  [shopping-bag] Orders        |
|                               |
|  [separator]                  |
|  CUSTOMERS                    |
|  [users]        Customers     |
|                               |
|  [separator]                  |
|  DISCOUNTS                    |
|  [tag]          Discounts     |
|                               |
|  [separator]                  |
|  CONTENT                      |
|  [doc-text]     Pages         |
|  [bars-3]       Navigation    |
|  [paint-brush]  Themes        |
|                               |
|  [separator]                  |
|  [chart-pie]    Analytics     |
|  [cog-6-tooth]  Settings      |
|  [squares-2x2]  Apps          |
|  [code-bracket] Developers    |
+-------------------------------+
```

#### Navigation Structure

```
Dashboard                        -> admin.dashboard
Products (group label)
  Products                       -> admin.products.index
  Collections                    -> admin.collections.index
  Inventory                      -> admin.inventory.index
Orders
  Orders                         -> admin.orders.index
Customers
  Customers                      -> admin.customers.index
Discounts
  Discounts                      -> admin.discounts.index
Content (group label)
  Pages                          -> admin.pages.index
  Navigation                     -> admin.navigation.index
  Themes                         -> admin.themes.index
Analytics                        -> admin.analytics.index
Settings                         -> admin.settings.index
Apps                             -> admin.apps.index
Developers                       -> admin.developers.index
```

Each nav item displays an icon (via Flux icon component) and a text label. The active item receives a highlighted background and bold text. All navigation links use Livewire SPA-style page transitions. Groups are visually separated with Flux separator components.

#### Flux Component Mapping

| UI Element | Flux Component |
|-----------|----------------|
| Platform logo and name | `brand` |
| Navigation icons | `icon` |
| Group dividers | `separator` |

#### Responsive Behavior

- **Desktop (lg and above):** Sidebar is always visible, fixed left, 256px wide. Main content has a left margin of 256px.
- **Mobile (below lg):** Sidebar is hidden off-screen. A hamburger button (icon: bars-3) appears in the top bar. When user clicks it, the sidebar slides in as an overlay with a semi-transparent backdrop. Clicking the backdrop or a nav item closes it.

### 1.3 Top Bar

**Livewire component:** `App\Livewire\Admin\Layout\TopBar`

**Blade view:** `resources/views/livewire/admin/layout/top-bar.blade.php`

#### Component Requirements

| Property | Type | Purpose |
|----------|------|---------|
| `currentStoreName` | `string` | Name of the active store |
| `stores` | `Collection` | List of stores the user has access to |
| `unreadNotificationCount` | `int` | Count of unread notifications |

| Action | Behavior |
|--------|----------|
| `switchStore(string $storeId)` | Switches active store in session, redirects to dashboard |

#### Wireframe

```
+--------------------------------------------------------------------+
| [hamburger*]  [Store Name v]                  [bell(3)]  [avatar v] |
+--------------------------------------------------------------------+
  * hamburger visible on mobile only

  Store Name dropdown:
    - Store A
    - Store B
    - Store C

  Avatar dropdown:
    - Settings (links to /admin/settings)
    - [separator]
    - Log out (POST /logout with CSRF)
```

#### Interaction Flows

- When user clicks the store name, a dropdown appears listing all stores. Clicking a store calls `switchStore()` which updates the session and redirects to the dashboard.
- Notification bell shows an unread count badge (positioned absolutely over the icon) when `unreadNotificationCount > 0`.
- Profile dropdown is triggered by a Flux profile component showing the user's avatar and name.

#### Flux Component Mapping

| UI Element | Flux Component |
|-----------|----------------|
| Store selector | `dropdown` |
| Hamburger (mobile) | `button` (icon: bars-3) |
| Notification bell | `button` (icon: bell, variant: ghost) |
| Notification count | `badge` |
| User profile trigger | `profile` |
| Profile menu | `dropdown` |
| Menu divider | `separator` |

### 1.4 Main Content Area

The main content area sits to the right of the sidebar and below the top bar. Every page renders within this area.

**Breadcrumbs:** Every page includes a Flux breadcrumbs component at the top of the content area. The first item is always "Home" linking to `/admin`. Subsequent items reflect the page hierarchy. Example for product edit: Home > Products > "Blue T-Shirt".

**Layout wrapper:** The content area has consistent padding (larger on desktop, smaller on mobile) and a max-width container centered horizontally.

### 1.5 Toast Notifications

A global toast notification system lives in the layout shell. It uses Alpine.js to listen for Livewire dispatched events.

| Property | Value |
|----------|-------|
| Event name | `toast` |
| Payload | `{ type: 'success' / 'error' / 'info', message: string }` |
| Position | Top-right corner |
| Auto-dismiss | 5 seconds |
| Stacking | Supports multiple toasts |
| Styling | Rounded card, shadow, colored left border (green=success, red=error, blue=info) |

Components dispatch toasts after successful actions (e.g., "Product saved successfully.") or on errors ("Something went wrong. Please try again.").

### 1.6 Dark Mode

The admin supports dark mode via Tailwind's `dark:` variant. The mode follows the user's system preference by default. A toggle can be added in the profile dropdown later. All components and custom markup must include dark mode variants.

Dark mode preference is persisted in `localStorage` under the key `theme` with values `light` or `dark`. On page load, the stored preference is applied before first paint to avoid flash of incorrect theme. If no preference is stored, the system preference (`prefers-color-scheme`) is used as default.

---

## 2. Dashboard

**Route:** `GET /admin`

**Livewire component:** `App\Livewire\Admin\Dashboard`

**Blade view:** `resources/views/livewire/admin/dashboard.blade.php`

### Component Requirements

| Property | Type | Purpose |
|----------|------|---------|
| `dateRange` | `string` | Active date range preset: `today`, `last_7_days`, `last_30_days`, `custom` |
| `customStartDate` | `?string` | Custom range start (Y-m-d) |
| `customEndDate` | `?string` | Custom range end (Y-m-d) |
| `totalSales` | `int` | Total sales amount in minor units |
| `ordersCount` | `int` | Number of orders in range |
| `averageOrderValue` | `int` | Average order value in minor units |
| `visitorsCount` | `int` | Unique visitors in range |
| `salesChange` | `float` | Percentage change vs previous period |
| `ordersChange` | `float` | Percentage change vs previous period |
| `aovChange` | `float` | Percentage change vs previous period |
| `visitorsChange` | `float` | Percentage change vs previous period |
| `ordersChartData` | `array` | Array of `{date, count}` for last 30 days |
| `topProducts` | `array` | Top 5 products: `{title, units_sold, revenue}` |
| `funnelData` | `array` | Funnel steps: `{visits, add_to_cart, checkout_started, checkout_completed}` |

| Action | Behavior |
|--------|----------|
| `updatedDateRange()` | Re-fetches all KPI data for the selected range |
| `loadKpis()` | Queries aggregated order/analytics data |
| `loadChart()` | Queries daily order counts for chart |
| `loadTopProducts()` | Queries top 5 products by revenue |
| `loadFunnel()` | Queries conversion funnel data |

| Computed Property | Purpose |
|-------------------|---------|
| `formattedTotalSales` | Formatted currency string |
| `formattedAov` | Formatted currency string |

### Wireframe

```
+------------------------------------------------------------------+
| Dashboard                           [Today v] (date range picker) |
+------------------------------------------------------------------+
|                                                                    |
|  +-------------+  +-------------+  +-------------+  +----------+  |
|  | Total Sales |  | Orders      |  | Avg Order   |  | Visitors |  |
|  | $12,345     |  | 156         |  | $79.13      |  | 2,340    |  |
|  | [+12.3%] ^  |  | [+8.1%] ^  |  | [-2.1%] v  |  | [+5%] ^  |  |
|  +-------------+  +-------------+  +-------------+  +----------+  |
|                                                                    |
|  +--------------------------------------------------------------+  |
|  | Orders over time                                              |  |
|  |  [line/bar chart - daily order counts for selected range]     |  |
|  +--------------------------------------------------------------+  |
|                                                                    |
|  +------------------------------+  +----------------------------+  |


Output:
Chunk ID: c94225
Wall time: 0.0000 seconds
Process exited with code 0
Original token count: 3334
Output:
# 04 - Storefront UI/UX Specification

> E-commerce platform - Customer-facing storefront UI/UX requirements

---

## Conventions

| Convention | Detail |
|---|---|
| CSS Framework | Tailwind CSS v4, mobile-first design, dark mode support |
| Interactivity | Livewire v4 for all dynamic UI (cart, filters, checkout) |
| Templating | Blade templates with reusable storefront-prefixed components |
| Accessibility | WCAG 2.2 AA compliance throughout |
| Responsive | Mobile-first with progressive enhancement at small, medium, large, and extra-large breakpoints |
| Currency | All prices stored as integers (cents), formatted with locale-aware helpers |
| Images | Lazy-loaded, with proper alt text and maintained aspect ratios |

---

## Currency Formatting

All monetary amounts are stored as integers in minor units (cents) and must be formatted for display according to these rules:

| Setting | Value |
|---------|-------|
| Decimal separator | `.` (period) |
| Thousands separator | `,` (comma) |
| Currency symbol | After amount with space (e.g., `24.99 EUR`) |
| Decimal places | Always 2 |
| Free amounts | Display as `0.00 EUR` |
| Negative amounts (refunds) | Prefix with `-` (e.g., `-12.50 EUR`) |

**Helper:** Use a shared Blade component or helper (e.g., `<x-price :amount="$amount" :currency="$currency" />`) to ensure consistent formatting across all storefront pages.

**Examples:**
- 2499 cents -> `24.99 EUR`
- 0 cents -> `0.00 EUR`
- 149900 cents -> `1,499.00 EUR`

---

## 1. Theme System Architecture

### 1.1 View Organization

The storefront views are organized into the following categories:

| Category | Purpose | Views |
|---|---|---|
| Layouts | Master page shell | app (master layout) |
| Pages | Core storefront pages | home, collection, product, cart, search, page (static CMS) |
| Checkout | Purchase flow | checkout index, order confirmation |
| Account | Customer area | login, register, dashboard, orders (list + detail), addresses |
| Errors | Error states | 404, 503 |
| Components | Reusable UI elements | product-card, price, badge, quantity-selector, address-form, order-summary, breadcrumbs, pagination |

### 1.2 Layout Hierarchy

All storefront pages extend a single master layout, which provides the full page shell including header, footer, cart drawer, and global Livewire listeners. Individual page templates fill the main content section.

### 1.3 Theme Settings

Theme settings are stored in the database as JSON (keyed by theme ID). A singleton service loads and caches the active theme settings for the current store. Settings control:

- Announcement bar visibility, text, link, and background color
- Sticky header toggle
- Home page section order and visibility
- Color palette overrides (primary, secondary, accent)
- Typography scale
- Footer content and social links
- Dark mode behavior (system preference, toggle, or forced)

### 1.4 Section-Based Architecture

Each page is composed of configurable sections. Sections are Blade includes or Livewire components receiving configuration from theme settings.

| Section | Description | Used On |
|---|---|---|
| Hero | Full-width banner with heading, subheading, call-to-action | Home |
| Featured Collections | Grid of collection cards | Home |
| Featured Products | Grid of product cards (lazy-loaded) | Home |
| Newsletter | Email signup form | Home, Footer |
| Rich Text | Customizable content block | Home, Pages |

### 1.5 Blade Components

All reusable UI elements are implemented as Blade components with a storefront prefix. See Section 16 for the full component library reference.

---

## 2. Base Layout

### 2.1 Document Head

The document head includes:

| Element | Description |
|---|---|
| Character encoding | UTF-8 |
| Viewport | Width = device width, initial scale 1 |
| Meta description | Page-specific, yielded from child templates |
| Title | Page-specific title appended with the app name |
| Stylesheets | Compiled CSS via Vite |
| Scripts | Compiled JS via Vite |
| Livewire styles | Injected by Livewire |
| Language attribute | Set on the HTML element from application locale |
| Scroll behavior | Smooth scrolling enabled globally |

### 2.2 Skip Link

A visually hidden "Skip to main content" link is the first element in the body. It becomes visible on keyboard focus, positioned fixed at top-left with a clear visual treatment (solid background, shadow, focus ring). Supports dark mode.

**Accessibility:** Allows keyboard users to bypass the header navigation and jump directly to the main content area.

### 2.3 Announcement Bar

Optional, controlled by theme settings. Renders a full-width bar above the header.

| Attribute | Description |
|---|---|
| Position | Full-width, above the header |
| Background | Configurable color, defaults to dark background (light text) / inverted in dark mode |
| Text | Centered, small size, configurable content |
| Link | Optional, underlined, opens in same tab |
| Dismiss | Close button (X icon) on the right side; dismissal persisted via localStorage |
| Height | Auto height with vertical padding |

### 2.4 Header

The header serves as the primary navigation banner.

**Desktop Layout (large breakpoint and above):**

```
+--------------------------------------------------------------+
| [Logo]      [Nav Item] [Nav Item] [Nav Item]     [S] [C] [A] |
+--------------------------------------------------------------+
```

| Element | Position | Description |
|---|---|---|
| Logo | Left | Linked to home page. Shows image if logo URL is set in theme settings, otherwise store name as text. Max height approximately 40px on desktop, 32px on smaller screens |
| Main Navigation | Center | Horizontal nav with links sourced from the "main-menu" navigation menu. Supports one level of dropdown submenus (revealed on hover/focus) |
| Search Icon | Right group | Button that opens the search modal |
| Cart Icon | Right group | Button that opens the cart drawer. Displays item count badge (small circular indicator, primary color background, white text) |
| Account Icon | Right group | Link to account dashboard (logged in) or login page (guest) |

**Mobile Layout (below large breakpoint):**

```
+--------------------------------------------------------------+
| [Hamburger]           [Logo]                            [Cart]|
+--------------------------------------------------------------+
```

| Element | Position | Description |
|---|---|---|
| Hamburger menu | Left | Toggle button for mobile navigation drawer |
| Logo | Center | Same as desktop but horizontally centered |
| Cart icon | Right | Same as desktop |

**Sticky Header (optional):**

When enabled in theme settings, the header sticks to the top of the viewport with a semi-transparent background and backdrop blur. A subtle bottom border appears on scroll.

**Mobile Navigation Drawer:**

| Attribute | Description |
|---|---|
| Animation | Slides in from the left side |
| Height | Full viewport height |
| Backdrop | Semi-transparent dark overlay behind the drawer |
| Close button | X icon at the top-right of the drawer |
| Navigation items | Vertical stack with comfortable tap targets |
| Submenus | Collapsible accordion pattern with chevron icons |
| Account link | Positioned at the bottom of the navigation list |
| Focus behavior | Focus is trapped within the drawer while open |
| ARIA | Labeled as "Mobile navigation" |

### 2.5 Main Content Area

The main content area is a landmark element with a unique ID for skip-link targeting. It occupies at least the full viewport height.

### 2.6 Footer

The footer is a content-info landmark.

**Layout:**

```
+--------------------------------------------------------------+
| [Column 1: Links]  [Column 2: Links]  [Column 3: Store Info] |
|                                                               |
| [Social Icons]                                                |
| [Copyright] [Payment Icons]                                   |
+--------------------------------------------------------------+
```

| Element | Description |
|---|---|
| Link columns | Responsive grid: 2 columns on mobile, 3 on tablet, up to 4 on desktop. Links sourced from "footer-menu" navigation menu. Each column has an uppercase heading and a list of links |
| Store info column | Store name, address (if configured), contact email |
| Social links | Row of icon links (Facebook, Instagram, Twitter/X, TikTok, YouTube) configured in theme settings. Each with screen reader label. Icons are 20x20, muted color with hover to full contrast |
| Copyright line | Small muted text: "(c) {year} {store name}. All rights reserved." |
| Payment method icons | Row of SVG icons for accepted payment methods (Visa, Mastercard, Amex, PayPal, etc.). Slightly reduced opacity |
| Spacing | Generous vertical padding, content constrained to max-width container with horizontal padding |
| Background | Light gray (dark: very dark gray), top border separator |

### 2.7 Cart Drawer (Livewire)

The cart drawer is always present in the layout as a global Livewire component. It listens for the "cart-updated" browser event to refresh and open. See Section 6 for full specification.

### 2.8 Dark Mode

Dark mode is implemented via Tailwind's dark variant. The behavior is controlled by theme settings:

| Mode | Implementation |
|---|---|
| System preference (default) | Follows OS-level dark mode preference automatically |
| Toggle | User-controlled toggle button in header/footer; preference stored in localStorage |
| Forced light/dark | Applied at server render time on the HTML element |

**Color Token Patterns:**

| Token | Light Mode | Dark Mode |
|---|---|---|
| Page background | White | Near-black |
| Card/section background | Light gray | Very dark gray |
| Heading text | Near-black | White |
| Body text | Medium gray | Light gray |
| Borders | Light gray | Medium-dark gray |
| Primary actions | Blue, darkens on hover | Slightly lighter blue, lightens on hover |

---

## 3. Home Page (GET /)

The home page renders sections in the order defined by theme settings. Each section can be toggled on/off and reordered. Default section order:

1. Hero Banner
2. Featured Collections
3. Featured Products
4. Newsletter Signup
5. Rich Text

### 3.1 Hero Banner Section

**Layout:** Full-width container (no max-width on the outer wrapper). Inner content constrained to standard max-width.

**Desktop (large breakpoint and above):**

```
+--------------------------------------------------------------+
|                                                               |
|  [Background Image / Gradient]                                |
|                                                               |
|       [Heading - very large, bold]                            |
|       [Subheading - medium, regular weight]                   |
|       [CTA Button - primary, large]                           |
|                                                               |
+--------------------------------------------------------------+
```

| Attribute | Description |
|---|---|
| Background | Full-width image (cover, centered) or gradient. Image set via theme settings. Semi-transparent dark overlay for text readability |
| Content | Centered vertically and horizontally, white text |
| Heading | H1 or H2 depending on context. Very large on desktop, progressively smaller on mobile. Bold, tight tracking |
| Subheading | Regular paragraph, medium size, generous top margin. Constrained to a comfortable reading width |
| CTA | Styled as primary button, large. Links to a configured collection or product |
| Height | Minimum 600px on desktop, 500px on tablet, 400px on mobile, 300px on small mobile |
| Padding | Generous vertical and horizontal padding |

**Mobile:** Same structure but stacked, with reduced font sizes and shorter minimum height. Full-bleed background image remains.

**Accessibility:**

- If background is an image, it is decorative (the content provides meaning)
- CTA button has descriptive text (e.g., "Shop the summer collection")

### 3.2 Featured Collections Section

**Layout:** Section with heading and grid of collection cards.

| Attribute | Description |
|---|---|
| Section heading | H2, large, bold, centered, with generous bottom margin |
| Grid | 2 columns on mobile, 4 columns on large screens, with gap spacing |
| Count | 2 to 4 collections, configurable in theme settings |

**Collection Card:**

```
+---------------------------+
|  [Collection Image]       |
|  3:4 aspect ratio         |
|  cover-fit, rounded       |
|                           |
|  [Title overlay at bottom]|
|  [Shop now ->]            |
+---------------------------+
```

| Element | Description |
|---|---|
| Image | 3:4 aspect ratio, cover-fit, rounded corners. Gradient overlay at bottom fading from transparent to semi-transparent dark |
| Title | White text overlaid at bottom of image, semi-bold, medium-large size |
| "Shop now" link | Small white text below title, slightly transparent, underlined. Becomes fully opaque on hover |
| Interaction | Entire card is clickable. Subtle scale-up on hover with smooth transition |

**Accessibility:**

- Each card link has the collection title as accessible name
- Images have alt text matching the collection title

### 3.3 Featured Products Section

**Livewire Component:** FeaturedProducts


rg -n "Products|Collections|Catalog|Product detail|Collection|Search|Admin|Storefront" specs/02-API-ROUTES.md specs/03-ADMIN-UI.md specs/04-STOREFRONT-UI.md specs/08-PLAYWRIGHT-E2E-PLAN.md

rg -n 'Products|Collections|Catalog|Product detail|Collection|Search|Admin|Storefront' specs/02-API-ROUTES.md specs/03-ADMIN-UI.md specs/04-STOREFRONT-UI.md specs/08-PLAYWRIGHT-E2E-PLAN.md

Question: Products|Collections|Catalog|Product detail|Collection|Search|Admin|Storefront

specs/04-STOREFRONT-UI.md:1:# 04 - Storefront UI/UX Specification
specs/04-STOREFRONT-UI.md:81:| Featured Collections | Grid of collection cards | Home |
specs/04-STOREFRONT-UI.md:82:| Featured Products | Grid of product cards (lazy-loaded) | Home |
specs/04-STOREFRONT-UI.md:145:| Search Icon | Right group | Button that opens the search modal |
specs/04-STOREFRONT-UI.md:242:2. Featured Collections
specs/04-STOREFRONT-UI.md:243:3. Featured Products
specs/04-STOREFRONT-UI.md:282:### 3.2 Featured Collections Section
specs/04-STOREFRONT-UI.md:292:**Collection Card:**
specs/04-STOREFRONT-UI.md:296:|  [Collection Image]       |
specs/04-STOREFRONT-UI.md:317:### 3.3 Featured Products Section
specs/04-STOREFRONT-UI.md:319:**Livewire Component:** FeaturedProducts
specs/04-STOREFRONT-UI.md:327:| Products | 4 to 8, configurable. Sourced from a configured collection or "best sellers" logic |
specs/04-STOREFRONT-UI.md:376:## 4. Collection Page (GET /collections/{handle})
specs/04-STOREFRONT-UI.md:378:**Livewire Component:** CollectionPage
specs/04-STOREFRONT-UI.md:380:### 4.1 Collection Header
specs/04-STOREFRONT-UI.md:384:| Breadcrumbs | Home > Collections > {Collection Title} |
specs/04-STOREFRONT-UI.md:538:|  [Search icon - large, muted]                                 |
specs/04-STOREFRONT-UI.md:625:Home > {Primary Collection} > {Product Title}. Small, muted text with separator characters.
specs/04-STOREFRONT-UI.md:1408:## 11. Search
specs/04-STOREFRONT-UI.md:1410:### 11.1 Search Modal
specs/04-STOREFRONT-UI.md:1412:**Livewire Component:** SearchModal
specs/04-STOREFRONT-UI.md:1418:|  [Search input with icon]                           [X close] |
specs/04-STOREFRONT-UI.md:1420:|  Products                                                     |
specs/04-STOREFRONT-UI.md:1424:|  Collections                                                  |
specs/04-STOREFRONT-UI.md:1425:|  Summer Collection                                            |
specs/04-STOREFRONT-UI.md:1426:|  Winter Collection                                            |
specs/04-STOREFRONT-UI.md:1436:| Search input | Large text, search icon prefix, autofocus on open. Live binding with 300ms debounce |
specs/04-STOREFRONT-UI.md:1437:| Results | Appear below input as user types. Grouped by type: "Products" and "Collections" headings |
specs/04-STOREFRONT-UI.md:1439:| Collection results | Title only. Clickable to collection page |
specs/04-STOREFRONT-UI.md:1446:| ARIA | Dialog role, modal, labeled "Search". Results list as listbox with option items |
specs/04-STOREFRONT-UI.md:1448:### 11.2 Search Results Page (GET /search?q=)
specs/04-STOREFRONT-UI.md:1450:**Livewire Component:** SearchResults
specs/04-STOREFRONT-UI.md:1456:| Heading | H1, "X results for '{query}'" or "Search results for '{query}'" |
specs/04-STOREFRONT-UI.md:1457:| Breadcrumbs | Home > Search results |
specs/04-STOREFRONT-UI.md:1490:|  [Search input]                                               |
specs/04-STOREFRONT-UI.md:1501:| Search | Simple input + button, submits to search page |
specs/04-STOREFRONT-UI.md:1547:| Collection filters | Drawer overlay | Drawer overlay | Persistent sidebar |
specs/04-STOREFRONT-UI.md:1580:| Collection Page | Live region for product count/grid on filter change. Filter sidebar labeled as navigation. Sort dropdown has associated label |
specs/04-STOREFRONT-UI.md:1584:| Search Modal | Dialog role with modal behavior. Results as listbox with option items. Active descendant tracking for keyboard navigation |
specs/04-STOREFRONT-UI.md:1596:| Search modal | Escape | Close |
specs/04-STOREFRONT-UI.md:1597:| Search results | Arrow Up/Down | Navigate results |
specs/04-STOREFRONT-UI.md:1598:| Search results | Enter | Select highlighted result |
specs/04-STOREFRONT-UI.md:1727:| FeaturedProducts | Home page | Lazy-loaded featured products grid |
specs/04-STOREFRONT-UI.md:1729:| CollectionPage | Collection page | Filtering, sorting, pagination |
specs/04-STOREFRONT-UI.md:1734:| SearchModal | Layout (global) | Autocomplete search overlay |
specs/04-STOREFRONT-UI.md:1735:| SearchResults | Search page | Full search results with filters |
specs/04-STOREFRONT-UI.md:1751:| open-search-modal | Header search icon click | SearchModal | None |
specs/04-STOREFRONT-UI.md:1752:| close-search-modal | SearchModal close actions | SearchModal | None |
specs/04-STOREFRONT-UI.md:1766:| Collection | "{Collection title} - {Store name}" | Collection description (stripped of markup) |
specs/04-STOREFRONT-UI.md:1769:| Search | "Search results - {Store name}" | Static |
specs/04-STOREFRONT-UI.md:1802:    B --> C[Collection Page]
specs/04-STOREFRONT-UI.md:1803:    B --> D[Search Modal]
specs/04-STOREFRONT-UI.md:1804:    D --> E[Search Results Page]
specs/03-ADMIN-UI.md:1:# 03 - Admin Panel UI/UX Specification
specs/03-ADMIN-UI.md:11:## 1. Admin Layout Shell
specs/03-ADMIN-UI.md:21:**Livewire component:** `App\Livewire\Admin\Layout\Sidebar`
specs/03-ADMIN-UI.md:47:|  [cube]         Products      |
sp…31345 chars truncated…duct page - gallery, variant selector, add-to-cart | `Storefront\Products\Show` |
specs/02-API-ROUTES.md:158:| GET | `/cart` | Full cart page - line items, quantity controls, discount input, totals | `Storefront\Cart\Show` |
specs/02-API-ROUTES.md:159:| GET | `/search` | Search results page with filter panel, sort dropdown, product grid | `Storefront\Search\Index` |
specs/02-API-ROUTES.md:160:| GET | `/pages/{handle}` | Static content page (About, FAQ, etc.) | `Storefront\Pages\Show` |
specs/02-API-ROUTES.md:168:| GET | `/account` | Customer account overview | `Storefront\Account\Dashboard` |
specs/02-API-ROUTES.md:169:| GET | `/account/orders` | Order history list | `Storefront\Account\Orders\Index` |
specs/02-API-ROUTES.md:170:| GET | `/account/orders/{orderNumber}` | Order detail | `Storefront\Account\Orders\Show` |
specs/02-API-ROUTES.md:171:| GET | `/account/addresses` | Address book management | `Storefront\Account\Addresses\Index` |
specs/02-API-ROUTES.md:177:| GET | `/account/login` | Customer login page | `Storefront\Account\Auth\Login` |
specs/02-API-ROUTES.md:178:| GET | `/account/register` | Customer registration page | `Storefront\Account\Auth\Register` |
specs/02-API-ROUTES.md:179:| GET | `/forgot-password` | Forgot password page | `Storefront\Account\Auth\ForgotPassword` |
specs/02-API-ROUTES.md:181:| GET | `/reset-password/{token}` | Reset password form | `Storefront\Account\Auth\ResetPassword` |
specs/02-API-ROUTES.md:192:| GET | `/checkout/{checkoutId}` | Checkout page - stepper UI (Contact -> Shipping -> Payment) | `Storefront\Checkout\Show` |
specs/02-API-ROUTES.md:193:| GET | `/checkout/{checkoutId}/confirmation` | Order confirmation page - order number, items, totals | `Storefront\Checkout\Confirmation` |
specs/02-API-ROUTES.md:197:## 2. Storefront REST API
specs/02-API-ROUTES.md:422:    participant API as Storefront API
specs/02-API-ROUTES.md:1017:### 2.5 Search Endpoints
specs/02-API-ROUTES.md:1021:Search products within the current store.
specs/02-API-ROUTES.md:1030:| `q` | string | Yes | Search query. Min: 1, max: 200 characters. |
specs/02-API-ROUTES.md:1108:| `q` | string | Yes | Search prefix. Min: 1, max: 100 characters. |
specs/02-API-ROUTES.md:1206:## 3. Admin REST API
specs/02-API-ROUTES.md:1218:### 3.1 Platform Management (Super-Admin Only)
specs/02-API-ROUTES.md:1373:    "name": "Jane Admin",
specs/02-API-ROUTES.md:1393:### 3.2 Products
specs/02-API-ROUTES.md:1395:#### Admin Products Endpoint Summary
specs/02-API-ROUTES.md:1415:| `query` | string | No | Search by title, vendor, or SKU. |
specs/02-API-ROUTES.md:1516:| `collections` | array of integers | No | Collection IDs to add this product to. |
specs/02-API-ROUTES.md:1631:        "title": "Summer Collection",
specs/02-API-ROUTES.md:1674:Archive a product (soft delete). Products with existing orders cannot be hard-deleted.
specs/02-API-ROUTES.md:1736:### 3.3 Collections
specs/02-API-ROUTES.md:1738:#### Admin Collections Endpoint Summary
specs/02-API-ROUTES.md:1756:| `query` | string | No | Search by title. |
specs/02-API-ROUTES.md:1768:      "title": "Summer Collection",
specs/02-API-ROUTES.md:1797:  "title": "Winter Collection",
specs/02-API-ROUTES.md:1813:| `product_ids` | array of integers | No | Products to add to the collection. |
specs/02-API-ROUTES.md:1835:- `404` - Collection not found
specs/02-API-ROUTES.md:1850:  "message": "Collection deleted"
specs/02-API-ROUTES.md:1856:- `404` - Collection not found
specs/02-API-ROUTES.md:1862:#### Admin Orders Endpoint Summary
specs/02-API-ROUTES.md:1885:| `query` | string | No | Search by order number or customer email. |
specs/02-API-ROUTES.md:2134:#### Admin Discounts Endpoint Summary
specs/02-API-ROUTES.md:2280:#### Admin Shipping Endpoint Summary
specs/02-API-ROUTES.md:2416:#### Admin Tax Endpoint Summary
specs/02-API-ROUTES.md:2494:#### Admin Themes Endpoint Summary
specs/02-API-ROUTES.md:2600:#### Admin Pages Endpoint Summary
specs/02-API-ROUTES.md:2713:### 3.10 Search Admin
specs/02-API-ROUTES.md:2715:#### Admin Search Endpoint Summary
specs/02-API-ROUTES.md:2766:#### Admin Analytics Endpoint Summary
specs/02-API-ROUTES.md:3008:#### Admin
specs/02-API-ROUTES.md:3019:#### Storefront
specs/02-API-ROUTES.md:3027:#### API Storefront
specs/02-API-ROUTES.md:3036:#### API Admin
specs/02-API-ROUTES.md:3080:| `login` | 5 requests | 1 minute | IP address | Admin and customer login attempts |
specs/02-API-ROUTES.md:3081:| `api.admin` | 60 requests | 1 minute | Sanctum token ID | Admin REST API endpoints |
specs/02-API-ROUTES.md:3082:| `api.storefront` | 120 requests | 1 minute | IP address | Storefront REST API (carts, etc.) |
specs/02-API-ROUTES.md:3084:| `search` | 30 requests | 1 minute | IP address | Search and autocomplete endpoints |
specs/02-API-ROUTES.md:3171:- **Storefront API:** Versioned via URL path (`/api/storefront/v1/`). Breaking changes require a new version.
specs/02-API-ROUTES.md:3172:- **Admin API:** Versioned via URL path (`/api/admin/v1/`). Same strategy.


Output:
Chunk ID: 9fbdda
Wall time: 0.0000 seconds
Process exited with code 0
Original token count: 10337
Output:
Total output lines: 423

specs/04-STOREFRONT-UI.md:1:# 04 - Storefront UI/UX Specification
specs/04-STOREFRONT-UI.md:81:| Featured Collections | Grid of collection cards | Home |
specs/04-STOREFRONT-UI.md:82:| Featured Products | Grid of product cards (lazy-loaded) | Home |
specs/04-STOREFRONT-UI.md:145:| Search Icon | Right group | Button that opens the search modal |
specs/04-STOREFRONT-UI.md:242:2. Featured Collections
specs/04-STOREFRONT-UI.md:243:3. Featured Products
specs/04-STOREFRONT-UI.md:282:### 3.2 Featured Collections Section
specs/04-STOREFRONT-UI.md:292:**Collection Card:**
specs/04-STOREFRONT-UI.md:296:|  [Collection Image]       |
specs/04-STOREFRONT-UI.md:317:### 3.3 Featured Products Section
specs/04-STOREFRONT-UI.md:319:**Livewire Component:** FeaturedProducts
specs/04-STOREFRONT-UI.md:327:| Products | 4 to 8, configurable. Sourced from a configured collection or "best sellers" logic |
specs/04-STOREFRONT-UI.md:376:## 4. Collection Page (GET /collections/{handle})
specs/04-STOREFRONT-UI.md:378:**Livewire Component:** CollectionPage
specs/04-STOREFRONT-UI.md:380:### 4.1 Collection Header
specs/04-STOREFRONT-UI.md:384:| Breadcrumbs | Home > Collections > {Collection Title} |
specs/04-STOREFRONT-UI.md:538:|  [Search icon - large, muted]                                 |
specs/04-STOREFRONT-UI.md:625:Home > {Primary Collection} > {Product Title}. Small, muted text with separator characters.
specs/04-STOREFRONT-UI.md:1408:## 11. Search
specs/04-STOREFRONT-UI.md:1410:### 11.1 Search Modal
specs/04-STOREFRONT-UI.md:1412:**Livewire Component:** SearchModal
specs/04-STOREFRONT-UI.md:1418:|  [Search input with icon]                           [X close] |
specs/04-STOREFRONT-UI.md:1420:|  Products                                                     |
specs/04-STOREFRONT-UI.md:1424:|  Collections                                                  |
specs/04-STOREFRONT-UI.md:1425:|  Summer Collection                                            |
specs/04-STOREFRONT-UI.md:1426:|  Winter Collection                                            |
specs/04-STOREFRONT-UI.md:1436:| Search input | Large text, search icon prefix, autofocus on open. Live binding with 300ms debounce |
specs/04-STOREFRONT-UI.md:1437:| Results | Appear below input as user types. Grouped by type: "Products" and "Collections" headings |
specs/04-STOREFRONT-UI.md:1439:| Collection results | Title only. Clickable to collection page |
specs/04-STOREFRONT-UI.md:1446:| ARIA | Dialog role, modal, labeled "Search". Results list as listbox with option items |
specs/04-STOREFRONT-UI.md:1448:### 11.2 Search Results Page (GET /search?q=)
specs/04-STOREFRONT-UI.md:1450:**Livewire Component:** SearchResults
specs/04-STOREFRONT-UI.md:1456:| Heading | H1, "X results for '{query}'" or "Search results for '{query}'" |
specs/04-STOREFRONT-UI.md:1457:| Breadcrumbs | Home > Search results |
specs/04-STOREFRONT-UI.md:1490:|  [Search input]                                               |
specs/04-STOREFRONT-UI.md:1501:| Search | Simple input + button, submits to search page |
specs/04-STOREFRONT-UI.md:1547:| Collection filters | Drawer overlay | Drawer overlay | Persistent sidebar |
specs/04-STOREFRONT-UI.md:1580:| Collection Page | Live region for product count/grid on filter change. Filter sidebar labeled as navigation. Sort dropdown has associated label |
specs/04-STOREFRONT-UI.md:1584:| Search Modal | Dialog role with modal behavior. Results as listbox with option items. Active descendant tracking for keyboard navigation |
specs/04-STOREFRONT-UI.md:1596:| Search modal | Escape | Close |
specs/04-STOREFRONT-UI.md:1597:| Search results | Arrow Up/Down | Navigate results |
specs/04-STOREFRONT-UI.md:1598:| Search results | Enter | Select highlighted result |
specs/04-STOREFRONT-UI.md:1727:| FeaturedProducts | Home page | Lazy-loaded featured products grid |
specs/04-STOREFRONT-UI.md:1729:| CollectionPage | Collection page | Filtering, sorting, pagination |
specs/04-STOREFRONT-UI.md:1734:| SearchModal | Layout (global) | Autocomplete search overlay |
specs/04-STOREFRONT-UI.md:1735:| SearchResults | Search page | Full search results with filters |
specs/04-STOREFRONT-UI.md:1751:| open-search-modal | Header search icon click | SearchModal | None |
specs/04-STOREFRONT-UI.md:1752:| close-search-modal | SearchModal close actions | SearchModal | None |
specs/04-STOREFRONT-UI.md:1766:| Collection | "{Collection title} - {Store name}" | Collection description (stripped of markup) |
specs/04-STOREFRONT-UI.md:1769:| Search | "Search results - {Store name}" | Static |
specs/04-STOREFRONT-UI.md:1802:    B --> C[Collection Page]
specs/04-STOREFRONT-UI.md:1803:    B --> D[Search Modal]
specs/04-STOREFRONT-UI.md:1804:    D --> E[Search Results Page]
specs/03-ADMIN-UI.md:1:# 03 - Admin Panel UI/UX Specification
specs/03-ADMIN-UI.md:11:## 1. Admin Layout Shell
specs/03-ADMIN-UI.md:21:**Livewire component:** `App\Livewire\Admin\Layout\Sidebar`
specs/03-ADMIN-UI.md:47:|  [cube]         Products      |
specs/03-ADMIN-UI.md:48:|  [rect-stack]   Collections   |
specs/03-ADMIN-UI.md:81:Products (group label)
specs/03-ADMIN-UI.md:82:  Products                       -> admin.products.index
specs/03-ADMIN-UI.md:83:  Collections                    -> admin.collections.index
specs/03-ADMIN-UI.md:118:**Livewire component:** `App\Livewire\Admin\Layout\TopBar`
specs/03-ADMIN-UI.md:127:| `stores` | `Collection` | List of stores the user has access to |
specs/03-ADMIN-UI.md:175:**Breadcrumbs:** Every page includes a Flux breadcrumbs component at the top of the content area. The first item is always "Home" linking to `/admin`. Subsequent items reflect the page hierarchy. Example for product edit: Home > Products > "Blue T-Shirt".
specs/03-ADMIN-UI.md:206:**Livewire component:** `App\Livewire\Admin\Dashboard`
specs/03-ADMIN-UI.md:226:| `topProducts` | `array` | Top 5 products: `{title, units_sold, revenue}` |
specs/03-ADMIN-UI.md:234:| `loadTopProducts()` | Queries top 5 products by revenue |
specs/03-ADMIN-UI.md:296:### Top Products Table
specs/03-ADMIN-UI.md:337:## 3. Products List
specs/03-ADMIN-UI.md:341:**Livewire component:** `App\Livewire\Admin\Products\Index`
specs/03-ADMIN-UI.md:349:| `search` | `string` | Search query, live-debounced at 300ms |
specs/03-ADMIN-UI.md:359:| `updatedSearch()` | Resets pagination |
specs/03-ADMIN-UI.md:378:| Products                                    [+ Add product]       |
specs/03-ADMIN-UI.md:380:| [search icon] Search products...   [Status: All v] [Type: All v] |
specs/03-ADMIN-UI.md:432:| Body text | "This will archive X product(s). Products with orders cannot be permanently deleted." |
specs/03-ADMIN-UI.md:442:| Search field | `input` (icon: magnifying-glass) |
specs/03-ADMIN-UI.md:468:**Livewire component:** `App\Livewire\Admin\Products\Form`
specs/03-ADMIN-UI.md:508:| `availableCollections` | All collections for the current store |
specs/03-ADMIN-UI.md:569:|  > Search engine listing                 |                   |
specs/03-ADMIN-UI.md:628:- Toggle button: chevron icon + "Search engine listing" text
specs/03-ADMIN-UI.md:646:#### Collections Card
specs/03-ADMIN-UI.md:647:- Flux field with label "Collections"
specs/03-ADMIN-UI.md:665:| Body text | "This product will be archived. Products with existing orders cannot be permanently removed." |
specs/03-ADMIN-UI.md:700:## 5. Collections List and Edit
specs/03-ADMIN-UI.md:702:### 5.1 Collections List
specs/03-ADMIN-UI.md:706:**Livewire component:** `App\Livewire\Admin\Collections\Index`
specs/03-ADMIN-UI.md:714:| `search` | `string` | Search query |
specs/03-ADMIN-UI.md:719:| `updatedSearch()` | Resets pagination |
specs/03-ADMIN-UI.md:720:| `deleteCollection(int $id)` | Deletes a collection after confirmation |
specs/03-ADMIN-UI.md:728:Same pattern as Products list:
specs/03-ADMIN-UI.md:729:- Heading "Collections" with "Add collection" primary button
specs/03-ADMIN-UI.md:730:- Search input
specs/03-ADMIN-UI.md:738:| Products count | Number of products in collection |
specs/03-ADMIN-UI.md:744:### 5.2 Collection Edit/Create
specs/03-ADMIN-UI.md:748:**Livewire component:** `App\Livewire\Admin\Collections\Form`
specs/03-ADMIN-UI.md:756:| `collection` | `?Collection` | The collection being edited |
specs/03-ADMIN-UI.md:757:| `title` | `string` | Collection title |
specs/03-ADMIN-UI.md:759:| `descriptionHtml` | `string` | Collection description |
specs/03-ADMIN-UI.md:761:| `productSearch` | `string` | Search input for product assignment |
specs/03-ADMIN-UI.md:769:| `reorderProducts(array $order)` | Updates product positions |
specs/03-ADMIN-UI.md:773:| `searchResults` | Products matching `productSearch` that are not already assigned |
specs/03-ADMIN-UI.md:774:| `assignedProducts` | Ordered collection of assigned Product models |
specs/03-ADMIN-UI.md:782:|  Title: [Summer Collection         ]     | Status: [Active v] |
specs/03-ADMIN-UI.md:788:|  Search: [Search products...       ]     |                   |
specs/03-ADMIN-UI.md:808:- Products assignment section:
specs/03-ADMIN-UI.md:809:  - Search input with live debounce (300ms)
specs/03-ADMIN-UI.md:810:  - Search results dropdown (conditionally shown): list of matching products with "Add" button
specs/03-ADMIN-UI.md:823:**Livewire component:** `App\Livewire\Admin\Inventory\Index`
specs/03-ADMIN-UI.md:831:| `search` | `string` | Search by product title or SKU |
specs/03-ADMIN-UI.md:844:| [search] Search by product or SKU   [Stock: All v]               |
specs/03-ADMIN-UI.md:857:- Search input and stock filter dropdown
specs/03-ADMIN-UI.md:866:**Livewire component:** `App\Livewire\Admin\Orders\Index`
specs/03-ADMIN-UI.md:874:| `search` | `string` | Search by order number or customer email |
specs/03-ADMIN-UI.md:881:| `updatedSearch()` | Resets pagination |
specs/03-ADMIN-UI.md:895:| [search] Search by order # or email...                           |
specs/03-ADMIN-UI.md:930:| Search field | `input` |
specs/03-ADMIN-UI.md:940:**Livewire component:** `App\Livewire\Admin\Orders\Show`
specs/03-ADMIN-UI.md:1140:**Livewire component:** `App\Livewire\Admin\Customers\Index`
specs/03-ADMIN-UI.md:1148:| `search` | `string` | Search by name or email |
specs/03-ADMIN-UI.md:1157:- Search input
specs/03-ADMIN-UI.md:1165:**Livewire component:** `App\Livewire\Admin\Customers\Show`
specs/03-ADMIN-UI.md:1239:**Livewire component:** `App\Livewire\Admin\Discounts\Index`
specs/03-ADMIN-UI.md:1247:| `search` | `string` | Search by discount code |
specs/03-ADMIN-UI.md:1257:- Search input and status filter
specs/03-ADMIN-UI.md:1274:**Livewire component:** `App\Livewire\Admin\Discounts\Form`
specs/03-ADMIN-UI.md:1289:| `specificCollectionIds` | `array<int>` | Specific collections the discount applies to |
specs/03-ADMIN-UI.md:1295:| `productSearch` | `string` | Search for products to add |
specs/03-ADMIN-UI.md:1296:| `collectionSearch` | `string` | Search for collections to add |
specs/03-ADMIN-UI.md:1304:| `addCollection(int $collectionId)` | Adds collection to specific collections |
specs/03-ADMIN-UI.md:1305:| `removeCollection(int $collectionId)` | Removes collection |
specs/03-ADMIN-UI.md:1330:|  [Search products...          ]                                   |
specs/03-ADMIN-UI.md:1384:**Livewire component:** `App\Livewire\Admin\Settings\General`
specs/03-ADMIN-UI.md:1425:**Livewire component:** `App\Livewire\Admin\Settings\Domains`
specs/03-ADMIN-UI.md:1433:| `domains` | `Collection` | Store domains |
specs/03-ADMIN-UI.md:1468:- Type select: Storefront, Admin, API
specs/03-ADMIN-UI.md:1475:**Livewire component:** `App\Livewire\Admin\Settings\Shipping`
specs/03-ADMIN-UI.md:1483:| `zones` | `Collection` | Shipping zones with rates |
specs/03-ADMIN-UI.md:1592:**Livewire component:** `App\Livewire\Admin\Settings\Taxes`
specs/03-ADMIN-UI.md:1661:**Livewire component:** `App\Livewire\Admin\Themes\Index`
specs/03-ADMIN-UI.md:1669:| `themes` | `Collection` | All themes for the store |
specs/03-ADMIN-UI.md:1718:**Livewire component:** `App\Livewire\Admin\Themes\Editor`
specs/03-ADMIN-UI.md:1753:| Products   |  |  preview rendered      | |  Logo text:          |
specs/03-ADMIN-UI.md:1809:**Livewire component:** `App\Livewire\Admin\Pages\Index`
specs/03-ADMIN-UI.md:1817:| `search` | `string` | Search by page title |
specs/03-ADMIN-UI.md:1826:- Search input
specs/03-ADMIN-UI.md:1834:**Livewire component:** `App\Livewire\Admin\Pages\Form`
specs/03-ADMIN-UI.md:1873:**Livewire component:** `App\Livewire\Admin\Navigation\Index`
specs/03-ADMIN-UI.md:1881:| `menus` | `Collection` | Navigation menus (Main Menu, Footer Menu) |
specs/03-ADMIN-UI.md:1918:| | [drag] Products           collection: All    [edit] [trash]  | |
specs/03-ADMIN-UI.md:1949:- Type select: Custom link, Page, Collection, Product (live-bound)
specs/03-ADMIN-UI.md:1952:  - **Page/Collection/Product:** Resource select dropdown populated with available resources of that type
specs/03-ADMIN-UI.md:1961:**Livewire component:** `App\Livewire\Admin\Apps\Index`
specs/03-ADMIN-UI.md:1969:| `installedApps` | `Collection` | Apps installed for this store |
specs/03-ADMIN-UI.md:2013:**Livewire component:** `App\Livewire\Admin\Developers\Index`
specs/03-ADMIN-UI.md:2021:| `tokens` | `Collection` | API tokens for the store |
specs/03-ADMIN-UI.md:2022:| `webhooks` | `Collection` | Webhook subscriptions |
specs/03-ADMIN-UI.md:2045:| Manage personal access tokens for the Admin API.                 |
specs/03-ADMIN-UI.md:2126:**Livewire component:** `App\Livewire\Admin\Analytics\Index`
specs/03-ADMIN-UI.md:2144:| `topProducts` | `Collection` | Top products by revenue |
specs/03-ADMIN-UI.md:2193:- Channel filter: Flux select with All, Storefront, API
specs/03-ADMIN-UI.md:2203:**Top Products table:** Extended version with 10-20 rows. Columns: Rank, Product, Units Sold, Revenue, Percentage of Total.
specs/03-ADMIN-UI.md:2209:## 18. Search Settings
specs/03-ADMIN-UI.md:2213:**Livewire component:** `App\Livewire\Admin\Search\Settings`
specs/03-ADMIN-UI.md:2239:| Search Settings                                                   |
specs/03-ADMIN-UI.md:2283:- Heading "Search index" (size lg)
specs/03-ADMIN-UI.md:2298:2. Search input with live debounce (300ms)
specs/03-ADMIN-UI.md:2334:- Intermediate items: parent section (e.g., "Products" linking to products index)
specs/03-ADMIN-UI.md:2382:| Collection saved | "Collection saved" | success |
specs/03-ADMIN-UI.md:2402:| `App\Livewire\Admin\Layout\Sidebar` | `livewire.admin.layout.sidebar` | Layout (all pages) |
specs/03-ADMIN-UI.md:2403:| `App\Livewire\Admin\Layout\TopBar` | `livewire.admin.layout.top-bar` | Layout (all pages) |
specs/03-ADMIN-UI.md:2404:| `App\Livewire\Admin\Dashboard` | `livewire.admin.dashboard` | `GET /admin` |
specs/03-ADMIN-UI.md:2405:| `App\Livewire\Admin\Products\Index` | `livewire.admin.products.index` | `GET /admin/products` |
specs/03-ADMIN-UI.md:2406:| `App\Livewire\Admin\Products\Form` | `livewire.admin.products.form` | `GET /admin/products/create`, `GET /admin/products/{product}/edit` |
specs/03-ADMIN-UI.md:2407:| `App\Livewire\Admin\Collections\Index` | `livewire.admin.collections.index` | `GET /admin/collections` |
specs/03-ADMIN-UI.md:2408:| `App\Livewire\Admin\Collections\Form` | `livewire.admin.collections.form` | `GET /admin/collections/create`, `GET /admin/collections/{collection}/edit` |
specs/03-ADMIN-UI.md:2409:| `App\Livewire\Admin\Inventory\Index` | `livewire.admin.inventory.index` | `GET /admin/inventory` |
specs/03-ADMIN-UI.md:2410:| `App\Livewire\Admin\Orders\Index` | `livewire.admin.orders.index` | `GET /admin/orders` |
specs/03-ADMIN-UI.md:2411:| `App\Livewire\Admin\Orders\Show` | `livewire.admin.orders.show` | `GET /admin/orders/{order}` |
specs/03-ADMIN-UI.md:2412:| `App\Livewire\Admin\Customers\Index` | `livewire.admin.customers.index` | `GET /admin/customers` |
specs/03-ADMIN-UI.md:2413:| `App\Livewire\Admin\Customers\Show` | `livewire.admin.customers.show` | `GET /admin/customers/{customer}` |
specs/03-ADMIN-UI.md:2414:| `App\Livewire\Admin\Discounts\Index` | `livewire.admin.discounts.index` | `GET /admin/discounts` |
specs/03-ADMIN-UI.md:2415:| `App\Livewire\Admin\Discounts\Form` | `livewire.admin.discounts.form` | `GET /admin/discounts/create`, `GET /admin/discounts/{discount}/edit` |
specs/03-ADMIN-UI.md:2416:| `App\Livewire\Admin\Settings\General` | `livewire.admin.settings.general` | `GET /admin/settings` |
specs/03-ADMIN-UI.md:2417:| `App\Livewire\Admin\Settings\Domains` | `livewire.admin.settings.domains` | Tab within `GET /admin/settings` |
specs/03-ADMIN-UI.md:2418:| `App\Livewire\Admin\Settings\Shipping` | `livewire.admin.settings.shipping` | `GET /admin/settings/shipping` |
specs/03-ADMIN-UI.md:2419:| `App\Livewire\Admin\Settings\Taxes` | `livewire.admin.settings.taxes` | `GET /admin/settings/taxes` |
specs/03-ADMIN-UI.md:2420:| `App\Livewire\Admin\Themes\Index` | `livewire.admin.themes.index` | `GET /admin/themes` |
specs/03-ADMIN-UI.md:2421:| `App\Livewire\Admin\Themes\Editor` | `livewire.admin.themes.editor` | `GET /admin/themes/{theme}/editor` |
specs/03-ADMIN-UI.md:2422:| `App\Livewire\Admin\Pages\Index` | `livewire.admin.pages.index` | `GET /admin/pages` |
specs/03-ADMIN-UI.md:2423:| `App\Livewire\Admin\Pages\Form` | `livewire.admin.pages.form` | `GET /admin/pages/create`, `GET /admin/pages/{page}/edit` |
specs/03-ADMIN-UI.md:2424:| `App\Livewire\Admin\Navigation\Index` | `livewire.admin.navigation.index` | `GET /admin/navigation` |
specs/03-ADMIN-UI.md:2425:| `App\Livewire\Admin\Apps\Index` | `livewire.admin.apps.index` | `GET /admin/apps` |
specs/03-ADMIN-UI.md:2426:| `App\Livewire\Admin\Developers\Index` | `livewire.admin.developers.index` | `GET /admin/developers` |
specs/03-ADMIN-UI.md:2427:| `App\Livewire\Admin\Analytics\Index` | `livewire.admin.analytics.index` | `GET /admin/analytics` |
specs/03-ADMIN-UI.md:2428:| `App\Livewire\Admin\Search\Settings` | `livewire.admin.search.settings` | `GET /admin/search/settings` |
specs/08-PLAYWRIGHT-E2E-PLAN.md:11:| 1 - Smoke Tests | `tests/Browser/SmokeTest.php` | 10 | Hit every major page, assert HTTP 200 and no JS errors | Store 1, Products, Collections, Pages |
specs/08-PLAYWRIGHT-E2E-PLAN.md:12:| 2 - Admin Authentication | `tests/Browser/Admin/AuthenticationTest.php` | 10 | Admin login, logout, invalid credentials, session access control | Admin user |
specs/08-PLAYWRIGHT-E2E-PLAN.md:13:| 3 - Admin Product Management | `tests/Browser/Admin/ProductManagementTest.php` | 7 | Product CRUD: listing, creating, editing, archiving, filtering | Admin user, Products (incl. #15 draft) |
specs/08-PLAYWRIGHT-E2E-PLAN.md:14:| 4 - Admin Order Management | `tests/Browser/Admin/OrderManagementTest.php` | 11 | Order listing, filtering, detail view, fulfillment, refund, confirm payment, fulfillment guard, mark shipped/delivered | Admin user, Orders (#1001, #1005), Customer |
specs/08-PLAYWRIGHT-E2E-PLAN.md:15:| 5 - Admin Discount Management | `tests/Browser/Admin/DiscountManagementTest.php` | 6 | Discount code listing, creation, editing | Admin user, Discounts |
specs/08-PLAYWRIGHT-E2E-PLAN.md:16:| 6 - Admin Settings | `tests/Browser/Admin/SettingsTest.php` | 7 | Store settings, shipping zones, tax config, domains | Admin user, Shipping zones, Store 1 |
specs/08-PLAYWRIGHT-E2E-PLAN.md:17:| 7 - Storefront Browsing | `tests/Browser/Storefront/BrowsingTest.php` | 15 | Home page, collections, product detail, variants, search, pages | Products, Collections, Pages, Products #15/#17/#18 |
specs/08-PLAYWRIGHT-E2E-PLAN.md:18:| 8 - Cart Flow | `tests/Browser/Storefront/CartTest.php` | 12 | Cart lifecycle: add, update qty, remove, discounts, totals | Products, Discounts (all codes) |
specs/08-PLAYWRIGHT-E2E-PLAN.md:19:| 9 - Checkout Flow | `tests/Browser/Storefront/CheckoutTest.php` | 13 | Full checkout: contact, address, shipping, payment method selection, payment, confirmation, magic card decline, bank transfer flow | Products, Shipping zones, Discounts |
specs/08-PLAYWRIGHT-E2E-PLAN.md:20:| 10 - Customer Account | `tests/Browser/Storefront/Cu…337 tokens truncated…/Browser/Admin/PageManagementTest.php` | 3 | CMS page management | Admin user, Pages |
specs/08-PLAYWRIGHT-E2E-PLAN.md:28:| 18 - Admin Analytics | `tests/Browser/Admin/AnalyticsTest.php` | 3 | Analytics dashboard rendering | Admin user, Orders |
specs/08-PLAYWRIGHT-E2E-PLAN.md:89:| **Admin user** | Email: `admin@acme.test`, password: `password`, role: `owner` on Store 1 | 2, 3, 4, 5, 6, 12, 13, 15, 16, 17, 18 |
specs/08-PLAYWRIGHT-E2E-PLAN.md:97:| **Products (20 total)** | Seeded across collections, with variants, options, images, inventory | 1, 3, 7, 8, 9, 11, 13 |
specs/08-PLAYWRIGHT-E2E-PLAN.md:98:| **Collections** | "T-Shirts" (handle: `t-shirts`), "New Arrivals" (handle: `new-arrivals`), plus others | 1, 7, 13, 15 |
specs/08-PLAYWRIGHT-E2E-PLAN.md:114:    S1[Suite 1: Smoke Tests] --> S2[Suite 2: Admin Auth]
specs/08-PLAYWRIGHT-E2E-PLAN.md:115:    S1 --> S7[Suite 7: Storefront Browsing]
specs/08-PLAYWRIGHT-E2E-PLAN.md:116:    S2 --> S3[Suite 3: Admin Products]
specs/08-PLAYWRIGHT-E2E-PLAN.md:117:    S2 --> S4[Suite 4: Admin Orders]
specs/08-PLAYWRIGHT-E2E-PLAN.md:118:    S2 --> S5[Suite 5: Admin Discounts]
specs/08-PLAYWRIGHT-E2E-PLAN.md:119:    S2 --> S6[Suite 6: Admin Settings]
specs/08-PLAYWRIGHT-E2E-PLAN.md:120:    S2 --> S15[Suite 15: Admin Collections]
specs/08-PLAYWRIGHT-E2E-PLAN.md:121:    S2 --> S16[Suite 16: Admin Customers]
specs/08-PLAYWRIGHT-E2E-PLAN.md:122:    S2 --> S17[Suite 17: Admin Pages]
specs/08-PLAYWRIGHT-E2E-PLAN.md:123:    S2 --> S18[Suite 18: Admin Analytics]
specs/08-PLAYWRIGHT-E2E-PLAN.md:137:| Phase 3 | Suites 3, 4, 5, 6, 10, 11, 15, 16, 17, 18 | Admin CRUD and storefront feature suites (can run in parallel) |
specs/08-PLAYWRIGHT-E2E-PLAN.md:149:    Admin/
specs/08-PLAYWRIGHT-E2E-PLAN.md:155:        CollectionManagementTest.php
specs/08-PLAYWRIGHT-E2E-PLAN.md:159:    Storefront/
specs/08-PLAYWRIGHT-E2E-PLAN.md:293:- Page displays "Collections"
specs/08-PLAYWRIGHT-E2E-PLAN.md:312:## Suite 2: Admin Authentication
specs/08-PLAYWRIGHT-E2E-PLAN.md:314:**File:** `tests/Browser/Admin/AuthenticationTest.php`
specs/08-PLAYWRIGHT-E2E-PLAN.md:326:    Dashboard --> Products: click "Products"
specs/08-PLAYWRIGHT-E2E-PLAN.md:436:6. Click on "Admin User" (profile/user menu)
specs/08-PLAYWRIGHT-E2E-PLAN.md:453:5. Click "Products" in the sidebar
specs/08-PLAYWRIGHT-E2E-PLAN.md:454:6. Verify "Products" heading is visible
specs/08-PLAYWRIGHT-E2E-PLAN.md:508:## Suite 3: Admin Product Management
specs/08-PLAYWRIGHT-E2E-PLAN.md:510:**File:** `tests/Browser/Admin/ProductManagementTest.php`
specs/08-PLAYWRIGHT-E2E-PLAN.md:537:5. Click "Products" in the sidebar
specs/08-PLAYWRIGHT-E2E-PLAN.md:553:3. Click "Products" in the sidebar
specs/08-PLAYWRIGHT-E2E-PLAN.md:563:13. Click "Products" to return to the product list
specs/08-PLAYWRIGHT-E2E-PLAN.md:578:3. Click "Products" in the sidebar
specs/08-PLAYWRIGHT-E2E-PLAN.md:583:8. Click "Products" to return to the product list
specs/08-PLAYWRIGHT-E2E-PLAN.md:598:3. Click "Products" in the sidebar
specs/08-PLAYWRIGHT-E2E-PLAN.md:606:11. Click "Products" to return to the product list
specs/08-PLAYWRIGHT-E2E-PLAN.md:610:15. Click "Products" to return to the product list
specs/08-PLAYWRIGHT-E2E-PLAN.md:626:3. Click "Products" in the sidebar
specs/08-PLAYWRIGHT-E2E-PLAN.md:647:3. Click "Products" in the sidebar
specs/08-PLAYWRIGHT-E2E-PLAN.md:663:3. Click "Products" in the sidebar
specs/08-PLAYWRIGHT-E2E-PLAN.md:676:## Suite 4: Admin Order Management
specs/08-PLAYWRIGHT-E2E-PLAN.md:678:**File:** `tests/Browser/Admin/OrderManagementTest.php`
specs/08-PLAYWRIGHT-E2E-PLAN.md:906:## Suite 5: Admin Discount Management
specs/08-PLAYWRIGHT-E2E-PLAN.md:908:**File:** `tests/Browser/Admin/DiscountManagementTest.php`
specs/08-PLAYWRIGHT-E2E-PLAN.md:1037:## Suite 6: Admin Settings
specs/08-PLAYWRIGHT-E2E-PLAN.md:1039:**File:** `tests/Browser/Admin/SettingsTest.php`
specs/08-PLAYWRIGHT-E2E-PLAN.md:1185:## Suite 7: Storefront Browsing
specs/08-PLAYWRIGHT-E2E-PLAN.md:1187:**File:** `tests/Browser/Storefront/BrowsingTest.php`
specs/08-PLAYWRIGHT-E2E-PLAN.md:1191:### Storefront Page Map
specs/08-PLAYWRIGHT-E2E-PLAN.md:1195:    Home["/"] --> Collections["/collections"]
specs/08-PLAYWRIGHT-E2E-PLAN.md:1197:    Collections --> CollectionDetail["/collections/{handle}"]
specs/08-PLAYWRIGHT-E2E-PLAN.md:1198:    CollectionDetail --> Product
specs/08-PLAYWRIGHT-E2E-PLAN.md:1199:    Home --> Search["/search?q=..."]
specs/08-PLAYWRIGHT-E2E-PLAN.md:1200:    Search --> Product
specs/08-PLAYWRIGHT-E2E-PLAN.md:1423:**File:** `tests/Browser/Storefront/CartTest.php`
specs/08-PLAYWRIGHT-E2E-PLAN.md:1534:**Preconditions:** Products #1 and #2 exist
specs/08-PLAYWRIGHT-E2E-PLAN.md:1693:**File:** `tests/Browser/Storefront/CheckoutTest.php`
specs/08-PLAYWRIGHT-E2E-PLAN.md:2080:**File:** `tests/Browser/Storefront/CustomerAccountTest.php`
specs/08-PLAYWRIGHT-E2E-PLAN.md:2321:**File:** `tests/Browser/Storefront/InventoryTest.php`
specs/08-PLAYWRIGHT-E2E-PLAN.md:2327:| Stock Level | Policy | Storefront Display | Add-to-Cart |
specs/08-PLAYWRIGHT-E2E-PLAN.md:2405:**File:** `tests/Browser/Storefront/TenantIsolationTest.php`
specs/08-PLAYWRIGHT-E2E-PLAN.md:2414:        S1Products[Fashion Products]
specs/08-PLAYWRIGHT-E2E-PLAN.md:2419:        S2Products[Other Products]
specs/08-PLAYWRIGHT-E2E-PLAN.md:2423:    S1Products -.-x S2Products
specs/08-PLAYWRIGHT-E2E-PLAN.md:2442:- Products from other stores (e.g., electronics from Store 2) are absent
specs/08-PLAYWRIGHT-E2E-PLAN.md:2461:### Test 12.3: Admin cannot access other store data
specs/08-PLAYWRIGHT-E2E-PLAN.md:2468:3. Click "Products" in the sidebar
specs/08-PLAYWRIGHT-E2E-PLAN.md:2481:### Test 12.4: Search only returns current store products
specs/08-PLAYWRIGHT-E2E-PLAN.md:2516:**File:** `tests/Browser/Storefront/ResponsiveTest.php`
specs/08-PLAYWRIGHT-E2E-PLAN.md:2524:| iPhone (mobile) | 375 | 812 | Storefront tests |
specs/08-PLAYWRIGHT-E2E-PLAN.md:2525:| iPad (tablet) | 768 | 1024 | Admin panel tests |
specs/08-PLAYWRIGHT-E2E-PLAN.md:2529:### Test 13.1: Storefront home works on mobile viewport
specs/08-PLAYWRIGHT-E2E-PLAN.md:2626:### Test 13.6: Admin login works on tablet viewport
specs/08-PLAYWRIGHT-E2E-PLAN.md:2643:### Test 13.7: Admin sidebar navigation works on tablet
specs/08-PLAYWRIGHT-E2E-PLAN.md:2651:4. Click "Products" in the sidebar
specs/08-PLAYWRIGHT-E2E-PLAN.md:2652:5. Verify "Products" heading is visible
specs/08-PLAYWRIGHT-E2E-PLAN.md:2662:### Test 13.8: Collection page works on mobile with filters
specs/08-PLAYWRIGHT-E2E-PLAN.md:2672:- Products are visible
specs/08-PLAYWRIGHT-E2E-PLAN.md:2682:**File:** `tests/Browser/Storefront/AccessibilityTest.php`
specs/08-PLAYWRIGHT-E2E-PLAN.md:2769:### Test 14.6: Admin login form has accessible labels
specs/08-PLAYWRIGHT-E2E-PLAN.md:2851:### Test 14.11: Search page has proper form labels
specs/08-PLAYWRIGHT-E2E-PLAN.md:2859:- Search input has a label or aria-label attribute
specs/08-PLAYWRIGHT-E2E-PLAN.md:2866:## Suite 15: Admin Collections Management
specs/08-PLAYWRIGHT-E2E-PLAN.md:2868:**File:** `tests/Browser/Admin/CollectionManagementTest.php`
specs/08-PLAYWRIGHT-E2E-PLAN.md:2899:5. Enter title: `E2E Test Collection`
specs/08-PLAYWRIGHT-E2E-PLAN.md:2905:- After step 7: page displays "Collection saved", no JavaScript errors
specs/08-PLAYWRIGHT-E2E-PLAN.md:2906:- After step 8: page displays "E2E Test Collection" in the list
specs/08-PLAYWRIGHT-E2E-PLAN.md:2923:- Page displays "Collection saved"
specs/08-PLAYWRIGHT-E2E-PLAN.md:2930:## Suite 16: Admin Customer Management
specs/08-PLAYWRIGHT-E2E-PLAN.md:2932:**File:** `tests/Browser/Admin/CustomerManagementTest.php`
specs/08-PLAYWRIGHT-E2E-PLAN.md:2990:## Suite 17: Admin Pages Management
specs/08-PLAYWRIGHT-E2E-PLAN.md:2992:**File:** `tests/Browser/Admin/PageManagementTest.php`
specs/08-PLAYWRIGHT-E2E-PLAN.md:3052:## Suite 18: Admin Analytics Dashboard
specs/08-PLAYWRIGHT-E2E-PLAN.md:3054:**File:** `tests/Browser/Admin/AnalyticsTest.php`
specs/08-PLAYWRIGHT-E2E-PLAN.md:3123:| 2 - Admin Authentication | `tests/Browser/Admin/AuthenticationTest.php` | 10 |
specs/08-PLAYWRIGHT-E2E-PLAN.md:3124:| 3 - Admin Product Management | `tests/Browser/Admin/ProductManagementTest.php` | 7 |
specs/08-PLAYWRIGHT-E2E-PLAN.md:3125:| 4 - Admin Order Management | `tests/Browser/Admin/OrderManagementTest.php` | 7 |
specs/08-PLAYWRIGHT-E2E-PLAN.md:3126:| 5 - Admin Discount Management | `tests/Browser/Admin/DiscountManagementTest.php` | 6 |
specs/08-PLAYWRIGHT-E2E-PLAN.md:3127:| 6 - Admin Settings | `tests/Browser/Admin/SettingsTest.php` | 7 |
specs/08-PLAYWRIGHT-E2E-PLAN.md:3128:| 7 - Storefront Browsing | `tests/Browser/Storefront/BrowsingTest.php` | 15 |
specs/08-PLAYWRIGHT-E2E-PLAN.md:3129:| 8 - Cart Flow | `tests/Browser/Storefront/CartTest.php` | 12 |
specs/08-PLAYWRIGHT-E2E-PLAN.md:3130:| 9 - Checkout Flow | `tests/Browser/Storefront/CheckoutTest.php` | 8 |
specs/08-PLAYWRIGHT-E2E-PLAN.md:3131:| 10 - Customer Account | `tests/Browser/Storefront/CustomerAccountTest.php` | 12 |
specs/08-PLAYWRIGHT-E2E-PLAN.md:3132:| 11 - Inventory Enforcement | `tests/Browser/Storefront/InventoryTest.php` | 4 |
specs/08-PLAYWRIGHT-E2E-PLAN.md:3133:| 12 - Tenant Isolation | `tests/Browser/Storefront/TenantIsolationTest.php` | 5 |
specs/08-PLAYWRIGHT-E2E-PLAN.md:3134:| 13 - Responsive / Mobile | `tests/Browser/Storefront/ResponsiveTest.php` | 8 |
specs/08-PLAYWRIGHT-E2E-PLAN.md:3135:| 14 - Accessibility | `tests/Browser/Storefront/AccessibilityTest.php` | 11 |
specs/08-PLAYWRIGHT-E2E-PLAN.md:3136:| 15 - Admin Collections | `tests/Browser/Admin/CollectionManagementTest.php` | 3 |
specs/08-PLAYWRIGHT-E2E-PLAN.md:3137:| 16 - Admin Customers | `tests/Browser/Admin/CustomerManagementTest.php` | 3 |
specs/08-PLAYWRIGHT-E2E-PLAN.md:3138:| 17 - Admin Pages | `tests/Browser/Admin/PageManagementTest.php` | 3 |
specs/08-PLAYWRIGHT-E2E-PLAN.md:3139:| 18 - Admin Analytics | `tests/Browser/Admin/AnalyticsTest.php` | 3 |
specs/08-PLAYWRIGHT-E2E-PLAN.md:3150:| Run a specific suite (nested) | `php artisan test tests/Browser/Storefront/CartTest.php` |
specs/08-PLAYWRIGHT-E2E-PLAN.md:3152:| Run admin auth tests | `php artisan test tests/Browser/Admin/AuthenticationTest.php` |
specs/08-PLAYWRIGHT-E2E-PLAN.md:3153:| Run checkout flow tests | `php artisan test tests/Browser/Storefront/CheckoutTest.php` |
specs/02-API-ROUTES.md:11:### 1.1 Admin Auth Routes
specs/02-API-ROUTES.md:17:| GET | `/admin/login` | Admin login page | `Livewire: Admin\Auth\Login` |
specs/02-API-ROUTES.md:20:| GET | `/admin/forgot-password` | Show forgot password form | `Livewire: Admin\Auth\ForgotPassword` |
specs/02-API-ROUTES.md:22:| GET | `/admin/reset-password/{token}` | Show reset password form | `Livewire: Admin\Auth\ResetPassword` |
specs/02-API-ROUTES.md:29:### 1.2 Admin Routes
specs/02-API-ROUTES.md:42:| GET | `/admin` | Dashboard with KPI tiles, orders chart, conversion funnel | `Admin\Dashboard` |
specs/02-API-ROUTES.md:44:#### Products
specs/02-API-ROUTES.md:48:| GET | `/admin/products` | Product list - searchable, filterable by status, bulk actions | `Admin\Products\Index` |
specs/02-API-ROUTES.md:49:| GET | `/admin/products/create` | Create product form | `Admin\Products\Create` |
specs/02-API-ROUTES.md:50:| GET | `/admin/products/{product}/edit` | Edit product form with variants, media, options | `Admin\Products\Edit` |
specs/02-API-ROUTES.md:56:| GET | `/admin/inventory` | Inventory management page | `Admin\Inventory\Index` |
specs/02-API-ROUTES.md:58:#### Collections
specs/02-API-ROUTES.md:62:| GET | `/admin/collections` | Collection list | `Admin\Collections\Index` |
specs/02-API-ROUTES.md:63:| GET | `/admin/collections/create` | Create collection form | `Admin\Collections\Create` |
specs/02-API-ROUTES.md:64:| GET | `/admin/collections/{collection}/edit` | Edit collection form | `Admin\Collections\Edit` |
specs/02-API-ROUTES.md:70:| GET | `/admin/orders` | Order list with status filters | `Admin\Orders\Index` |
specs/02-API-ROUTES.md:71:| GET | `/admin/orders/{order}` | Order detail with timeline, payments, fulfillments | `Admin\Orders\Show` |
specs/02-API-ROUTES.md:77:| GET | `/admin/customers` | Customer list | `Admin\Customers\Index` |
specs/02-API-ROUTES.md:78:| GET | `/admin/customers/{customer}` | Customer detail with order history, addresses | `Admin\Customers\Show` |
specs/02-API-ROUTES.md:84:| GET | `/admin/discounts` | Discount list | `Admin\Discounts\Index` |
specs/02-API-ROUTES.md:85:| GET | `/admin/discounts/create` | Create discount form with rules builder | `Admin\Discounts\Create` |
specs/02-API-ROUTES.md:86:| GET | `/admin/discounts/{discount}/edit` | Edit discount form | `Admin\Discounts\Edit` |
specs/02-API-ROUTES.md:92:| GET | `/admin/settings` | Store settings (tabs: General, Domains, Shipping, Taxes, Checkout, Notifications) | `Admin\Settings\Index` |
specs/02-API-ROUTES.md:93:| GET | `/admin/settings/shipping` | Shipping zones and rates configuration | `Admin\Settings\Shipping` |
specs/02-API-ROUTES.md:94:| GET | `/admin/settings/taxes` | Tax settings - mode, provider config, rates | `Admin\Settings\Taxes` |
specs/02-API-ROUTES.md:100:| GET | `/admin/themes` | Theme management - cards with actions (Customize, Preview, Publish, Duplicate, Delete) | `Admin\Themes\Index` |
specs/02-API-ROUTES.md:101:| GET | `/admin/themes/{theme}/editor` | Theme editor - left panel sections, center preview iframe, right panel settings | `Admin\Themes\Editor` |
specs/02-API-ROUTES.md:107:| GET | `/admin/pages` | Content pages list | `Admin\Pages\Index` |
specs/02-API-ROUTES.md:108:| GET | `/admin/pages/create` | Create content page | `Admin\Pages\Create` |
specs/02-API-ROUTES.md:109:| GET | `/admin/pages/{page}/edit` | Edit content page | `Admin\Pages\Edit` |
specs/02-API-ROUTES.md:115:| GET | `/admin/navigation` | Navigation menus management | `Admin\Navigation\Index` |
specs/02-API-ROUTES.md:121:| GET | `/admin/apps` | Apps directory - list installed and available apps | `Admin\Apps\Index` |
specs/02-API-ROUTES.md:122:| GET | `/admin/apps/{installation}` | Installed app detail - scopes, webhooks, usage | `Admin\Apps\Show` |
specs/02-API-ROUTES.md:128:| GET | `/admin/developers` | Developer settings - API keys/tokens, webhook management | `Admin\Developers\Index` |
specs/02-API-ROUTES.md:136:| GET | `/admin/analytics` | Analytics dashboard - sales, traffic, funnel, exports | `Admin\Analytics\Index` |
specs/02-API-ROUTES.md:138:#### Search Settings
specs/02-API-ROUTES.md:142:| GET | `/admin/search/settings` | Search settings - synonyms, stopwords, reindex | `Admin\Search\Settings` |
specs/02-API-ROUTES.md:146:### 1.3 Storefront Routes
specs/02-API-ROUTES.md:154:| GET | `/` | Home page | `Storefront\Home` |
specs/02-API-ROUTES.md:155:| GET | `/collections` | All collections listing | `Storefront\Collections\Index` |
specs/02-API-ROUTES.md:156:| GET | `/collections/{handle}` | Single collection page with product grid and filters | `Storefront\Collections\Show` |
specs/02-API-ROUTES.md:157:| GET | `/products/{handle}` | Product page - gallery, variant selector, add-to-cart | `Storefront\Products\Show` |
specs/02-API-ROUTES.md:158:| GET | `/cart` | Full cart page - line items, quantity controls, discount input, totals | `Storefront\Cart\Show` |
specs/02-API-ROUTES.md:159:| GET | `/search` | Search results page with filter panel, sort dropdown, product grid | `Storefront\Search\Index` |
specs/02-API-ROUTES.md:160:| GET | `/pages/{handle}` | Static content page (About, FAQ, etc.) | `Storefront\Pages\Show` |
specs/02-API-ROUTES.md:168:| GET | `/account` | Customer account overview | `Storefront\Account\Dashboard` |
specs/02-API-ROUTES.md:169:| GET | `/account/orders` | Order history list | `Storefront\Account\Orders\Index` |
specs/02-API-ROUTES.md:170:| GET | `/account/orders/{orderNumber}` | Order detail | `Storefront\Account\Orders\Show` |
specs/02-API-ROUTES.md:171:| GET | `/account/addresses` | Address book management | `Storefront\Account\Addresses\Index` |
specs/02-API-ROUTES.md:177:| GET | `/account/login` | Customer login page | `Storefront\Account\Auth\Login` |
specs/02-API-ROUTES.md:178:| GET | `/account/register` | Customer registration page | `Storefront\Account\Auth\Register` |
specs/02-API-ROUTES.md:179:| GET | `/forgot-password` | Forgot password page | `Storefront\Account\Auth\ForgotPassword` |
specs/02-API-ROUTES.md:181:| GET | `/reset-password/{token}` | Reset password form | `Storefront\Account\Auth\ResetPassword` |
specs/02-API-ROUTES.md:192:| GET | `/checkout/{checkoutId}` | Checkout page - stepper UI (Contact -> Shipping -> Payment) | `Storefront\Checkout\Show` |
specs/02-API-ROUTES.md:193:| GET | `/checkout/{checkoutId}/confirmation` | Order confirmation page - order number, items, totals | `Storefront\Checkout\Confirmation` |
specs/02-API-ROUTES.md:197:## 2. Storefront REST API
specs/02-API-ROUTES.md:422:    participant API as Storefront API
specs/02-API-ROUTES.md:1017:### 2.5 Search Endpoints
specs/02-API-ROUTES.md:1021:Search products within the current store.
specs/02-API-ROUTES.md:1030:| `q` | string | Yes | Search query. Min: 1, max: 200 characters. |
specs/02-API-ROUTES.md:1108:| `q` | string | Yes | Search prefix. Min: 1, max: 100 characters. |
specs/02-API-ROUTES.md:1206:## 3. Admin REST API
specs/02-API-ROUTES.md:1218:### 3.1 Platform Management (Super-Admin Only)
specs/02-API-ROUTES.md:1373:    "name": "Jane Admin",
specs/02-API-ROUTES.md:1393:### 3.2 Products
specs/02-API-ROUTES.md:1395:#### Admin Products Endpoint Summary
specs/02-API-ROUTES.md:1415:| `query` | string | No | Search by title, vendor, or SKU. |
specs/02-API-ROUTES.md:1516:| `collections` | array of integers | No | Collection IDs to add this product to. |
specs/02-API-ROUTES.md:1631:        "title": "Summer Collection",
specs/02-API-ROUTES.md:1674:Archive a product (soft delete). Products with existing orders cannot be hard-deleted.
specs/02-API-ROUTES.md:1736:### 3.3 Collections
specs/02-API-ROUTES.md:1738:#### Admin Collections Endpoint Summary
specs/02-API-ROUTES.md:1756:| `query` | string | No | Search by title. |
specs/02-API-ROUTES.md:1768:      "title": "Summer Collection",
specs/02-API-ROUTES.md:1797:  "title": "Winter Collection",
specs/02-API-ROUTES.md:1813:| `product_ids` | array of integers | No | Products to add to the collection. |
specs/02-API-ROUTES.md:1835:- `404` - Collection not found
specs/02-API-ROUTES.md:1850:  "message": "Collection deleted"
specs/02-API-ROUTES.md:1856:- `404` - Collection not found
specs/02-API-ROUTES.md:1862:#### Admin Orders Endpoint Summary
specs/02-API-ROUTES.md:1885:| `query` | string | No | Search by order number or customer email. |
specs/02-API-ROUTES.md:2134:#### Admin Discounts Endpoint Summary
specs/02-API-ROUTES.md:2280:#### Admin Shipping Endpoint Summary
specs/02-API-ROUTES.md:2416:#### Admin Tax Endpoint Summary
specs/02-API-ROUTES.md:2494:#### Admin Themes Endpoint Summary
specs/02-API-ROUTES.md:2600:#### Admin Pages Endpoint Summary
specs/02-API-ROUTES.md:2713:### 3.10 Search Admin
specs/02-API-ROUTES.md:2715:#### Admin Search Endpoint Summary
specs/02-API-ROUTES.md:2766:#### Admin Analytics Endpoint Summary
specs/02-API-ROUTES.md:3008:#### Admin
specs/02-API-ROUTES.md:3019:#### Storefront
specs/02-API-ROUTES.md:3027:#### API Storefront
specs/02-API-ROUTES.md:3036:#### API Admin
specs/02-API-ROUTES.md:3080:| `login` | 5 requests | 1 minute | IP address | Admin and customer login attempts |
specs/02-API-ROUTES.md:3081:| `api.admin` | 60 requests | 1 minute | Sanctum token ID | Admin REST API endpoints |
specs/02-API-ROUTES.md:3082:| `api.storefront` | 120 requests | 1 minute | IP address | Storefront REST API (carts, etc.) |
specs/02-API-ROUTES.md:3084:| `search` | 30 requests | 1 minute | IP address | Search and autocomplete endpoints |
specs/02-API-ROUTES.md:3171:- **Storefront API:** Versioned via URL path (`/api/storefront/v1/`). Breaking changes require a new version.
specs/02-API-ROUTES.md:3172:- **Admin API:** Versioned via URL path (`/api/admin/v1/`). Same strategy.


sed -n '376,740p' specs/04-STOREFRONT-UI.md


sed -n '1185,1265p' specs/08-PLAYWRIGHT-E2E-PLAN.md


sed -n '508,675p' specs/08-PLAYWRIGHT-E2E-PLAN.md


/bin/zsh
-lc
sed -n '337,830p' specs/03-ADMIN-UI.md

## 3. Products List

**Route:** `GET /admin/products`

**Livewire component:** `App\Livewire\Admin\Products\Index`

**Blade view:** `resources/views/livewire/admin/products/index.blade.php`

### Component Requirements

| Property | Type | Purpose |
|----------|------|---------|
| `search` | `string` | Search query, live-debounced at 300ms |
| `statusFilter` | `string` | Status filter: `all`, `draft`, `active`, `archived` |
| `typeFilter` | `string` | Product type filter |
| `selectedIds` | `array<int>` | Array of selected product IDs for bulk actions |
| `selectAll` | `bool` | Whether all visible rows are selected |
| `sortField` | `string` | Column to sort by (default: `updated_at`) |
| `sortDirection` | `string` | `asc` or `desc` |

| Action | Behavior |
|--------|----------|
| `updatedSearch()` | Resets pagination |
| `updatedStatusFilter()` | Resets pagination |
| `updatedTypeFilter()` | Resets pagination |
| `bulkArchive()` | Archives all selected products |
| `bulkDelete()` | Soft-deletes selected products (with confirmation) |
| `bulkSetActive()` | Sets selected products to active status |
| `sortBy(string $field)` | Toggles sort direction or changes sort field |
| `toggleSelectAll()` | Selects or deselects all visible product IDs |
| `confirmBulkDelete()` | Opens delete confirmation modal |

| Computed Property | Purpose |
|-------------------|---------|
| `products` | Paginated query result with search, filters, sorting applied. Eager loads `variants`, `media` (limit 1). Uses `withCount('variants')`. |
| `productTypes` | Distinct product types for the type filter dropdown |

### Wireframe

```
+------------------------------------------------------------------+
| Products                                    [+ Add product]       |
+------------------------------------------------------------------+
| [search icon] Search products...   [Status: All v] [Type: All v] |
+------------------------------------------------------------------+
| (shown when items selected)                                       |
| "3 products selected"  [Set Active]  [Archive]  [Delete]         |
+------------------------------------------------------------------+
| [x] | IMG | Title ^     | Status  | Inventory | Type | Vendor | Updated ^  |
|-----|-----|-------------|---------|-----------|------|--------|-----------|
| [ ] | img | Blue Shirt  | Active  | 45        | Tops | Nike   | 2h ago    |
| [ ] | img | Red Hat     | Draft   | 12        | Hats | Adidas | 1d ago    |
| [ ] | img | Sneakers    | Active  | 0         | Shoes| Nike   | 3d ago    |
| ...                                                              |
+------------------------------------------------------------------+
| < 1 2 3 ... 10 >  (pagination)                                  |
+------------------------------------------------------------------+
```

### Table Column Definitions

| Column | Sortable | Content |
|--------|----------|---------|
| Select | No | Checkbox for bulk selection |
| Image | No | 40x40 rounded thumbnail of first media item, or placeholder icon |
| Title | Yes | Product title as a link to the edit page (uses Livewire navigate) |
| Status | No | Flux badge: draft=zinc/gray, active=green, archived=red |
| Inventory | Yes | Sum of `inventory_items.quantity_on_hand` across all variants |
| Type | No | Product type text or "-" |
| Vendor | No | Vendor name text or "-" |
| Updated | Yes (default) | Relative timestamp (e.g., "2h ago") |

### Bulk Action Bar

Conditionally shown when `count($selectedIds) > 0`. Contains:
- Text showing "X products selected"
- "Set Active" button (ghost variant)
- "Archive" button (ghost variant)
- "Delete" button (danger variant) - opens confirmation modal

### Empty State

When no products exist (not filtered, genuinely empty):
- Centered container with a large muted placeholder icon (cube)
- Heading: "Add your first product"
- Text: "Start building your catalog by adding products."
- Primary button: "Add product" linking to the create page

### Delete Confirmation Modal

| Property | Value |
|----------|-------|
| Modal name | `confirm-bulk-delete` |
| Max width | md |
| Heading | "Delete products?" |
| Body text | "This will archive X product(s). Products with orders cannot be permanently deleted." |
| Cancel button | Ghost variant, closes modal |
| Confirm button | Danger variant, calls `bulkDelete` |

### Flux Component Mapping

| UI Element | Flux Component |
|-----------|----------------|
| Page title | `heading` |
| Add product button | `button` (variant: primary) |
| Search field | `input` (icon: magnifying-glass) |
| Status filter | `select` |
| Type filter | `select` |
| Bulk action buttons | `button` (ghost/danger variants) |
| Selected count text | `text` |
| Row checkbox | `checkbox` |
| Status badges | `badge` |
| Cell text | `text` |
| Delete confirmation | `modal` |
| Pagination | Laravel default Tailwind pagination |

### View States

| State | Behavior |
|-------|----------|
| Loading | Ta…10478 chars truncated… (upload) | Progress bar shown in media section |
| Create mode | Empty form, no delete button, heading says "Add product" |
| Edit mode | Pre-filled form, delete button visible, heading shows product title |
| Validation error | Inline error messages below each invalid field |

---

## 5. Collections List and Edit

### 5.1 Collections List

**Route:** `GET /admin/collections`

**Livewire component:** `App\Livewire\Admin\Collections\Index`

**Blade view:** `resources/views/livewire/admin/collections/index.blade.php`

#### Component Requirements

| Property | Type | Purpose |
|----------|------|---------|
| `search` | `string` | Search query |
| `statusFilter` | `string` | `all`, `active`, `archived` |

| Action | Behavior |
|--------|----------|
| `updatedSearch()` | Resets pagination |
| `deleteCollection(int $id)` | Deletes a collection after confirmation |

| Computed Property | Purpose |
|-------------------|---------|
| `collections` | Paginated, filtered, searched. Includes `withCount('products')`. |

#### Layout

Same pattern as Products list:
- Heading "Collections" with "Add collection" primary button
- Search input
- Status filter dropdown

#### Table Columns

| Column | Content |
|--------|---------|
| Title | Link to edit page |
| Products count | Number of products in collection |
| Status | Flux badge |
| Updated date | Relative timestamp |

**Empty state:** "Create your first collection" with CTA button.

### 5.2 Collection Edit/Create

**Route:** `GET /admin/collections/create` and `GET /admin/collections/{collection}/edit`

**Livewire component:** `App\Livewire\Admin\Collections\Form`

**Blade view:** `resources/views/livewire/admin/collections/form.blade.php`

#### Component Requirements

| Property | Type | Purpose |
|----------|------|---------|
| `collection` | `?Collection` | The collection being edited |
| `title` | `string` | Collection title |
| `handle` | `string` | URL slug |
| `descriptionHtml` | `string` | Collection description |
| `status` | `string` | `active` or `archived` |
| `productSearch` | `string` | Search input for product assignment |
| `assignedProductIds` | `array<int>` | Ordered list of product IDs in this collection |

| Action | Behavior |
|--------|----------|
| `save()` | Validates and saves the collection with product assignments |
| `addProduct(int $productId)` | Adds a product to the collection |
| `removeProduct(int $productId)` | Removes a product from the collection |
| `reorderProducts(array $order)` | Updates product positions |

| Computed Property | Purpose |
|-------------------|---------|
| `searchResults` | Products matching `productSearch` that are not already assigned |
| `assignedProducts` | Ordered collection of assigned Product models |

#### Layout Wireframe

```
+------------------------------------------+-------------------+
|          LEFT COLUMN (2/3)               | RIGHT COLUMN (1/3)|
+------------------------------------------+-------------------+
|  Title: [Summer Collection         ]     | Status: [Active v] |
|  Handle: [summer-collection        ]     |                   |
|  Description:                            |                   |
|  [textarea...                      ]     |                   |
|                                          |                   |
|  PRODUCTS                                |                   |
|  Search: [Search products...       ]     |                   |
|  +----------------------------------+   |                   |
|  | Blue Shirt           [Add]       |   |                   |
|  | Red Hat              [Add]       |   |                   |
|  +----------------------------------+   |                   |
|                                          |                   |
|  Assigned products:                      |                   |
|  [drag] [img] Sneakers         [remove]  |                   |
|  [drag] [img] Blue Shirt       [remove]  |                   |
+------------------------------------------+-------------------+

+==================================================================+
| STICKY SAVE BAR                          [Discard]  [Save]       |
+==================================================================+
```

**Left column:**
- Title input
- Handle input
- Description textarea
- Products assignment section:
  - Search input with live debounce (300ms)
  - Search results dropdown (conditionally shown): list of matching products with "Add" button
  - Assigned products list: each row shows product title, thumbnail, and a remove button. Rows are sortable via drag-to-reorder.

**Right column:**
- Status: Flux select with Active / Archived
- Sticky save bar (same pattern as product form)

---

## 6. Inventory Management

**Route:** `GET /admin/inventory`

**Livewire component:** `App\Livewire\Admin\Inventory\Index`

**Blade view:** `resources/views/livewire/admin/inventory/index.blade.php`

### Component Requirements

| Property | Type | Purpose |
|----------|------|---------|