From a00bc2f70df6a9c58f5d26f2ca2359f0aa981bae Mon Sep 17 00:00:00 2001
From: Kim Coleman <kim@strangerstudios.com>
Date: Tue, 6 Aug 2024 13:58:16 -0400
Subject: [PATCH] Better select dropdown field arrow; fixes for dark background
 themes

---
 css/frontend/variation_1.css             | 15 +++++++++++++--
 css/frontend/variation_high_contrast.css | 11 +++++++++++
 2 files changed, 24 insertions(+), 2 deletions(-)

diff --git a/css/frontend/variation_1.css b/css/frontend/variation_1.css
index bb731a1ec5..0ef96cd2cf 100644
--- a/css/frontend/variation_1.css
+++ b/css/frontend/variation_1.css
@@ -276,7 +276,7 @@
 	}
 
 	.pmpro_form_input {
-		background-color: var(--pmpro--color--white);
+		background-color: var(--pmpro--color--base);
 		border: 1px solid var(--pmpro--color--border);
 		border-radius: var(--pmpro--base--border-radius);
 		box-shadow: none;
@@ -296,6 +296,17 @@
 		width: 100%;
 	}
 
+	.pmpro_form_input-select {
+		-webkit-appearance: none;
+		-moz-appearance: none;
+		appearance: none;
+		background-image: url('data:image/svg+xml;utf8,<svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>');
+		background-position: right var(--pmpro--base--spacing--small) center;
+		background-repeat: no-repeat;
+		background-size: 16px 16px;
+		padding-right: calc(var(--pmpro--base--spacing--small) + 20px);
+	}
+
 	.pmpro_form_input-text:focus,
 	.pmpro_form_input-email:focus,
 	.pmpro_form_input-url:focus,
@@ -309,7 +320,7 @@
 	.pmpro_form_input-file:focus,
 	.pmpro_form_input-date:focus,
 	.pmpro_form_input-textarea:focus {
-		background-color: var(--pmpro--color--white);
+		background-color: var(--pmpro--color--base);
 		border-color: #80BDFF;
 		box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
 		outline: none;
diff --git a/css/frontend/variation_high_contrast.css b/css/frontend/variation_high_contrast.css
index 2d23333899..a137d3f341 100644
--- a/css/frontend/variation_high_contrast.css
+++ b/css/frontend/variation_high_contrast.css
@@ -292,6 +292,17 @@
 		width: 100%;
 	}
 
+	.pmpro_form_input-select {
+		-webkit-appearance: none;
+		-moz-appearance: none;
+		appearance: none;
+		background-image: url('data:image/svg+xml;utf8,<svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>');
+		background-position: right var(--pmpro--base--spacing--small) center;
+		background-repeat: no-repeat;
+		background-size: 16px 16px;
+		padding-right: calc(var(--pmpro--base--spacing--small) + 20px);
+	}
+
 	.pmpro_form_input-text:focus,
 	.pmpro_form_input-email:focus,
 	.pmpro_form_input-url:focus,