# Plan: Style Appreciation Review Pages to Match App Theme

## Current State

The review pages (`review_list.html` and `review_detail.html`) use generic Tailwind classes without the custom CSS that the existing `appreciation_list.html` uses. This makes them visually inconsistent.

## Target Design (from appreciation_list.html)

The existing appreciation page uses custom CSS classes:
- **`.page-header-gradient`** — Navy gradient (`#005696` → `#007bbd`), white text, rounded-xl
- **`.section-card`** — White bg, 2px slate-200 border, rounded-xl, hover:border-navy, shadow
- **`.section-header`** — Gradient bg (`#f8fafc` → `#f1f5f9`), border-bottom, flex with icon
- **`.section-icon`** — 40px square, rounded-xl, colored bg (blue-100, green-100, etc.)
- **Typography** — `text-xs font-bold uppercase tracking-wider` for labels, `text-2xl font-black text-navy` for counts
- **Stats cards** — 4-column grid with icon + label + value

## Issues to Fix

### Field Names (will cause errors)
- `Hospital.name_en` → `Hospital.name`
- `Staff.name_en` → `Staff.name`
- `AppreciationCategory.name_en` — KEEP (this field exists)

### review_list.html Changes
1. **Add `extra_css`** block with custom CSS classes matching appreciation_list.html
2. **Header**: Change emerald gradient → navy `.page-header-gradient`
3. **Add stats row**: Show "Total Pending" count with icon
4. **Filter card**: Use `.section-card` with `.section-header`
5. **Appreciation cards**: Use `.section-card` instead of raw Tailwind
6. **Fix field names**: `h.name_en` → `h.name`, `s.name_en` → `s.name`

### review_detail.html Changes
1. **Add `extra_css`** block with custom CSS classes
2. **Header**: Change emerald gradient → navy `.page-header-gradient`
3. **Patient Info card**: Use `.section-card` with `.section-header` and `.section-icon`
4. **Message card**: Use `.section-card`
5. **Activation form card**: Use `.section-card` with `.section-header`
6. **Fix field names**: `appreciation.hospital.name_en` → `appreciation.hospital.name`, `s.name_en` → `s.name`

## Files to Edit

1. `templates/appreciation/review_list.html`
2. `templates/appreciation/review_detail.html`

## No Schema Changes Needed

The `AppreciationCategory` model **does** have `name_en`, so those references stay. Only Hospital and Staff use `name` (not `name_en`).