fix(input): prevent the input from jumping when it becomes disabled

* The inputs used to offset their border with a -1px margin, however this caused all surrounding content to jump. This change switches to using `background-position` instead.
* Fixes inputs not getting their disabled styles when they're in a disabled fieldset.

Closes #7640.

Closes #7919

src/components/input/input-theme.scss

@@ -76,7 +76,7 @@ md-input-container.md-THEME_NAME-theme {
   }
   .md-input {
     &[disabled],
-    [disabled] {
+    [disabled] & {
       border-bottom-color: transparent;
       color: '{{foreground-3}}';
       background-image: linear-gradient(to right, '{{foreground-3}}' 0%, '{{foreground-3}}' 33%, transparent 0%);

src/components/input/input.scss

@@ -307,12 +307,13 @@ md-input-container {
   .md-input {
     &[disabled],
     [disabled] & {
-      background-position: 0 bottom;
+      // The negative border width offsets the dotted "border" so
+      // it's placed in the same place as the solid one before it.
+      background-position: bottom $input-border-width-default * -1 left 0;
       // This background-size is coordinated with a linear-gradient set in input-theme.scss
       // to create a dotted line under the input.
       background-size: 4px 1px;
       background-repeat: repeat-x;
-      margin-bottom: -1px; // Shift downward so dotted line is positioned the same as other bottom borders
     }
   }