From 1c02394a0d1d8fbb74dce600a3cf13466086b6cd Mon Sep 17 00:00:00 2001
From: Minecon724 <minecon724@noreply.git.m724.eu>
Date: Thu, 5 Jun 2025 09:34:14 +0200
Subject: [PATCH 1/2] Make the captcha bigger

---
 web_src/css/form.css | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/web_src/css/form.css b/web_src/css/form.css
index 3a53b6d8f2..bc0aafc893 100644
--- a/web_src/css/form.css
+++ b/web_src/css/form.css
@@ -626,3 +626,7 @@ input:-webkit-autofill:active,
     width: 100% !important;
   }
 }
+
+.captcha-img {
+  width: min(30em, 100%);
+}
\ No newline at end of file

From 8c51098959370ffce1ae2a8b1f99a8ceff36e7d6 Mon Sep 17 00:00:00 2001
From: Minecon724 <minecon724@noreply.git.m724.eu>
Date: Thu, 5 Jun 2025 09:34:31 +0200
Subject: [PATCH 2/2] Make the captcha look

---
 templates/user/auth/captcha.tmpl |  2 +-
 web_src/css/markup/dark.css      | 10 ++++++++++
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/templates/user/auth/captcha.tmpl b/templates/user/auth/captcha.tmpl
index b2deb5a2c9..906786e4c8 100644
--- a/templates/user/auth/captcha.tmpl
+++ b/templates/user/auth/captcha.tmpl
@@ -1,7 +1,7 @@
 {{if .EnableCaptcha}}{{if eq .CaptchaType "image"}}
 	<div class="inline field tw-text-center">
 		<input type="hidden" name="img-captcha-id" value="{{.Captcha}}">
-		<img style="transform: scaleX(-1);background-color: white" onclick="this.src=`{{AppSubUrl}}/captcha/{{.Captcha}}.png?reload=${Date.now()}`" class="captcha-img" src="{{AppSubUrl}}/captcha/{{.Captcha}}.png" alt="{{ctx.Locale.Tr "captcha"}}">
+		<img style="transform: scaleX(-1);" onclick="this.src=`{{AppSubUrl}}/captcha/{{.Captcha}}.png?reload=${Date.now()}`" class="captcha-img" src="{{AppSubUrl}}/captcha/{{.Captcha}}.png" alt="{{ctx.Locale.Tr "captcha"}}">
 	</div>
 	<div class="required field {{if .Err_Captcha}}error{{end}}">
 		<label for="captcha">{{ctx.Locale.Tr "captcha"}}</label>
diff --git a/web_src/css/markup/dark.css b/web_src/css/markup/dark.css
index 700a48518e..e17f9fba67 100644
--- a/web_src/css/markup/dark.css
+++ b/web_src/css/markup/dark.css
@@ -11,3 +11,13 @@
 .markup [href$="#dark-mode-only"] {
   display: unset;
 }
+
+/*
+  The reason we're doing this here, is because dark templates always use this file, and there's no other way to detect dark theme.
+  Third party templates may not, but this isn't that big, since you can't change the theme logged out.
+*/
+
+.captcha-img {
+  filter: invert();
+  /* optionally contrast filter? */
+}
\ No newline at end of file