From 0662b0a37b5c5711bf12a3cb605f699eade8fc2d Mon Sep 17 00:00:00 2001
From: Antoine M <martinon.toinou@protonmail.com>
Date: Thu, 3 Jul 2025 17:07:30 +0200
Subject: [PATCH] FEATURE Introducing the forms styles

---
 resources/css/forms/forms.css | 52 +++++++++++++++++++++++++++++++++++
 1 file changed, 52 insertions(+)
 create mode 100644 resources/css/forms/forms.css

diff --git a/resources/css/forms/forms.css b/resources/css/forms/forms.css
new file mode 100644
index 0000000..d1790ea
--- /dev/null
+++ b/resources/css/forms/forms.css
@@ -0,0 +1,52 @@
+:root {
+  --form-text-color: var(--wp--preset--color--carhop-green);
+  --form-border-color: var(--wp--preset--color--carhop-green);
+}
+
+select,
+input,
+textarea {
+  @apply bg-transparent border border-primary p-4;
+  border-color: var(--form-border-color, #f1fcf9);
+  &::placeholder {
+    color: var(--form-text-color);
+    @apply text-lg font-light;
+    opacity: 0.8;
+  }
+}
+
+.nf-field-element:has(input[aria-required='true']) {
+  @apply relative;
+  &:after {
+    @apply content-['*'] absolute top-3 right-3 text-red-800 text-2xl;
+    line-height: 1;
+  }
+}
+
+input[type='submit'] {
+  @apply text-white  w-12 h-12 relative block !mx-auto;
+
+  &:hover {
+    @apply bg-carhop-green-900 border border-carhop-green-900 cursor-pointer;
+  }
+}
+
+.content-box {
+  --form-border-color: var(--content-box-text-color);
+  --form-text-color: var(--content-box-text-color);
+}
+
+label {
+  @apply sr-only;
+}
+
+.nf-form-fields-required {
+}
+
+.nf-before-form-content {
+  .nf-form-fields-required {
+    @apply text-lg pb-12;
+    color: var(--form-text-color);
+    opacity: 0.9;
+  }
+}