ligth theme design fix

src/shared/utils/accent.ts

@@ -0,0 +1,37 @@
+/**
+ * The two-accent brand system, expressed as class names.
+ *
+ * There are exactly two non-semantic hues in this product — warm (Loyaly
+ * yellow) and cool (purple) — and their values live in globals.css as
+ * `--color-brand-*`. This file is the only place that turns one into markup,
+ * so "which utility do I use for a warm icon?" has a single answer and a
+ * feature file never writes `text-brand-warm-ink` by hand.
+ *
+ * Assignment is a property of the DATA, not of the position in a grid. Each
+ * activity carries its own accent from the API, so the same activity is the
+ * same colour on the dashboard, on the activity page and inside a campaign
+ * row — and a grid that gains a row does not repaint itself.
+ *
+ * `ink` is the readable slot (icons, text); `soft` is a tint for an icon chip
+ * only. Nothing here paints a card background: the cards stay white.
+ */
+
+export type BrandAccent = 'warm' | 'cool';
+
+export const ACCENT: Record<
+  BrandAccent,
+  {ink: string; soft: string; solid: string; chip: string}
+> = {
+  warm: {
+    ink: 'text-brand-warm-ink',
+    soft: 'bg-brand-warm-soft',
+    solid: 'bg-brand-warm',
+    chip: 'bg-brand-warm-soft text-brand-warm-ink',
+  },
+  cool: {
+    ink: 'text-brand-cool-ink',
+    soft: 'bg-brand-cool-soft',
+    solid: 'bg-brand-cool',
+    chip: 'bg-brand-cool-soft text-brand-cool-ink',
+  },
+};

src/shared/utils/icons.ts

@@ -11,11 +11,14 @@
  */
 
 import {
+  ArrowRight,
   BadgeCheck,
   Bell,
   BookOpen,
   Building2,
   CalendarClock,
+  CalendarDays,
+  Camera,
   ChartLine,
   ChevronsUpDown,
   CircleAlert,
@@ -25,6 +28,8 @@ import {
   Coins,
   Columns3,
   CreditCard,
+  Disc3,
+  DoorOpen,
   Download,
   Expand,
   Footprints,
@@ -35,9 +40,11 @@ import {
   Info,
   Keyboard,
   LayoutDashboard,
+  Lightbulb,
   Lock,
   LogOut,
   Maximize2,
+  Megaphone,
   Menu,
   MessageSquare,
   Mic,
@@ -50,21 +57,26 @@ import {
   Plus,
   Percent,
   Plug,
+  Route,
   Send,
   Settings,
   ShieldCheck,
   Shrink,
+  ShoppingBag,
   ShoppingCart,
   Sliders,
   Square,
   SquarePen,
   Sparkles,
   Store,
+  Target,
+  Ticket,
   TrendingDown,
   TrendingUp,
   Trophy,
   User,
   UserCheck,
+  UserPlus,
   Users,
   UserX,
 } from 'lucide-react';
@@ -100,6 +112,30 @@ export const ICONS = {
   conversion: Percent,
   lyt: Coins,
 
+  // Customer activities.
+  //
+  // One glyph per activity in the loyalty ecosystem. Named with an `activity`
+  // prefix rather than folded into the metric block above because several
+  // collide with an existing concept and must not be merged with it: a `visit`
+  // is a customer walking in, which is not the `visitors` KPI; `activityShop`
+  // is the shop ACTIVITY, while `purchases` is the transaction metric.
+  activityWalk: Footprints,
+  activityVisit: DoorOpen,
+  activitySelfie: Camera,
+  activitySpin: Disc3,
+  activityScratch: Ticket,
+  activityBrand: Megaphone,
+  activityChallenge: Target,
+  activityFriend: UserPlus,
+  activityShop: ShoppingBag,
+  activityEvent: CalendarDays,
+
+  // Store intelligence
+  journey: Route,
+  campaign: Megaphone,
+  insight: Lightbulb,
+  arrowRight: ArrowRight,
+
   // Dashboard controls
   compare: Columns3,