fix: properly display preselected drives in individual storage slots

Major fixes for instant customization storage:
1. Preselected drives now show correctly in individual slots
2. Pricing handled correctly - preselected drives cost €0 (included)
3. Storage summary shows proper counts (4x Crucial T705 4TB + 2x Kioxia CM7-V 3.2TB)
4. When changing drives, only charge the difference from original
5. Individual slot rendering now uses preselected values from WHMCS URL

The €1520 server will now correctly show:
- NVMe 1: Crucial T705 4TB (preselected)
- NVMe 2: Crucial T705 4TB (preselected)
- NVMe 3: Crucial T705 4TB (preselected)
- NVMe 4: Crucial T705 4TB (preselected)
- NVMe 5: Kioxia CM7-V 3.2TB (preselected)
- NVMe 6: Kioxia CM7-V 3.2TB (preselected)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

Documents/Vibe Coding Projects/dedicatednodes-redesign/dedicatednodes-bare-metal/new-baremetal.html

@@ -5018,8 +5018,15 @@ var wpcf7 = {
 
                 if (isActive) {
                     card.classList.add('active');
+
+                    // For instant customization storage, preselected drives should have 0 cost
+                    if (isInstant && opt.type === 'storage' && isPreselected) {
+                        configState[opt.label] = 0; // Included in base price
+                    } else {
                         // Set initial state - use the relative price (already converted from absolute)
                         configState[opt.label] = val.price;
+                    }
+
                     configIds[opt.id] = val.id;
 
                     // Update Summary Texts & Tech Specs
@@ -5057,7 +5064,37 @@ var wpcf7 = {
                     grid.querySelectorAll('.config-card').forEach(c => c.classList.remove('active'));
                     card.classList.add('active');
 
+                    // For instant customization storage, handle price differences
+                    if (isInstant && opt.type === 'storage') {
+                        // Find the original drive for this slot
+                        const originalDrive = window.originalDrives ?
+                            window.originalDrives.find(d => d.slotId === opt.id) : null;
+
+                        if (originalDrive && originalDrive.driveId !== val.id) {
+                            // User is changing from original drive, charge the difference
+                            configState[opt.label] = val.price - originalDrive.price;
+                        } else if (originalDrive && originalDrive.driveId === val.id) {
+                            // User is reverting to original drive, no charge
+                            configState[opt.label] = 0;
+                        } else {
+                            // No original drive found, charge full price
                             configState[opt.label] = val.price;
+                        }
+
+                        // Update original drives tracking
+                        if (window.originalDrives) {
+                            const drive = window.originalDrives.find(d => d.slotId === opt.id);
+                            if (drive) {
+                                drive.driveId = val.id;
+                                drive.text = val.text;
+                                drive.price = val.price;
+                            }
+                        }
+                    } else {
+                        // Non-instant or non-storage, use full price
+                        configState[opt.label] = val.price;
+                    }
+
                     configIds[opt.id] = val.id;
                     
                     if (opt.type === 'ram') {
@@ -5073,7 +5110,38 @@ var wpcf7 = {
                     }
                     
                     if (opt.type === 'storage') {
+                        // For instant customization, build storage summary differently
+                        if (isInstant) {
+                            // Collect all selected drives from individual slots
+                            const allStorageOptions = document.querySelectorAll('.config-card.active');
+                            const storageCount = {};
+                            let storageSummary = [];
+
+                            allStorageOptions.forEach(card => {
+                                const name = card.querySelector('.option-name').textContent;
+                                const price = card.querySelector('.option-price').textContent;
+
+                                // Count each drive type
+                                if (!name.toLowerCase().includes('none')) {
+                                    storageCount[name] = (storageCount[name] || 0) + 1;
+                                }
+                            });
+
+                            // Build summary text with counts
+                            Object.entries(storageCount).forEach(([name, count]) => {
+                                storageSummary.push(`${count}x ${name}`);
+                            });
+
+                            const storageText = storageSummary.length > 0 ? storageSummary.join(' + ') : 'None';
+                            document.getElementById('summaryStorage').textContent = storageText;
+
+                            // Update Tech Specs
+                            const specStorage = document.getElementById('spec-storage-config-hero');
+                            if(specStorage) specStorage.innerText = storageText;
+                        } else {
+                            // Custom server storage handling (original logic)
                             storageSelection[opt.id] = { name: displayName, price: val.price };
+
                             // Recalculate total storage price
                             let totalStoragePrice = 0;
                             let storageNames = [];
@@ -5093,6 +5161,7 @@ var wpcf7 = {
                             const specStorage = document.getElementById('spec-storage-config-hero');
                             if(specStorage) specStorage.innerText = storageText;
                         }
+                    }
                     
                     updateSummary();
                 });