fix: Change dark theme icon border to #5e5e5e medium gray

- Changed from transparent to #5e5e5e (rgb(94,94,94))
- Visible but subtle medium gray border in dark theme
- Updated test to verify new border color
- Note: CSS filter on LIV Golf only affects image pixels, not border

static/css/01-foundation/_themes.css

@@ -86,7 +86,7 @@
   /* Borders & Dividers */
   --border-color: #404040;
   --border-light: #333333;
-  --icon-border: transparent; /* Invisible border for icons in dark theme */
+  --icon-border: #5e5e5e; /* Medium gray border for icons in dark theme */
   --item-separator: rgba(255, 255, 255, 0.05); /* Very subtle separator in dark theme */
 
   /* Shadows */
@@ -137,7 +137,7 @@
     /* Borders & Dividers */
     --border-color: #404040;
     --border-light: #333333;
-    --icon-border: transparent; /* Invisible border for icons in dark theme */
+    --icon-border: #5e5e5e; /* Medium gray border for icons in dark theme */
     --item-separator: rgba(255, 255, 255, 0.05); /* Very subtle separator in dark theme */
 
     /* Shadows */

tests/mjs/23-dark-theme-borders.test.mjs

@@ -76,23 +76,17 @@ async function testDarkThemeBorders() {
 
     console.log(`   Border color: ${darkBorders.borderColor}`);
 
-    // Check if transparent or rgba with 0 alpha
+    // Check for expected #5e5e5e = rgb(94, 94, 94)
-    const isTransparent = darkBorders.borderColor.includes('rgba(0, 0, 0, 0)') ||
+    const isExpectedGray = darkBorders.borderColor.includes('rgb(94, 94, 94)') ||
-                          darkBorders.borderColor === 'transparent';
+                           darkBorders.borderColor.includes('#5e5e5e');
 
-    if (isTransparent) {
+    if (isExpectedGray) {
-      console.log('   ✅ Borders completely transparent (invisible) in dark theme');
+      console.log('   ✅ Borders are medium gray (#5e5e5e) in dark theme');
     } else {
-      // Check if it's a very dark color
+      console.log('   ❌ Border color unexpected!');
-      const darkRgb = darkBorders.borderColor.match(/\d+/g);
+      console.log(`   Expected: rgb(94, 94, 94) or #5e5e5e, Got: ${darkBorders.borderColor}`);
-      if (darkRgb && darkRgb.every(v => parseInt(v) < 50)) {
+      await browser.close();
-        console.log('   ✅ Borders very dark in dark theme');
+      process.exit(1);
-      } else {
-        console.log('   ❌ Borders still too visible in dark theme!');
-        console.log(`   Expected: transparent or very dark, Got: ${darkBorders.borderColor}`);
-        await browser.close();
-        process.exit(1);
-      }
     }
 
     // Test 3: LIV Golf logo inversion