New contact form with friendlycaptcha

resources/assets/sass/components/_button.scss

@@ -1,40 +1,5 @@
-@use "../abstracts/variables" as *;
+@use "../abstracts/mixin" as *;
 
 .btn {
-  display: block;
-  width: CALC(100% - 78px);
-  padding: 10px 39px 10px 39px;
-  border-radius: 3px;
-  background-image: linear-gradient(to right, #0f259d, #5ba8f4);
-  font-family: Nunito, serif;
-  font-size: 14px;
-  font-weight: bold;
-  line-height: 0.93;
-  text-align: center;
-  color: $text-inverted-color;
-  margin-bottom: 10px;
-  text-decoration: none;
-  text-transform: uppercase;
-
-  &:hover, &:active {
-    color: $text-inverted-color;
-  }
-
-  &.auto_width {
-    width: fit-content;
-    margin: 0 auto;
-  }
-
-  &.fit_content {
-    width: fit-content;
-  }
-
-  &.btn_facebook_share {
-    background-image: none;
-    background-color: #0f259d;
-  }
-  &.btn_twitter_x_share {
-    background-image: none;
-    background-color: #5ba8f4;
-  }
+  @include btn-base;
 }

resources/assets/sass/components/_contact_form.scss

@@ -0,0 +1,24 @@
+@use "../abstracts/mixin" as *;
+
+.contant-form {
+  .form-group {
+    display: flex;
+    margin-bottom: 10px;
+    label {
+      width: 160px;
+    }
+    input, textarea {
+      flex-grow: 1;
+    }
+  }
+  .action_button {
+    margin-top: 10px;
+    cursor: pointer;
+  }
+  .form-control-file::file-selector-button {
+    @include btn-base;
+    width: fit-content;
+    margin-bottom: 0;
+    cursor: pointer;
+  }
+}