Add Bambu Lab predefined colors and finishes

- Parse Bambu Lab PDF to extract all official colors and finishes
- Add 77 predefined Bambu Lab colors with accurate hex codes
- Update finish dropdown to show only Bambu Lab finishes
- Make color selection dynamic based on brand and finish
- Show Bambu Lab colors only when BambuLab brand is selected
- Auto-fill hex codes for Bambu Lab colors
- Allow custom colors for other brands
- Add database migrations for finish types and colors
- Import all Bambu Lab colors to database

app/upadaj/dashboard/page.tsx

@@ -4,6 +4,7 @@ import { useState, useEffect } from 'react';
 import { useRouter } from 'next/navigation';
 import { filamentService, colorService } from '@/src/services/api';
 import { Filament } from '@/src/types/filament';
+import { bambuLabColors, colorsByFinish, getColorHex } from '@/src/data/bambuLabColorsComplete';
 import '@/src/styles/select.css';
 
 interface FilamentWithId extends Filament {
@@ -460,9 +461,11 @@ function FilamentForm({
             <option value="Basic">Basic</option>
             <option value="Matte">Matte</option>
             <option value="Silk">Silk</option>
+            <option value="Metal">Metal</option>
+            <option value="Sparkle">Sparkle</option>
             <option value="Glow">Glow</option>
-            <option value="Wood">Wood</option>
-            <option value="CF">CF</option>
+            <option value="Transparent">Transparent</option>
+            <option value="Support">Support</option>
           </select>
         </div>
 
@@ -472,22 +475,53 @@ function FilamentForm({
             name="boja"
             value={formData.boja}
             onChange={(e) => {
-              const selectedColor = availableColors.find(c => c.name === e.target.value);
+              const selectedColorName = e.target.value;
+              let hexValue = formData.bojaHex;
+              
+              // Only use Bambu Lab colors if BambuLab brand is selected
+              if (formData.brand === 'BambuLab') {
+                const bambuHex = getColorHex(selectedColorName);
+                if (bambuHex !== "#000000") {
+                  hexValue = bambuHex;
+                }
+              }
+              
+              // Check available colors from database
+              const dbColor = availableColors.find(c => c.name === selectedColorName);
+              if (dbColor && hexValue === formData.bojaHex) {
+                hexValue = dbColor.hex;
+              }
+              
               setFormData({
                 ...formData,
-                boja: e.target.value,
-                bojaHex: selectedColor?.hex || formData.bojaHex
+                boja: selectedColorName,
+                bojaHex: hexValue
               });
             }}
             required
             className="custom-select w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 focus:outline-none focus:ring-2 focus:ring-blue-500"
           >
             <option value="">Izaberite boju</option>
-            {availableColors.map(color => (
-              <option key={color.id} value={color.name}>
-                {color.name}
-              </option>
-            ))}
+            {/* Show Bambu Lab colors only when BambuLab brand is selected */}
+            {formData.brand === 'BambuLab' && formData.finish && colorsByFinish[formData.finish as keyof typeof colorsByFinish] && (
+              <optgroup label={`Bambu Lab ${formData.finish} boje`}>
+                {colorsByFinish[formData.finish as keyof typeof colorsByFinish].map(colorName => (
+                  <option key={`bambu-${colorName}`} value={colorName}>
+                    {colorName}
+                  </option>
+                ))}
+              </optgroup>
+            )}
+            {/* Show all available colors from database */}
+            {availableColors.length > 0 && (
+              <optgroup label={formData.brand === 'BambuLab' ? 'Ostale boje' : 'Dostupne boje'}>
+                {availableColors.map(color => (
+                  <option key={color.id} value={color.name}>
+                    {color.name}
+                  </option>
+                ))}
+              </optgroup>
+            )}
             <option value="custom">Druga boja...</option>
           </select>
         </div>
@@ -502,7 +536,7 @@ function FilamentForm({
               name="bojaHex"
               value={formData.bojaHex || '#000000'}
               onChange={handleChange}
-              disabled={!!(formData.boja && formData.boja !== 'custom' && availableColors.some(c => c.name === formData.boja))}
+              disabled={!!(formData.brand === 'BambuLab' && formData.boja && formData.boja !== 'custom' && getColorHex(formData.boja) !== "#000000")}
               className="w-full h-10 px-1 py-1 border border-gray-300 dark:border-gray-600 rounded-md bg-white dark:bg-gray-700 cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed"
             />
             {formData.bojaHex && (