From 9c9322f05e947c5c618ca7537c701eef0505898f Mon Sep 17 00:00:00 2001
From: DamsFX <contact@hounddd.fr>
Date: Wed, 30 Sep 2026 19:24:36 +0200
Subject: [PATCH 1/2] fix(cli): add dark mode styles to body for error
 templates

---
 cli/templates/404.html | 5 +++++
 cli/templates/500.html | 5 +++++
 2 files changed, 10 insertions(+)

diff --git a/cli/templates/404.html b/cli/templates/404.html
index b4d09c002..e7ce36649 100644
--- a/cli/templates/404.html
+++ b/cli/templates/404.html
@@ -8,6 +8,11 @@
 				color: #000;
 				font-family: monospace;
 				text-align: center;
+
+				@media (prefers-color-scheme: dark) {
+						color: #fff;
+						background-color: #2e2e2e;
+				}
 			}
 			.container {
 				display: flex;
diff --git a/cli/templates/500.html b/cli/templates/500.html
index c02c63d83..96ca9a38d 100644
--- a/cli/templates/500.html
+++ b/cli/templates/500.html
@@ -9,6 +9,11 @@
 				color: #000;
 				font-family: monospace;
 				text-align: center;
+
+				@media (prefers-color-scheme: dark) {
+						color: #fff;
+						background-color: #2e2e2e;
+				}
 			}
 			.container {
 				display: flex;

From 0330394624e871c4473c10a321719920ae28ca02 Mon Sep 17 00:00:00 2001
From: DamsFX <contact@hounddd.fr>
Date: Wed, 30 Sep 2026 19:35:42 +0200
Subject: [PATCH 2/2] fix(cli): use css variables for colors

---
 cli/templates/404.html | 21 ++++++++++++++-------
 cli/templates/500.html | 29 +++++++++++++++++------------
 2 files changed, 31 insertions(+), 19 deletions(-)

diff --git a/cli/templates/404.html b/cli/templates/404.html
index e7ce36649..2c1819774 100644
--- a/cli/templates/404.html
+++ b/cli/templates/404.html
@@ -3,16 +3,23 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
 		<title>Valet - Not Found</title>
 		<style>
+			:root {
+				--color-default-dark: #2e2e2e;
+
+				--background-color: #fff;
+				--text-color: #000;
+
+				@media (prefers-color-scheme: dark) {
+					--background-color: var(--color-default-dark);
+					--text-color: #fff;
+				}
+			}
 			body {
 				margin: 0;
-				color: #000;
+				color: var(--text-color);
+				background-color: var(--background-color);
 				font-family: monospace;
 				text-align: center;
-
-				@media (prefers-color-scheme: dark) {
-						color: #fff;
-						background-color: #2e2e2e;
-				}
 			}
 			.container {
 				display: flex;
@@ -32,7 +39,7 @@
 				min-width: 200px;
 
 				.valet {
-					fill: #2e2e2e;
+					fill: var(--color-default-dark);
 					fill-rule: evenodd;
 
 					@media (prefers-color-scheme: dark) {
diff --git a/cli/templates/500.html b/cli/templates/500.html
index 96ca9a38d..86d02f5e3 100644
--- a/cli/templates/500.html
+++ b/cli/templates/500.html
@@ -4,16 +4,25 @@
 		<title>Valet - Internal Server Error</title>
 
 		<style>
+			:root {
+				--color-default-dark: #2e2e2e;
+				--color-accent: #4b40c8;
+
+				--background-color: #fff;
+				--text-color: #000;
+
+				@media (prefers-color-scheme: dark) {
+					--color-accent: #bd74e6;
+					--background-color: var(--color-default-dark);
+					--text-color: #fff;
+				}
+			}
 			body {
 				margin: 0;
-				color: #000;
+				color: var(--text-color);
+				background-color: var(--background-color);
 				font-family: monospace;
 				text-align: center;
-
-				@media (prefers-color-scheme: dark) {
-						color: #fff;
-						background-color: #2e2e2e;
-				}
 			}
 			.container {
 				display: flex;
@@ -32,7 +41,7 @@
 				min-width: 200px;
 
 				.valet {
-					fill: #2e2e2e;
+					fill: var(--color-default-dark);
 					fill-rule: evenodd;
 
 					@media (prefers-color-scheme: dark) {
@@ -61,11 +70,7 @@
 				word-wrap: break-word;
 
 				em {
-					color: #4b40c8;
-
-					@media (prefers-color-scheme: dark) {
-						color: #bd74e6;
-					}
+					color: var(--color-accent);
 
 					&.command {
 						white-space: nowrap;