refactor: remove category colors from units app

components/units/MainConverter.tsx

@@ -21,8 +21,6 @@ import {
   convertToAll,
   convertUnit,
   formatMeasureName,
-  getCategoryColor,
-  getCategoryColorHex,
   type Measure,
   type ConversionResult,
 } from '@/lib/units/units';
@@ -131,12 +129,7 @@ export default function MainConverter() {
               value={selectedMeasure}
               onValueChange={(value) => setSelectedMeasure(value as Measure)}
             >
-              <SelectTrigger
-                className="w-full"
-                style={{
-                  borderLeft: `4px solid ${getCategoryColorHex(selectedMeasure)}`,
-                }}
-              >
+              <SelectTrigger className="w-full">
                 <SelectValue placeholder="Measure" />
               </SelectTrigger>
               <SelectContent>
@@ -223,13 +216,9 @@ export default function MainConverter() {
 
           {/* Quick result */}
           {parseNumberInput(inputValue) !== null && (
-            <div className="p-4 rounded-lg bg-accent/50 border-l-4" style={{
-              borderLeftColor: getCategoryColorHex(selectedMeasure),
-            }}>
+            <div className="p-4 rounded-lg bg-accent/50 border-l-4 border-primary">
               <div className="text-sm text-muted-foreground">Result</div>
-              <div className="text-3xl font-bold mt-1" style={{
-                color: getCategoryColorHex(selectedMeasure),
-              }}>
+              <div className="text-3xl font-bold mt-1 text-primary">
                 {formatNumber(convertUnit(parseNumberInput(inputValue)!, selectedUnit, targetUnit))} {targetUnit}
               </div>
             </div>
@@ -256,7 +245,6 @@ export default function MainConverter() {
           {showVisualComparison ? (
             <VisualComparison
               conversions={conversions}
-              color={getCategoryColorHex(selectedMeasure)}
               onValueChange={handleValueChange}
             />
           ) : (
@@ -268,11 +256,7 @@ export default function MainConverter() {
               return (
                 <div
                   key={conversion.unit}
-                  className="group relative p-4 rounded-lg border bg-card hover:bg-accent/50 transition-colors"
-                  style={{
-                    borderLeftWidth: '4px',
-                    borderLeftColor: getCategoryColorHex(selectedMeasure),
-                  }}
+                  className="group relative p-4 rounded-lg border bg-card hover:bg-accent/50 transition-colors border-l-4 border-l-primary/30"
                 >
                   {/* Favorite & Copy buttons */}
                   <div className="absolute top-2 right-2 flex gap-1 opacity-0 group-hover:opacity-100 transition-opacity">