From 100d1de04cc898cb2e63c72f4d1e6b67ed89faa7 Mon Sep 17 00:00:00 2001
From: Markus Unterwaditzer <markus-tarpit+git@unterwaditzer.net>
Date: Fri, 24 Apr 2026 01:56:30 +0200
Subject: [PATCH] Remove some global reset styles in favor of explicit border
 colors, restore button cursors

---
 daemon/web/src/app.css                        | 14 ++++------
 .../web/src/lib/components/ConfigForm.svelte  | 26 +++++++++----------
 .../src/lib/components/ManifestCard.svelte    |  2 +-
 .../lib/components/ManifestTableRow.svelte    |  4 +--
 .../lib/components/SystemStatsTable.svelte    | 12 ++++-----
 5 files changed, 27 insertions(+), 31 deletions(-)

diff --git a/daemon/web/src/app.css b/daemon/web/src/app.css
index 803cb3f..e3d466c 100644
--- a/daemon/web/src/app.css
+++ b/daemon/web/src/app.css
@@ -6,15 +6,11 @@
     --color-rayhunter-green: #94ea18;
 }
 
-/* Preserve Tailwind v3's default border / divide color (gray-200) so the
- * v4 upgrade does not visually change every bare `border` / `divide-x` in
- * the codebase. Without this, those utilities use `currentColor` in v4. */
+/* v4 dropped the v3 preflight rule that set `cursor: pointer` on buttons.
+ * Restore it so enabled buttons get the pointer cursor. */
 @layer base {
-    *,
-    ::after,
-    ::before,
-    ::backdrop,
-    ::file-selector-button {
-        border-color: var(--color-gray-200, currentColor);
+    button:not(:disabled),
+    [role='button']:not(:disabled) {
+        cursor: pointer;
     }
 }
diff --git a/daemon/web/src/lib/components/ConfigForm.svelte b/daemon/web/src/lib/components/ConfigForm.svelte
index dc23090..1facbc1 100644
--- a/daemon/web/src/lib/components/ConfigForm.svelte
+++ b/daemon/web/src/lib/components/ConfigForm.svelte
@@ -210,7 +210,7 @@
                     </div>
                 </div>
 
-                <div class="border-t pt-4 mt-6 space-y-3">
+                <div class="border-t border-gray-200 pt-4 mt-6 space-y-3">
                     <h3 class="text-lg font-semibold text-gray-800 mb-4">Notification Settings</h3>
                     <div>
                         <label for="ntfy_url" class="block text-sm font-medium text-gray-700 mb-1">
@@ -303,7 +303,7 @@
                     </div>
                 </div>
 
-                <div class="border-t pt-4 mt-6 space-y-3">
+                <div class="border-t border-gray-200 pt-4 mt-6 space-y-3">
                     <h3 class="text-lg font-semibold text-gray-800 mb-4">Storage Management</h3>
 
                     <div>
@@ -346,7 +346,7 @@
                 </div>
 
                 {#if config.device === 'orbic' || config.device === 'moxee' || config.device === 'tmobile' || config.device === 'wingtech'}
-                    <div class="border-t pt-4 mt-6 space-y-3">
+                    <div class="border-t border-gray-200 pt-4 mt-6 space-y-3">
                         <h3 class="text-lg font-semibold text-gray-800 mb-4">WiFi Client Mode</h3>
                         <p class="text-xs text-gray-500">
                             Connect the device to an existing WiFi network for internet access (e.g.
@@ -359,7 +359,7 @@
                                 id="wifi_enabled"
                                 type="checkbox"
                                 bind:checked={config.wifi_enabled}
-                                class="h-4 w-4 text-rayhunter-blue focus:ring-rayhunter-blue border-gray-300 rounded"
+                                class="h-4 w-4 text-rayhunter-blue focus:ring-rayhunter-blue border-gray-300 rounded-sm"
                             />
                             <label for="wifi_enabled" class="ml-2 block text-sm text-gray-700">
                                 Enable WiFi
@@ -402,7 +402,7 @@
                                     type="text"
                                     bind:value={config.wifi_ssid}
                                     placeholder="MyWiFiNetwork"
-                                    class="flex-1 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-rayhunter-blue"
+                                    class="flex-1 px-3 py-2 border border-gray-300 rounded-md focus:outline-hidden focus:ring-2 focus:ring-rayhunter-blue"
                                 />
                                 <button
                                     type="button"
@@ -421,7 +421,7 @@
 
                         {#if scanResults.length > 0}
                             <div
-                                class="border border-gray-200 rounded-md max-h-40 overflow-y-auto divide-y"
+                                class="border border-gray-200 rounded-md max-h-40 overflow-y-auto divide-y divide-gray-200"
                             >
                                 {#each scanResults as network}
                                     <button
@@ -449,7 +449,7 @@
                                 <select
                                     id="wifi_security"
                                     bind:value={config.wifi_security}
-                                    class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-rayhunter-blue"
+                                    class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-hidden focus:ring-2 focus:ring-rayhunter-blue"
                                 >
                                     <option value="wpa_psk">WPA2 (WPA-PSK)</option>
                                     <option value="sae">WPA3 (SAE)</option>
@@ -469,7 +469,7 @@
                                 type="password"
                                 bind:value={config.wifi_password}
                                 placeholder="Enter password"
-                                class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-rayhunter-blue"
+                                class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-hidden focus:ring-2 focus:ring-rayhunter-blue"
                             />
                             <p class="text-xs text-gray-500 mt-1">
                                 Changing the network requires re-entering the password.
@@ -489,7 +489,7 @@
                                     type="text"
                                     bind:value={dnsServersInput}
                                     placeholder="9.9.9.9, 149.112.112.112"
-                                    class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-rayhunter-blue"
+                                    class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-hidden focus:ring-2 focus:ring-rayhunter-blue"
                                 />
                                 <p class="text-xs text-gray-500 mt-1">
                                     Comma-separated. Used when WiFi is active. Defaults to 9.9.9.9,
@@ -500,7 +500,7 @@
                     </div>
                 {/if}
 
-                <div class="border-t pt-4 mt-6 space-y-3">
+                <div class="border-t border-gray-200 pt-4 mt-6 space-y-3">
                     <h3 class="text-lg font-semibold text-gray-800 mb-4">Device Security</h3>
 
                     <div class="flex items-center">
@@ -508,7 +508,7 @@
                             id="firewall_restrict_outbound"
                             type="checkbox"
                             bind:checked={config.firewall_restrict_outbound}
-                            class="h-4 w-4 text-rayhunter-blue focus:ring-rayhunter-blue border-gray-300 rounded"
+                            class="h-4 w-4 text-rayhunter-blue focus:ring-rayhunter-blue border-gray-300 rounded-sm"
                         />
                         <label
                             for="firewall_restrict_outbound"
@@ -548,7 +548,7 @@
                                             : null;
                                 }}
                                 placeholder="22, 80"
-                                class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-rayhunter-blue"
+                                class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-hidden focus:ring-2 focus:ring-rayhunter-blue"
                             />
                             <p class="text-xs text-gray-500 mt-1">
                                 Comma-separated TCP ports, e.g. 22, 80
@@ -557,7 +557,7 @@
                     {/if}
                 </div>
 
-                <div class="border-t pt-4 mt-6">
+                <div class="border-t border-gray-200 pt-4 mt-6">
                     <h3 class="text-lg font-semibold text-gray-800 mb-4">
                         Analyzer Heuristic Settings
                     </h3>
diff --git a/daemon/web/src/lib/components/ManifestCard.svelte b/daemon/web/src/lib/components/ManifestCard.svelte
index 35a1ba4..1b5d084 100644
--- a/daemon/web/src/lib/components/ManifestCard.svelte
+++ b/daemon/web/src/lib/components/ManifestCard.svelte
@@ -100,7 +100,7 @@
             />
         {/if}
     </div>
-    <div class="border-b {analysis_visible ? '' : 'hidden'}">
+    <div class="border-b border-gray-200 {analysis_visible ? '' : 'hidden'}">
         <AnalysisView {entry} {manager} {current} />
     </div>
 </div>
diff --git a/daemon/web/src/lib/components/ManifestTableRow.svelte b/daemon/web/src/lib/components/ManifestTableRow.svelte
index 8976111..eab9639 100644
--- a/daemon/web/src/lib/components/ManifestTableRow.svelte
+++ b/daemon/web/src/lib/components/ManifestTableRow.svelte
@@ -65,8 +65,8 @@
         </td>
     {/if}
 </tr>
-<tr class="{alternating_row_color} border-b {analysis_visible ? '' : 'hidden'}">
-    <td class="border-t border-dashed p-2" colspan="9">
+<tr class="{alternating_row_color} border-b border-gray-200 {analysis_visible ? '' : 'hidden'}">
+    <td class="border-t border-gray-200 border-dashed p-2" colspan="9">
         <AnalysisView {entry} {manager} {current} />
     </td>
 </tr>
diff --git a/daemon/web/src/lib/components/SystemStatsTable.svelte b/daemon/web/src/lib/components/SystemStatsTable.svelte
index f655857..9a634a2 100644
--- a/daemon/web/src/lib/components/SystemStatsTable.svelte
+++ b/daemon/web/src/lib/components/SystemStatsTable.svelte
@@ -6,7 +6,7 @@
         stats: SystemStats;
     } = $props();
 
-    const table_cell_classes = 'border p-1 lg:p-2';
+    const table_cell_classes = 'border border-gray-200 p-1 lg:p-2';
 
     let battery_level = $derived(stats.battery_status ? stats.battery_status.level : 0);
     let bar_color = $derived.by(() => {
@@ -39,26 +39,26 @@
     class="flex-1 drop-shadow-sm p-4 flex flex-col gap-2 border rounded-md bg-gray-100 border-gray-100"
 >
     <p class="text-xl mb-2">System Information</p>
-    <table class="table-auto border">
+    <table class="table-auto border border-gray-200">
         <tbody>
-            <tr class="border">
+            <tr class="border border-gray-200">
                 <th class={table_cell_classes}> Rayhunter Version </th>
                 <td class={table_cell_classes}>{stats.runtime_metadata.rayhunter_version}</td>
             </tr>
-            <tr class="border">
+            <tr class="border border-gray-200">
                 <th class={table_cell_classes}> Storage </th>
                 <td class={table_cell_classes}>
                     {stats.disk_stats.used_percent} used ({stats.disk_stats.used_size} used / {stats
                         .disk_stats.available_size} available)
                 </td>
             </tr>
-            <tr class="border-b">
+            <tr class="border-b border-gray-200">
                 <th class={table_cell_classes}> Memory (RAM) </th>
                 <td class={table_cell_classes}>
                     Free: {stats.memory_stats.free}, Used: {stats.memory_stats.used}
                 </td>
             </tr>
-            <tr class="border-b">
+            <tr class="border-b border-gray-200">
                 <th class={table_cell_classes}> Battery </th>
                 <td class={table_cell_classes}>
                     <svg