2 files changed, 17 insertions, 13 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') {
diff --git a/tpl/objects/field-label.pug b/tpl/objects/field-label.pug
index fb96443..192780d 100644
--- a/tpl/objects/field-label.pug
+++ b/tpl/objects/field-label.pug
@@ -16,7 +16,7 @@ mixin field-label(label, hint=null)
 
         let labelStyle = needsLabelWidth ? 'width: ' + attributes.labelWidth : '';
 
-    div(class=classes)
+    label(class=classes)
         .o-field-label__label(style=labelStyle class=attributes.labelClass)= label
         .o-field-label__content(class=attributes.contentClass)
             block