Styles reordering for better slim version

scss/content/_form-alt-input-types.scss

@@ -150,6 +150,7 @@
     border: $border-thumb solid var(--background);
     border-radius: 50%;
     background-color: var(--text);
+    cursor: pointer;
 
     @if $enable-transitions {
       transition:
@@ -166,6 +167,7 @@
     border: 0;
     border-radius: 50%;
     background-color: var(--text);
+    cursor: pointer;
 
     @if $enable-transitions {
       transition:
@@ -182,6 +184,7 @@
     border: 0;
     border-radius: 50%;
     background-color: var(--text);
+    cursor: pointer;
 
     @if $enable-transitions {
       transition:
@@ -239,7 +242,7 @@
 }
 
 // Search
-input[type="search"] {
+[type="search"] {
   padding-left: #{$spacing-input-button-horizontal + 1.5rem} !important;
   border-radius: #{1rem*$line-height + $spacing-input-button-vertical*2};
   // Source: https://feathericons.com/

scss/content/_form.scss

@@ -117,7 +117,7 @@ textarea {
 // ––––––––––––––––––––
 
 // Force height for alternatives input types
-input:not([type="checkbox"]):not([type="radio"]) {
+input:not([type="checkbox"]):not([type="radio"]):not([type="range"]) {
   height: calc(#{1rem*$line-height} + #{$spacing-input-button-vertical*2} + 2px);
 }
 
@@ -129,15 +129,6 @@ fieldset {
   border: 0;
 }
 
-// Layout
-input:not([type="checkbox"]):not([type="radio"]),
-select,
-textarea,
-form small {
-  display: block;
-  width: 100%;
-}
-
 // Spacing beteen label and input
 $spacing-label-input: $spacing-typography/12;
 
@@ -149,7 +140,16 @@ fieldset legend {
   vertical-align: middle;
 }
 
-// Inputs (Not Checkboxes, Radios, Range, File)
+// Global layout
+input:not([type="checkbox"]):not([type="radio"]),
+select,
+textarea,
+form small {
+  display: block;
+  width: 100%;
+}
+
+// Reset appearance (Not Checkboxes, Radios, Range and File)
 input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
 select,
 textarea {
@@ -160,14 +160,7 @@ textarea {
   vertical-align: middle;
 }
 
-// Inputs (Not Checkboxes, Radios)
-input:not([type="checkbox"]):not([type="radio"]),
-select,
-textarea {
-  margin-bottom: $spacing-typography;
-}
-
-// Inputs (Commons styles)
+// Commons styles
 input,
 select,
 textarea {
@@ -198,10 +191,6 @@ textarea {
     border-color: var(--primary);
   }
 
-  &:focus  {
-    box-shadow: 0 0 0 0.2rem var(--primary-focus);
-  }
-
   &[readonly],
   &[disabled] {
     border-color: var(--muted-border);
@@ -220,13 +209,8 @@ textarea {
     cursor: not-allowed;
     opacity: .5;
   }
-}
-
-// Validation states for Text, Select & Textarea
-input,
-select,
-textarea {
 
+  // Validation states
   @if $enable-input-states and $enable-classes {
 
     // Validation states
@@ -250,6 +234,22 @@ textarea {
   }
 }
 
+// Margin bottom (Not Checkboxes andRadios)
+input:not([type="checkbox"]):not([type="radio"]),
+select,
+textarea {
+  margin-bottom: $spacing-typography;
+}
+
+// Focus styles (Not Range and File)
+input:not([type="range"]):not([type="file"]),
+select,
+textarea {
+  &:focus  {
+    box-shadow: 0 0 0 0.2rem var(--primary-focus);
+ }
+}
+
 // Select
 select {
 
@@ -274,6 +274,7 @@ form small {
   color: var(--muted-text);
 }
 
+// Helper: padding
 input,
 select,
 textarea {