senke/veza

senke 01f2acc718 docs: generate comprehensive list of all remaining Tailwind default color instances

2026-01-16 01:51:32 +01:00

162 KiB

Raw Blame History

Complete List of Remaining Tailwind Default Color Instances

Generated: Automatically generated list Total Files: 203 Total Instances: 1169 Status: Action 9.1.1.3 - In Progress (294 instances migrated, ~19.7% complete)

Usage

This document lists all remaining Tailwind default color instances organized by file path. Each entry includes:

File path
Line number
Color classes found
Full line context

Migration Guidelines

Refer to TAILWIND_COLORS_AUDIT.md for color mapping:

text-gray-* → text-kodo-content-dim or text-kodo-text-main
bg-gray-* → bg-kodo-graphite, bg-kodo-ink, bg-kodo-steel, etc.
border-gray-* → border-kodo-steel
text-blue-* → text-kodo-cyan (when appropriate)
Other colors: Map to appropriate Kodo design system colors

Files with Tailwind Default Colors

apps/web/src/components/ErrorBoundary.tsx

Total instances in file: 1

Line 90: bg-gray-, bg-gray-

<div className="min-h-screen flex items-center justify-center bg-gray-50 dark:bg-gray-900 p-4">

apps/web/src/components/admin/AdminDashboardView.tsx

Total instances in file: 8

Line 109: text-gray-

<span className="text-xs text-gray-400 flex items-center gap-1">

Line 113: text-gray-

<span className="text-xs text-gray-400 flex items-center gap-1">

Line 181: text-gray-

<span className="text-gray-400">Database</span>

Line 185: text-gray-

<span className="text-gray-400">Storage</span>

Line 189: text-gray-

<span className="text-gray-400">API Latency</span>

Line 218: text-gray-

<div className="text-xs text-gray-400">

Line 243: text-gray-

<div className="text-center text-gray-500 py-4">

Line 270: text-gray-

<div className="text-xs text-gray-400">

apps/web/src/components/admin/AdminModerationView.tsx

Total instances in file: 7

Line 82: text-gray-, text-gray-

className={`pb-3 text-sm font-bold uppercase tracking-wider border-b-2 transition-colors ${activeTab === tab ? 'border-kodo-red text-white' : 'border-transparent text-gray-500 hover:text-gray-300'}`}

Line 107: text-gray-

<div className="text-center py-20 text-gray-500">

Line 127: text-gray-

<span className="text-xs text-gray-500 font-mono flex items-center gap-1">

Line 135: text-gray-
```

```

Line 139: text-gray-

<div className="text-xs text-gray-500">

Line 149: bg-red-, bg-red-, border-red-

className="bg-red-600 hover:bg-red-700 border-red-500 text-white"

Line 174: text-gray-

className="text-gray-500 hover:text-white"

apps/web/src/components/admin/AdminSettingsView.tsx

Total instances in file: 6

Line 40: text-gray-

<label className="block text-sm font-bold text-gray-400 mb-2">

Line 49: text-gray-

<p className="text-xs text-gray-500 mt-1">

Line 54: text-gray-

<label className="block text-sm font-bold text-gray-400 mb-2">

Line 102: text-gray-

<div className="text-xs text-gray-400">

Line 108: bg-gray-

className={`w-12 h-6 rounded-full relative cursor-pointer transition-colors ${maintenance ? 'bg-kodo-red' : 'bg-gray-600'}`}

Line 117: text-gray-

<label className="block text-sm font-bold text-gray-400 mb-2">

apps/web/src/components/admin/AdminUsersView.tsx

Total instances in file: 4

Line 73: text-gray-

<p className="text-gray-400 font-mono text-sm">

Line 130: text-gray-

<tr className="border-b border-kodo-steel bg-kodo-graphite text-xs font-bold text-gray-500 uppercase tracking-wider">

Line 154: text-gray-

<td colSpan={7} className="p-8 text-center text-gray-500">

Line 164: text-gray-

<div className="p-4 border-t border-kodo-steel bg-kodo-ink/30 text-xs text-gray-500 flex justify-between items-center">

apps/web/src/components/admin/UserTableRow.tsx

Total instances in file: 9

Line 23: bg-gray-
```
offline: 'bg-gray-500',
```

Line 45: text-gray-

<div className="text-xs text-gray-500 font-mono">{user.id}</div>

Line 49: text-gray-

<td className="p-4 text-sm text-gray-400">{user.email}</td>

Line 64: text-gray-

<td className="p-4 text-sm text-gray-400">{user.tier || 'Free'}</td>

Line 65: text-gray-

<td className="p-4 text-sm text-gray-400 font-mono">

Line 68: text-gray-

<td className="p-4 text-sm text-gray-400 font-mono">

Line 74: text-gray-

className="p-1.5 hover:bg-white/10 rounded text-gray-400 hover:text-white"

Line 91: text-gray-

className="w-full text-left px-4 py-2.5 text-xs text-gray-300 hover:bg-white/10 flex items-center gap-2"

Line 99: text-gray-

<button className="w-full text-left px-4 py-2.5 text-xs text-gray-300 hover:bg-white/10 flex items-center gap-2">

apps/web/src/components/admin/modals/BanUserModal.tsx

Total instances in file: 11

Line 33: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 38: text-gray-
```

```

Line 45: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-2">

Line 63: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-2">

Line 76: text-gray-

<Calendar className="w-5 h-5 text-gray-400" />

Line 79: text-gray-

<div className="text-xs text-gray-400">

Line 86: text-gray-

className={`text-xs ${!isPermanent ? 'text-white' : 'text-gray-500'}`}

Line 92: bg-gray-

className={`w-10 h-5 rounded-full relative cursor-pointer transition-colors ${isPermanent ? 'bg-kodo-red' : 'bg-gray-600'}`}

Line 99: text-gray-

className={`text-xs ${isPermanent ? 'text-kodo-red font-bold' : 'text-gray-500'}`}

Line 108: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-2">

Line 128: bg-red-, bg-red-, border-red-

className="bg-red-600 hover:bg-red-700 border-red-500 text-white"

apps/web/src/components/analytics/TrackAnalyticsView.tsx

Total instances in file: 3

Line 53: text-gray-

<p className="text-gray-400 text-sm">Analytics Report</p>

Line 130: text-gray-

<div className="w-16 text-sm text-gray-400">{g.country}</div>

Line 170: text-gray-

<div className="flex justify-between text-xs text-gray-500 mt-2">

apps/web/src/components/commerce/CartItem.tsx

Total instances in file: 4

Line 24: bg-gray-

<div className="w-full md:w-24 h-24 rounded-lg overflow-hidden flex-shrink-0 bg-gray-800">

Line 35: text-gray-

<p className="text-gray-400 text-sm mb-2">{item.author}</p>

Line 40: text-gray-

<span className="px-2 py-1 bg-kodo-ink border border-kodo-steel rounded uppercase font-bold text-gray-500">

Line 54: text-gray-

className="text-gray-500 hover:text-kodo-red hover:bg-kodo-red/10"

apps/web/src/components/commerce/OrderSummary.tsx

Total instances in file: 5

Line 42: border-gray-

<h3 className="font-bold text-white mb-6 uppercase tracking-wider text-sm border-b border-gray-700 pb-2">

Line 47: text-gray-

<div className="flex justify-between text-gray-400">

Line 63: text-gray-

<div className="flex justify-between text-gray-400">

Line 71: border-gray-

<div className="border-t border-gray-700 pt-4 mb-6">

Line 95: text-gray-

<p className="text-xs text-gray-400 leading-relaxed">

apps/web/src/components/commerce/WishlistView.tsx

Total instances in file: 7

Line 79: text-gray-

<Heart className="w-10 h-10 text-gray-600" />

Line 84: text-gray-
```

```

Line 98: text-gray-

<p className="text-gray-400 font-mono text-sm">

Line 119: bg-gray-

<div className="relative w-24 h-24 bg-gray-800 rounded-lg overflow-hidden flex-shrink-0">

Line 150: text-gray-

<p className="text-xs text-gray-400 truncate">

Line 153: text-gray-

<p className="text-xs text-gray-500 mt-1 capitalize">

Line 175: text-gray-

className="text-gray-500 hover:text-kodo-red"

apps/web/src/components/commerce/modals/PromoCodeModal.tsx

Total instances in file: 1

Line 43: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

apps/web/src/components/commerce/modals/RefundRequestModal.tsx

Total instances in file: 5

Line 36: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 41: text-gray-
```

```

Line 48: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-2">

Line 64: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-2">

Line 75: text-gray-, border-gray-

<div className="border-2 border-dashed border-kodo-steel rounded-lg p-6 flex flex-col items-center justify-center text-gray-500 hover:text-white hover:border-gray-500 cursor-pointer transition-colors">

apps/web/src/components/dashboard/StatCard.tsx

Total instances in file: 2

Line 83: text-gray-

<p className="text-xs font-mono text-gray-400 uppercase tracking-widest mb-1">

Line 106: text-gray-

<span className="text-gray-500 font-normal">vs last period</span>

apps/web/src/components/dashboard/TrackList.tsx

Total instances in file: 5

Line 96: text-gray-

<div className="text-gray-500 text-center py-10 bg-kodo-ink/30 rounded-xl border border-dashed border-kodo-steel">

Line 122: text-gray-

<div className="w-8 text-center text-gray-500 font-mono text-xs font-bold pl-2">

Line 130: text-gray-

<span className="group-hover:hidden text-gray-600">

Line 156: text-gray-

<p className="text-xs text-gray-400 truncate hover:underline">

Line 161: text-gray-

<div className="hidden md:flex items-center gap-6 text-gray-500 text-xs font-medium">

apps/web/src/components/developer/APIPlaygroundView.tsx

Total instances in file: 7

Line 61: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-2">

Line 78: text-gray-

<p className="text-xs text-gray-500 mt-1">

Line 84: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-2">

Line 125: text-gray-

<span className="text-xs font-bold text-gray-400 bg-white/10 px-2 py-1 rounded">

Line 135: text-green-

<pre className="text-xs text-green-400 font-mono whitespace-pre-wrap overflow-auto h-full max-h-[500px]">

Line 139: bg-gray-, text-gray-

className="absolute top-2 right-2 p-2 bg-gray-800 rounded text-gray-400 hover:text-white opacity-0 group-hover:opacity-100 transition-opacity"

Line 149: text-gray-

<div className="flex flex-col items-center justify-center h-full text-gray-500">

apps/web/src/components/developer/DeveloperDashboardView.tsx

Total instances in file: 6

Line 91: text-gray-

<p className="text-gray-400 font-mono text-sm">

Line 143: text-gray-

<tr className="text-xs text-gray-500 uppercase border-b border-kodo-steel/50">

Line 161: text-gray-

<td className="py-4 text-gray-400">{key.created}</td>

Line 162: text-gray-

<td className="py-4 text-gray-300">{key.lastUsed}</td>

Line 167: text-gray-

className="h-8 w-8 text-gray-400 hover:text-white"

Line 185: text-gray-

<td colSpan={5} className="py-8 text-center text-gray-500">

apps/web/src/components/developer/WebhooksView.tsx

Total instances in file: 5

Line 65: text-gray-

<p className="text-gray-400 font-mono text-sm">

Line 108: text-gray-

<div className="text-xs text-gray-400 mt-1 flex flex-wrap gap-2">

Line 109: text-gray-

<span className="text-gray-500">Events:</span>

Line 113: text-gray-

className="bg-white/5 px-1.5 rounded text-gray-300"

Line 118: text-gray-
```

```

apps/web/src/components/developer/modals/CreateAPIKeyModal.tsx

Total instances in file: 6

Line 66: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 82: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-3">

Line 89: border-gray-

className="flex items-center gap-3 p-3 bg-kodo-ink rounded border border-kodo-steel cursor-pointer hover:border-gray-500 transition-colors"

Line 93: border-gray-

className="rounded border-gray-600 bg-transparent text-kodo-gold focus:ring-0"

Line 97: text-gray-

<span className="text-sm text-gray-300">

Line 114: text-gray-

<p className="text-sm text-gray-400 max-w-xs mx-auto">

apps/web/src/components/education/CourseCard.tsx

Total instances in file: 4

Line 25: bg-gray-

<div className="relative aspect-video bg-gray-900 overflow-hidden">

Line 68: text-gray-

<p className="text-gray-400 text-xs mb-3">by {course.instructor}</p>

Line 73: text-gray-

<div className="flex justify-between text-xs text-gray-400">

Line 95: text-gray-

<div className="flex items-center gap-1 text-xs text-gray-500">

apps/web/src/components/education/CourseDetailView.tsx

Total instances in file: 18

Line 51: text-gray-

className="pl-0 text-gray-400 hover:text-white"

Line 65: text-gray-

<p className="text-xl text-gray-300 mb-6 font-light">

Line 69: text-gray-

<div className="flex flex-wrap items-center gap-6 text-sm text-gray-400 mb-6">

Line 93: text-gray-

<div className="text-xs text-gray-500 uppercase">

Line 109: text-gray-, text-gray-

className={`pb-3 text-sm font-bold uppercase tracking-wider border-b-2 transition-colors ${activeTab === tab ? 'border-kodo-cyan text-white' : 'border-transparent text-gray-500 hover:text-gray-300'}`}

Line 125: text-gray-

<div key={i} className="flex gap-3 text-sm text-gray-300">

Line 137: text-gray-

<ul className="list-disc pl-5 space-y-1 text-sm text-gray-400">

Line 148: text-gray-

<div className="flex justify-between items-center text-sm text-gray-400 mb-2">

Line 185: text-gray-

<span className="text-xs text-gray-500">

Line 198: text-gray-

<div className="flex items-center gap-3 text-sm text-gray-300">

Line 208: text-gray-

<Lock className="w-3 h-3 text-gray-500" />

Line 210: text-gray-

<span className="text-xs text-gray-500">

Line 243: text-gray-

className={`w-3 h-3 ${i < review.rating ? 'fill-current' : 'text-gray-700'}`}

Line 248: text-gray-

<span className="ml-auto text-xs text-gray-500">

Line 252: text-gray-

<p className="text-sm text-gray-300">{review.comment}</p>

Line 291: text-gray-

<p className="text-gray-400 text-xs mb-6 line-through">

Line 313: text-gray-

<p className="text-center text-xs text-gray-500">

Line 323: text-gray-

<ul className="text-sm text-gray-400 space-y-2">

apps/web/src/components/education/CourseLearningView.tsx

Total instances in file: 11

Line 124: text-gray-

<div className="text-xs text-gray-400 font-mono hidden md:block">

Line 149: text-gray-

<p className="text-gray-500">Video Player Placeholder</p>

Line 150: text-gray-

<p className="text-xs text-gray-600 mt-2">

Line 174: text-gray-

<p className="text-gray-300 leading-relaxed">

Line 211: text-gray-, text-gray-

className={`pb-3 text-sm font-bold uppercase tracking-wider border-b-2 transition-colors ${activeTab === tab ? 'border-kodo-cyan text-white' : 'border-transparent text-gray-500 hover:text-gray-300'}`}

Line 219: text-gray-

<div className="text-gray-300 space-y-4">

Line 283: text-gray-

<div className="p-4 bg-kodo-ink/50 text-xs font-bold text-gray-400 uppercase tracking-wider sticky top-0 backdrop-blur-sm z-10">

Line 301: text-gray-

className={`w-4 h-4 ${isActive ? 'text-kodo-cyan' : 'text-gray-500'}`}

Line 304: text-gray-

<HelpCircle className="w-4 h-4 text-gray-500" />

Line 309: text-gray-

className={`text-sm font-medium leading-snug ${isActive ? 'text-white' : 'text-gray-300'}`}

Line 313: text-gray-

<div className="text-[10px] text-gray-500 mt-1 flex items-center gap-2">

apps/web/src/components/education/MyCoursesView.tsx

Total instances in file: 4

Line 93: bg-gray-

<div className="w-full bg-gray-700 h-2 rounded-full mb-4 max-w-md mx-auto md:mx-0">

Line 113: text-gray-, text-gray-

className={`pb-3 text-sm font-bold uppercase tracking-wider border-b-2 transition-colors ${activeTab === 'in_progress' ? 'border-kodo-cyan text-white' : 'border-transparent text-gray-500 hover:text-gray-300'}`}

Line 119: text-gray-, text-gray-

className={`pb-3 text-sm font-bold uppercase tracking-wider border-b-2 transition-colors ${activeTab === 'completed' ? 'border-kodo-lime text-white' : 'border-transparent text-gray-500 hover:text-gray-300'}`}

Line 136: text-gray-

<div className="col-span-full text-center py-20 text-gray-500">

apps/web/src/components/education/modals/CertificateModal.tsx

Total instances in file: 14

Line 41: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 45: bg-gray-

<div className="p-8 bg-gray-900 flex justify-center">

Line 47: border-gray-

<div className="w-full aspect-[1.414] bg-white text-black p-8 relative shadow-2xl max-w-2xl border-8 border-double border-gray-300">

Line 50: text-gray-

<h1 className="text-4xl font-display font-bold text-gray-900 mb-2 uppercase tracking-widest">

Line 53: text-gray-

<p className="text-sm font-serif italic text-gray-500">

Line 58: text-gray-

<p className="text-sm text-gray-600 mb-2">

Line 61: border-gray-

<h2 className="text-3xl font-script font-bold text-kodo-cyan-dim mb-6 border-b-2 border-gray-200 pb-2 px-8">

Line 65: text-gray-

<p className="text-sm text-gray-600 mb-2">

Line 68: text-gray-

<h3 className="text-xl font-bold text-gray-800 mb-8 max-w-md leading-tight">

Line 72: border-gray-

<div className="flex justify-between w-full mt-auto pt-8 border-t border-gray-300">

Line 74: text-gray-

<p className="text-xs font-bold text-gray-900">

Line 77: text-gray-

<p className="text-[10px] text-gray-500 uppercase">Date</p>

Line 80: bg-gray-

<div className="h-8 w-24 bg-gray-200 mb-1 opacity-50"></div>{' '}

Line 82: text-gray-

<p className="text-[10px] text-gray-500 uppercase">

apps/web/src/components/education/modals/QuizModal.tsx

Total instances in file: 6

Line 79: text-gray-
```

```

Line 114: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 130: text-gray-

<span className="text-xs font-bold text-gray-500 uppercase mb-2 block">

Line 145: text-gray-, border-gray-

: 'bg-kodo-ink border-kodo-steel text-gray-300 hover:bg-white/5 hover:border-gray-500'

Line 150: border-gray-, text-gray-

className={`w-6 h-6 rounded-full border flex items-center justify-center text-xs font-bold ${selectedAnswers[currentQuestionIndex] === idx ? 'bg-kodo-cyan border-kodo-cyan text-black' : 'border-gray-500 text-gray-500'}`}

Line 163: text-gray-

<span className="text-xs text-gray-500">

apps/web/src/components/forms/RegisterForm.tsx

Total instances in file: 4

Line 135: border-green-

? 'border-green-500 focus-visible:ring-green-500'

Line 136: border-red-

: 'border-red-500 focus-visible:ring-red-500'),

Line 143: text-green-
```
className="h-5 w-5 text-green-500"
```

Line 147: text-red-

<XCircle className="h-5 w-5 text-red-500" aria-hidden="true" />

apps/web/src/components/gamification/AchievementCard.tsx

Total instances in file: 7

Line 32: text-gray-

<div className="absolute top-2 right-2 text-gray-500">

Line 41: from-gray-, border-gray-, text-gray-

className={`rounded-full bg-gradient-to-br from-gray-800 to-black flex items-center justify-center border-2 ${isUnlocked ? 'border-kodo-gold w-16 h-16 text-3xl shadow-[0_0_15px_rgba(234,179,8,0.3)]' : 'border-gray-700 w-12 h-12 text-xl text-gray-500'}`}

Line 48: text-gray-

className={`font-bold truncate ${isUnlocked ? 'text-white' : 'text-gray-400'}`}

Line 52: text-gray-

<p className="text-xs text-gray-500 line-clamp-2 mb-2">

Line 57: bg-gray-

<div className="w-full bg-gray-800 h-1.5 rounded-full overflow-hidden">

Line 59: bg-gray-

className={`h-full transition-all duration-500 ${isUnlocked ? 'bg-kodo-gold' : 'bg-gray-600'}`}

Line 64: text-gray-

<span className={isUnlocked ? 'text-kodo-gold' : 'text-gray-500'}>

apps/web/src/components/gamification/AchievementsView.tsx

Total instances in file: 1

Line 61: text-gray-

<p className="text-gray-400 font-mono text-sm">

apps/web/src/components/gamification/LeaderboardView.tsx

Total instances in file: 7

Line 40: text-gray-

<p className="text-gray-400 font-mono text-sm">

Line 50: text-gray-

className={`px-4 py-2 rounded text-xs font-bold uppercase transition-all ${period === p ? 'bg-kodo-gold text-black shadow-lg' : 'text-gray-400 hover:text-white'}`}

Line 75: border-gray-

className={`w-20 h-20 md:w-24 md:h-24 rounded-full overflow-hidden border-4 ${i === 1 ? 'border-kodo-gold' : i === 0 ? 'border-gray-300' : 'border-orange-400'}`}

Line 107: text-gray-

<tr className="border-b border-kodo-steel bg-kodo-ink text-xs font-bold text-gray-500 uppercase tracking-wider">

Line 121: text-gray-

<td className="p-4 text-center font-bold font-mono text-gray-400">

Line 136: text-gray-

<span className="bg-kodo-slate px-2 py-1 rounded text-xs font-mono text-gray-300">

Line 154: text-gray-

<span className="text-gray-500 flex items-center justify-center">

apps/web/src/components/gamification/ProfileXPView.tsx

Total instances in file: 8

Line 81: text-gray-
```

```

Line 89: text-gray-

<div className="text-xs text-gray-500">

Line 104: text-gray-

<div className="bg-black/30 px-3 py-1 rounded text-xs text-gray-400">

Line 110: text-gray-

<div className="bg-black/30 px-3 py-1 rounded text-xs text-gray-400">

Line 126: text-gray-

<div className="text-xs text-gray-500 uppercase font-bold">

Line 137: text-gray-

<div className="text-xs text-gray-500 uppercase font-bold">

Line 148: text-gray-

<div className="text-xs text-gray-500 uppercase font-bold">

Line 192: text-gray-

<div className="flex justify-between text-xs text-gray-500 mt-2">

apps/web/src/components/gamification/XPBar.tsx

Total instances in file: 2

Line 44: text-gray-
```

```

Line 67: text-gray-

<div className="text-right text-[10px] text-gray-500 mt-1 font-mono">

apps/web/src/components/inventory/AddEquipmentView.tsx

Total instances in file: 5

Line 59: text-gray-

<div className="aspect-square bg-kodo-ink border-2 border-dashed border-kodo-steel rounded-xl flex flex-col items-center justify-center text-gray-500 hover:text-white hover:border-kodo-cyan cursor-pointer transition-colors group mb-4">

Line 75: text-gray-

<FileText className="w-4 h-4 text-gray-400" /> Documents

Line 78: text-gray-

<p className="text-xs text-gray-500 mt-2 text-center">

Line 92: text-gray-

<label className="block text-sm font-medium text-gray-400 mb-2">

Line 162: text-gray-

<label className="block text-sm font-medium text-gray-400 mb-2">

apps/web/src/components/inventory/EquipmentCard.tsx

Total instances in file: 3

Line 19: text-gray-, bg-gray-
```
Sold: 'text-gray-400 bg-gray-500/10',
```

Line 29: bg-gray-

<div className="relative aspect-square bg-gray-900 overflow-hidden">

Line 56: text-gray-

<div className="flex items-center gap-1 text-gray-400">

apps/web/src/components/inventory/EquipmentDetailView.tsx

Total instances in file: 18

Line 65: text-gray-

<div className="text-center py-20 text-gray-500">Item not found</div>

Line 83: text-gray-

className="pl-0 text-gray-400 hover:text-white"

Line 127: bg-gray-

className={`w-2 h-2 rounded-full ${i === activeImgIndex ? 'bg-kodo-cyan' : 'bg-gray-600'}`}

Line 143: text-gray-

<span className="text-gray-500 block text-xs uppercase">

Line 150: text-gray-

<p className="text-gray-500">No specs defined.</p>

Line 162: bg-gray-, text-gray-

className={`px-2 py-0.5 rounded text-[10px] font-bold uppercase ${item.status === 'Active' ? 'bg-kodo-lime/10 text-kodo-lime' : 'bg-gray-700 text-gray-300'}`}

Line 174: text-gray-

<div className="flex gap-6 text-sm text-gray-400 mb-6 font-mono bg-kodo-ink p-4 rounded-lg border border-kodo-steel/50">

Line 176: text-gray-

<span className="text-[10px] uppercase font-bold text-gray-500">

Line 182: text-gray-

<span className="text-[10px] uppercase font-bold text-gray-500">

Line 188: text-gray-

<span className="text-[10px] uppercase font-bold text-gray-500">

Line 199: border-gray-

<h3 className="font-bold text-white mb-4 border-b border-gray-700 pb-2 flex items-center gap-2">

Line 205: text-gray-

<span className="block text-xs text-gray-500 uppercase">

Line 216: text-gray-

<span className="text-gray-500">Support: </span>

Line 229: text-gray-

<FileText className="w-4 h-4 text-gray-400" /> Documentation

Line 239: text-gray-

<span className="text-sm text-gray-300">{doc.name}</span>

Line 244: text-gray-

className="h-8 w-8 text-gray-500 hover:text-white"

Line 268: text-gray-

<span className="text-xs text-gray-500">{log.date}</span>

Line 270: text-gray-

<p className="text-xs text-gray-400 mt-1">{log.notes}</p>

apps/web/src/components/inventory/InventoryView.tsx

Total instances in file: 6

Line 59: text-gray-

<p className="text-gray-400 font-mono text-sm">

Line 93: text-gray-

<Filter className="w-4 h-4 text-gray-500 ml-2" />

Line 95: text-gray-

className="bg-transparent text-sm text-gray-300 focus:outline-none p-1 cursor-pointer"

Line 108: text-gray-

<Box className="w-4 h-4 text-gray-500 ml-2" />

Line 110: text-gray-

className="bg-transparent text-sm text-gray-300 focus:outline-none p-1 cursor-pointer"

Line 139: text-gray-

<div className="col-span-full text-center py-20 text-gray-500">

apps/web/src/components/keyboard/KeyboardShortcutsHelp.tsx

Total instances in file: 3

Line 80: border-gray-, border-gray-

className="flex items-center justify-between border-b border-gray-200 dark:border-gray-700 pb-2 last:border-0"

Line 82: text-gray-, text-gray-

<span className="text-sm text-gray-600 dark:text-gray-400">

Line 85: text-gray-, text-gray-, bg-gray-, bg-gray-, border-gray-, border-gray-

<kbd className="px-2 py-1 text-xs font-semibold text-gray-800 dark:text-gray-200 bg-gray-100 dark:bg-gray-800 border border-gray-300 dark:border-gray-600 rounded">

apps/web/src/components/layout/AudioPlayer.tsx

Total instances in file: 15

Line 72: text-gray-

className="w-5 h-5 text-gray-400 cursor-pointer hover:text-white"

Line 80: text-gray-

className={`flex-1 py-3 text-xs font-bold uppercase tracking-wider transition-colors ${queueTab === 'up-next' ? 'text-kodo-cyan border-b-2 border-kodo-cyan bg-white/5' : 'text-gray-500 hover:text-white'}`}

Line 86: text-gray-

className={`flex-1 py-3 text-xs font-bold uppercase tracking-wider transition-colors ${queueTab === 'history' ? 'text-kodo-magenta border-b-2 border-kodo-magenta bg-white/5' : 'text-gray-500 hover:text-white'}`}

Line 110: text-gray-

<div className="text-xs text-gray-400 truncate">

Line 115: text-gray-

className="p-2 hover:bg-white/10 rounded-full text-gray-400 hover:text-kodo-magenta"

Line 125: text-gray-

<div className="text-center text-gray-500 py-12 flex flex-col items-center">

Line 140: text-gray-

<div className="cursor-grab active:cursor-grabbing text-gray-600 hover:text-white p-1">

Line 157: text-gray-

<div className="text-sm font-medium text-gray-300 group-hover:text-white truncate">

Line 160: text-gray-

<div className="text-xs text-gray-500 truncate">

Line 178: text-red-
```
className="p-1.5 hover:text-red-500"
```

Line 197: text-gray-

<div className="text-center text-gray-500 py-12 flex flex-col items-center">

Line 215: text-gray-

<div className="text-sm font-medium text-gray-300 group-hover:text-white truncate">

Line 218: text-gray-

<div className="text-xs text-gray-500 truncate">

Line 223: text-gray-

className="p-1.5 text-gray-400 hover:text-kodo-cyan opacity-0 group-hover:opacity-100 transition-opacity"

Line 242: text-gray-, text-red-

className="w-full text-xs text-gray-400 hover:text-red-400"

apps/web/src/components/layout/Header.tsx

Total instances in file: 1

Line 209: text-red-, text-red-, bg-red-

className="flex items-center gap-3 w-full px-3 py-2 text-sm text-red-400/80 hover:text-red-400 hover:bg-red-500/10 rounded-xl transition-all group cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-red-400 focus-visible:ring-offset-2 focus-visible:ring-offset-kodo-void"

Total instances in file: 6

Line 174: from-gray-, to-gray-

<div className="w-9 h-9 rounded-full bg-gradient-to-tr from-gray-700 to-gray-600 p-[1px] hover:ring-2 hover:ring-kodo-cyan transition-all">

Line 192: text-gray-

<p className="text-xs text-gray-500">Pro Plan</p>

Line 199: text-gray-

className="w-full text-left px-4 py-2.5 text-sm text-gray-300 hover:bg-white/5 hover:text-white flex items-center gap-3 transition-colors"

Line 208: text-gray-

className="w-full text-left px-4 py-2.5 text-sm text-gray-300 hover:bg-white/5 hover:text-white flex items-center gap-3 transition-colors"

Line 217: text-gray-

className="w-full text-left px-4 py-2.5 text-sm text-gray-300 hover:bg-white/5 hover:text-white flex items-center gap-3 transition-colors"

Line 226: text-gray-

className="w-full text-left px-4 py-2.5 text-sm text-gray-300 hover:bg-white/5 hover:text-white flex items-center gap-3 transition-colors"

apps/web/src/components/layout/Sidebar.tsx

Total instances in file: 1

Line 324: text-red-, text-red-, bg-red-

className="w-full flex items-center gap-3 px-4 py-2.5 text-red-400/80 hover:text-red-400 hover:bg-red-500/10 rounded-xl transition-all text-sm mt-1 cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-red-400 focus-visible:ring-offset-2 focus-visible:ring-offset-kodo-void"

apps/web/src/components/library/AutoMetadataDetectionModal.tsx

Total instances in file: 6

Line 52: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 69: text-gray-

<p className="text-sm text-gray-400 mt-2">

Line 80: text-gray-

<div className="text-xs text-gray-500 uppercase font-bold mb-1">

Line 88: text-gray-

<div className="text-xs text-gray-500 uppercase font-bold mb-1">

Line 96: text-gray-

<div className="text-xs text-gray-500 uppercase font-bold mb-1">

Line 104: text-gray-

<div className="text-xs text-gray-500 uppercase font-bold mb-1">

apps/web/src/components/library/WatermarkSettingsModal.tsx

Total instances in file: 6

Line 56: bg-gray-

className={`w-10 h-5 rounded-full relative transition-colors ${enabled ? 'bg-kodo-magenta' : 'bg-gray-600'}`}

Line 72: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-2">

Line 80: text-gray-, border-gray-

className={`h-10 rounded border text-[10px] uppercase font-bold transition-all ${position === i ? 'bg-kodo-magenta border-kodo-magenta text-white' : 'bg-kodo-void border-kodo-steel text-gray-500 hover:border-gray-400'}`}

Line 84: bg-gray-

className={`w-2 h-2 rounded-full mx-auto ${position === i ? 'bg-white' : 'bg-gray-600'}`}

Line 92: text-gray-

<div className="flex justify-between text-xs text-gray-400 mb-2">

Line 132: bg-gray-

<div className="w-3/4 aspect-square bg-gray-800 rounded-lg relative overflow-hidden shadow-2xl">

apps/web/src/components/library/playlists/AddToPlaylistModal.tsx

Total instances in file: 4

Line 82: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 95: text-gray-

<Search className="absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-500" />

Line 126: text-gray-

<div className="text-xs text-gray-500">

Line 131: border-gray-

className={`w-5 h-5 rounded-full border flex items-center justify-center ${selectedIds.includes(playlist.id) ? 'bg-kodo-cyan border-kodo-cyan' : 'border-gray-600'}`}

apps/web/src/components/library/playlists/CreatePlaylistModal.tsx

Total instances in file: 7

Line 41: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 46: text-gray-

<div className="w-40 h-40 bg-kodo-ink border-2 border-dashed border-kodo-steel rounded-lg flex flex-col items-center justify-center text-gray-500 hover:text-white hover:border-kodo-cyan cursor-pointer transition-colors flex-shrink-0">

Line 81: text-gray-

<div className="text-xs text-gray-400">

Line 89: bg-gray-

className={`w-8 h-4 rounded-full relative transition-colors ${isPublic ? 'bg-kodo-cyan' : 'bg-gray-600'}`}

Line 103: text-gray-

className={`w-4 h-4 ${isCollaborative ? 'text-kodo-lime' : 'text-gray-400'}`}

Line 107: text-gray-

<div className="text-xs text-gray-400">

Line 113: bg-gray-

className={`w-8 h-4 rounded-full relative transition-colors ${isCollaborative ? 'bg-kodo-lime' : 'bg-gray-600'}`}

apps/web/src/components/library/playlists/EditPlaylistModal.tsx

Total instances in file: 4

Line 53: text-gray-

<p className="text-sm text-gray-400 mb-6">

Line 62: bg-red-, bg-red-, border-red-

className="bg-red-600 hover:bg-red-700 border-red-500"

Line 83: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 130: bg-gray-

className={`w-8 h-4 rounded-full relative transition-colors ${isPublic ? 'bg-kodo-cyan' : 'bg-gray-600'}`}

apps/web/src/components/library/playlists/PlaylistDetailView.tsx

Total instances in file: 13

Line 121: text-gray-

<p className="text-gray-400 text-sm mb-6 max-w-2xl">

Line 125: text-gray-

<div className="flex items-center gap-4 text-sm text-gray-300 font-medium mb-6">

Line 127: bg-gray-

<div className="w-6 h-6 rounded-full bg-gray-700"></div>

Line 132: bg-gray-

<span className="w-1 h-1 bg-gray-500 rounded-full"></span>

Line 134: bg-gray-

<span className="w-1 h-1 bg-gray-500 rounded-full"></span>

Line 160: text-gray-

className="border border-white/10 hover:border-white text-gray-300 hover:text-white"

Line 169: text-gray-

className="border border-white/10 hover:border-white text-gray-300 hover:text-white"

Line 181: text-gray-

<div className="grid grid-cols-[auto_1fr_auto_auto_auto] gap-4 text-xs font-bold text-gray-500 uppercase px-4 pb-2 border-b border-white/10 mb-2">

Line 201: text-gray-

<div className="w-8 text-center flex justify-center text-gray-500 group-hover:text-white cursor-grab active:cursor-grabbing">

Line 217: text-gray-

<div className="text-gray-400 text-xs truncate hover:underline cursor-pointer">

Line 222: text-gray-

<div className="hidden md:block text-gray-400 text-sm truncate">

Line 225: text-gray-

<div className="hidden sm:block text-gray-500 text-xs">

Line 228: text-gray-

<div className="text-right pr-2 flex items-center justify-end gap-4 text-sm text-gray-400 font-mono">

apps/web/src/components/library/playlists/PlaylistsView.tsx

Total instances in file: 7

Line 97: text-gray-

<p className="text-gray-400 font-mono text-sm">

Line 131: bg-gray-

<div className="aspect-square relative bg-gray-900">

Line 138: text-gray-

<div className="w-full h-full flex items-center justify-center text-gray-600">

Line 157: text-gray-

<p className="text-xs text-gray-400 mb-3 line-clamp-1">

Line 160: text-gray-

<div className="flex justify-between items-center text-[10px] font-bold text-gray-500 uppercase">

Line 163: text-gray-

<Globe className="w-3 h-3 text-gray-600" />

Line 165: text-gray-

<Lock className="w-3 h-3 text-gray-600" />

apps/web/src/components/library/playlists/QueueView.tsx

Total instances in file: 11

Line 64: text-gray-

<p className="text-gray-400 font-mono text-sm">

Line 90: text-gray-

<h3 className="text-xs font-bold text-gray-500 uppercase tracking-widest mb-3">

Line 126: text-gray-

<div className="text-gray-500 font-mono text-sm hidden md:block">

Line 136: text-gray-

<h3 className="text-xs font-bold text-gray-500 uppercase tracking-widest">

Line 144: text-gray-

className={`text-xs font-bold ${autoplay ? 'text-kodo-lime' : 'text-gray-500'}`}

Line 149: bg-gray-

className={`w-8 h-4 rounded-full relative transition-colors ${autoplay ? 'bg-kodo-lime' : 'bg-gray-700'}`}

Line 160: text-gray-

<div className="text-center py-12 border-2 border-dashed border-kodo-steel rounded-xl text-gray-500">

Line 181: text-gray-

<div className="text-gray-600 cursor-grab active:cursor-grabbing hover:text-white p-1">

Line 200: text-gray-

<div className="text-xs text-gray-400 truncate">

Line 204: text-gray-

<div className="text-gray-500 font-mono text-xs hidden sm:block">

Line 208: text-gray-

className="p-2 text-gray-500 hover:text-kodo-red opacity-0 group-hover:opacity-100 transition-opacity"

apps/web/src/components/library/playlists/SaveQueueAsPlaylistModal.tsx

Total instances in file: 4

Line 38: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 52: border-gray-

className="flex items-center justify-between p-3 bg-kodo-ink rounded border border-kodo-steel cursor-pointer hover:border-gray-500"

Line 65: text-gray-

<div className="text-xs text-gray-400">

Line 71: bg-gray-

className={`w-10 h-5 rounded-full relative transition-colors ${isPublic ? 'bg-kodo-cyan' : 'bg-gray-600'}`}

apps/web/src/components/live/LiveStreamDetailView.tsx

Total instances in file: 4

Line 52: text-gray-
```
color: 'text-gray-400',
```

Line 170: text-gray-

<Settings className="w-4 h-4 text-gray-400 cursor-pointer hover:text-white" />

Line 181: text-gray-

<span className="text-gray-300">{msg.text}</span>

Line 203: text-gray-

<span className="text-[10px] text-gray-500">Slow Mode: Off</span>

apps/web/src/components/live/modals/TipStreamerModal.tsx

Total instances in file: 9

Line 46: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 53: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-2">

Line 61: text-gray-

className={`flex-1 py-2 rounded font-bold border transition-colors ${amount === val ? 'bg-kodo-gold text-black border-kodo-gold' : 'bg-kodo-void border-kodo-steel text-gray-400 hover:text-white'}`}

Line 68: text-gray-

<span className="absolute left-3 top-1/2 -translate-y-1/2 text-gray-400 font-bold">

Line 83: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-2">

Line 93: text-gray-

<p className="text-right text-xs text-gray-500 mt-1">

Line 100: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-2">

Line 106: text-gray-

className={`flex-1 flex items-center justify-center gap-2 py-2 rounded border ${paymentMethod === 'card' ? 'bg-kodo-cyan/10 border-kodo-cyan text-kodo-cyan' : 'bg-kodo-void border-kodo-steel text-gray-400'}`}

Line 112: text-gray-

className={`flex-1 flex items-center justify-center gap-2 py-2 rounded border ${paymentMethod === 'crypto' ? 'bg-kodo-magenta/10 border-kodo-magenta text-kodo-magenta' : 'bg-kodo-void border-kodo-steel text-gray-400'}`}

apps/web/src/components/marketplace/LicenceCard.tsx

Total instances in file: 2

Line 42: text-gray-

<li key={i} className="flex items-start gap-2 text-sm text-gray-300">

Line 48: text-gray-

<li className="text-xs text-gray-500 pl-6">

apps/web/src/components/marketplace/ProductCard.tsx

Total instances in file: 3

Line 95: text-gray-

<p className="text-gray-400 text-xs mb-4 flex items-center gap-1">

Line 97: text-gray-

<span className="text-gray-300 hover:underline">

Line 105: text-gray-

<span className="text-gray-500">({product.reviewCount || 0})</span>

apps/web/src/components/marketplace/ProductDetailView.tsx

Total instances in file: 19

Line 65: text-gray-

<span className="text-gray-500 text-sm">

Line 93: bg-gray-

<div className="h-1 bg-gray-600 rounded-full overflow-hidden">

Line 125: text-gray-

className="border border-kodo-steel text-gray-400 hover:text-kodo-magenta"

Line 132: text-gray-

className="border border-kodo-steel text-gray-400 hover:text-white"

Line 141: text-gray-

<div className="flex items-center gap-4 text-sm text-gray-400">

Line 155: text-gray-

<div className="text-[10px] text-gray-500 uppercase font-bold">

Line 161: text-gray-

<div className="text-[10px] text-gray-500 uppercase font-bold">

Line 167: text-gray-

<div className="text-[10px] text-gray-500 uppercase font-bold">

Line 173: text-gray-

<div className="text-[10px] text-gray-500 uppercase font-bold">

Line 182: text-gray-

<h3 className="text-sm font-bold text-gray-400 uppercase tracking-wider mb-4 flex items-center gap-2">

Line 201: text-gray-

<div className="text-xs text-gray-400 uppercase font-bold">

Line 228: text-gray-

<div className="prose prose-invert max-w-none text-gray-300">

Line 255: bg-gray-

className="w-10 h-10 rounded-full bg-gray-700"

Line 266: text-gray-

className={`w-3 h-3 ${i < review.rating ? 'fill-current' : 'text-gray-600'}`}

Line 270: text-gray-

<span className="text-xs text-gray-500">

Line 274: text-gray-

<p className="text-sm text-gray-300">{review.comment}</p>

Line 279: text-gray-

<p className="text-gray-500 italic text-center py-4">

Line 314: bg-gray-

className="w-16 h-16 rounded bg-gray-800 object-cover"

Line 320: text-gray-

<p className="text-xs text-gray-500">{p.type}</p>

apps/web/src/components/marketplace/modals/LicenceDetailsModal.tsx

Total instances in file: 6

Line 29: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 39: text-gray-
```

```

Line 57: text-gray-

className="flex items-start gap-3 text-sm text-gray-300"

Line 73: text-gray-

<li className="flex items-start gap-3 text-sm text-gray-400">

Line 79: text-gray-

<li className="flex items-start gap-3 text-sm text-gray-400">

Line 88: text-gray-

<p className="text-xs text-gray-500 italic">

apps/web/src/components/marketplace/modals/ReviewProductModal.tsx

Total instances in file: 4

Line 43: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 49: text-gray-

<p className="text-gray-400 text-sm mb-2">

Line 68: text-gray-
```
: 'text-gray-600'
```

Line 76: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-2">

apps/web/src/components/modals/CreatorModal.tsx

Total instances in file: 11

Line 48: text-gray-

className={`px-4 py-1.5 rounded text-sm font-bold transition-all flex items-center gap-2 ${activeTab === 'track' ? 'bg-kodo-cyan text-black' : 'text-gray-400 hover:text-white'}`}

Line 54: text-gray-

className={`px-4 py-1.5 rounded text-sm font-bold transition-all flex items-center gap-2 ${activeTab === 'product' ? 'bg-kodo-magenta text-white' : 'text-gray-400 hover:text-white'}`}

Line 60: text-gray-

className={`px-4 py-1.5 rounded text-sm font-bold transition-all flex items-center gap-2 ${activeTab === 'course' ? 'bg-kodo-gold text-black' : 'text-gray-400 hover:text-white'}`}

Line 66: text-gray-

<button onClick={onClose} className="text-gray-400 hover:text-white">

Line 79: text-gray-

className={`w-8 h-8 rounded-full flex items-center justify-center font-bold text-sm transition-colors ${step >= i ? 'bg-kodo-cyan text-black' : 'bg-kodo-slate text-gray-500'}`}

Line 91: text-gray-

<h4 className="font-bold text-gray-400 text-sm mb-2 uppercase">

Line 94: text-gray-

<ul className="text-xs text-gray-500 space-y-1">

Line 109: text-gray-

<label className="block text-sm font-medium text-gray-400 mb-2 font-body">

Line 117: text-gray-

<button className="p-3 rounded border border-kodo-steel bg-kodo-slate text-gray-400 flex flex-col items-center justify-center gap-2 hover:border-white hover:text-white">

Line 121: text-gray-

<button className="p-3 rounded border border-kodo-steel bg-kodo-slate text-gray-400 flex flex-col items-center justify-center gap-2 hover:border-white hover:text-white">

Line 136: text-gray-
```

```

apps/web/src/components/notifications/NotificationBell.tsx

Total instances in file: 2

Line 57: text-gray-

<p className="text-xs text-gray-400">{unreadCount} unread</p>

Line 71: text-gray-

<div className="text-center py-10 text-gray-500">

apps/web/src/components/notifications/NotificationItem.tsx

Total instances in file: 3

Line 38: text-gray-

return <Info className="w-4 h-4 text-gray-400" />;

Line 63: text-gray-

<p className="text-sm text-gray-200 leading-relaxed">

Line 66: text-gray-

<span className="text-xs text-gray-500 font-mono mt-1 block">

apps/web/src/components/player/LyricsPanel.tsx

Total instances in file: 2

Line 34: text-gray-

<div className="flex flex-col items-center justify-center h-full text-gray-500 opacity-50">

Line 50: text-gray-

className={`p-2 rounded-full backdrop-blur-md ${autoScroll ? 'bg-kodo-cyan/20 text-kodo-cyan' : 'bg-black/30 text-gray-400'}`}

apps/web/src/components/player/MiniPlayer.tsx

Total instances in file: 7

Line 61: text-gray-

<p className="text-gray-400 text-xs truncate hover:text-white cursor-pointer">

Line 66: text-gray-

className="text-gray-500 hover:text-kodo-magenta transition-colors ml-2"

Line 78: text-gray-

<span className="text-[10px] font-mono text-gray-500 w-8 text-right">

Line 97: text-gray-

<span className="text-[10px] font-mono text-gray-500 w-8">

Line 106: text-gray-

className="text-gray-400 hover:text-kodo-magenta transition-colors hidden xl:block"

Line 113: text-gray-

className="text-gray-400 hover:text-kodo-lime transition-colors"

Line 120: text-gray-

className={`text-gray-400 hover:text-kodo-cyan transition-colors ${isQueueOpen ? 'text-kodo-cyan' : ''}`}

apps/web/src/components/player/PlaybackSpeedModal.tsx

Total instances in file: 5

Line 27: text-gray-

<X className="w-4 h-4 text-gray-400 hover:text-white" />

Line 34: text-gray-

<div className="flex justify-between text-xs text-gray-400">

Line 58: text-gray-

className={`px-2 py-1.5 rounded text-xs font-bold transition-all ${playbackRate === rate ? 'bg-kodo-gold text-black' : 'bg-kodo-slate text-gray-400 hover:text-white'}`}

Line 71: text-gray-

<span className="text-[10px] text-gray-500">

Line 77: bg-gray-

className={`w-10 h-5 rounded-full relative cursor-pointer transition-colors ${pitchCorrection ? 'bg-kodo-gold' : 'bg-gray-600'}`}

apps/web/src/components/player/PlayerControls.tsx

Total instances in file: 7

Line 51: text-gray-

className={`transition-colors hover:text-white ${shuffle ? 'text-kodo-cyan' : 'text-gray-500'}`}

Line 58: text-gray-

className={`transition-colors hover:text-white relative ${repeatMode !== 'off' ? 'text-kodo-cyan' : 'text-gray-500'}`}

Line 74: text-gray-

className="text-gray-400 hover:text-white transition-colors hover:scale-110"

Line 108: text-gray-

className="text-gray-400 hover:text-white transition-colors hover:scale-110"

Line 126: text-gray-

className={`text-gray-400 hover:text-kodo-gold transition-colors ${showSpeed ? 'text-kodo-gold' : ''}`}

Line 136: text-gray-

className={`text-gray-400 hover:text-kodo-cyan transition-colors ${showVisualizer ? 'text-kodo-cyan' : ''}`}

Line 152: text-gray-

className="text-gray-400 hover:text-white"

apps/web/src/components/player/VisualizerSettingsModal.tsx

Total instances in file: 5

Line 27: text-gray-

<X className="w-4 h-4 text-gray-400 hover:text-white" />

Line 34: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-2">

Line 42: text-gray-

className={`px-2 py-1.5 rounded text-xs font-bold capitalize transition-all border ${visualizerSettings.mode === mode ? 'bg-kodo-cyan/10 border-kodo-cyan text-kodo-cyan' : 'bg-kodo-slate border-transparent text-gray-400 hover:text-white'}`}

Line 52: text-gray-

<div className="flex justify-between text-xs text-gray-400 mb-1">

Line 70: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-2">

apps/web/src/components/search/SearchBar.tsx

Total instances in file: 10

Line 98: text-gray-

className={`w-5 h-5 mr-3 transition-colors ${isFocused ? 'text-kodo-cyan' : 'text-gray-500'}`}

Line 112: text-gray-

className="text-gray-500 hover:text-white transition-colors"

Line 126: text-gray-

<div className="px-4 py-2 text-[10px] font-bold text-gray-500 uppercase">

Line 135: text-gray-

<div className="w-8 h-8 rounded bg-kodo-slate flex items-center justify-center text-gray-400">

Line 142: text-gray-

<div className="text-xs text-gray-500 capitalize">

Line 150: text-gray-

<div className="p-4 text-center text-gray-500 text-sm">

Line 158: text-gray-

<span className="text-[10px] font-bold text-gray-500 uppercase">

Line 174: text-gray-

<div className="flex items-center gap-3 text-gray-300 group-hover:text-white">

Line 175: text-gray-

<Clock className="w-4 h-4 text-gray-500" />

Line 178: text-gray-

<ArrowUpRight className="w-3 h-3 text-gray-600 opacity-0 group-hover:opacity-100" />

apps/web/src/components/seller/CreateProductView.tsx

Total instances in file: 16

Line 65: text-gray-

<p className="text-gray-400 font-mono text-sm">

Line 86: text-gray-

<div className="aspect-square bg-kodo-ink border-2 border-dashed border-kodo-steel rounded-xl flex flex-col items-center justify-center text-gray-500 hover:text-white hover:border-kodo-cyan cursor-pointer transition-colors group">

Line 90: text-gray-

<p className="text-xs text-gray-500 mt-2 text-center">

Line 101: text-gray-

<label className="text-xs text-gray-400 mb-1 block">

Line 104: border-gray-

<div className="h-20 bg-kodo-ink border border-kodo-steel rounded-lg flex items-center justify-center cursor-pointer hover:border-gray-500">

Line 105: text-gray-

<span className="text-xs text-gray-500">

Line 111: text-gray-

<label className="text-xs text-gray-400 mb-1 block">

Line 114: border-gray-

<div className="h-12 bg-kodo-ink border border-kodo-steel rounded-lg flex items-center justify-center cursor-pointer hover:border-gray-500">

Line 115: text-gray-

<span className="text-xs text-gray-500">

Line 139: text-gray-

<label className="block text-sm font-medium text-gray-400 mb-2">

Line 152: text-gray-

<label className="block text-sm font-medium text-gray-400 mb-2">

Line 189: text-gray-

<label className="block text-sm font-medium text-gray-400 mb-2">

Line 192: text-gray-

<div className="p-3 bg-kodo-ink border border-kodo-steel rounded-lg text-gray-400 text-sm">

Line 217: bg-gray-

className={`w-10 h-5 rounded-full relative cursor-pointer transition-colors ${lic.enabled ? 'bg-kodo-cyan' : 'bg-gray-600'}`}

Line 227: text-gray-

<div className="text-xs text-gray-400">

Line 239: text-gray-

<span className="absolute left-3 top-1/2 -translate-y-1/2 text-gray-500">

apps/web/src/components/seller/SellerDashboardView.tsx

Total instances in file: 9

Line 75: text-gray-

<p className="text-gray-400 font-mono text-sm">

Line 103: text-gray-

<div className="text-gray-400 text-xs font-bold uppercase mb-1">

Line 118: text-gray-

<div className="text-gray-400 text-xs font-bold uppercase mb-1">

Line 133: text-gray-

<div className="text-gray-400 text-xs font-bold uppercase mb-1">

Line 150: text-gray-

<div className="text-gray-400 text-xs font-bold uppercase mb-1">

Line 178: text-gray-

<div className="w-8 text-center font-mono text-gray-500">

Line 189: text-gray-

<div className="text-xs text-gray-400">

Line 222: text-gray-

<div className="text-xs text-gray-400 flex justify-between mt-1">

Line 226: text-gray-

<div className="text-[10px] text-gray-500 mt-1">

apps/web/src/components/seller/modals/FlashSaleModal.tsx

Total instances in file: 9

Line 50: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 58: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-2">

Line 62: text-gray-

<Percent className="absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-500" />

Line 75: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-2">

Line 79: text-gray-

<Calendar className="absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-500" />

Line 99: text-gray-
```

```

Line 114: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase">

Line 141: text-gray-

className={`text-gray-500 ${selectedIds.includes(product.id) ? 'text-kodo-gold' : ''}`}

Line 157: text-gray-

<div className="text-xs text-gray-500">

apps/web/src/components/settings/accessibility/AccessibilitySettingsView.tsx

Total instances in file: 2

Line 35: text-gray-

<p className="text-gray-400 font-mono text-sm">

Line 135: text-gray-

<div className="text-xs text-gray-400">{desc}</div>

apps/web/src/components/settings/account/AccountSettings.tsx

Total instances in file: 17

Line 73: text-gray-

<div className="w-10 h-10 bg-kodo-slate rounded-full flex items-center justify-center text-gray-400">

Line 80: text-gray-

<div className="text-xs text-gray-400">{user.email}</div>

Line 95: text-gray-

<div className="w-10 h-10 bg-kodo-slate rounded-full flex items-center justify-center text-gray-400">

Line 100: text-gray-

<div className="text-xs text-gray-400">@{user.username}</div>

Line 123: text-gray-

<label className="block text-sm font-bold text-gray-400 mb-3">

Line 147: text-gray-

className={`flex flex-col items-center justify-center gap-2 p-3 rounded-lg border transition-all ${theme === opt.id ? 'bg-kodo-cyan/10 border-kodo-cyan text-kodo-cyan' : 'bg-kodo-ink border-kodo-steel text-gray-400 hover:text-white'}`}

Line 157: text-gray-

<label className="block text-sm font-bold text-gray-400 mb-3">

Line 161: text-gray-

<Globe className="absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-500" />

Line 162: border-gray-

<select className="w-full bg-kodo-ink border border-kodo-steel rounded-lg py-2.5 pl-10 pr-4 text-white text-sm focus:border-kodo-cyan outline-none appearance-none cursor-pointer hover:border-gray-500 transition-colors">

Line 182: text-gray-

<span className="text-sm text-gray-300">Email Notifications</span>

Line 189: text-gray-

<span className="text-sm text-gray-300">Push Notifications</span>

Line 205: text-gray-

<span className="text-sm text-gray-300 block">

Line 208: text-gray-

<span className="text-[10px] text-gray-500">

Line 219: text-gray-

<span className="text-sm text-gray-300 block">

Line 222: text-gray-

<span className="text-[10px] text-gray-500">

Line 244: text-gray-

<p className="text-gray-400 text-sm mb-6">

Line 251: text-gray-

<div className="text-xs text-gray-500">

apps/web/src/components/settings/account/ChangeEmailModal.tsx

Total instances in file: 4

Line 45: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 52: text-gray-
```

```

Line 73: text-gray-

<div className="bg-kodo-ink p-3 rounded text-xs text-gray-400 border border-kodo-steel">

Line 86: text-gray-

<p className="text-sm text-gray-400 mb-6">

apps/web/src/components/settings/account/ChangeUsernameModal.tsx

Total instances in file: 3

Line 55: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 72: text-gray-

<Loader2 className="w-4 h-4 animate-spin text-gray-400" />

Line 95: text-gray-

<div className="text-xs text-gray-300">

apps/web/src/components/settings/account/DeleteAccountConfirmModal.tsx

Total instances in file: 4

Line 47: text-gray-

className="text-gray-400 hover:text-white disabled:opacity-50"

Line 54: text-gray-
```

```

Line 60: text-gray-

<ul className="text-xs text-gray-400 space-y-2 list-disc pl-4">

Line 87: bg-red-, bg-red-, border-red-

className="bg-red-600 hover:bg-red-700 border-red-500 text-white"

apps/web/src/components/settings/account/DeleteAccountView.tsx

Total instances in file: 15

Line 43: text-gray-

className="p-2 hover:bg-white/5 rounded-full text-gray-400 hover:text-white transition-colors"

Line 64: text-gray-

<p className="text-gray-400 text-sm leading-relaxed">

Line 72: border-gray-

<label className="flex items-start gap-3 p-4 bg-kodo-ink rounded border border-kodo-steel cursor-pointer hover:border-gray-500 transition-colors">

Line 75: border-gray-

className="mt-1 bg-kodo-graphite border-gray-600 text-kodo-red focus:ring-kodo-red rounded"

Line 82: text-gray-

<span className="font-bold text-gray-200 block mb-1">

Line 85: text-gray-
```

```

Line 92: border-gray-

<label className="flex items-start gap-3 p-4 bg-kodo-ink rounded border border-kodo-steel cursor-pointer hover:border-gray-500 transition-colors">

Line 95: border-gray-

className="mt-1 bg-kodo-graphite border-gray-600 text-kodo-red focus:ring-kodo-red rounded"

Line 102: text-gray-

<span className="font-bold text-gray-200 block mb-1">

Line 105: text-gray-
```

```

Line 112: border-gray-

<label className="flex items-start gap-3 p-4 bg-kodo-ink rounded border border-kodo-steel cursor-pointer hover:border-gray-500 transition-colors">

Line 115: border-gray-

className="mt-1 bg-kodo-graphite border-gray-600 text-kodo-red focus:ring-kodo-red rounded"

Line 122: text-gray-

<span className="font-bold text-gray-200 block mb-1">

Line 125: text-gray-
```

```

Line 149: bg-red-, bg-red-, border-red-, bg-gray-, border-gray-, text-gray-

className="w-full bg-red-600 hover:bg-red-700 text-white border-red-500 disabled:bg-gray-800 disabled:border-gray-700 disabled:text-gray-500"

apps/web/src/components/settings/appearance/AppearanceSettingsView.tsx

Total instances in file: 12

Line 45: text-gray-

<p className="text-gray-400 font-mono text-sm">

Line 85: border-gray-

${theme === opt.id ? 'border-kodo-cyan bg-kodo-cyan/5' : 'border-kodo-steel bg-kodo-ink hover:border-gray-500'}

Line 89: text-gray-

className={`p-3 rounded-full ${theme === opt.id ? 'bg-kodo-cyan text-black' : 'bg-kodo-slate text-gray-400'}`}

Line 94: text-gray-

className={`font-bold ${theme === opt.id ? 'text-white' : 'text-gray-400'}`}

Line 133: border-gray-

className={`w-4 h-4 rounded-full border-2 flex items-center justify-center ${density === opt.id ? 'border-kodo-magenta' : 'border-gray-500'}`}

Line 141: text-gray-

className={`text-sm font-bold ${density === opt.id ? 'text-white' : 'text-gray-300'}`}

Line 145: text-gray-

<div className="text-xs text-gray-500">{opt.desc}</div>

Line 158: text-gray-

<div className="flex justify-between text-sm text-gray-400 mb-2">

Line 171: text-gray-

className="mt-4 p-4 bg-kodo-ink rounded border border-kodo-steel text-gray-300"

Line 205: text-gray-

<Layout className="w-5 h-5 text-gray-400" /> Layout

Line 208: border-gray-

className="flex items-center justify-between p-4 bg-kodo-ink rounded-lg border border-kodo-steel cursor-pointer hover:border-gray-500"

Line 213: text-gray-

<div className="text-xs text-gray-400">

apps/web/src/components/settings/backups/BackupsView.tsx

Total instances in file: 9

Line 76: text-gray-
```

```

Line 114: text-gray-

<div className="text-xs text-gray-400 flex gap-2">

Line 160: text-gray-

<div className="text-xs text-gray-400">

Line 166: bg-gray-

className={`w-10 h-5 rounded-full relative cursor-pointer transition-colors ${autoBackup ? 'bg-kodo-cyan' : 'bg-gray-600'}`}

Line 175: border-gray-

<div className="animate-fadeIn space-y-3 pt-2 border-t border-gray-700">

Line 177: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-1">

Line 187: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-1">

Line 197: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-1">

Line 217: text-gray-
```

```

apps/web/src/components/settings/cloud/CloudIntegrationView.tsx

Total instances in file: 11

Line 33: bg-gray-, text-gray-

className={`w-16 h-16 rounded-full flex items-center justify-center ${isConnected ? 'bg-kodo-cyan text-black' : 'bg-gray-700 text-gray-400'}`}

Line 41: text-gray-
```

```

Line 88: text-gray-

<div className="text-xs text-gray-500">Host</div>

Line 93: text-gray-

<div className="text-xs text-gray-500">Sync Frequency</div>

Line 98: text-gray-

<div className="text-xs text-gray-500">Status</div>

Line 115: text-gray-

<div className="text-xs text-gray-400">

Line 121: bg-gray-

className={`w-10 h-5 rounded-full relative cursor-pointer transition-colors ${autoSync ? 'bg-kodo-cyan' : 'bg-gray-600'}`}

Line 130: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-2">

Line 142: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-2">

Line 168: text-gray-

<div className="text-sm text-gray-400">used of 100 GB</div>

Line 171: text-gray-

<div className="text-xs text-gray-500 flex justify-between">

apps/web/src/components/settings/data/DataExportModal.tsx

Total instances in file: 16

Line 46: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 51: text-gray-
```

```

Line 58: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-2">

Line 73: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-2">

Line 77: border-gray-

<label className="flex items-center gap-3 p-3 bg-kodo-ink rounded border border-kodo-steel cursor-pointer hover:border-gray-500">

Line 82: border-gray-

className="rounded border-gray-600 bg-transparent text-kodo-cyan"

Line 84: text-gray-

<span className="text-sm text-gray-300">

Line 88: border-gray-

<label className="flex items-center gap-3 p-3 bg-kodo-ink rounded border border-kodo-steel cursor-pointer hover:border-gray-500">

Line 93: border-gray-

className="rounded border-gray-600 bg-transparent text-kodo-cyan"

Line 95: text-gray-

<span className="text-sm text-gray-300">

Line 99: border-gray-

<label className="flex items-center gap-3 p-3 bg-kodo-ink rounded border border-kodo-steel cursor-pointer hover:border-gray-500">

Line 104: border-gray-

className="rounded border-gray-600 bg-transparent text-kodo-cyan"

Line 106: text-gray-

<span className="text-sm text-gray-300">

Line 110: border-gray-

<label className="flex items-center gap-3 p-3 bg-kodo-ink rounded border border-kodo-steel cursor-pointer hover:border-gray-500">

Line 115: border-gray-

className="rounded border-gray-600 bg-transparent text-kodo-cyan"

Line 117: text-gray-

<span className="text-sm text-gray-300">

apps/web/src/components/settings/data/DataExportView.tsx

Total instances in file: 5

Line 32: text-gray-

<p className="text-gray-400 font-mono text-sm">

Line 46: text-gray-

<p className="text-gray-400 text-sm mt-1 max-w-xl">

Line 71: text-gray-

<FileText className="w-5 h-5 text-gray-500" />

Line 76: text-gray-

<div className="text-xs text-gray-500 flex gap-2">

Line 93: text-gray-, bg-gray-

<span className="text-xs text-gray-500 bg-gray-800 px-3 py-1 rounded">

apps/web/src/components/settings/integrations/IntegrationsView.tsx

Total instances in file: 6

Line 99: text-gray-

<p className="text-gray-400 font-mono text-sm">

Line 136: text-gray-

<span className="text-gray-500">Not Connected</span>

Line 139: text-gray-
```

```

Line 153: text-gray-

<RefreshCw className="w-4 h-4 text-gray-400 hover:text-white" />

Line 158: text-gray-

<p className="text-gray-400 text-sm mb-6 flex-1">

Line 167: text-gray-

className="flex-1 border border-kodo-steel text-gray-300"

apps/web/src/components/settings/profile/EditProfile.tsx

Total instances in file: 5

Line 153: bg-gray-

<div className="h-48 md:h-64 bg-gray-900 relative">

Line 230: text-gray-

<label className="block text-sm font-medium text-gray-400 mb-2">

Line 241: text-gray-

<p className="text-xs text-gray-500 text-right mt-1">

Line 254: text-gray-

<label className="block text-sm font-medium text-gray-400 mb-2">

Line 280: text-gray-

<p className="text-xs text-gray-400 mb-4">

apps/web/src/components/settings/security/LoginHistory.tsx

Total instances in file: 5

Line 93: text-gray-
```

```

Line 121: text-gray-

<tr className="border-b border-kodo-steel text-gray-500 font-mono text-xs uppercase bg-kodo-ink/30">

Line 147: text-gray-

<div className="text-gray-500">{log.time}</div>

Line 150: text-gray-

<div className="flex items-center gap-2 text-gray-300">

Line 162: text-gray-
```
<td className="p-3 text-gray-400">
```

apps/web/src/components/settings/security/PasskeyModal.tsx

Total instances in file: 4

Line 49: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 60: text-gray-
```

```
Line 90: text-gray-
```

```

Line 104: text-gray-

<p className="text-sm text-gray-400 mb-6">

apps/web/src/components/settings/security/SecuritySettings.tsx

Total instances in file: 4

Line 101: text-gray-

<p className="text-xs text-gray-400 mt-1">

Line 131: text-gray-

<p className="text-xs text-gray-400 mt-1">

Line 145: text-gray-

<span className="text-gray-300">MacBook Pro (Chrome)</span>

Line 146: text-gray-

<span className="text-xs text-gray-500">Added 2d ago</span>

apps/web/src/components/settings/security/SessionManagement.tsx

Total instances in file: 7

Line 56: text-gray-

<div className="text-center p-4 text-gray-500">Loading sessions...</div>

Line 64: text-gray-
```

```

Line 88: text-gray-

className={`p-3 rounded-full ${session.is_current ? 'bg-kodo-cyan/10 text-kodo-cyan' : 'bg-kodo-slate text-gray-400'}`}

Line 107: text-gray-

<p className="text-xs text-gray-400 mt-1 truncate max-w-xs">

Line 110: text-gray-

<div className="flex items-center gap-4 mt-2 text-xs text-gray-500">

Line 123: text-gray-

className="mt-4 md:mt-0 text-gray-400 hover:text-white border border-kodo-steel hover:bg-white/5"

Line 133: text-gray-

<p className="text-gray-500 text-sm">No active sessions found.</p>

apps/web/src/components/settings/security/TwoFactorSetup.tsx

Total instances in file: 10

Line 63: text-gray-

className="p-2 hover:bg-white/5 rounded-full text-gray-400 hover:text-white transition-colors"

Line 71: text-gray-
```

```
Line 95: text-gray-
```

```
Line 117: text-gray-
```

```

Line 132: bg-gray-

<div className="w-48 h-48 bg-gray-900 flex items-center justify-center relative overflow-hidden">

Line 144: text-gray-

<p className="text-sm text-gray-300 mb-2">

Line 148: text-gray-

className="text-xs text-gray-500 font-mono bg-black/30 py-1 px-2 rounded inline-block cursor-pointer hover:text-white"

Line 187: text-gray-
```

```
Line 241: text-gray-
```

```

Line 248: text-gray-

<div className="grid grid-cols-2 gap-3 bg-black/40 p-4 rounded-lg font-mono text-sm text-gray-300 text-center border border-kodo-steel/50">

Total instances in file: 1

Line 325: text-green-

<Check className="h-4 w-4 text-green-600" />

Total instances in file: 3

Line 39: text-gray-

<span className="text-gray-500 text-xs">{comment.timestamp}</span>

Line 42: text-gray-

<p className="text-gray-300 leading-relaxed whitespace-pre-wrap">

Line 47: text-gray-

<div className="flex items-center gap-4 mt-1 pl-2 text-xs text-gray-500">

Total instances in file: 7

Line 51: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 57: bg-gray-

<div className="w-10 h-10 rounded-full bg-gray-700 overflow-hidden flex-shrink-0">

Line 87: text-gray-

<span className="text-gray-500 flex items-center gap-1">

Line 105: text-gray-

className={`p-2 rounded hover:bg-white/10 text-gray-400 hover:text-kodo-cyan ${postType === 'image' ? 'text-kodo-cyan' : ''}`}

Line 115: text-gray-

className="p-2 rounded hover:bg-white/10 text-gray-400 hover:text-kodo-magenta"

Line 125: text-gray-

className="p-2 rounded hover:bg-white/10 text-gray-400 hover:text-kodo-lime"

Line 135: text-gray-

className="p-2 rounded hover:bg-white/10 text-gray-400 hover:text-kodo-gold"

Total instances in file: 7

Line 32: from-gray-

//     { name: 'Techno', color: 'from-gray-700 to-black' },

Line 33: from-blue-

//     { name: 'Ambient', color: 'from-blue-400 to-teal-500' },

Line 36: to-blue-600

//     { name: 'House', color: 'from-indigo-500 to-blue-600' },

Line 118: text-gray-

className={`flex items-center gap-2 px-4 py-2 rounded-lg text-sm font-bold transition-all whitespace-nowrap ${activeTab === tab.id ? 'bg-kodo-cyan text-black shadow-neon-cyan' : 'text-gray-400 hover:text-white hover:bg-white/5'}`}

Line 144: border-gray-, text-gray-, border-gray-

className={`px-3 py-1 rounded-full text-xs font-bold border transition-colors ${filter === f ? 'bg-white text-black border-white' : 'border-gray-600 text-gray-400 hover:border-gray-400'}`}

Line 161: bg-gray-

className={`relative group cursor-pointer overflow-hidden rounded-xl bg-gray-900 aspect-square ${i === 0 ? 'col-span-2 row-span-2' : ''}`}

Line 174: text-gray-

<div className="flex justify-between items-center text-xs text-gray-300">

Total instances in file: 6

Line 83: bg-gray-

<div className="w-10 h-10 rounded-full bg-gray-700 flex-shrink-0 overflow-hidden cursor-pointer">

Line 93: text-gray-

<div className="w-full bg-kodo-void/50 border border-kodo-steel rounded-full px-4 py-2.5 text-gray-500 hover:bg-kodo-void hover:border-kodo-cyan/50 transition-all text-sm">

Line 101: text-gray-

className="flex items-center gap-1 text-gray-400 hover:text-kodo-cyan text-xs font-bold cursor-pointer transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-kodo-cyan focus-visible:ring-offset-2 focus-visible:ring-offset-kodo-void rounded"

Line 107: text-gray-

className="flex items-center gap-1 text-gray-400 hover:text-kodo-magenta text-xs font-bold cursor-pointer transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-kodo-cyan focus-visible:ring-offset-2 focus-visible:ring-offset-kodo-void rounded"

Line 113: text-gray-

className="flex items-center gap-1 text-gray-400 hover:text-kodo-lime text-xs font-bold cursor-pointer transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-kodo-cyan focus-visible:ring-offset-2 focus-visible:ring-offset-kodo-void rounded"

Line 119: text-gray-

className="flex items-center gap-1 text-gray-400 hover:text-kodo-gold text-xs font-bold cursor-pointer transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-kodo-cyan focus-visible:ring-offset-2 focus-visible:ring-offset-kodo-void rounded"

Total instances in file: 10

Line 74: text-gray-

<div className="px-4 pt-3 pb-0 flex items-center gap-2 text-xs text-gray-500 font-bold uppercase tracking-wider">

Line 82: bg-gray-

<div className="w-10 h-10 rounded-full bg-gray-700 overflow-hidden border border-kodo-steel cursor-pointer">

Line 99: text-gray-

<div className="text-xs text-gray-500">

Line 110: text-gray-

<div className="px-4 pb-2 text-gray-200 whitespace-pre-wrap leading-relaxed text-sm">

Line 139: bg-gray-

<div className="w-12 h-12 bg-gray-800 rounded overflow-hidden relative group cursor-pointer">

Line 152: text-gray-

<div className="text-xs text-gray-400 truncate">

Line 184: text-gray-

<span className="text-xs text-gray-400">{opt.votes}%</span>

Line 188: text-gray-

<div className="text-xs text-gray-500 px-1">

Line 195: text-gray-

<div className="p-4 border-t border-kodo-steel flex items-center justify-between text-gray-400 text-sm">

Line 244: bg-gray-

<div className="w-8 h-8 rounded-full bg-gray-700 overflow-hidden flex-shrink-0">

Total instances in file: 7

Line 39: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 60: text-gray-

<p className="text-xs text-gray-400 line-clamp-2">

Line 94: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 111: text-gray-

<div className="text-xs text-gray-400">

Line 126: text-gray-

<div className="text-xs text-gray-400">

Line 138: bg-gray-, text-gray-

<div className="w-10 h-10 rounded-full bg-gray-800 flex items-center justify-center text-gray-400 group-hover:text-white">

Line 152: bg-gray-, text-gray-

<div className="w-10 h-10 rounded-full bg-gray-800 flex items-center justify-center text-gray-400 group-hover:text-white">

Total instances in file: 4

Line 59: text-gray-

<p className="text-gray-400 font-mono text-sm">

Line 78: text-gray-

className={filter === 'all' ? 'text-white' : 'text-gray-500'}

Line 86: text-gray-

className={filter === 'mutual' ? 'text-white' : 'text-gray-500'}

Line 94: text-gray-

className={filter === 'recent' ? 'text-white' : 'text-gray-500'}

Total instances in file: 6

Line 54: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 64: text-gray-

<div className="text-gray-500 flex flex-col items-center group-hover:text-kodo-cyan">

Line 89: text-gray-

<label className="block text-sm font-medium text-gray-400 mb-2">

Line 101: border-gray-

className="bg-kodo-ink p-3 rounded-lg border border-kodo-steel flex items-center justify-between cursor-pointer hover:border-gray-500"

Line 114: text-gray-

<div className="text-xs text-gray-400">

Line 120: bg-gray-

className={`w-10 h-5 rounded-full relative transition-colors ${isPrivate ? 'bg-kodo-cyan' : 'bg-gray-600'}`}

Total instances in file: 4

Line 28: bg-gray-

<div className="h-32 relative overflow-hidden bg-gray-900">

Line 51: text-gray-

<p className="text-sm text-gray-400 mb-4 line-clamp-2 flex-1">

Line 55: text-gray-

<div className="flex items-center gap-4 text-xs text-gray-500 mb-4 font-mono">

Line 71: bg-red-

className="w-full border border-kodo-steel hover:bg-red-500/10 hover:text-kodo-red hover:border-kodo-red"

Total instances in file: 11

Line 87: text-gray-

<div className="text-center py-20 text-gray-500">Group not found</div>

Line 94: bg-gray-

<div className="h-64 bg-gray-900 relative">

Line 122: text-red-, bg-red-

className="bg-black/50 backdrop-blur text-red-400 hover:bg-red-500/20 border-none"

Line 153: text-gray-

<p className="text-gray-400 max-w-2xl leading-relaxed">

Line 158: text-gray-

<div className="flex gap-6 text-sm text-gray-400 font-mono bg-kodo-ink/50 p-4 rounded-xl border border-kodo-steel/30">

Line 187: text-gray-, text-gray-

className={`py-4 text-sm font-bold uppercase tracking-wider border-b-2 transition-colors ${activeTab === tab ? 'text-white border-kodo-cyan' : 'text-gray-500 border-transparent hover:text-gray-300'}`}

Line 213: text-gray-

<span className="text-[10px] bg-kodo-slate px-1.5 py-0.5 rounded text-gray-400">

Line 224: text-gray-

<div className="col-span-full text-center py-8 text-gray-500 text-sm">

Line 250: text-gray-

<div className="flex items-center gap-2 text-gray-400 text-sm mt-1">

Line 266: text-gray-

<p className="text-sm text-gray-400 mb-4">

Line 275: text-gray-

className="px-2 py-1 bg-kodo-ink border border-kodo-steel rounded text-xs text-gray-400"

Total instances in file: 4

Line 100: text-gray-

<p className="text-gray-400 font-mono text-sm">

Line 117: text-gray-

className={`flex items-center gap-2 px-4 py-2 rounded text-sm font-bold transition-colors ${activeTab === 'my_groups' ? 'bg-kodo-slate text-white' : 'text-gray-400 hover:text-white'}`}

Line 123: text-gray-

className={`flex items-center gap-2 px-4 py-2 rounded text-sm font-bold transition-colors ${activeTab === 'discover' ? 'bg-kodo-slate text-white' : 'text-gray-400 hover:text-white'}`}

Line 155: text-gray-

<div className="col-span-full text-center py-20 text-gray-500">

apps/web/src/components/studio/AIToolsView.tsx

Total instances in file: 7

Line 94: text-gray-

className={`w-10 h-10 rounded-lg flex items-center justify-center mb-3 ${activeTool === tool.id ? 'bg-kodo-cyan text-black' : 'bg-kodo-ink text-gray-400 group-hover:text-white'}`}

Line 99: text-gray-

className={`font-bold text-sm ${activeTool === tool.id ? 'text-white' : 'text-gray-300'}`}

Line 103: text-gray-

<div className="text-[10px] text-gray-500 mt-1 leading-tight">

Line 118: text-gray-

<p className="text-center text-xs text-gray-500 mt-4">

Line 130: text-gray-
```

```

Line 143: text-gray-

<p className="text-xs text-gray-300">{result.fileName}</p>

Line 155: text-gray-

<h4 className="text-sm font-bold text-gray-400 uppercase mb-4 tracking-wider">

apps/web/src/components/studio/CloudFileBrowser.tsx

Total instances in file: 18

Line 183: text-gray-

<Filter className="w-4 h-4 text-gray-500 shrink-0" />

Line 188: text-gray-, border-gray-

className={`px-2 py-1 rounded text-xs border transition-colors whitespace-nowrap ${activeTags.includes(tag) ? 'bg-kodo-cyan/20 border-kodo-cyan text-kodo-cyan' : 'border-kodo-steel text-gray-400 hover:border-gray-400'}`}

Line 247: text-gray-

<span className="text-xs text-gray-500 px-2 uppercase font-bold">

Line 264: text-gray-

className="ml-2 p-1 hover:text-white text-gray-400"

Line 277: text-gray-

className={`p-2 rounded ${viewMode === 'list' ? 'bg-kodo-slate text-white' : 'text-gray-400 hover:text-white'}`}

Line 283: text-gray-

className={`p-2 rounded ${viewMode === 'grid' ? 'bg-kodo-slate text-white' : 'text-gray-400 hover:text-white'}`}

Line 297: text-gray-

<thead className="bg-kodo-ink text-xs font-mono text-gray-500 uppercase tracking-wider sticky top-0 z-10">

Line 343: text-gray-

className="cursor-pointer text-gray-500 hover:text-white"

Line 368: text-gray-

) && <File className="w-5 h-5 text-gray-400" />}

Line 369: text-gray-

<span className="font-medium text-gray-200 group-hover:text-white transition-colors">

Line 379: text-gray-

className="text-[10px] bg-kodo-slate px-1.5 py-0.5 rounded text-gray-400 border border-kodo-steel"

Line 386: text-gray-

<td className="p-4 text-gray-400 font-mono text-xs">

Line 389: text-gray-

<td className="p-4 text-gray-400 text-xs">

Line 403: text-gray-

<button className="p-1.5 hover:bg-white/10 rounded text-gray-400 hover:text-white">

Line 406: text-gray-

<button className="p-1.5 hover:bg-white/10 rounded text-gray-400 hover:text-white">

Line 435: text-gray-

<Square className="w-4 h-4 text-gray-400 hover:text-white" />

Line 450: text-gray-

<File className="w-8 h-8 text-gray-400" />

Line 464: text-gray-

className="text-[8px] bg-white/10 px-1 rounded text-gray-400"

apps/web/src/components/studio/CloudSettingsView.tsx

Total instances in file: 7

Line 24: text-gray-

<div className="text-sm text-gray-400">used of 100 GB (Pro Plan)</div>

Line 29: text-gray-

<div className="text-xs text-gray-500 uppercase font-bold">

Line 35: text-gray-

<div className="text-xs text-gray-500 uppercase font-bold">

Line 41: text-gray-

<div className="text-xs text-gray-500 uppercase font-bold">

Line 62: text-gray-

<label className="block text-sm font-bold text-gray-400 mb-2 flex items-center gap-2">

Line 75: text-gray-

<p className="text-xs text-gray-500 mt-1">

Line 81: text-gray-

<label className="block text-sm font-bold text-gray-400 mb-2 flex items-center gap-2">

apps/web/src/components/studio/ConnectivityView.tsx

Total instances in file: 9

Line 54: text-gray-

<p className="text-sm text-gray-400 mt-1">

Line 66: text-gray-

<label className="block text-xs font-bold text-gray-500 uppercase mb-2">

Line 70: text-gray-

<div className="flex-1 bg-kodo-graphite border border-kodo-steel rounded px-3 py-2 text-sm text-gray-300 font-mono truncate">

Line 86: text-gray-

<label className="block text-xs font-bold text-gray-500 uppercase mb-2">

Line 90: text-gray-

<div className="flex-1 bg-kodo-graphite border border-kodo-steel rounded px-3 py-2 text-sm text-gray-300 font-mono">

Line 104: text-gray-

<label className="block text-xs font-bold text-gray-500 uppercase mb-2">

Line 115: text-gray-

<p className="text-[10px] text-gray-500 mt-2">

Line 130: text-gray-

<p className="text-sm text-gray-400 mt-1">

Line 162: text-gray-

<div className="text-xs text-gray-500 mt-1 flex gap-2">

apps/web/src/components/studio/GoLiveView.tsx

Total instances in file: 15

Line 53: text-gray-

className={`w-8 h-8 ${isLive ? 'text-kodo-red animate-pulse' : 'text-gray-500'}`}

Line 57: text-gray-

<p className="text-gray-400 font-mono text-sm">

Line 63: text-gray-

className={`px-4 py-2 rounded-lg border flex items-center gap-2 font-bold ${isLive ? 'bg-kodo-red text-white border-kodo-red' : 'bg-kodo-ink text-gray-500 border-kodo-steel'}`}

Line 66: bg-gray-

className={`w-3 h-3 rounded-full ${isLive ? 'bg-white animate-pulse' : 'bg-gray-600'}`}

Line 97: bg-gray-

<div className="w-full h-full flex items-center justify-center bg-gray-900">

Line 101: text-gray-

<p className="text-gray-400">Receiving Stream Data...</p>

Line 105: text-gray-

<div className="w-full h-full flex items-col items-center justify-center bg-kodo-ink/50 text-gray-500">

Line 128: text-gray-

<label className="block text-sm font-medium text-gray-400 mb-2">

Line 168: text-gray-

<label className="block text-xs font-bold text-gray-500 uppercase mb-2">

Line 173: text-gray-

className="flex-1 bg-kodo-ink border border-kodo-steel rounded px-3 py-2 text-sm text-gray-300 font-mono"

Line 189: text-gray-

<label className="block text-xs font-bold text-gray-500 uppercase mb-2">

Line 194: text-gray-

className="flex-1 bg-kodo-ink border border-kodo-steel rounded px-3 py-2 text-sm text-gray-300 font-mono"

Line 233: text-gray-

<ol className="text-sm text-gray-400 space-y-2 list-decimal pl-4">

Line 244: text-gray-

<span className="text-sm text-gray-300">Microphone</span>

Line 247: bg-gray-

<div className="w-full bg-gray-800 h-2 rounded-full overflow-hidden">

apps/web/src/components/studio/ProjectsManager.tsx

Total instances in file: 12

Line 161: text-gray-

<p className="text-gray-400 font-mono text-sm">

Line 187: text-gray-, border-gray-

className={`px-3 py-1.5 rounded-lg text-xs font-bold uppercase tracking-wider transition-colors border ${filter === daw ? 'bg-kodo-cyan text-black border-kodo-cyan' : 'bg-kodo-slate text-gray-400 border-transparent hover:border-gray-500'}`}

Line 199: text-gray-

<button className="p-1.5 rounded text-gray-500 hover:text-white">

Line 237: text-gray-

<MoreVertical className="w-4 h-4 text-gray-500 hover:text-white" />

Line 244: text-gray-

<p className="text-xs text-gray-500 mb-4 font-mono">

Line 250: text-gray-

<div className="text-[10px] text-gray-400 uppercase font-bold">

Line 256: text-gray-

<div className="text-[10px] text-gray-400 uppercase font-bold">

Line 265: text-gray-

<span className="text-gray-400 font-bold">

Line 278: border-gray-

<div className="flex justify-between items-center pt-4 border-t border-gray-800">

Line 280: bg-gray-

<div className="w-6 h-6 rounded-full bg-gray-600 border border-black"></div>

Line 296: text-gray-

className="border-2 border-dashed border-kodo-steel rounded-xl flex flex-col items-center justify-center p-8 hover:bg-kodo-slate/20 transition-colors cursor-pointer text-gray-500 hover:text-kodo-cyan hover:border-kodo-cyan min-h-[250px]"

Line 308: text-gray-

<div className="text-center py-20 text-gray-500">

apps/web/src/components/studio/projects/CreateProjectModal.tsx

Total instances in file: 4

Line 47: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 61: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-2">

Line 69: text-gray-, border-gray-

className={`p-3 rounded-lg border text-sm font-bold transition-all ${formData.daw === daw ? 'bg-kodo-cyan/10 border-kodo-cyan text-white' : 'bg-kodo-void border-kodo-steel text-gray-500 hover:border-gray-400'}`}

Line 98: text-gray-

<label className="block text-xs font-bold text-gray-400 uppercase mb-2">

apps/web/src/components/studio/projects/ProjectDetailView.tsx

Total instances in file: 18

Line 103: text-gray-

<div className="flex items-center gap-4 text-sm text-gray-400 font-mono">

Line 134: text-gray-, text-gray-

className={`pb-3 text-sm font-bold uppercase tracking-wider border-b-2 transition-colors ${activeTab === tab ? 'border-kodo-cyan text-white' : 'border-transparent text-gray-500 hover:text-gray-300'}`}

Line 149: text-gray-

<div className="flex justify-between text-sm text-gray-400 mb-1">

Line 162: text-gray-

<div className="text-xs text-gray-500 uppercase">

Line 170: text-gray-

<div className="text-xs text-gray-500 uppercase">

Line 193: text-gray-

<div className="text-sm text-gray-300">

Line 197: text-gray-

<div className="text-xs text-gray-500">2 hours ago</div>

Line 224: text-gray-

<div className="w-10 h-10 bg-kodo-slate rounded flex items-center justify-center text-gray-400">

Line 235: text-gray-

<div className="text-xs text-gray-500">

Line 307: text-gray-

<p className="text-sm text-gray-400 mb-4">

Line 329: bg-gray-

<div className="w-10 h-10 rounded-full border-2 border-kodo-graphite bg-gray-700"></div>

Line 330: bg-gray-

<div className="w-10 h-10 rounded-full border-2 border-kodo-graphite bg-gray-600"></div>

Line 331: text-gray-

<div className="w-10 h-10 rounded-full border-2 border-kodo-graphite bg-kodo-ink flex items-center justify-center text-xs text-gray-400 font-bold">

Line 351: text-gray-

<span className="text-xs text-gray-500">2h ago</span>

Line 353: text-gray-

<div className="flex justify-between items-center text-sm p-2 hover:bg-white/5 rounded cursor-pointer text-gray-400">

Line 355: text-gray-

<span className="text-xs text-gray-600">1d ago</span>

Line 357: text-gray-

<div className="flex justify-between items-center text-sm p-2 hover:bg-white/5 rounded cursor-pointer text-gray-400">

Line 359: text-gray-

<span className="text-xs text-gray-600">3d ago</span>

apps/web/src/components/ui/DataList.tsx

Total instances in file: 9

Line 131: bg-gray-, bg-gray-

className="animate-pulse bg-gray-200 dark:bg-gray-700 rounded h-16"

Line 141: text-red-, text-red-

<p className="text-red-500 dark:text-red-400">{error}</p>

Line 149: text-gray-, text-gray-

<p className="text-gray-500 dark:text-gray-400">{emptyMessage}</p>

Line 258: bg-gray-

'relative bg-white dark:bg-gray-800 rounded-lg shadow-xl',

Line 265: border-gray-, border-gray-

<div className="flex items-center justify-between p-6 border-b border-gray-200 dark:border-gray-700">

Line 267: text-gray-

<h2 className="text-lg font-semibold text-gray-900 dark:text-white">

Line 274: text-gray-, text-gray-, text-gray-

className="text-gray-400 hover:text-gray-600 dark:hover:text-gray-300"

Line 386: bg-gray-

'absolute z-20 mt-1 bg-white dark:bg-gray-800 rounded-md shadow-lg',

Line 387: border-gray-, border-gray-

'border border-gray-200 dark:border-gray-700',

apps/web/src/components/ui/FormField.tsx

Total instances in file: 13

Line 115: text-gray-, text-gray-

<label className="text-sm font-medium text-gray-700 dark:text-gray-300">

Line 117: text-red-

{required && <span className="text-red-500 ml-1">*</span>}

Line 121: text-gray-, text-gray-

<p className="text-xs text-gray-500 dark:text-gray-400">{helpText}</p>

Line 124: text-red-, text-red-

<p className="text-xs text-red-500 dark:text-red-400">{error}</p>

Line 144: bg-gray-, border-gray-

'dark:bg-gray-800 dark:border-gray-600 dark:text-white',

Line 146: border-red-
```
? 'border-red-500 focus:ring-red-500'
```

Line 147: border-gray-, border-gray-

: 'border-gray-300 dark:border-gray-600',

Line 170: bg-gray-, border-gray-

'dark:bg-gray-800 dark:border-gray-600 dark:text-white',

Line 172: border-red-
```
? 'border-red-500 focus:ring-red-500'
```

Line 173: border-gray-, border-gray-

: 'border-gray-300 dark:border-gray-600',

Line 197: bg-gray-, border-gray-

'dark:bg-gray-800 dark:border-gray-600 dark:text-white',

Line 199: border-red-
```
? 'border-red-500 focus:ring-red-500'
```

Line 200: border-gray-, border-gray-

: 'border-gray-300 dark:border-gray-600',

apps/web/src/components/ui/ImageCropper.tsx

Total instances in file: 6

Line 7: bg-gray-

<div className="bg-gray-800 flex items-center justify-center h-full text-white">

Line 138: text-gray-

<button onClick={onCancel} className="text-gray-400 hover:text-white">

Line 170: text-gray-

<span className="text-xs text-gray-400 w-16">Zoom</span>

Line 171: text-gray-

<ZoomIn className="w-4 h-4 text-gray-500" />

Line 185: text-gray-

<span className="text-xs text-gray-400 w-16">Rotate</span>

Line 186: text-gray-

<RotateCw className="w-4 h-4 text-gray-500" />

apps/web/src/components/ui/LazyComponent.tsx

Total instances in file: 2

Line 28: text-yellow-

<AlertTriangle className="h-6 w-6 text-yellow-600" />

Line 31: bg-yellow-, bg-yellow-, text-yellow-, text-yellow-

<div className="bg-yellow-50 dark:bg-yellow-900/20 border border-yellow-200 dark:border-yellow-800 text-yellow-700 dark:text-yellow-300 px-4 py-3 rounded-lg mb-4">

apps/web/src/components/ui/LoadingState.tsx

Total instances in file: 6

Line 123: text-gray-

className={cn('animate-spin text-gray-400', sizeClasses[size])}

Line 127: text-gray-, text-gray-

<span className="text-sm text-gray-600 dark:text-gray-400">

Line 141: bg-gray-, bg-gray-

<div className="h-4 bg-gray-200 dark:bg-gray-700 rounded w-3/4"></div>

Line 142: bg-gray-, bg-gray-

<div className="h-4 bg-gray-200 dark:bg-gray-700 rounded w-1/2"></div>

Line 143: bg-gray-, bg-gray-

<div className="h-4 bg-gray-200 dark:bg-gray-700 rounded w-5/6"></div>

Line 159: text-gray-

className={cn('animate-spin text-gray-400', sizeClasses[size], className)}

apps/web/src/components/ui/Toast.tsx

Total instances in file: 1

Line 103: text-gray-

className="text-gray-400 hover:text-white transition-colors"

apps/web/src/components/ui/avatar.tsx

Total instances in file: 2

Line 117: bg-gray-
```
offline: 'bg-gray-500',
```

Line 163: text-gray-

<span className="font-bold text-gray-400">{initials}</span>

apps/web/src/components/ui/checkbox.tsx

Total instances in file: 1

Line 121: text-gray-

<span className="text-sm text-gray-300 group-hover:text-white transition-colors select-none">

apps/web/src/components/ui/confirmation-dialog.tsx

Total instances in file: 2

Line 153: bg-red-, bg-red-

<div className="flex h-10 w-10 items-center justify-center rounded-full bg-red-100 dark:bg-red-900/20">

Line 154: text-red-, text-red-

<AlertTriangle className="h-5 w-5 text-red-600 dark:text-red-400" />

apps/web/src/components/ui/dialog.tsx

Total instances in file: 1

Line 322: text-gray-

return <p className={cn('text-sm text-gray-400', className)}>{children}</p>;

Total instances in file: 5

Line 188: text-gray-

'text-gray-300 hover:text-white w-full text-left',

Line 216: text-gray-

'text-gray-300 hover:text-white w-full text-left',

Line 244: text-gray-

'text-gray-300 hover:text-white w-full text-left',

Line 269: text-gray-

'px-2 py-1.5 text-sm font-semibold text-gray-400',

Line 300: text-gray-

'ml-auto text-xs tracking-widest opacity-60 text-gray-500',

apps/web/src/components/ui/empty-state.tsx

Total instances in file: 2

Line 149: text-gray-

<div className={cn('text-gray-400', iconSizeClasses[size])}>

Line 158: text-gray-

<p className="text-sm text-gray-400 mb-4 max-w-md mx-auto">

apps/web/src/components/ui/file-upload.tsx

Total instances in file: 1

Line 458: text-green-

<div className="flex items-center gap-1 text-xs text-green-600">

apps/web/src/components/ui/label.tsx

Total instances in file: 1

Line 41: text-gray-

'text-sm font-medium leading-none text-gray-400 peer-disabled:cursor-not-allowed peer-disabled:opacity-70',

apps/web/src/components/ui/loading-spinner.tsx

Total instances in file: 2

Line 79: border-gray-

'animate-spin rounded-full border-2 border-gray-300 border-t-blue-600',

Line 88: text-gray-, text-gray-

<p className="mt-2 text-sm text-gray-600 dark:text-gray-400">{text}</p>

apps/web/src/components/ui/optimized-image.tsx

Total instances in file: 3

Line 154: bg-gray-

className={`bg-gray-200 animate-pulse ${className}`}

Line 298: bg-gray-

className={`bg-gray-200 flex items-center justify-center ${className}`}

Line 301: text-gray-

<span className="text-gray-400 text-sm">Image non disponible</span>

apps/web/src/components/ui/progress.tsx

Total instances in file: 2

Line 130: to-blue-500
```
cyan: 'from-kodo-cyan to-blue-500',
```

Line 170: text-gray-

<div className="flex justify-between text-xs text-gray-500 mt-1 font-mono">

apps/web/src/components/ui/select.tsx

Total instances in file: 3

Line 363: text-gray-

<div className="px-3 py-1.5 text-xs font-semibold text-gray-400 uppercase">

Line 382: text-gray-

<div className="px-3 py-2 text-sm text-gray-400 text-center">

Line 444: text-gray-
```
'transition-colors text-gray-300',
```

apps/web/src/components/ui/table.tsx

Total instances in file: 3

Line 168: text-gray-

'h-12 px-4 text-left align-middle font-bold text-gray-400 uppercase tracking-wider [&:has([role=checkbox])]:pr-0',

Line 190: text-gray-

'p-4 align-middle [&:has([role=checkbox])]:pr-0 text-gray-300',

Line 212: text-gray-

className={cn('mt-4 text-sm text-gray-400', className)}

apps/web/src/components/ui/tabs.tsx

Total instances in file: 2

Line 171: text-gray-

'inline-flex h-10 items-center justify-center rounded-md bg-kodo-graphite p-1 text-gray-400 border border-kodo-steel/30',

Line 256: text-gray-, text-gray-
```
: 'text-gray-500 hover:text-gray-300',
```

apps/web/src/components/ui/textarea.tsx

Total instances in file: 1

Line 77: text-gray-

<label className="block text-sm font-medium text-gray-400 mb-2 font-body">

apps/web/src/components/upload/BulkUploadModal.tsx

Total instances in file: 5

Line 41: text-gray-

<p className="text-xs text-gray-400 mt-1">

Line 46: text-gray-

<button onClick={onClose} className="text-gray-400 hover:text-white">

Line 53: text-gray-

<div className="flex justify-between text-[10px] font-bold text-gray-400 uppercase mb-1">

Line 57: bg-gray-

<div className="h-1 bg-gray-700 rounded-full overflow-hidden">

Line 84: text-gray-

className="text-gray-400 hover:text-white"

apps/web/src/components/upload/FilePreviewCard.tsx

Total instances in file: 2

Line 51: text-gray-

return <File className="w-6 h-6 text-gray-400" />;

Line 81: text-gray-

<span className="text-[10px] text-gray-500 font-mono flex-shrink-0">

apps/web/src/components/upload/FileUploadZone.tsx

Total instances in file: 3

Line 100: text-gray-

<p className="text-gray-400 mb-6 max-w-sm">

Line 108: text-gray-

className="px-2 py-1 bg-black/30 rounded text-[10px] font-mono text-gray-500 border border-white/5 uppercase"

Line 114: text-gray-

<p className="mt-4 text-[10px] text-gray-600">

apps/web/src/components/upload/UploadProgressBar.tsx

Total instances in file: 1

Line 33: text-gray-

<div className="flex justify-between text-[10px] uppercase font-bold text-gray-500 mb-1">

apps/web/src/components/upload/metadata/CoverArtUploadModal.tsx

Total instances in file: 3

Line 117: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 126: text-gray-

<Upload className="w-8 h-8 text-gray-500" />

Line 135: text-gray-
```

```

apps/web/src/components/upload/metadata/LyricsEditorModal.tsx

Total instances in file: 5

Line 48: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 55: text-gray-

<label className="flex items-center gap-2 text-sm text-gray-300 cursor-pointer">

Line 58: border-gray-

className="rounded border-gray-600 bg-transparent text-kodo-cyan focus:ring-0"

Line 64: text-gray-

<span className="text-xs text-gray-500 flex items-center gap-1">

Line 92: text-gray-

<p className="text-right text-xs text-gray-500 mt-2">

apps/web/src/components/upload/metadata/MetadataEditor.tsx

Total instances in file: 1

Line 148: text-gray-

<p className="text-xs text-gray-400 font-mono">

apps/web/src/components/upload/metadata/MetadataForm.tsx

Total instances in file: 7

Line 73: text-gray-

<div className="absolute inset-0 flex flex-col items-center justify-center text-gray-500 group-hover:text-kodo-cyan">

Line 84: text-gray-

<p className="text-center text-xs text-gray-500 mt-2">

Line 185: text-gray-

<span className="text-sm text-gray-300 flex items-center gap-2">

Line 204: text-gray-

className="text-[10px] bg-kodo-slate px-2 py-1 rounded text-gray-300"

Line 215: text-gray-

<span className="text-sm text-gray-300 flex items-center gap-2">

Line 221: text-gray-

className={data.lyrics ? 'text-kodo-lime' : 'text-gray-400'}

Line 236: text-gray-

<label className="block text-sm font-medium text-gray-400 mb-2">

apps/web/src/components/upload/metadata/TagSuggestionsModal.tsx

Total instances in file: 5

Line 67: text-gray-

<X className="w-5 h-5 text-gray-400 hover:text-white" />

Line 104: text-gray-

<span className="text-gray-500 text-sm italic">

Line 109: text-gray-

<p className="text-right text-xs text-gray-500 mt-1">

Line 115: text-gray-

<h4 className="text-xs font-bold text-gray-400 uppercase tracking-widest mb-3">

Line 123: text-gray-

className="px-3 py-1 bg-kodo-slate border border-kodo-steel rounded-full text-sm text-gray-300 hover:text-white hover:border-white transition-colors flex items-center gap-1"

apps/web/src/components/user/UserCard.tsx

Total instances in file: 5

Line 49: text-gray-

<p className="text-xs text-gray-400 font-mono mb-3">@{user.username}</p>

Line 52: text-gray-

<p className="text-sm text-gray-400 mb-4 line-clamp-2 min-h-[2.5em]">

Line 60: text-gray-

<div className="text-[10px] text-gray-500 uppercase">Tracks</div>

Line 66: text-gray-

<div className="text-[10px] text-gray-500 uppercase">Fans</div>

Line 74: text-gray-

className={`flex-1 ${isFollowing ? 'border border-kodo-steel text-gray-400' : ''}`}

apps/web/src/components/views/DiscoverView.tsx

Total instances in file: 3

Line 22: from-gray-

{ name: 'Techno', color: 'from-gray-700 to-black' },

Line 23: from-blue-

{ name: 'Ambient', color: 'from-blue-400 to-teal-500' },

Line 26: to-blue-600

{ name: 'House', color: 'from-indigo-500 to-blue-600' },

apps/web/src/components/views/FileDetailsView.tsx

Total instances in file: 1

Line 143: to-blue-600

<div className="w-32 h-32 bg-gradient-to-br from-kodo-cyan to-blue-600 rounded-full mx-auto mb-8 flex items-center justify-center shadow-[0_0_50px_rgba(102,252,241,0.3)] animate-pulse">

apps/web/src/features/auth/components/AuthButton.tsx

Total instances in file: 2

Line 23: bg-blue-, bg-blue-, bg-blue-, bg-blue-

? 'bg-blue-600 text-white hover:bg-blue-700 focus:ring-blue-500 dark:bg-blue-500 dark:hover:bg-blue-600'

Line 24: bg-gray-, text-gray-, bg-gray-, bg-gray-, text-gray-, bg-gray-

: 'bg-gray-200 text-gray-800 hover:bg-gray-300 focus:ring-gray-500 dark:bg-gray-700 dark:text-gray-200 dark:hover:bg-gray-600',

apps/web/src/features/auth/components/AuthFormField.tsx

Total instances in file: 4

Line 30: text-gray-, text-gray-

className="block text-sm font-medium text-gray-700 dark:text-gray-300"

Line 34: text-red-

<span className="text-red-500 ml-1" aria-label="required">

Line 41: text-gray-, text-gray-

<p className="text-xs text-gray-500 dark:text-gray-400">{helpText}</p>

Line 45: text-red-, text-red-

className="text-sm text-red-600 dark:text-red-400"

apps/web/src/features/auth/components/AuthInput.tsx

Total instances in file: 5

Line 26: text-gray-, text-gray-

className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1"

Line 35: bg-gray-, border-gray-

'dark:bg-gray-800 dark:text-white dark:border-gray-600',

Line 37: border-red-, border-red-

? 'border-red-500 focus:ring-red-500 dark:border-red-500'

Line 38: border-gray-, border-gray-

: 'border-gray-300 focus:ring-blue-500 dark:border-gray-600',

Line 63: text-red-, text-red-

className="mt-1 text-sm text-red-600 dark:text-red-400"

apps/web/src/features/auth/components/AuthLayout.tsx

Total instances in file: 1

Line 78: text-blue-, text-blue-, text-blue-, text-blue-

className="text-sm text-blue-600 dark:text-blue-400 hover:text-blue-800 dark:hover:text-blue-300 transition-colors focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 rounded"

apps/web/src/features/auth/components/EmailVerificationBadge.tsx

Total instances in file: 2

Line 14: bg-green-, text-green-, bg-green-, text-green-

<span className="inline-flex items-center px-2 py-1 rounded-full text-xs font-medium bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-200">

Line 21: bg-yellow-, text-yellow-, bg-yellow-, text-yellow-

<span className="inline-flex items-center px-2 py-1 rounded-full text-xs font-medium bg-yellow-100 text-yellow-800 dark:bg-yellow-900 dark:text-yellow-200">

apps/web/src/features/auth/components/OAuthButtons.tsx

Total instances in file: 1

Line 43: text-gray-

<div className="text-sm text-center text-gray-500 mb-4">

apps/web/src/features/auth/components/PasswordStrengthIndicator.tsx

Total instances in file: 9

Line 52: bg-red-
```
color = 'bg-red-500';
```
Line 55: bg-orange-
```
color = 'bg-orange-500';
```
Line 58: bg-yellow-
```
color = 'bg-yellow-500';
```
Line 61: bg-green-
```
color = 'bg-green-500';
```
Line 64: bg-green-
```
color = 'bg-green-600';
```

Line 84: bg-gray-

className="w-full bg-gray-200 rounded-full h-2"

Line 97: text-gray-

<p className="text-xs text-gray-600 mt-1" id="password-strength-label">

Line 102: text-gray-

<div className="text-xs text-gray-600">

Line 106: text-red-

<li key={index} className="text-red-600">

apps/web/src/features/auth/components/TwoFactorVerify.tsx

Total instances in file: 5

Line 78: text-blue-

<Shield className="h-5 w-5 text-blue-500" />

Line 119: text-gray-
```

```

Line 123: text-blue-

className="text-blue-600 hover:underline"

Line 144: text-gray-
```

```

Line 147: text-blue-

className="text-blue-600 hover:underline"

apps/web/src/features/auth/pages/ForgotPasswordPage.tsx

Total instances in file: 4

Line 74: bg-green-, border-green-, text-green-

className="bg-green-50 border border-green-200 text-green-700 px-4 py-3 rounded"

Line 83: text-gray-
```

```

Line 89: text-blue-

className="text-blue-600 hover:underline text-sm block focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 rounded"

Line 102: bg-red-, border-red-, text-red-

className="bg-red-50 border border-red-200 text-red-700 px-4 py-3 rounded"

apps/web/src/features/auth/pages/LoginPage.tsx

Total instances in file: 5

Line 206: border-gray-

<div className="w-full border-t border-gray-300"></div>

Line 209: text-gray-

<span className="px-2 bg-white text-gray-500" aria-hidden="true">

Line 224: bg-red-, border-red-, text-red-

className="bg-red-50 border border-red-200 text-red-700 px-4 py-3 rounded"

Line 266: text-blue-, border-gray-

className="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded"

Line 271: text-gray-

className="ml-2 block text-sm text-gray-900"

apps/web/src/features/auth/pages/OAuthCallbackPage.tsx

Total instances in file: 2

Line 10: border-blue-

<div className="animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600 mx-auto"></div>

Line 11: text-gray-

<p className="mt-4 text-sm text-gray-600">

apps/web/src/features/auth/pages/RegisterPage.tsx

Total instances in file: 13

Line 167: bg-green-, border-green-, text-green-

className="bg-green-50 border border-green-200 text-green-700 px-4 py-3 rounded"

Line 176: text-gray-
```

```
Line 182: text-green-
```
className="text-sm text-green-600"
```

Line 193: text-blue-

className="text-blue-600 hover:underline text-sm disabled:opacity-50 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 rounded"

Line 215: bg-red-, border-red-, text-red-

className="bg-red-50 border border-red-200 text-red-700 px-4 py-3 rounded"

Line 236: text-gray-

<p className="text-xs text-gray-500" role="status">

Line 241: text-green-

<p className="text-xs text-green-600" role="status">

Line 247: text-red-

<p className="text-xs text-red-600" role="alert">

Line 300: text-blue-, border-gray-

className="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded mt-1"

Line 307: text-gray-

<label htmlFor="terms" className="ml-2 block text-sm text-gray-900">

Line 311: text-blue-

className="text-blue-600 hover:underline focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 rounded"

Line 319: text-blue-

className="text-blue-600 hover:underline focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 rounded"

Line 331: text-red-

<p id="terms-error" className="text-sm text-red-600" role="alert">

apps/web/src/features/auth/pages/ResetPasswordPage.tsx

Total instances in file: 2

Line 124: bg-red-, border-red-, text-red-

<div className="bg-red-50 border border-red-200 text-red-700 px-4 py-3 rounded">

Line 146: bg-green-, border-green-, text-green-

className="bg-green-50 border border-green-200 text-green-700 px-4 py-3 rounded"

apps/web/src/features/auth/pages/VerifyEmailPage.tsx

Total instances in file: 5

Line 152: border-blue-

<div className="animate-spin rounded-full h-12 w-12 border-b-2 border-blue-600"></div>

Line 154: text-gray-

<p className="text-gray-600">{message}</p>

Line 173: bg-green-, border-green-, text-green-

className="bg-green-50 border border-green-200 text-green-700 px-4 py-3 rounded"

Line 178: text-gray-

<p className="text-xs mt-2 text-gray-600">

Line 196: bg-red-, border-red-, text-red-

className="bg-red-50 border border-red-200 text-red-700 px-4 py-3 rounded"

apps/web/src/features/chat/components/ChatMessage.tsx

Total instances in file: 1

Line 72: text-gray-

: 'bg-white/5 border border-white/10 text-gray-100 rounded-tl-sm hover:bg-white/10',

apps/web/src/features/chat/components/MessageSearch.tsx

Total instances in file: 6

Line 63: text-gray-

<Search className="absolute left-2 top-1/2 transform -translate-y-1/2 h-4 w-4 text-gray-400" />

Line 100: text-gray-

<div className="text-xs text-gray-500 mb-2">

Line 106: bg-gray-

className="p-2 hover:bg-gray-100 rounded cursor-pointer"

Line 115: text-gray-

<div className="text-xs text-gray-600 truncate">

Line 118: text-gray-

<div className="text-xs text-gray-400">

Line 128: text-gray-

<div className="absolute z-10 w-full mt-2 bg-white border rounded-lg shadow-lg p-4 text-sm text-gray-500">

apps/web/src/features/chat/components/TypingIndicator.tsx

Total instances in file: 1

Line 17: text-gray-

<div className="px-4 py-1 text-xs text-gray-500 italic animate-pulse">

apps/web/src/features/chat/components/VirtualizedChatMessages.tsx

Total instances in file: 13

Line 49: border-gray-, bg-gray-

className={`p-3 border-b border-gray-200 hover:bg-gray-50 cursor-pointer transition-colors ${

Line 58: bg-blue-

<div className="w-8 h-8 bg-blue-500 rounded-full flex items-center justify-center text-white text-sm font-medium">

Line 66: text-gray-

<span className="text-sm font-medium text-gray-900">

Line 69: text-gray-

<span className="text-xs text-gray-500">

Line 79: text-gray-

className="text-sm text-gray-700 break-words"

Line 87: text-gray-

<div className="mt-2 text-xs text-gray-500">

Line 88: bg-blue-, text-blue-

<span className="inline-block px-2 py-1 bg-blue-100 text-blue-800 rounded-full">

Line 126: border-blue-

<div className="animate-spin rounded-full h-6 w-6 border-b-2 border-blue-500"></div>

Line 127: text-gray-

<span className="ml-2 text-sm text-gray-500">

Line 139: text-gray-

<div className="text-gray-400 text-6xl mb-4">💬</div>

Line 140: text-gray-

<p className="text-gray-500">Aucun message dans cette conversation</p>

Line 141: text-gray-

<p className="text-sm text-gray-400 mt-2">

Line 173: bg-blue-, bg-blue-

className="absolute bottom-4 right-4 bg-blue-500 hover:bg-blue-600 text-white rounded-full p-2 shadow-lg transition-colors"

apps/web/src/features/dashboard/pages/DashboardPage.tsx

Total instances in file: 8

Line 35: text-blue-
```
color: 'text-blue-600',
```
Line 42: text-green-
```
color: 'text-green-600',
```
Line 49: text-red-
```
color: 'text-red-600',
```
Line 56: text-purple-
```
color: 'text-purple-600',
```

Line 85: text-green-

<span className="text-green-600">{stat.change}</span> par

Line 105: bg-blue-

<div className="w-2 h-2 bg-blue-600 rounded-full"></div>

Line 114: bg-green-

<div className="w-2 h-2 bg-green-600 rounded-full"></div>

Line 123: bg-purple-

<div className="w-2 h-2 bg-purple-600 rounded-full"></div>

apps/web/src/features/error/pages/NotFoundPage.tsx

Total instances in file: 8

Line 24: bg-gray-, bg-gray-

<div className="min-h-screen flex items-center justify-center bg-gray-50 dark:bg-gray-900 p-4">

Line 28: bg-blue-, bg-blue-

<div className="mx-auto mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-blue-100 dark:bg-blue-900">

Line 29: text-blue-, text-blue-

<Search className="h-8 w-8 text-blue-600 dark:text-blue-400" />

Line 37: text-gray-, text-gray-

<div className="text-6xl font-bold text-gray-300 dark:text-gray-700">

Line 40: text-gray-, text-gray-

<p className="text-gray-600 dark:text-gray-400">

Line 65: text-gray-, text-gray-

<p className="text-sm font-medium text-gray-700 dark:text-gray-300 mb-3">

Line 91: text-gray-, text-gray-

<p className="text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">

Line 94: text-gray-, text-gray-

<ul className="text-sm text-gray-600 dark:text-gray-400 space-y-1 list-disc list-inside">

apps/web/src/features/error/pages/ServerErrorPage.tsx

Total instances in file: 16

Line 40: bg-gray-, bg-gray-

<div className="min-h-screen flex items-center justify-center bg-gray-50 dark:bg-gray-900 p-4">

Line 44: bg-red-, bg-red-

<div className="mx-auto mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-red-100 dark:bg-red-900">

Line 45: text-red-, text-red-

<AlertTriangle className="h-8 w-8 text-red-600 dark:text-red-400" />

Line 53: text-gray-, text-gray-

<div className="text-6xl font-bold text-gray-300 dark:text-gray-700">

Line 56: text-gray-, text-gray-

<p className="text-gray-600 dark:text-gray-400">

Line 63: bg-blue-, bg-blue-, border-blue-, border-blue-

<div className="bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-800 rounded-lg p-4">

Line 65: text-blue-, text-blue-

<Clock className="h-5 w-5 text-blue-600 dark:text-blue-400 mt-0.5" />

Line 67: text-blue-, text-blue-

<p className="text-sm font-medium text-blue-900 dark:text-blue-100">

Line 70: text-blue-, text-blue-

<ul className="text-sm text-blue-800 dark:text-blue-200 mt-2 space-y-1 list-disc list-inside">

Line 103: text-gray-, text-gray-

<p className="text-sm font-medium text-gray-700 dark:text-gray-300 mb-3">

Line 107: text-gray-, text-gray-

<div className="flex items-center gap-2 text-sm text-gray-600 dark:text-gray-400">

Line 108: text-green-

<CheckCircle className="h-4 w-4 text-green-600" />

Line 113: text-gray-, text-gray-

<div className="flex items-center gap-2 text-sm text-gray-600 dark:text-gray-400">

Line 114: text-blue-

<Mail className="h-4 w-4 text-blue-600" />

Line 125: text-gray-, text-gray-, text-gray-, text-gray-

<summary className="text-sm font-medium text-gray-700 dark:text-gray-300 cursor-pointer hover:text-gray-900 dark:hover:text-gray-100">

Line 128: bg-gray-, bg-gray-, text-gray-, text-gray-

<div className="mt-2 p-3 bg-gray-100 dark:bg-gray-800 rounded text-xs font-mono text-gray-600 dark:text-gray-400">

apps/web/src/features/library/components/LibraryManager.tsx

Total instances in file: 1

Line 227: text-red-

<div className="text-center text-red-500">

apps/web/src/features/library/pages/LibraryPage.tsx

Total instances in file: 1

Line 782: text-red-
```

```

apps/web/src/features/player/components/AudioPlayer.tsx

Total instances in file: 8

Line 192: text-gray-, text-gray-

<div className="text-sm text-gray-500 dark:text-gray-400">

Line 203: bg-gray-

'bg-white dark:bg-gray-900 rounded-lg shadow-lg p-6',

Line 308: border-gray-, border-gray-

<div className="flex items-center justify-between gap-4 pt-4 border-t border-gray-200 dark:border-gray-700">

Line 313: text-gray-

className={cn('gap-1', !isSynced && 'text-gray-500')}

Line 332: text-gray-, text-gray-

<span className="text-sm text-gray-600 dark:text-gray-400">

Line 344: text-gray-, text-gray-

<span className="text-sm text-gray-600 dark:text-gray-400">

Line 362: text-gray-, text-gray-

<div className="text-gray-500 dark:text-gray-400 mb-2">

Line 365: text-gray-, text-gray-

<div className="text-sm text-gray-400 dark:text-gray-500">

apps/web/src/features/player/components/MiniPlayer.tsx

Total instances in file: 5

Line 51: bg-gray-, border-gray-, border-gray-

'fixed left-0 right-0 z-50 bg-white dark:bg-gray-900 border-t border-gray-200 dark:border-gray-800 shadow-lg',

Line 118: text-gray-, text-gray-

'p-2 rounded-lg text-gray-600 dark:text-gray-400',

Line 119: bg-gray-, bg-gray-

'hover:bg-gray-100 dark:hover:bg-gray-800',

Line 136: text-gray-, text-gray-

'p-2 rounded-lg text-gray-600 dark:text-gray-400',

Line 137: bg-gray-, bg-gray-

'hover:bg-gray-100 dark:hover:bg-gray-800',

apps/web/src/features/player/components/NextPreviousButtons.tsx

Total instances in file: 3

Line 44: bg-blue-, bg-blue-, bg-blue-, bg-blue-

'bg-blue-600 text-white hover:bg-blue-700 focus:ring-blue-500 dark:bg-blue-500 dark:hover:bg-blue-600',

Line 46: text-gray-, bg-gray-, text-gray-, bg-gray-

'bg-transparent text-gray-700 hover:bg-gray-100 focus:ring-gray-500 dark:text-gray-300 dark:hover:bg-gray-800',

Line 48: border-gray-, text-gray-, bg-gray-, border-gray-, bg-gray-, text-gray-, bg-gray-

'border border-gray-300 bg-white text-gray-700 hover:bg-gray-50 focus:ring-gray-500 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-300 dark:hover:bg-gray-700',

apps/web/src/features/player/components/PlayPauseButton.tsx

Total instances in file: 3

Line 42: bg-blue-, bg-blue-, bg-blue-, bg-blue-

'bg-blue-600 text-white hover:bg-blue-700 focus:ring-blue-500 dark:bg-blue-500 dark:hover:bg-blue-600',

Line 44: text-gray-, bg-gray-, text-gray-, bg-gray-

'bg-transparent text-gray-700 hover:bg-gray-100 focus:ring-gray-500 dark:text-gray-300 dark:hover:bg-gray-800',

Line 46: border-gray-, text-gray-, bg-gray-, border-gray-, bg-gray-, text-gray-, bg-gray-

'border border-gray-300 bg-white text-gray-700 hover:bg-gray-50 focus:ring-gray-500 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-300 dark:hover:bg-gray-700',

apps/web/src/features/player/components/PlaybackSpeedControl.tsx

Total instances in file: 9

Line 90: bg-gray-, border-gray-, border-gray-

'bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600',

Line 91: text-gray-, text-gray-
```
'text-gray-700 dark:text-gray-300',
```

Line 92: bg-gray-, bg-gray-

'hover:bg-gray-50 dark:hover:bg-gray-700',

Line 116: bg-gray-, border-gray-, border-gray-

className="absolute z-50 mt-1 w-32 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600 rounded-lg shadow-lg"

Line 126: bg-gray-, bg-gray-

'hover:bg-gray-100 dark:hover:bg-gray-700',

Line 127: bg-gray-, bg-gray-

'focus:outline-none focus:bg-gray-100 dark:focus:bg-gray-700',

Line 130: bg-blue-, bg-blue-
```
'bg-blue-50 dark:bg-blue-900/20',
```

Line 135: text-gray-

<span className="font-medium text-gray-900 dark:text-white">

Line 140: text-blue-, text-blue-

className="h-4 w-4 text-blue-600 dark:text-blue-400"

apps/web/src/features/player/components/PlayerLoading.tsx

Total instances in file: 2

Line 55: text-blue-, text-blue-

'animate-spin text-blue-600 dark:text-blue-400',

Line 63: text-gray-, text-gray-

'text-gray-700 dark:text-gray-300 text-center',

apps/web/src/features/player/components/ProgressBar.tsx

Total instances in file: 6

Line 155: bg-gray-, bg-gray-

<div className="absolute inset-0 bg-gray-200 dark:bg-gray-700 rounded-full" />

Line 160: bg-blue-, bg-blue-

'absolute left-0 top-0 h-full bg-blue-600 dark:bg-blue-500 rounded-full transition-all',

Line 161: bg-blue-, bg-blue-

isDragging && 'bg-blue-700 dark:bg-blue-600',

Line 169: bg-blue-, bg-blue-

className="absolute top-0 h-full w-0.5 bg-blue-800 dark:bg-blue-400 opacity-50"

Line 177: bg-blue-, bg-blue-

'absolute top-1/2 -translate-y-1/2 w-4 h-4 bg-blue-600 dark:bg-blue-500 rounded-full',

Line 188: bg-gray-, bg-gray-

className="absolute bottom-full mb-2 px-2 py-1 bg-gray-900 dark:bg-gray-800 text-white text-xs rounded pointer-events-none whitespace-nowrap"

apps/web/src/features/player/components/QualitySelector.tsx

Total instances in file: 10

Line 86: bg-gray-, border-gray-, border-gray-

'bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600',

Line 87: text-gray-, text-gray-
```
'text-gray-700 dark:text-gray-300',
```

Line 88: bg-gray-, bg-gray-

'hover:bg-gray-50 dark:hover:bg-gray-700',

Line 111: bg-gray-, border-gray-, border-gray-

className="absolute z-50 mt-1 w-48 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600 rounded-lg shadow-lg"

Line 121: bg-gray-, bg-gray-

'hover:bg-gray-100 dark:hover:bg-gray-700',

Line 122: bg-gray-, bg-gray-

'focus:outline-none focus:bg-gray-100 dark:focus:bg-gray-700',

Line 125: bg-blue-, bg-blue-
```
'bg-blue-50 dark:bg-blue-900/20',
```

Line 131: text-gray-

<span className="font-medium text-gray-900 dark:text-white">

Line 135: text-gray-, text-gray-

<span className="text-xs text-gray-500 dark:text-gray-400">

Line 142: text-blue-, text-blue-

className="h-4 w-4 text-blue-600 dark:text-blue-400"

apps/web/src/features/player/components/RepeatShuffleButtons.tsx

Total instances in file: 6

Line 44: bg-blue-, bg-blue-, bg-blue-, bg-blue-

'bg-blue-600 text-white hover:bg-blue-700 focus:ring-blue-500 dark:bg-blue-500 dark:hover:bg-blue-600',

Line 46: text-gray-, bg-gray-, text-gray-, bg-gray-

'bg-transparent text-gray-700 hover:bg-gray-100 focus:ring-gray-500 dark:text-gray-300 dark:hover:bg-gray-800',

Line 48: border-gray-, text-gray-, bg-gray-, border-gray-, bg-gray-, text-gray-, bg-gray-

'border border-gray-300 bg-white text-gray-700 hover:bg-gray-50 focus:ring-gray-500 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-300 dark:hover:bg-gray-700',

Line 98: bg-blue-, bg-blue-, bg-blue-, bg-blue-

'bg-blue-600 text-white hover:bg-blue-700 dark:bg-blue-500 dark:hover:bg-blue-600',

Line 112: bg-blue-, bg-blue-

className="absolute bottom-0 right-0 text-[8px] font-bold leading-none bg-blue-700 dark:bg-blue-600 rounded-full w-3 h-3 flex items-center justify-center"

Line 131: bg-blue-, bg-blue-, bg-blue-, bg-blue-

'bg-blue-600 text-white hover:bg-blue-700 dark:bg-blue-500 dark:hover:bg-blue-600',

apps/web/src/features/player/components/TimeDisplay.tsx

Total instances in file: 1

Line 30: text-gray-, text-gray-

'flex items-center text-sm text-gray-600 dark:text-gray-400',

apps/web/src/features/player/components/TrackInfo.tsx

Total instances in file: 8

Line 29: text-gray-, text-gray-

'flex items-center gap-3 text-gray-500 dark:text-gray-400',

Line 56: bg-gray-, bg-gray-

'rounded-lg object-cover bg-gray-200 dark:bg-gray-700',

Line 63: bg-gray-, bg-gray-

'rounded-lg bg-gray-200 dark:bg-gray-700 flex items-center justify-center',

Line 73: text-gray-, text-gray-
```
'text-gray-400 dark:text-gray-500',
```

Line 85: text-gray-

className="text-sm font-semibold text-gray-900 dark:text-white truncate"

Line 92: text-gray-, text-gray-

className="text-xs text-gray-600 dark:text-gray-400 truncate"

Line 101: text-gray-, text-gray-

<div className="flex items-center gap-2 mt-1 text-xs text-gray-500 dark:text-gray-500">

Line 108: text-gray-, text-gray-

<span className="text-gray-400 dark:text-gray-600">•</span>

apps/web/src/features/player/components/VolumeControl.tsx

Total instances in file: 6

Line 110: text-gray-, bg-gray-, text-gray-, bg-gray-

'bg-transparent text-gray-700 hover:bg-gray-100 focus:ring-gray-500 dark:text-gray-300 dark:hover:bg-gray-800',

Line 140: bg-gray-, bg-gray-

<div className="absolute inset-0 bg-gray-200 dark:bg-gray-700 rounded-full" />

Line 145: bg-blue-, bg-blue-

'absolute left-0 top-0 h-full bg-blue-600 dark:bg-blue-500 rounded-full transition-all',

Line 146: bg-blue-, bg-blue-

isDragging && 'bg-blue-700 dark:bg-blue-600',

Line 154: bg-blue-, bg-blue-

'absolute top-1/2 -translate-y-1/2 w-4 h-4 bg-blue-600 dark:bg-blue-500 rounded-full',

Line 166: text-gray-, text-gray-

className="text-xs text-gray-600 dark:text-gray-400 min-w-[3ch] text-right"

apps/web/src/features/playlists/components/ImportPlaylistButton.tsx

Total instances in file: 1

Line 267: border-gray-

className="h-4 w-4 rounded border-gray-300 text-primary focus:ring-2 focus:ring-primary"

apps/web/src/features/playlists/components/PlaylistActions.tsx

Total instances in file: 1

Line 125: text-green-

className="w-4 h-4 sm:mr-2 text-green-600"

apps/web/src/features/playlists/components/PlaylistBatchActions.tsx

Total instances in file: 2

Line 200: bg-blue-, bg-blue-, border-blue-, border-blue-

'p-4 bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-800 rounded-lg',

Line 208: text-blue-, text-blue-

<span className="text-sm font-medium text-blue-900 dark:text-blue-100">

apps/web/src/features/playlists/components/PlaylistCard.tsx

Total instances in file: 5

Line 68: border-blue-

selectable && selected && 'ring-2 ring-blue-500 border-blue-500',

Line 100: bg-blue-, border-blue-

? 'bg-blue-600 border-blue-600 text-white'

Line 101: bg-gray-, border-gray-, border-gray-, border-blue-

: 'bg-white/90 dark:bg-gray-800/90 border-gray-300 dark:border-gray-600 text-transparent hover:border-blue-500',

Line 119: bg-green-

className="bg-green-500/80 text-white px-2 py-1 rounded-full text-xs flex items-center gap-1"

Line 127: bg-gray-

className="bg-gray-700/80 text-white px-2 py-1 rounded-full text-xs flex items-center gap-1"

apps/web/src/features/playlists/components/PlaylistHeader.tsx

Total instances in file: 2

Line 56: bg-green-

className="bg-green-500/90 text-white px-3 py-1.5 rounded-full text-sm flex items-center gap-2"

Line 64: bg-gray-

className="bg-gray-700/90 text-white px-3 py-1.5 rounded-full text-sm flex items-center gap-2"

apps/web/src/features/playlists/components/PlaylistList.tsx

Total instances in file: 7

Line 298: bg-gray-, bg-gray-, border-gray-, border-gray-

className="inline-flex items-center gap-1 p-1 rounded-lg bg-gray-100 dark:bg-gray-800 border border-gray-200 dark:border-gray-700"

Line 307: bg-gray-, bg-gray-

'hover:bg-gray-200 dark:hover:bg-gray-700',

Line 311: bg-gray-, text-blue-, text-blue-

? 'bg-white dark:bg-gray-700 text-blue-600 dark:text-blue-400 shadow-sm'

Line 312: text-gray-, text-gray-
```
: 'text-gray-600 dark:text-gray-400',
```

Line 325: bg-gray-, bg-gray-

'hover:bg-gray-200 dark:hover:bg-gray-700',

Line 329: bg-gray-, text-blue-, text-blue-

? 'bg-white dark:bg-gray-700 text-blue-600 dark:text-blue-400 shadow-sm'

Line 330: text-gray-, text-gray-
```
: 'text-gray-600 dark:text-gray-400',
```

apps/web/src/features/playlists/components/PlaylistTrackItem.tsx

Total instances in file: 10

Line 66: bg-gray-, bg-gray-

'hover:bg-gray-100 dark:hover:bg-gray-800',

Line 67: bg-gray-, bg-gray-

'active:bg-gray-200 dark:active:bg-gray-700',

Line 95: bg-gray-, bg-gray-, bg-gray-, bg-gray-

className="p-1 rounded-full hover:bg-gray-200 dark:hover:bg-gray-700 active:bg-gray-300 dark:active:bg-gray-600 transition-colors touch-manipulation min-h-[32px] min-w-[32px] sm:min-h-0 sm:min-w-0"

Line 103: text-gray-, text-gray-

<Pause className="h-3 w-3 sm:h-4 sm:w-4 text-gray-700 dark:text-gray-300" />

Line 105: text-gray-, text-gray-

<Play className="h-3 w-3 sm:h-4 sm:w-4 text-gray-700 dark:text-gray-300" />

Line 122: bg-gray-, bg-gray-

<div className="w-10 h-10 sm:w-12 sm:h-12 rounded-md bg-gray-200 dark:bg-gray-700 flex items-center justify-center">

Line 123: text-gray-, text-gray-

<Music className="h-5 w-5 sm:h-6 sm:w-6 text-gray-400 dark:text-gray-500" />

Line 130: text-gray-

<div className="font-medium text-sm sm:text-base text-gray-900 dark:text-white truncate">

Line 133: text-gray-, text-gray-

<div className="text-xs sm:text-sm text-gray-600 dark:text-gray-400 truncate">

Line 142: text-gray-, text-gray-

<div className="hidden sm:block text-sm text-gray-500 dark:text-gray-500 flex-shrink-0">

apps/web/src/features/playlists/components/PlaylistTrackList.tsx

Total instances in file: 1

Line 222: text-gray-

<p className="text-lg font-medium text-gray-900 dark:text-white mb-2">

apps/web/src/features/playlists/pages/PlaylistListPage.tsx

Total instances in file: 2

Line 109: text-gray-

<Search className="absolute left-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-gray-400" />

Line 126: bg-blue-

<span className="ml-2 bg-blue-600 text-white rounded-full px-2 py-0.5 text-xs">

apps/web/src/features/streaming/components/PlaybackDashboard.tsx

Total instances in file: 4

Line 145: text-green-

{isPositive && <TrendingUp className="h-4 w-4 text-green-500" />}

Line 146: text-red-

{isNegative && <TrendingDown className="h-4 w-4 text-red-500" />}

Line 151: text-green-
```
? 'text-green-500'
```
Line 153: text-red-
```
? 'text-red-500'
```

apps/web/src/features/streaming/components/PlaybackHeatmap.tsx

Total instances in file: 1

Line 304: bg-gray-

<div className="absolute bottom-full left-1/2 transform -translate-x-1/2 mb-2 hidden group-hover:block z-10 bg-gray-900 text-white text-xs rounded px-2 py-1 whitespace-nowrap">

apps/web/src/features/streaming/components/PlaybackSummary.tsx

Total instances in file: 3

Line 145: text-blue-

<Play className="h-4 w-4 text-blue-600" />

Line 163: text-green-

<Clock className="h-4 w-4 text-green-600" />

Line 181: text-purple-

<CheckCircle2 className="h-4 w-4 text-purple-600" />

apps/web/src/features/tracks/components/LikeButton.tsx

Total instances in file: 1

Line 163: text-red-, text-red-

isLiked && 'text-red-500 hover:text-red-600',

apps/web/src/features/tracks/components/TrackCard.tsx

Total instances in file: 1

Line 155: text-red-

className="text-white hover:text-red-500"

apps/web/src/features/tracks/components/TrackGridDensitySelector.tsx

Total instances in file: 4

Line 53: bg-gray-, bg-gray-, border-gray-, border-gray-

'bg-gray-100 dark:bg-gray-800 border border-gray-200 dark:border-gray-700',

Line 69: bg-gray-, bg-gray-

'hover:bg-gray-200 dark:hover:bg-gray-700',

Line 72: bg-gray-, text-blue-, text-blue-

? 'bg-white dark:bg-gray-700 text-blue-600 dark:text-blue-400 shadow-sm'

Line 73: text-gray-, text-gray-
```
: 'text-gray-600 dark:text-gray-400',
```

apps/web/src/features/tracks/components/TrackHistory.tsx

Total instances in file: 6

Line 125: text-green-, bg-green-
```
return 'text-green-600 bg-green-50';
```
Line 127: text-blue-, bg-blue-
```
return 'text-blue-600 bg-blue-50';
```
Line 129: text-red-, bg-red-
```
return 'text-red-600 bg-red-50';
```
Line 131: text-purple-, bg-purple-
```
return 'text-purple-600 bg-purple-50';
```
Line 133: text-orange-, bg-orange-
```
return 'text-orange-600 bg-orange-50';
```
Line 137: text-gray-, bg-gray-
```
return 'text-gray-600 bg-gray-50';
```

apps/web/src/features/tracks/components/TrackList.tsx

Total instances in file: 2

Line 133: bg-blue-, bg-blue-
```
'bg-blue-50 dark:bg-blue-900/20',
```
Line 162: bg-blue-, bg-blue-
```
'bg-blue-50 dark:bg-blue-900/20',
```

apps/web/src/features/tracks/components/TrackListContainer.tsx

Total instances in file: 1

Line 22: text-red-
```
<div className="p-4 text-red-500">
```

apps/web/src/features/tracks/components/TrackListEmpty.tsx

Total instances in file: 8

Line 85: text-red-, text-red-
```
? 'text-red-500 dark:text-red-400'
```
Line 86: text-gray-, text-gray-
```
: 'text-gray-400 dark:text-gray-500';
```
Line 106: text-red-, text-red-
```
? 'text-red-900 dark:text-red-100'
```
Line 107: text-gray-
```
: 'text-gray-900 dark:text-white',
```
Line 117: text-red-, text-red-
```
? 'text-red-700 dark:text-red-300'
```
Line 118: text-gray-, text-gray-
```
: 'text-gray-600 dark:text-gray-400',
```

Line 136: bg-red-, bg-red-, bg-red-, bg-red-

? 'bg-red-600 text-white hover:bg-red-700 dark:bg-red-500 dark:hover:bg-red-600 focus:ring-red-500'

Line 137: bg-blue-, bg-blue-, bg-blue-, bg-blue-

: 'bg-blue-600 text-white hover:bg-blue-700 dark:bg-blue-500 dark:hover:bg-blue-600 focus:ring-blue-500',

apps/web/src/features/tracks/components/TrackListPagination.tsx

Total instances in file: 21

Line 104: border-gray-, border-gray-

'px-4 py-3 border-t border-gray-200 dark:border-gray-700',

Line 112: text-gray-, text-gray-

<div className="text-sm text-gray-600 dark:text-gray-400">

Line 114: text-gray-

<span className="font-medium text-gray-900 dark:text-white">

Line 118: text-gray-

<span className="font-medium text-gray-900 dark:text-white">

Line 122: text-gray-

<span className="font-medium text-gray-900 dark:text-white">

Line 138: text-gray-, text-gray-
```
'text-gray-600 dark:text-gray-400',
```

Line 139: bg-gray-, bg-gray-

'hover:bg-gray-100 dark:hover:bg-gray-800',

Line 156: text-gray-, text-gray-
```
'text-gray-600 dark:text-gray-400',
```

Line 157: bg-gray-, bg-gray-

'hover:bg-gray-100 dark:hover:bg-gray-800',

Line 178: text-gray-, text-gray-
```
'text-gray-700 dark:text-gray-300',
```

Line 179: bg-gray-, bg-gray-

'hover:bg-gray-100 dark:hover:bg-gray-800',

Line 188: text-gray-, text-gray-

<span className="px-2 text-gray-500 dark:text-gray-400">

Line 205: bg-blue-, bg-blue-

? 'bg-blue-600 text-white dark:bg-blue-500'

Line 206: text-gray-, text-gray-, bg-gray-, bg-gray-

: 'text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800',

Line 219: text-gray-, text-gray-

<span className="px-2 text-gray-500 dark:text-gray-400">

Line 229: text-gray-, text-gray-
```
'text-gray-700 dark:text-gray-300',
```

Line 230: bg-gray-, bg-gray-

'hover:bg-gray-100 dark:hover:bg-gray-800',

Line 250: text-gray-, text-gray-
```
'text-gray-600 dark:text-gray-400',
```

Line 251: bg-gray-, bg-gray-

'hover:bg-gray-100 dark:hover:bg-gray-800',

Line 268: text-gray-, text-gray-
```
'text-gray-600 dark:text-gray-400',
```

Line 269: bg-gray-, bg-gray-

'hover:bg-gray-100 dark:hover:bg-gray-800',

apps/web/src/features/tracks/components/TrackListRow.tsx

Total instances in file: 2

Line 71: bg-blue-, bg-blue-

isSelected && 'bg-blue-50 dark:bg-blue-900/20',

Line 149: bg-blue-, bg-blue-

isSelected && 'bg-blue-50 dark:bg-blue-900/20',

apps/web/src/features/tracks/components/TrackListSelectionActions.tsx

Total instances in file: 7

Line 60: bg-blue-, bg-blue-

'bg-blue-600 dark:bg-blue-700 text-white',

Line 82: bg-blue-, bg-blue-

'hover:bg-blue-700 dark:hover:bg-blue-600',

Line 98: bg-blue-, bg-blue-

'hover:bg-blue-700 dark:hover:bg-blue-600',

Line 114: bg-blue-, bg-blue-

'hover:bg-blue-700 dark:hover:bg-blue-600',

Line 130: bg-red-, bg-red-

'hover:bg-red-600 dark:hover:bg-red-500',

Line 146: bg-blue-, bg-blue-

'hover:bg-blue-700 dark:hover:bg-blue-600',

Line 164: bg-blue-, bg-blue-

'hover:bg-blue-700 dark:hover:bg-blue-600',

apps/web/src/features/tracks/components/TrackListSkeleton.tsx

Total instances in file: 5

Line 32: bg-gray-, border-gray-, border-gray-

className="flex items-center gap-4 p-3 rounded-lg bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700"

Line 37: bg-gray-, bg-gray-

<div className="w-12 h-12 rounded-md bg-gray-200 dark:bg-gray-700 animate-pulse" />

Line 43: bg-gray-, bg-gray-

<div className="h-4 bg-gray-200 dark:bg-gray-700 rounded animate-pulse w-3/4" />

Line 45: bg-gray-, bg-gray-

<div className="h-3 bg-gray-200 dark:bg-gray-700 rounded animate-pulse w-1/2" />

Line 52: bg-gray-, bg-gray-

<div className="h-3 bg-gray-200 dark:bg-gray-700 rounded animate-pulse w-12" />

apps/web/src/features/tracks/components/TrackSort.tsx

Total instances in file: 9

Line 133: text-gray-

<FieldIcon className="absolute left-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-gray-400 pointer-events-none" />

Line 141: border-gray-, border-gray-

'pl-10 pr-8 py-2 border border-gray-300 dark:border-gray-600',

Line 142: bg-gray-

'rounded-md bg-white dark:bg-gray-700',

Line 143: text-gray-

'text-sm font-medium text-gray-900 dark:text-white',

Line 155: text-gray-

<ArrowUpDown className="absolute right-2 top-1/2 transform -translate-y-1/2 h-4 w-4 text-gray-400 pointer-events-none" />

Line 165: border-gray-, border-gray-

'p-2 rounded-md border border-gray-300 dark:border-gray-600',

Line 166: bg-gray-
```
'bg-white dark:bg-gray-700',
```
Line 167: text-gray-, text-gray-
```
'text-gray-700 dark:text-gray-300',
```

Line 168: bg-gray-, bg-gray-

'hover:bg-gray-50 dark:hover:bg-gray-600',

apps/web/src/features/tracks/components/UploadQuota.tsx

Total instances in file: 5

Line 132: text-yellow-

isQuotaNearLimit && !isQuotaExceeded && 'text-yellow-600',

Line 142: bg-yellow-

isQuotaNearLimit && !isQuotaExceeded && '[&>div]:bg-yellow-500',

Line 163: text-yellow-

isQuotaNearLimit && !isQuotaExceeded && 'text-yellow-600',

Line 174: bg-yellow-

isQuotaNearLimit && !isQuotaExceeded && '[&>div]:bg-yellow-500',

Line 186: bg-yellow-, bg-yellow-, text-yellow-, text-yellow-

<div className="flex items-start gap-2 p-2 bg-yellow-50 dark:bg-yellow-900/20 rounded-md text-xs text-yellow-800 dark:text-yellow-200">

apps/web/src/features/tracks/components/ViewToggle.tsx

Total instances in file: 7

Line 69: bg-gray-, bg-gray-, border-gray-, border-gray-

'bg-gray-100 dark:bg-gray-800 border border-gray-200 dark:border-gray-700',

Line 83: bg-gray-, bg-gray-

'hover:bg-gray-200 dark:hover:bg-gray-700',

Line 87: bg-gray-, text-blue-, text-blue-

? 'bg-white dark:bg-gray-700 text-blue-600 dark:text-blue-400 shadow-sm'

Line 88: text-gray-, text-gray-
```
: 'text-gray-600 dark:text-gray-400',
```

Line 106: bg-gray-, bg-gray-

'hover:bg-gray-200 dark:hover:bg-gray-700',

Line 110: bg-gray-, text-blue-, text-blue-

? 'bg-white dark:bg-gray-700 text-blue-600 dark:text-blue-400 shadow-sm'

Line 111: text-gray-, text-gray-
```
: 'text-gray-600 dark:text-gray-400',
```

apps/web/src/features/upload/components/UploadModal.tsx

Total instances in file: 1

Line 426: bg-green-, border-green-, text-green-

<Alert className="bg-green-50 border-green-200 text-green-800">

apps/web/src/features/user/components/ProfileForm.tsx

Total instances in file: 17

Line 307: text-green-

<CheckCircle2 className="h-5 w-5 text-green-600" />

Line 309: text-yellow-

<AlertCircle className="h-5 w-5 text-yellow-600" />

Line 379: text-red-
```

```

Line 396: text-red-

<p className="text-sm text-red-500">{errors.email.message}</p>

Line 411: text-red-
```

```
Line 426: text-red-
```

```
Line 444: text-red-
```

```

Line 465: text-red-

<p className="text-red-500">{errors.bio.message}</p>

Line 493: text-red-
```

```
Line 514: text-red-
```

```
Line 535: text-red-
```

```
Line 556: text-red-
```

```
Line 577: text-red-
```

```

Line 596: text-blue-

className="flex items-center gap-2 text-blue-500 hover:underline"

Line 607: text-pink-

className="flex items-center gap-2 text-pink-500 hover:underline"

Line 618: text-blue-

className="flex items-center gap-2 text-blue-600 hover:underline"

Line 629: text-red-

className="flex items-center gap-2 text-red-500 hover:underline"

apps/web/src/pages/marketplace/MarketplaceHome.tsx

Total instances in file: 2

Line 212: bg-blue-

<Badge className="ml-2 bg-blue-600">{getItemCount()}</Badge>

Line 223: text-gray-

<Search className="absolute left-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-gray-400" />

162 KiB Raw Blame History

Complete List of Remaining Tailwind Default Color Instances

Usage

Migration Guidelines

Files with Tailwind Default Colors

apps/web/src/components/ErrorBoundary.tsx

apps/web/src/components/admin/AdminDashboardView.tsx

apps/web/src/components/admin/AdminModerationView.tsx

apps/web/src/components/admin/AdminSettingsView.tsx

apps/web/src/components/admin/AdminUsersView.tsx

apps/web/src/components/admin/UserTableRow.tsx

apps/web/src/components/admin/modals/BanUserModal.tsx

apps/web/src/components/analytics/TrackAnalyticsView.tsx

apps/web/src/components/commerce/CartItem.tsx

apps/web/src/components/commerce/OrderSummary.tsx

apps/web/src/components/commerce/WishlistView.tsx

apps/web/src/components/commerce/modals/PromoCodeModal.tsx

apps/web/src/components/commerce/modals/RefundRequestModal.tsx

apps/web/src/components/dashboard/StatCard.tsx

apps/web/src/components/dashboard/TrackList.tsx

apps/web/src/components/developer/APIPlaygroundView.tsx

apps/web/src/components/developer/DeveloperDashboardView.tsx

apps/web/src/components/developer/WebhooksView.tsx

apps/web/src/components/developer/modals/CreateAPIKeyModal.tsx

apps/web/src/components/education/CourseCard.tsx

apps/web/src/components/education/CourseDetailView.tsx

apps/web/src/components/education/CourseLearningView.tsx

apps/web/src/components/education/MyCoursesView.tsx

apps/web/src/components/education/modals/CertificateModal.tsx

apps/web/src/components/education/modals/QuizModal.tsx

apps/web/src/components/forms/RegisterForm.tsx

apps/web/src/components/gamification/AchievementCard.tsx

apps/web/src/components/gamification/AchievementsView.tsx

apps/web/src/components/gamification/LeaderboardView.tsx

apps/web/src/components/gamification/ProfileXPView.tsx

apps/web/src/components/gamification/XPBar.tsx

apps/web/src/components/inventory/AddEquipmentView.tsx

apps/web/src/components/inventory/EquipmentCard.tsx

apps/web/src/components/inventory/EquipmentDetailView.tsx

apps/web/src/components/inventory/InventoryView.tsx

apps/web/src/components/keyboard/KeyboardShortcutsHelp.tsx

apps/web/src/components/layout/AudioPlayer.tsx

apps/web/src/components/layout/Header.tsx

apps/web/src/components/layout/Navbar.tsx

apps/web/src/components/layout/Sidebar.tsx

apps/web/src/components/library/AutoMetadataDetectionModal.tsx

apps/web/src/components/library/WatermarkSettingsModal.tsx

apps/web/src/components/library/playlists/AddToPlaylistModal.tsx

apps/web/src/components/library/playlists/CreatePlaylistModal.tsx

apps/web/src/components/library/playlists/EditPlaylistModal.tsx

apps/web/src/components/library/playlists/PlaylistDetailView.tsx

apps/web/src/components/library/playlists/PlaylistsView.tsx

apps/web/src/components/library/playlists/QueueView.tsx

apps/web/src/components/library/playlists/SaveQueueAsPlaylistModal.tsx

apps/web/src/components/live/LiveStreamDetailView.tsx

apps/web/src/components/live/modals/TipStreamerModal.tsx

apps/web/src/components/marketplace/LicenceCard.tsx

apps/web/src/components/marketplace/ProductCard.tsx

apps/web/src/components/marketplace/ProductDetailView.tsx

apps/web/src/components/marketplace/modals/LicenceDetailsModal.tsx

apps/web/src/components/marketplace/modals/ReviewProductModal.tsx

apps/web/src/components/modals/CreatorModal.tsx

apps/web/src/components/notifications/NotificationBell.tsx

apps/web/src/components/notifications/NotificationItem.tsx

apps/web/src/components/player/LyricsPanel.tsx

apps/web/src/components/player/MiniPlayer.tsx

apps/web/src/components/player/PlaybackSpeedModal.tsx

apps/web/src/components/player/PlayerControls.tsx

apps/web/src/components/player/VisualizerSettingsModal.tsx

apps/web/src/components/search/SearchBar.tsx

apps/web/src/components/seller/CreateProductView.tsx

apps/web/src/components/seller/SellerDashboardView.tsx

apps/web/src/components/seller/modals/FlashSaleModal.tsx

apps/web/src/components/settings/accessibility/AccessibilitySettingsView.tsx

apps/web/src/components/settings/account/AccountSettings.tsx

apps/web/src/components/settings/account/ChangeEmailModal.tsx

apps/web/src/components/settings/account/ChangeUsernameModal.tsx

apps/web/src/components/settings/account/DeleteAccountConfirmModal.tsx

apps/web/src/components/settings/account/DeleteAccountView.tsx

apps/web/src/components/settings/appearance/AppearanceSettingsView.tsx

162 KiB

Raw Blame History