1 files changed, 16 insertions, 12 deletions

diff --git a/src/objects/_text-field.scss b/src/objects/_text-field.scss
index 2beff5f..a52050c 100644
--- a/src/objects/_text-field.scss
+++ b/src/objects/_text-field.scss
@@ -104,38 +104,42 @@
             }
         }
 
-        @include bem.modifier('pill') {
-            border-radius: 100em;
+        @include bem.modifier('extended') {
+            padding: props.get(vars.$extended--pad);
 
-            @include bem.elem('bg') {
-                border-radius: 100em;
+            @include bem.multi('&', 'elem' 'bg') {
+                border-radius: calc(props.get(vars.$rounding) + props.get(vars.$extended--pad));
             }
 
             @include bem.elem('native') {
-                padding-inline: props.get(vars.$pad-i-pill);
-
                 &:focus {
                     @include bem.sibling-elem('bg') {
-                        border-radius: 100em;
+                        border-radius: calc(props.get(vars.$rounding) + props.get(vars.$extended--pad) - $focus-border-offset);
                     }
                 }
             }
         }
 
-        @include bem.modifier('extended') {
-            padding: props.get(vars.$extended--pad);
-
+        @include bem.modifier('pill') {
             @include bem.multi('&', 'elem' 'bg') {
-                border-radius: calc(props.get(vars.$rounding) + props.get(vars.$extended--pad));
+                border-radius: 100em;
             }
 
             @include bem.elem('native') {
+                padding-inline: props.get(vars.$pad-i-pill);
+
                 &:focus {
                     @include bem.sibling-elem('bg') {
-                        border-radius: calc(props.get(vars.$rounding) + props.get(vars.$extended--pad) - $focus-border-offset);
+                        border-radius: 100em;
                     }
                 }
             }
+
+            @include bem.modifier('extended') {
+                @include bem.elem('native') {
+                    padding-inline: props.get(vars.$pad-i);
+                }
+            }
         }
 
         @include bem.is('invalid') {