Create input style

frontend/assets/css/input.comp.css

@@ -0,0 +1,47 @@
+@utility input-outlined-error {
+    @apply text-danger-600 border-danger-600;
+    svg[class~=iconify] path {
+        @apply stroke-danger-600;
+    }
+}
+
+@utility input-solid-error {
+    @apply input-outlined-error bg-danger-50;
+}
+
+@utility input-outlined-disabled {
+    @apply text-slate-300 border-slate-200;
+    svg[class~=iconify] path {
+        @apply stroke-slate-300;
+    }
+}
+
+@utility input-solid-disabled {
+    @apply input-outlined-disabled bg-slate-50;
+}
+
+@utility input-effects {
+    &:hover {
+        @apply border-black;
+    }
+
+    &:focus-within {
+        @apply border-black text-black;
+
+        svg[class~=iconify] path {
+            @apply stroke-black;
+        }
+    }
+}
+
+@utility input-outlined {
+    @apply text-slate-500 border-slate-200;
+
+    svg[class~=iconify] path {
+        @apply stroke-slate-500;
+    }
+}
+
+@utility input-solid {
+    @apply bg-slate-50 input-outlined;
+}