# Implementation Plan - 777 Wolfpack 'Operations Command Center' UI Refactor

This plan outlines the steps to align the 777 Wolfpack UI with the "High-trust Agritech Control System" visual direction.

## User Objective

- Transform the app into a professional, data-forward operations manager.
- Avoid "recreational" clichés in favor of a scientific, industrial agritech aesthetic.
- Implement specialized screens for Facility Overview, Room Detail, Batch Traceability, and Task Management.

## Visual System Alignment

- **Colors**: Deep blue-gray/charcoal backgrounds (#0B0E14), high-contrast data cards, desaturated green accents (#10B981).
- **Typography**: Legible Inter-style sans-serif for high data density.
- **Layout**: Persistent sidebar, KPI strips, grid-based command centers.

## Tasks

### 1. Batch & Lot Traceability Redesign

- [ ] Refactor `BatchDetailPage.tsx` to include an event timeline (planting, harvest, etc.).
- [ ] Implement KPI strips for yield, plant health, and compliance status.
- [ ] Add data tabs for Environment, Tasks, and Compliance logs.

### 2. Operational Task Board

- [ ] Refactor `TasksPage.tsx` into a high-density Kanban or specialized operational list.
- [ ] Focus on tablet-friendly targets for on-floor use.
- [ ] Use semantic icons for task types (Defoliation, Irrigation, IPM).

### 3. High-Trust Compliance & Exports

- [ ] Refactor `AuditLogPage.tsx` or `DocumentsPage.tsx` to use clean, stripe-bordered tables.
- [ ] Implement status badges for verified/unverified events.
- [ ] Add clear export CTAs in the high-trust industrial style.

### 4. Component Library Refinement

- [ ] Standardize the `DataTable` component for high density.
- [ ] Update `PageHeader` across all pages for consistent site-wide navigation feels.
- [ ] Ensure all modals/dialogs use the new charcoal/white elevated aesthetic.

## Verification

- [ ] Confirm dark mode depth and contrast across all redesigned pages.
- [ ] Verify that no "cannabis leaf" icons are used, following the agritech brief.
- [ ] Validate responsive behavior on tablet-sized viewports.