Phase 2 — Theme provider & dark mode

[jonmatum]

Phase 2 — Theme provider & dark mode

Tasks

• ThemeProvider wrapping next-themes with sensible defaults (class strategy, system default, no-flash)
• useTheme() hook re-export with typed theme union ("light" | "dark" | "system")
• ThemeToggle component — icon button variant + dropdown variant — using only semantic tokens
• SSR-safe: no hydration flicker, verified in Next.js 15 App Router
• Brand override API: consumers pass { primary, accent, radius, ...overrides } via ThemeProvider props → applied as CSS variable overrides on :root / [data-theme="dark"]
• Cookie-based theme persistence helper for SSR first-paint correctness

Acceptance

• Mount <ThemeProvider> at root + drop <ThemeToggle /> anywhere → dark mode works everywhere, no FOUC
• Playwright test confirms no theme flash on first paint
• Brand overrides applied by a consumer change the look of all shadcn primitives without touching component code

Depends on Phase 1 (tokens must exist).

Part of the next-shell app shell extraction plan.