@oslokommune/punkt-css 12.12.2 → 12.12.3

package/dist/css/pkt.css

@@ -291,90 +291,90 @@ input::-webkit-datetime-edit {
    * @tokens Colors
    * @presenter Color
    */
-  --pkt-color-brand-blue-100: #F1FDFF;
-  --pkt-color-brand-blue-200: #E5FCFF;
-  --pkt-color-brand-blue-300: #D1F9FF;
-  --pkt-color-brand-blue-500: #B3F5FF;
-  --pkt-color-brand-blue-1000: #6FE9FF;
-  --pkt-color-brand-dark-blue-700: #6A698B;
-  --pkt-color-brand-dark-blue-1000: #2A2859;
-  --pkt-color-brand-warm-blue-1000: #1F42AA;
-  --pkt-color-brand-green-400: #C7FDE9;
-  --pkt-color-brand-green-1000: #43F8B6;
-  --pkt-color-brand-light-green-400: #E5FFE6;
-  --pkt-color-brand-light-green-1000: #C7F6C9;
-  --pkt-color-brand-dark-green-1000: #034B45;
-  --pkt-color-brand-yellow-1000: #F9C66B;
-  --pkt-color-brand-yellow-500: #FFE7BC;
-  --pkt-color-brand-red-100: #FFF2F1;
-  --pkt-color-brand-red-400: #FFDFDC;
-  --pkt-color-brand-red-600: #FFB4AC;
-  --pkt-color-brand-red-1000: #FF8274;
-  --pkt-color-brand-light-beige-1000: #F8F0DD;
-  --pkt-color-brand-dark-beige-1000: #D0BFAE;
-  --pkt-color-brand-neutrals-white: #FFFFFF;
-  --pkt-color-brand-neutrals-100: #F9F9F9;
-  --pkt-color-brand-neutrals-200: #F2F2F2;
-  --pkt-color-brand-neutrals-1000: #2C2C2C;
+  --pkt-color-brand-blue-100: #f1fdff;
+  --pkt-color-brand-blue-200: #e5fcff;
+  --pkt-color-brand-blue-300: #d1f9ff;
+  --pkt-color-brand-blue-500: #b3f5ff;
+  --pkt-color-brand-blue-1000: #6fe9ff;
+  --pkt-color-brand-dark-blue-700: #6a698b;
+  --pkt-color-brand-dark-blue-1000: #2a2859;
+  --pkt-color-brand-warm-blue-1000: #1f42aa;
+  --pkt-color-brand-green-400: #c7fde9;
+  --pkt-color-brand-green-1000: #43f8b6;
+  --pkt-color-brand-light-green-400: #e5ffe6;
+  --pkt-color-brand-light-green-1000: #c7f6c9;
+  --pkt-color-brand-dark-green-1000: #034b45;
+  --pkt-color-brand-yellow-1000: #f9c66b;
+  --pkt-color-brand-yellow-500: #ffe7bc;
+  --pkt-color-brand-red-100: #fff2f1;
+  --pkt-color-brand-red-400: #ffdfdc;
+  --pkt-color-brand-red-600: #ffb4ac;
+  --pkt-color-brand-red-1000: #ff8274;
+  --pkt-color-brand-light-beige-1000: #f8f0dd;
+  --pkt-color-brand-dark-beige-1000: #d0bfae;
+  --pkt-color-brand-neutrals-white: #ffffff;
+  --pkt-color-brand-neutrals-100: #f9f9f9;
+  --pkt-color-brand-neutrals-200: #f2f2f2;
+  --pkt-color-brand-neutrals-1000: #2c2c2c;
   --pkt-color-brand-neutrals-black: #000000;
   --pkt-color-brand-neutrals-transparent: transparent;
-  --pkt-color-brand-purple-1000: #E0ADFF;
-  --pkt-color-grays-gray-100: #E6E6E6;
-  --pkt-color-grays-gray-200: #CCCCCC;
-  --pkt-color-grays-gray-300: #B3B3B3;
-  --pkt-color-grays-gray-400: #9A9A9A;
+  --pkt-color-brand-purple-1000: #e0adff;
+  --pkt-color-grays-gray-100: #e6e6e6;
+  --pkt-color-grays-gray-200: #cccccc;
+  --pkt-color-grays-gray-300: #b3b3b3;
+  --pkt-color-grays-gray-400: #9a9a9a;
   --pkt-color-grays-gray-500: #808080;
   --pkt-color-grays-gray-600: #666666;
-  --pkt-color-grays-gray-700: #4D4D4D;
+  --pkt-color-grays-gray-700: #4d4d4d;
   --pkt-color-grays-gray-800: #333333;
-  --pkt-color-grays-gray-900: #1A1A1A;
-  --pkt-color-grays-gray-1000: #2C2C2C;
-  --pkt-color-background-card: #FFFFFF;
-  --pkt-color-background-default: #FFFFFF;
-  --pkt-color-background-subtle: #F9F9F9;
+  --pkt-color-grays-gray-900: #1a1a1a;
+  --pkt-color-grays-gray-1000: #2c2c2c;
+  --pkt-color-background-card: #ffffff;
+  --pkt-color-background-default: #ffffff;
+  --pkt-color-background-subtle: #f9f9f9;
   --pkt-color-background-transparent: transparent;
-  --pkt-color-border-default: #2A2859;
-  --pkt-color-border-beige: #D0BFAE;
-  --pkt-color-border-blue: #6FE9FF;
-  --pkt-color-border-gray: #CCCCCC;
-  --pkt-color-border-green: #43F8B6;
-  --pkt-color-border-light-beige: #F8F0DD;
-  --pkt-color-border-red: #FF8274;
-  --pkt-color-border-subtle: #F2F2F2;
-  --pkt-color-border-yellow: #F9C66B;
-  --pkt-color-border-states-active: #1F42AA;
-  --pkt-color-border-states-disabled: #B3B3B3;
-  --pkt-color-border-states-focus: #E0ADFF;
-  --pkt-color-border-states-hover: #1F42AA;
-  --pkt-color-surface-default-faded-green: #E5FFE6;
-  --pkt-color-surface-default-faded-red: #FFDFDC;
-  --pkt-color-surface-default-gray: #F9F9F9;
-  --pkt-color-surface-default-light-beige: #F8F0DD;
-  --pkt-color-surface-default-light-blue: #D1F9FF;
-  --pkt-color-surface-default-light-green: #C7FDE9;
-  --pkt-color-surface-default-red: #FFB4AC;
-  --pkt-color-surface-default-yellow: #FFE7BC;
-  --pkt-color-surface-strong-beige: #D0BFAE;
-  --pkt-color-surface-strong-blue: #6FE9FF;
-  --pkt-color-surface-strong-dark-blue: #2A2859;
-  --pkt-color-surface-strong-dark-green: #034B45;
-  --pkt-color-surface-strong-gray: #F2F2F2;
-  --pkt-color-surface-strong-green: #43F8B6;
-  --pkt-color-surface-strong-light-green: #C7F6C9;
-  --pkt-color-surface-strong-red: #FF8274;
-  --pkt-color-surface-strong-yellow: #F9C66B;
-  --pkt-color-surface-subtle-light-blue: #E5FCFF;
-  --pkt-color-surface-subtle-light-red: #FFF2F1;
-  --pkt-color-surface-subtle-pale-blue: #F1FDFF;
-  --pkt-color-surface-subtle-white: #FFFFFF;
-  --pkt-color-text-body-dark: #2A2859;
-  --pkt-color-text-body-default: #2A2859;
-  --pkt-color-text-body-light: #FFFFFF;
+  --pkt-color-border-default: #2a2859;
+  --pkt-color-border-beige: #d0bfae;
+  --pkt-color-border-blue: #6fe9ff;
+  --pkt-color-border-gray: #cccccc;
+  --pkt-color-border-green: #43f8b6;
+  --pkt-color-border-light-beige: #f8f0dd;
+  --pkt-color-border-red: #ff8274;
+  --pkt-color-border-subtle: #f2f2f2;
+  --pkt-color-border-yellow: #f9c66b;
+  --pkt-color-border-states-active: #1f42aa;
+  --pkt-color-border-states-disabled: #b3b3b3;
+  --pkt-color-border-states-focus: #e0adff;
+  --pkt-color-border-states-hover: #1f42aa;
+  --pkt-color-surface-default-faded-green: #e5ffe6;
+  --pkt-color-surface-default-faded-red: #ffdfdc;
+  --pkt-color-surface-default-gray: #f9f9f9;
+  --pkt-color-surface-default-light-beige: #f8f0dd;
+  --pkt-color-surface-default-light-blue: #d1f9ff;
+  --pkt-color-surface-default-light-green: #c7fde9;
+  --pkt-color-surface-default-red: #ffb4ac;
+  --pkt-color-surface-default-yellow: #ffe7bc;
+  --pkt-color-surface-strong-beige: #d0bfae;
+  --pkt-color-surface-strong-blue: #6fe9ff;
+  --pkt-color-surface-strong-dark-blue: #2a2859;
+  --pkt-color-surface-strong-dark-green: #034b45;
+  --pkt-color-surface-strong-gray: #f2f2f2;
+  --pkt-color-surface-strong-green: #43f8b6;
+  --pkt-color-surface-strong-light-green: #c7f6c9;
+  --pkt-color-surface-strong-red: #ff8274;
+  --pkt-color-surface-strong-yellow: #f9c66b;
+  --pkt-color-surface-subtle-light-blue: #e5fcff;
+  --pkt-color-surface-subtle-light-red: #fff2f1;
+  --pkt-color-surface-subtle-pale-blue: #f1fdff;
+  --pkt-color-surface-subtle-white: #ffffff;
+  --pkt-color-text-body-dark: #2a2859;
+  --pkt-color-text-body-default: #2a2859;
+  --pkt-color-text-body-light: #ffffff;
   --pkt-color-text-placeholder: #666666;
   --pkt-color-text-action-disabled: #666666;
-  --pkt-color-text-action-active: #1F42AA;
-  --pkt-color-text-action-hover: #1F42AA;
-  --pkt-color-text-action-normal: #2A2859;
+  --pkt-color-text-action-active: #1f42aa;
+  --pkt-color-text-action-hover: #1f42aa;
+  --pkt-color-text-action-normal: #2a2859;
   --color-blue: #6fe9ff;
   --color-blue-light: #b3f5ff;
   --color-blue-dark: #2a2859;
@@ -428,229 +428,229 @@ input::-webkit-datetime-edit {
   --color-black: #000;
 }
 :root .pkt-color-bg-brand-blue-100 {
-  background-color: #F1FDFF !important;
+  background-color: #f1fdff !important;
 }
 :root .pkt-color-txt-brand-blue-100 {
-  color: #F1FDFF !important;
+  color: #f1fdff !important;
 }
 :root .pkt-color-border-brand-blue-100 {
-  border-color: #F1FDFF !important;
+  border-color: #f1fdff !important;
 }
 :root .pkt-color-bg-brand-blue-200 {
-  background-color: #E5FCFF !important;
+  background-color: #e5fcff !important;
 }
 :root .pkt-color-txt-brand-blue-200 {
-  color: #E5FCFF !important;
+  color: #e5fcff !important;
 }
 :root .pkt-color-border-brand-blue-200 {
-  border-color: #E5FCFF !important;
+  border-color: #e5fcff !important;
 }
 :root .pkt-color-bg-brand-blue-300 {
-  background-color: #D1F9FF !important;
+  background-color: #d1f9ff !important;
 }
 :root .pkt-color-txt-brand-blue-300 {
-  color: #D1F9FF !important;
+  color: #d1f9ff !important;
 }
 :root .pkt-color-border-brand-blue-300 {
-  border-color: #D1F9FF !important;
+  border-color: #d1f9ff !important;
 }
 :root .pkt-color-bg-brand-blue-500 {
-  background-color: #B3F5FF !important;
+  background-color: #b3f5ff !important;
 }
 :root .pkt-color-txt-brand-blue-500 {
-  color: #B3F5FF !important;
+  color: #b3f5ff !important;
 }
 :root .pkt-color-border-brand-blue-500 {
-  border-color: #B3F5FF !important;
+  border-color: #b3f5ff !important;
 }
 :root .pkt-color-bg-brand-blue-1000 {
-  background-color: #6FE9FF !important;
+  background-color: #6fe9ff !important;
 }
 :root .pkt-color-txt-brand-blue-1000 {
-  color: #6FE9FF !important;
+  color: #6fe9ff !important;
 }
 :root .pkt-color-border-brand-blue-1000 {
-  border-color: #6FE9FF !important;
+  border-color: #6fe9ff !important;
 }
 :root .pkt-color-bg-brand-dark-blue-700 {
-  background-color: #6A698B !important;
+  background-color: #6a698b !important;
 }
 :root .pkt-color-txt-brand-dark-blue-700 {
-  color: #6A698B !important;
+  color: #6a698b !important;
 }
 :root .pkt-color-border-brand-dark-blue-700 {
-  border-color: #6A698B !important;
+  border-color: #6a698b !important;
 }
 :root .pkt-color-bg-brand-dark-blue-1000 {
-  background-color: #2A2859 !important;
+  background-color: #2a2859 !important;
 }
 :root .pkt-color-txt-brand-dark-blue-1000 {
-  color: #2A2859 !important;
+  color: #2a2859 !important;
 }
 :root .pkt-color-border-brand-dark-blue-1000 {
-  border-color: #2A2859 !important;
+  border-color: #2a2859 !important;
 }
 :root .pkt-color-bg-brand-warm-blue-1000 {
-  background-color: #1F42AA !important;
+  background-color: #1f42aa !important;
 }
 :root .pkt-color-txt-brand-warm-blue-1000 {
-  color: #1F42AA !important;
+  color: #1f42aa !important;
 }
 :root .pkt-color-border-brand-warm-blue-1000 {
-  border-color: #1F42AA !important;
+  border-color: #1f42aa !important;
 }
 :root .pkt-color-bg-brand-green-400 {
-  background-color: #C7FDE9 !important;
+  background-color: #c7fde9 !important;
 }
 :root .pkt-color-txt-brand-green-400 {
-  color: #C7FDE9 !important;
+  color: #c7fde9 !important;
 }
 :root .pkt-color-border-brand-green-400 {
-  border-color: #C7FDE9 !important;
+  border-color: #c7fde9 !important;
 }
 :root .pkt-color-bg-brand-green-1000 {
-  background-color: #43F8B6 !important;
+  background-color: #43f8b6 !important;
 }
 :root .pkt-color-txt-brand-green-1000 {
-  color: #43F8B6 !important;
+  color: #43f8b6 !important;
 }
 :root .pkt-color-border-brand-green-1000 {
-  border-color: #43F8B6 !important;
+  border-color: #43f8b6 !important;
 }
 :root .pkt-color-bg-brand-light-green-400 {
-  background-color: #E5FFE6 !important;
+  background-color: #e5ffe6 !important;
 }
 :root .pkt-color-txt-brand-light-green-400 {
-  color: #E5FFE6 !important;
+  color: #e5ffe6 !important;
 }
 :root .pkt-color-border-brand-light-green-400 {
-  border-color: #E5FFE6 !important;
+  border-color: #e5ffe6 !important;
 }
 :root .pkt-color-bg-brand-light-green-1000 {
-  background-color: #C7F6C9 !important;
+  background-color: #c7f6c9 !important;
 }
 :root .pkt-color-txt-brand-light-green-1000 {
-  color: #C7F6C9 !important;
+  color: #c7f6c9 !important;
 }
 :root .pkt-color-border-brand-light-green-1000 {
-  border-color: #C7F6C9 !important;
+  border-color: #c7f6c9 !important;
 }
 :root .pkt-color-bg-brand-dark-green-1000 {
-  background-color: #034B45 !important;
+  background-color: #034b45 !important;
 }
 :root .pkt-color-txt-brand-dark-green-1000 {
-  color: #034B45 !important;
+  color: #034b45 !important;
 }
 :root .pkt-color-border-brand-dark-green-1000 {
-  border-color: #034B45 !important;
+  border-color: #034b45 !important;
 }
 :root .pkt-color-bg-brand-yellow-1000 {
-  background-color: #F9C66B !important;
+  background-color: #f9c66b !important;
 }
 :root .pkt-color-txt-brand-yellow-1000 {
-  color: #F9C66B !important;
+  color: #f9c66b !important;
 }
 :root .pkt-color-border-brand-yellow-1000 {
-  border-color: #F9C66B !important;
+  border-color: #f9c66b !important;
 }
 :root .pkt-color-bg-brand-yellow-500 {
-  background-color: #FFE7BC !important;
+  background-color: #ffe7bc !important;
 }
 :root .pkt-color-txt-brand-yellow-500 {
-  color: #FFE7BC !important;
+  color: #ffe7bc !important;
 }
 :root .pkt-color-border-brand-yellow-500 {
-  border-color: #FFE7BC !important;
+  border-color: #ffe7bc !important;
 }
 :root .pkt-color-bg-brand-red-100 {
-  background-color: #FFF2F1 !important;
+  background-color: #fff2f1 !important;
 }
 :root .pkt-color-txt-brand-red-100 {
-  color: #FFF2F1 !important;
+  color: #fff2f1 !important;
 }
 :root .pkt-color-border-brand-red-100 {
-  border-color: #FFF2F1 !important;
+  border-color: #fff2f1 !important;
 }
 :root .pkt-color-bg-brand-red-400 {
-  background-color: #FFDFDC !important;
+  background-color: #ffdfdc !important;
 }
 :root .pkt-color-txt-brand-red-400 {
-  color: #FFDFDC !important;
+  color: #ffdfdc !important;
 }
 :root .pkt-color-border-brand-red-400 {
-  border-color: #FFDFDC !important;
+  border-color: #ffdfdc !important;
 }
 :root .pkt-color-bg-brand-red-600 {
-  background-color: #FFB4AC !important;
+  background-color: #ffb4ac !important;
 }
 :root .pkt-color-txt-brand-red-600 {
-  color: #FFB4AC !important;
+  color: #ffb4ac !important;
 }
 :root .pkt-color-border-brand-red-600 {
-  border-color: #FFB4AC !important;
+  border-color: #ffb4ac !important;
 }
 :root .pkt-color-bg-brand-red-1000 {
-  background-color: #FF8274 !important;
+  background-color: #ff8274 !important;
 }
 :root .pkt-color-txt-brand-red-1000 {
-  color: #FF8274 !important;
+  color: #ff8274 !important;
 }
 :root .pkt-color-border-brand-red-1000 {
-  border-color: #FF8274 !important;
+  border-color: #ff8274 !important;
 }
 :root .pkt-color-bg-brand-light-beige-1000 {
-  background-color: #F8F0DD !important;
+  background-color: #f8f0dd !important;
 }
 :root .pkt-color-txt-brand-light-beige-1000 {
-  color: #F8F0DD !important;
+  color: #f8f0dd !important;
 }
 :root .pkt-color-border-brand-light-beige-1000 {
-  border-color: #F8F0DD !important;
+  border-color: #f8f0dd !important;
 }
 :root .pkt-color-bg-brand-dark-beige-1000 {
-  background-color: #D0BFAE !important;
+  background-color: #d0bfae !important;
 }
 :root .pkt-color-txt-brand-dark-beige-1000 {
-  color: #D0BFAE !important;
+  color: #d0bfae !important;
 }
 :root .pkt-color-border-brand-dark-beige-1000 {
-  border-color: #D0BFAE !important;
+  border-color: #d0bfae !important;
 }
 :root .pkt-color-bg-brand-neutrals-white {
-  background-color: #FFFFFF !important;
+  background-color: #ffffff !important;
 }
 :root .pkt-color-txt-brand-neutrals-white {
-  color: #FFFFFF !important;
+  color: #ffffff !important;
 }
 :root .pkt-color-border-brand-neutrals-white {
-  border-color: #FFFFFF !important;
+  border-color: #ffffff !important;
 }
 :root .pkt-color-bg-brand-neutrals-100 {
-  background-color: #F9F9F9 !important;
+  background-color: #f9f9f9 !important;
 }
 :root .pkt-color-txt-brand-neutrals-100 {
-  color: #F9F9F9 !important;
+  color: #f9f9f9 !important;
 }
 :root .pkt-color-border-brand-neutrals-100 {
-  border-color: #F9F9F9 !important;
+  border-color: #f9f9f9 !important;
 }
 :root .pkt-color-bg-brand-neutrals-200 {
-  background-color: #F2F2F2 !important;
+  background-color: #f2f2f2 !important;
 }
 :root .pkt-color-txt-brand-neutrals-200 {
-  color: #F2F2F2 !important;
+  color: #f2f2f2 !important;
 }
 :root .pkt-color-border-brand-neutrals-200 {
-  border-color: #F2F2F2 !important;
+  border-color: #f2f2f2 !important;
 }
 :root .pkt-color-bg-brand-neutrals-1000 {
-  background-color: #2C2C2C !important;
+  background-color: #2c2c2c !important;
 }
 :root .pkt-color-txt-brand-neutrals-1000 {
-  color: #2C2C2C !important;
+  color: #2c2c2c !important;
 }
 :root .pkt-color-border-brand-neutrals-1000 {
-  border-color: #2C2C2C !important;
+  border-color: #2c2c2c !important;
 }
 :root .pkt-color-bg-brand-neutrals-black {
   background-color: #000000 !important;
@@ -671,49 +671,49 @@ input::-webkit-datetime-edit {
   border-color: transparent !important;
 }
 :root .pkt-color-bg-brand-purple-1000 {
-  background-color: #E0ADFF !important;
+  background-color: #e0adff !important;
 }
 :root .pkt-color-txt-brand-purple-1000 {
-  color: #E0ADFF !important;
+  color: #e0adff !important;
 }
 :root .pkt-color-border-brand-purple-1000 {
-  border-color: #E0ADFF !important;
+  border-color: #e0adff !important;
 }
 :root .pkt-color-bg-grays-gray-100 {
-  background-color: #E6E6E6 !important;
+  background-color: #e6e6e6 !important;
 }
 :root .pkt-color-txt-grays-gray-100 {
-  color: #E6E6E6 !important;
+  color: #e6e6e6 !important;
 }
 :root .pkt-color-border-grays-gray-100 {
-  border-color: #E6E6E6 !important;
+  border-color: #e6e6e6 !important;
 }
 :root .pkt-color-bg-grays-gray-200 {
-  background-color: #CCCCCC !important;
+  background-color: #cccccc !important;
 }
 :root .pkt-color-txt-grays-gray-200 {
-  color: #CCCCCC !important;
+  color: #cccccc !important;
 }
 :root .pkt-color-border-grays-gray-200 {
-  border-color: #CCCCCC !important;
+  border-color: #cccccc !important;
 }
 :root .pkt-color-bg-grays-gray-300 {
-  background-color: #B3B3B3 !important;
+  background-color: #b3b3b3 !important;
 }
 :root .pkt-color-txt-grays-gray-300 {
-  color: #B3B3B3 !important;
+  color: #b3b3b3 !important;
 }
 :root .pkt-color-border-grays-gray-300 {
-  border-color: #B3B3B3 !important;
+  border-color: #b3b3b3 !important;
 }
 :root .pkt-color-bg-grays-gray-400 {
-  background-color: #9A9A9A !important;
+  background-color: #9a9a9a !important;
 }
 :root .pkt-color-txt-grays-gray-400 {
-  color: #9A9A9A !important;
+  color: #9a9a9a !important;
 }
 :root .pkt-color-border-grays-gray-400 {
-  border-color: #9A9A9A !important;
+  border-color: #9a9a9a !important;
 }
 :root .pkt-color-bg-grays-gray-500 {
   background-color: #808080 !important;
@@ -734,13 +734,13 @@ input::-webkit-datetime-edit {
   border-color: #666666 !important;
 }
 :root .pkt-color-bg-grays-gray-700 {
-  background-color: #4D4D4D !important;
+  background-color: #4d4d4d !important;
 }
 :root .pkt-color-txt-grays-gray-700 {
-  color: #4D4D4D !important;
+  color: #4d4d4d !important;
 }
 :root .pkt-color-border-grays-gray-700 {
-  border-color: #4D4D4D !important;
+  border-color: #4d4d4d !important;
 }
 :root .pkt-color-bg-grays-gray-800 {
   background-color: #333333 !important;
@@ -752,22 +752,22 @@ input::-webkit-datetime-edit {
   border-color: #333333 !important;
 }
 :root .pkt-color-bg-grays-gray-900 {
-  background-color: #1A1A1A !important;
+  background-color: #1a1a1a !important;
 }
 :root .pkt-color-txt-grays-gray-900 {
-  color: #1A1A1A !important;
+  color: #1a1a1a !important;
 }
 :root .pkt-color-border-grays-gray-900 {
-  border-color: #1A1A1A !important;
+  border-color: #1a1a1a !important;
 }
 :root .pkt-color-bg-grays-gray-1000 {
-  background-color: #2C2C2C !important;
+  background-color: #2c2c2c !important;
 }
 :root .pkt-color-txt-grays-gray-1000 {
-  color: #2C2C2C !important;
+  color: #2c2c2c !important;
 }
 :root .pkt-color-border-grays-gray-1000 {
-  border-color: #2C2C2C !important;
+  border-color: #2c2c2c !important;
 }
 :root .pkt-color-bg-background-card {
   background-color: var(--pkt-color-background-card) !important;
@@ -17696,22 +17696,15 @@ button.pkt-link {
   text-align: left;
   align-items: center;
   column-gap: 0.5rem;
-  font-size: 1.125rem;
-  font-weight: 500;
-  letter-spacing: -0.2px;
-  line-height: 1.75rem;
-  height: 3rem;
-  line-height: 1.1;
-  padding: 0 1rem;
 }
 .pkt-btn--small {
-  font-size: 0.875rem;
-  font-weight: 500;
-  letter-spacing: -0.2px;
-  line-height: 1.375rem;
   height: 2.625rem;
-  line-height: 1.1;
   padding: 0 0.5rem;
+  line-height: 1.1;
+  letter-spacing: -0.2px;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.375rem;
 }
 .pkt-btn--small .pkt-btn__icon, .pkt-btn--small .pkt-btn__icon .pkt-icon {
   height: 1.25rem;
@@ -17720,6 +17713,15 @@ button.pkt-link {
 .pkt-btn--small.pkt-btn--icon-only {
   padding: 0 0.5625rem;
 }
+.pkt-btn {
+  height: 3rem;
+  padding: 0 1rem;
+  line-height: 1.1;
+  letter-spacing: -0.2px;
+  font-weight: 500;
+  font-size: 1.125rem;
+  line-height: 1.75rem;
+}
 .pkt-btn__icon, .pkt-btn__icon .pkt-icon {
   height: 1.5rem;
   width: 1.5rem;
@@ -17740,13 +17742,13 @@ button.pkt-link {
   padding: 0 0.625rem;
 }
 .pkt-btn--large {
-  font-size: 1.5rem;
-  font-weight: 500;
-  letter-spacing: -0.2px;
-  line-height: 2.25rem;
   height: 4rem;
-  line-height: 1.1;
   padding: 0 1rem;
+  line-height: 1.1;
+  letter-spacing: -0.2px;
+  font-weight: 500;
+  font-size: 1.5rem;
+  line-height: 2.25rem;
 }
 .pkt-btn--large .pkt-btn__icon, .pkt-btn--large .pkt-btn__icon .pkt-icon {
   height: 2rem;
@@ -17967,10 +17969,10 @@ div.pkt-btn:not([data-disabled]):active, .pkt-btn:enabled:active, .pkt-btn.pkt-b
   color: var(--pkt-color-grays-gray-300);
   cursor: inherit;
 }
-/* 
+/*
  * Checkbox and radio
- * 
- * 
+ *
+ *
  */
 .pkt-input-check, .pkt-input-check__input, .pkt-input-check__input-checkbox, .pkt-input-check__input--tile {
   --pkt-color-input-background-normal: var(--pkt-color-brand-neutrals-white);
@@ -17986,9 +17988,7 @@ div.pkt-btn:not([data-disabled]):active, .pkt-btn:enabled:active, .pkt-btn.pkt-b
   --pkt-color-input-text-error: var(--pkt-color-brand-red-1000);
 }
 [data-mode=dark] .pkt-input-check, [data-mode=dark] .pkt-input-check__input, [data-mode=dark] .pkt-input-check__input-checkbox, [data-mode=dark] .pkt-input-check__input--tile {
-  --pkt-color-input-background-normal: var(
-    --pkt-color-brand-dark-blue-1000
-  );
+  --pkt-color-input-background-normal: var(--pkt-color-brand-dark-blue-1000);
   --pkt-color-input-border-active: var(--pkt-color-brand-blue-500);
   --pkt-color-input-border-disabled: var(--pkt-color-grays-gray-200);
   --pkt-color-input-border-error: var(--pkt-color-brand-red-1000);
@@ -18010,21 +18010,21 @@ div.pkt-btn:not([data-disabled]):active, .pkt-btn:enabled:active, .pkt-btn.pkt-b
   display: flex;
 }
 .pkt-input-check__input-label {
-  font-size: 1rem;
-  font-weight: 300;
-  letter-spacing: -0.2px;
-  line-height: 1.5rem;
   color: var(--pkt-color-text-body-default);
   padding-left: 0.5rem;
+  letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 1rem;
+  line-height: 1.5rem;
 }
 .pkt-input-check__input-helptext {
-  font-size: 0.875rem;
-  font-weight: 300;
-  letter-spacing: -0.2px;
-  line-height: 1.375rem;
   padding-top: 0.5rem;
-  color: var(--pkt-color-text-body-default);
   max-width: 21.875rem;
+  color: var(--pkt-color-text-body-default);
+  letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 0.875rem;
+  line-height: 1.375rem;
 }
 .pkt-input-check__input:hover > .pkt-input-check__input-checkbox:not(:disabled) + .pkt-input-check__input-label {
   color: var(--pkt-color-input-text-hover);
@@ -18141,16 +18141,12 @@ div.pkt-btn:not([data-disabled]):active, .pkt-btn:enabled:active, .pkt-btn.pkt-b
 }
 .pkt-input-check__input-checkbox:disabled[type=checkbox] {
   background-color: var(--pkt-color-surface-default-gray);
-  --pkt-color-input-check-border: var(
-    --pkt-color-input-border-disabled
-  );
+  --pkt-color-input-check-border: var(--pkt-color-input-border-disabled);
   cursor: not-allowed;
 }
 .pkt-input-check__input-checkbox:disabled[type=checkbox][role=switch]:checked:after {
   --svg: url(https://punkt-cdn.oslo.kommune.no/12.12/icons/check-medium.svg);
-  --pkt-color-input-check-border: var(
-    --pkt-color-input-border-normal
-  );
+  --pkt-color-input-check-border: var(--pkt-color-input-border-normal);
   filter: grayscale(100%) brightness(400%);
 }
 .pkt-input-check__input-checkbox:disabled[type=radio] {
@@ -18161,9 +18157,7 @@ div.pkt-btn:not([data-disabled]):active, .pkt-btn:enabled:active, .pkt-btn.pkt-b
 }
 .pkt-input-check__input-checkbox:disabled:checked[type=checkbox] {
   background-color: var(--pkt-color-input-border-disabled);
-  --pkt-color-input-check-border: var(
-    --pkt-color-input-border-disabled
-  );
+  --pkt-color-input-check-border: var(--pkt-color-input-border-disabled);
 }
 .pkt-input-check__input-checkbox:disabled:checked[type=radio] {
   box-shadow: 0px 0px 0px 0.125rem var(--pkt-color-input-border-disabled);
@@ -18341,10 +18335,6 @@ Therefore, this is removed from the reset here, and images who need to be fluid
 
 .pkt-input, .pkt-textinput__input, .pkt-select select,
 .pkt-select:is(select) {
-  font-size: 1.125rem;
-  font-weight: 300;
-  letter-spacing: -0.2px;
-  line-height: 1.75rem;
   display: flex;
   align-items: center;
   appearance: none;
@@ -18354,6 +18344,10 @@ Therefore, this is removed from the reset here, and images who need to be fluid
   color: var(--pkt-color-input-text-normal);
   margin: 0;
   padding: 0.5rem 1rem;
+  letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 1.125rem;
+  line-height: 1.75rem;
 }
 .pkt-input:not(.pkt-input-compact), .pkt-textinput__input:not(.pkt-input-compact), .pkt-select select:not(.pkt-input-compact),
 .pkt-select:not(.pkt-input-compact):is(select) {
@@ -18364,9 +18358,9 @@ Therefore, this is removed from the reset here, and images who need to be fluid
   border: 0;
   border-bottom: 1px solid var(--pkt-color-input-border-normal);
   padding: 0 0 0.1rem 0;
-  font-size: 1rem;
-  font-weight: 300;
   letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 1rem;
   line-height: 1.5rem;
 }
 .pkt-input-compact.pkt-input:is(select):not([multiple]), .pkt-input-compact.pkt-textinput__input:is(select):not([multiple]), .pkt-select select.pkt-input-compact:is(select):not([multiple]),
@@ -18445,10 +18439,12 @@ Therefore, this is removed from the reset here, and images who need to be fluid
   border: 2px solid var(--pkt-color-input-border-disabled);
 }
 .pkt-input-prefix, .pkt-input-suffix, .pkt-input-icon, .pkt-input-separator {
-  font-size: 1.125rem;
-  font-weight: 300;
   letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 1.125rem;
   line-height: 1.75rem;
+}
+.pkt-input-prefix, .pkt-input-suffix, .pkt-input-icon, .pkt-input-separator {
   display: flex;
   align-items: center;
   width: auto;
@@ -18548,18 +18544,22 @@ Therefore, this is removed from the reset here, and images who need to be fluid
   border-color: var(--pkt-color-input-border-active);
 }
 .pkt-input__counter {
-  font-size: 0.875rem;
-  font-weight: 300;
   letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 0.875rem;
   line-height: 1.375rem;
+}
+.pkt-input__counter {
   width: min(100%, 31rem);
   text-align: right;
 }
 .pkt-input__counter--error {
-  font-size: 0.875rem;
-  font-weight: 500;
   letter-spacing: -0.2px;
+  font-weight: 500;
+  font-size: 0.875rem;
   line-height: 1.375rem;
+}
+.pkt-input__counter--error {
   color: var(--pkt-color-input-text-error);
 }
 .pkt-input__range-inputs {
@@ -18700,18 +18700,19 @@ Therefore, this is removed from the reset here, and images who need to be fluid
   border-bottom: 1px solid rgba(0, 0, 0, 0.15);
 }
 
-/* 
+/*
  * Section elements
- * 
+ *
  */
 .pkt-section {
   margin: 1rem 0;
 }
 
 .pkt-section--dark {
+  color: white;
   margin: 1rem 0;
   padding: 0.75rem;
-  background-color: #2A2859;
+  background-color: #2a2859;
   /*
   @if luminance($backgroundColor) < 0.4 {
     color: white;
@@ -18722,7 +18723,6 @@ Therefore, this is removed from the reset here, and images who need to be fluid
     }
   }
   */
-  color: white;
 }
 @media screen and (min-width: 35.938rem) {
   .pkt-section--dark {
@@ -18739,9 +18739,10 @@ Therefore, this is removed from the reset here, and images who need to be fluid
 }
 
 .pkt-section--danger {
+  color: black;
   margin: 1rem 0;
   padding: 0.75rem;
-  background-color: #FF8274;
+  background-color: #ff8274;
   /*
   @if luminance($backgroundColor) < 0.4 {
     color: white;
@@ -18752,7 +18753,6 @@ Therefore, this is removed from the reset here, and images who need to be fluid
     }
   }
   */
-  color: black;
 }
 @media screen and (min-width: 35.938rem) {
   .pkt-section--danger {
@@ -18772,7 +18772,7 @@ Therefore, this is removed from the reset here, and images who need to be fluid
 .pkt-section--grey {
   margin: 1rem 0;
   padding: 0.75rem;
-  background-color: #F2F2F2;
+  background-color: #f2f2f2;
   /*
   @if luminance($backgroundColor) < 0.4 {
     color: white;
@@ -18798,9 +18798,10 @@ Therefore, this is removed from the reset here, and images who need to be fluid
 }
 
 .pkt-section--success {
+  color: black;
   margin: 1rem 0;
   padding: 0.75rem;
-  background-color: #43F8B6;
+  background-color: #43f8b6;
   /*
   @if luminance($backgroundColor) < 0.4 {
     color: white;
@@ -18811,7 +18812,6 @@ Therefore, this is removed from the reset here, and images who need to be fluid
     }
   }
   */
-  color: black;
 }
 @media screen and (min-width: 35.938rem) {
   .pkt-section--success {
@@ -18830,7 +18830,7 @@ Therefore, this is removed from the reset here, and images who need to be fluid
 .pkt-section--warning {
   margin: 1rem 0;
   padding: 0.75rem;
-  background-color: #F9C66B;
+  background-color: #f9c66b;
   /*
   @if luminance($backgroundColor) < 0.4 {
     color: white;
@@ -18856,7 +18856,7 @@ Therefore, this is removed from the reset here, and images who need to be fluid
 .pkt-section--info {
   margin: 1rem 0;
   padding: 0.75rem;
-  background-color: #B3F5FF;
+  background-color: #b3f5ff;
   /*
   @if luminance($backgroundColor) < 0.4 {
     color: white;
@@ -18883,6 +18883,7 @@ Therefore, this is removed from the reset here, and images who need to be fluid
 }
 
 .pkt-section--frame {
+  border: 1px solid #2c2c2c;
   margin: 1rem 0;
   padding: 0.75rem;
   background-color: white;
@@ -18896,7 +18897,6 @@ Therefore, this is removed from the reset here, and images who need to be fluid
     }
   }
   */
-  border: 1px solid #2C2C2C;
 }
 @media screen and (min-width: 35.938rem) {
   .pkt-section--frame {
@@ -19195,22 +19195,22 @@ Therefore, this is removed from the reset here, and images who need to be fluid
   color: var(--pkt-color-alert-txt);
 }
 .pkt-alert__title {
-  font-size: 1.125rem;
-  font-weight: 500;
+  margin: 0 0 1.5rem 2.5rem;
   letter-spacing: -0.2px;
+  font-weight: 500;
+  font-size: 1.125rem;
   line-height: 1.75rem;
-  margin: 0 0 1.5rem 2.5rem;
 }
 .pkt-alert__close ~ .pkt-alert__title {
   margin: 0 4rem 1.5rem 2.5rem;
 }
 .pkt-alert__text {
-  font-size: 1.125rem;
-  font-weight: 300;
-  letter-spacing: -0.2px;
-  line-height: 1.75rem;
   margin: 0 0 0 2.5rem;
   overflow-wrap: break-word;
+  letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 1.125rem;
+  line-height: 1.75rem;
 }
 .pkt-alert__text p {
   margin-bottom: 1rem;
@@ -19229,11 +19229,11 @@ Therefore, this is removed from the reset here, and images who need to be fluid
   margin-right: 0;
 }
 .pkt-alert__date {
-  font-size: 0.875rem;
-  font-weight: 300;
+  margin-top: 1.5rem;
   letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 0.875rem;
   line-height: 1.375rem;
-  margin-top: 1.5rem;
 }
 .pkt-alert__icon {
   --fg-color: var(--pkt-color-alert-icon-fg);
@@ -19262,28 +19262,28 @@ Therefore, this is removed from the reset here, and images who need to be fluid
   left: 1.25rem;
 }
 .pkt-alert--compact .pkt-alert__text {
-  font-size: 1rem;
-  font-weight: 300;
+  margin: 0 2.875rem;
   letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 1rem;
   line-height: 1.5rem;
-  margin: 0 2.875rem;
 }
 .pkt-alert--compact .pkt-alert__close {
   top: 0.25rem;
 }
 
-/* 
+/*
  * Back link component
  */
 .pkt-back-link__icon {
   flex-basis: 1rem;
 }
 .pkt-back-link__text {
-  font-size: 0.875rem;
-  font-weight: 300;
+  flex-grow: 1;
   letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 0.875rem;
   line-height: 1.375rem;
-  flex-grow: 1;
 }
 
 /* 
@@ -19333,9 +19333,9 @@ Therefore, this is removed from the reset here, and images who need to be fluid
  */
 .pkt-breadcrumbs {
   position: relative;
-  font-size: 0.875rem;
-  font-weight: 300;
   letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 0.875rem;
   line-height: 1.375rem;
 }
 .pkt-breadcrumbs__list {
@@ -19447,9 +19447,9 @@ pkt-calendar .pkt-cal-month-nav .pkt-cal-month-picker {
 }
 .pkt-calendar .pkt-cal-month-nav .pkt-cal-month-picker .pkt-input,
 pkt-calendar .pkt-cal-month-nav .pkt-cal-month-picker .pkt-input {
-  font-size: 1rem;
-  font-weight: 500;
   letter-spacing: -0.2px;
+  font-weight: 500;
+  font-size: 1rem;
   line-height: 1.5rem;
 }
 .pkt-calendar .pkt-cal-month-nav .pkt-cal-month-picker .pkt-input:is(select),
@@ -19734,15 +19734,15 @@ pkt-datepicker .pkt-datepicker__tags .pkt-tag {
  * Footer element
  */
 .pkt-footer {
-  font-size: 1.125rem;
-  font-weight: 300;
-  letter-spacing: -0.2px;
-  line-height: 1.75rem;
   padding: 2.5rem 1.5rem;
   background-color: var(--pkt-color-surface-strong-dark-blue);
   color: var(--pkt-color-text-body-default);
   display: flex;
   align-items: center;
+  letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 1.125rem;
+  line-height: 1.75rem;
 }
 @media screen and (min-width: 80rem) {
   .pkt-footer {
@@ -19754,13 +19754,13 @@ pkt-datepicker .pkt-datepicker__tags .pkt-tag {
   max-width: 80rem;
 }
 .pkt-footer__title {
-  font-size: 1.5rem;
-  font-weight: 500;
-  letter-spacing: -0.2px;
-  line-height: 2.25rem;
   margin-bottom: 2rem;
   margin-top: 0;
   color: var(--pkt-color-text-body-default);
+  letter-spacing: -0.2px;
+  font-weight: 500;
+  font-size: 1.5rem;
+  line-height: 2.25rem;
 }
 .pkt-footer__text:last-child {
   margin-bottom: 0;
@@ -19837,15 +19837,15 @@ pkt-datepicker .pkt-datepicker__tags .pkt-tag {
 }
 
 .pkt-footer-simple {
-  font-size: 1.125rem;
-  font-weight: 300;
-  letter-spacing: -0.2px;
-  line-height: 1.75rem;
   padding: 2rem 1.5rem;
   background-color: var(--pkt-color-surface-strong-dark-blue);
   color: var(--pkt-color-text-body-default);
   display: flex;
   align-items: center;
+  letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 1.125rem;
+  line-height: 1.75rem;
 }
 @media screen and (min-width: 80rem) {
   .pkt-footer-simple {
@@ -19961,9 +19961,9 @@ pkt-datepicker .pkt-datepicker__tags .pkt-tag {
   white-space: nowrap;
   text-overflow: ellipsis;
   overflow: hidden;
-  font-size: 1.375rem;
-  font-weight: 300;
   letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 1.375rem;
   line-height: 2.125rem;
 }
 @media screen and (min-width: 48rem) {
@@ -19974,9 +19974,9 @@ pkt-datepicker .pkt-datepicker__tags .pkt-tag {
 @media screen and (min-width: 80rem) {
   .pkt-header__logo-service {
     padding-top: 0.6rem;
-    font-size: 1.5rem;
-    font-weight: 300;
     letter-spacing: -0.2px;
+    font-weight: 300;
+    font-size: 1.5rem;
     line-height: 2.25rem;
   }
 }
@@ -19999,9 +19999,9 @@ pkt-datepicker .pkt-datepicker__tags .pkt-tag {
 }
 .pkt-header--narrow .pkt-header__logo-service {
   padding-top: 0.28rem;
-  font-size: 1.125rem;
-  font-weight: 300;
   letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 1.125rem;
   line-height: 1.75rem;
 }
 .pkt-header--narrow .pkt-header__logo-svg {
@@ -20131,21 +20131,21 @@ pkt-datepicker .pkt-datepicker__tags .pkt-tag {
 }
 .pkt-user-menu__label {
   color: var(--pkt-color-grays-gray-600);
-  font-size: 0.875rem;
-  font-weight: 500;
   letter-spacing: -0.2px;
+  font-weight: 500;
+  font-size: 0.875rem;
   line-height: 1.375rem;
 }
 .pkt-user-menu__name {
-  font-size: 1.125rem;
-  font-weight: 500;
   letter-spacing: -0.2px;
+  font-weight: 500;
+  font-size: 1.125rem;
   line-height: 1.75rem;
 }
 .pkt-user-menu__last-logged-in, .pkt-user-menu__org_number {
-  font-size: 1rem;
-  font-weight: 300;
   letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 1rem;
   line-height: 1.5rem;
 }
 .pkt-user-menu .pkt-list {
@@ -20203,15 +20203,15 @@ pkt-icon > svg {
 
 /* inputwrapper */
 .pkt-inputwrapper__label {
-  font-size: 1.125rem;
-  font-weight: 500;
-  letter-spacing: -0.2px;
-  line-height: 1.75rem;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   gap: 0.5rem;
   color: var(--pkt-color-text-body-default);
+  letter-spacing: -0.2px;
+  font-weight: 500;
+  font-size: 1.125rem;
+  line-height: 1.75rem;
 }
 .pkt-inputwrapper__label > h2 {
   font-size: inherit;
@@ -20223,22 +20223,22 @@ pkt-icon > svg {
 }
 .pkt-inputwrapper__helptext {
   width: min(100%, 31rem);
-  font-size: 0.875rem;
-  font-weight: 300;
+  color: var(--pkt-color-text-body-default);
   letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 0.875rem;
   line-height: 1.375rem;
-  color: var(--pkt-color-text-body-default);
 }
 .pkt-inputwrapper__helptext > .pkt-btn, .pkt-inputwrapper__helptext-expandable .pkt-btn {
-  font-size: 0.875rem;
-  font-weight: 300;
-  letter-spacing: -0.2px;
-  line-height: 1.375rem;
   padding: 0;
   height: auto;
   display: inline-flex;
   text-align: left;
   align-items: center;
+  letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 0.875rem;
+  line-height: 1.375rem;
 }
 .pkt-inputwrapper__helptext > *:first-child {
   margin-top: 0;
@@ -20247,11 +20247,11 @@ pkt-icon > svg {
   margin-bottom: 0;
 }
 .pkt-inputwrapper__helptext-expandable-heading {
-  font-size: 1.125rem;
-  font-weight: 500;
+  margin: 0;
   letter-spacing: -0.2px;
+  font-weight: 500;
+  font-size: 1.125rem;
   line-height: 1.75rem;
-  margin: 0;
 }
 .pkt-inputwrapper__helptext-expandable-open {
   display: block;
@@ -20389,9 +20389,9 @@ pkt-icon > svg {
 }
 .pkt-linkcard__title {
   grid-column: 2;
-  font-size: 1.25rem;
-  font-weight: 500;
   letter-spacing: -0.2px;
+  font-weight: 500;
+  font-size: 1.25rem;
   line-height: 2rem;
 }
 .pkt-linkcard__title > p {
@@ -20399,9 +20399,9 @@ pkt-icon > svg {
 }
 @media screen and (min-width: 35.938rem) {
   .pkt-linkcard__title {
-    font-size: 1.5rem;
-    font-weight: 500;
     letter-spacing: -0.2px;
+    font-weight: 500;
+    font-size: 1.5rem;
     line-height: 2.25rem;
   }
 }
@@ -20507,9 +20507,9 @@ pkt-icon > svg {
   aspect-ratio: 600/165;
 }
 .pkt-loader--small > p {
-  font-size: 0.75rem;
-  font-weight: 300;
   letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 0.75rem;
   line-height: 1.25rem;
 }
 .pkt-loader--small .pkt-loader__svg svg {
@@ -20519,9 +20519,9 @@ pkt-icon > svg {
   width: 1rem;
 }
 .pkt-loader--medium > p {
-  font-size: 1rem;
-  font-weight: 300;
   letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 1rem;
   line-height: 1.5rem;
 }
 .pkt-loader--medium .pkt-loader__svg svg {
@@ -20531,9 +20531,9 @@ pkt-icon > svg {
   width: 2.5rem;
 }
 .pkt-loader--large > p {
-  font-size: 1.125rem;
-  font-weight: 300;
   letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 1.125rem;
   line-height: 1.75rem;
 }
 .pkt-loader--large .pkt-loader__svg svg {
@@ -20788,19 +20788,19 @@ body.pkt-modal--open {
 }
 .pkt-messagebox__title {
   grid-area: title;
-  font-size: 1.5rem;
-  font-weight: 500;
+  margin: 0 0 1.5rem 0;
   letter-spacing: -0.2px;
+  font-weight: 500;
+  font-size: 1.5rem;
   line-height: 2.25rem;
-  margin: 0 0 1.5rem 0;
 }
 .pkt-messagebox__text {
   grid-area: text;
-  font-size: 1.125rem;
-  font-weight: 300;
+  margin: 0;
   letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 1.125rem;
   line-height: 1.75rem;
-  margin: 0;
 }
 .pkt-messagebox__text p {
   margin-bottom: 1rem;
@@ -20819,15 +20819,15 @@ body.pkt-modal--open {
   padding: 1rem 1rem 1rem 0.75rem;
 }
 .pkt-messagebox--compact .pkt-messagebox__title {
-  font-size: 1rem;
-  font-weight: 500;
   letter-spacing: -0.2px;
+  font-weight: 500;
+  font-size: 1rem;
   line-height: 1.5rem;
 }
 .pkt-messagebox--compact .pkt-messagebox__text {
-  font-size: 1rem;
-  font-weight: 300;
   letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 1rem;
   line-height: 1.5rem;
 }
 .pkt-messagebox--compact .pkt-messagebox__close > .pkt-btn {
@@ -20969,9 +20969,9 @@ body.pkt-modal--open {
 /* Common styles for all inputs */
 .pkt-searchinput {
   position: relative;
-  font-size: 1.125rem;
-  font-weight: 300;
   letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 1.125rem;
   line-height: 1.75rem;
 }
 .pkt-searchinput__field {
@@ -21047,9 +21047,9 @@ body.pkt-modal--open {
   cursor: pointer;
 }
 .pkt-searchinput__suggestion-title {
-  font-size: 1.125rem;
-  font-weight: 500;
   letter-spacing: -0.2px;
+  font-weight: 500;
+  font-size: 1.125rem;
   line-height: 1.75rem;
 }
 .pkt-searchinput__suggestion-text {
@@ -21294,11 +21294,11 @@ body.pkt-modal--open {
   padding: 0.75rem 1rem;
   color: var(--pkt-color-text-action-disabled);
   border-bottom: 0.25rem solid transparent;
-  font-size: 1rem;
-  font-weight: 400;
+  white-space: nowrap;
   letter-spacing: -0.2px;
+  font-weight: 400;
+  font-size: 1rem;
   line-height: 1.5rem;
-  white-space: nowrap;
 }
 .pkt-tabs__link .pkt-icon,
 .pkt-tabs__link pkt-icon, .pkt-tabs__button .pkt-icon,
@@ -21327,9 +21327,9 @@ body.pkt-modal--open {
 .pkt-tabs__link.active, .pkt-tabs__button.active {
   color: var(--pkt-color-text-action-normal);
   border-bottom: 0.25rem solid var(--pkt-color-border-blue);
-  font-size: 1rem;
-  font-weight: 500;
   letter-spacing: -0.2px;
+  font-weight: 500;
+  font-size: 1rem;
   line-height: 1.5rem;
 }
 .pkt-tabs:after {
@@ -21345,7 +21345,7 @@ body.pkt-modal--open {
   pointer-events: none;
 }
 
-/* 
+/*
  * Tag element
  */
 .pkt-tag {
@@ -21370,9 +21370,9 @@ body.pkt-modal--open {
   height: 1.875rem;
   column-gap: 0;
   color: var(--pkt-color-tag-text-normal);
-  font-size: 0.875rem;
-  font-weight: 500;
   letter-spacing: -0.2px;
+  font-weight: 500;
+  font-size: 0.875rem;
   line-height: 1.375rem;
 }
 .pkt-tag.pkt-btn:hover, .pkt-tag.pkt-tag--hover {
@@ -21563,23 +21563,23 @@ body.pkt-modal--open {
   height: 1.875rem;
 }
 .pkt-tag--large {
-  font-size: 1.125rem;
-  font-weight: 500;
-  letter-spacing: -0.2px;
-  line-height: 1.75rem;
   padding: 0.25rem 0.5rem;
   height: 2.25rem;
+  letter-spacing: -0.2px;
+  font-weight: 500;
+  font-size: 1.125rem;
+  line-height: 1.75rem;
 }
 .pkt-tag--normal-text {
-  font-size: 0.875rem;
-  font-weight: 500;
   letter-spacing: -0.2px;
+  font-weight: 500;
+  font-size: 0.875rem;
   line-height: 1.375rem;
 }
 .pkt-tag--thin-text {
-  font-size: 0.875rem;
-  font-weight: 300;
   letter-spacing: -0.2px;
+  font-weight: 300;
+  font-size: 0.875rem;
   line-height: 1.375rem;
 }