npm - scu-web-components - Versions diffs - 1.3.11 → 1.3.12 - Mend

scu-web-components 1.3.11 → 1.3.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (615) hide show

package/dist/tokens/source/componentScssMixins.scss CHANGED Viewed

@@ -35910,9 +35910,9 @@
   text-align: LEFT;
   font: var( --scw-type-text-04-font );
   @if $themeVar {
-    color: var( #{$themeVar} , rgba(114,118,121,1) );
+    color: var( #{$themeVar}-04 , var( --scw-color-grey-04 ) );
   } @else {
-    color: rgba(114,118,121,1);
+    color: var( --scw-color-grey-04 );
   }
   flex: 1;
 }
@@ -36821,9 +36821,9 @@
   border-width: 1px;
   border-style: solid;
   @if $borderThemeVar {
-    border-color: var( #{$borderThemeVar} , var( --scw-color-grey ) );
+    border-color: var( #{$borderThemeVar}-02 , var( --scw-color-grey-02 ) );
   } @else {
-    border-color: var( --scw-color-grey );
+    border-color: var( --scw-color-grey-02 );
   }
   align-self: stretch;
 }
@@ -37201,9 +37201,9 @@
   text-align: LEFT;
   font: var( --scw-type-text-04-font );
   @if $themeVar {
-    color: var( #{$themeVar} , rgba(114,118,121,1) );
+    color: var( #{$themeVar}-04 , var( --scw-color-grey-04 ) );
   } @else {
-    color: rgba(114,118,121,1);
+    color: var( --scw-color-grey-04 );
   }
   flex: 1;
 }
@@ -37497,9 +37497,9 @@
   $borderThemeVar: false
 ) {
   @if $bgThemeVar {
-    background-color: var( #{$bgThemeVar}-04 , var( --scw-color-grey-04 ) );
+    background-color: var( #{$bgThemeVar}-01 , var( --scw-color-primary-01 ) );
   } @else {
-    background-color: var( --scw-color-grey-04 );
+    background-color: var( --scw-color-primary-01 );
   }
 }
@@ -39723,9 +39723,9 @@
   text-align: LEFT;
   font: var( --scw-type-text-04-font );
   @if $themeVar {
-    color: var( #{$themeVar} , rgba(114,118,121,1) );
+    color: var( #{$themeVar}-04 , var( --scw-color-grey-04 ) );
   } @else {
-    color: rgba(114,118,121,1);
+    color: var( --scw-color-grey-04 );
   }
   flex: 1;
 }
@@ -40634,9 +40634,9 @@
   border-width: 1px;
   border-style: solid;
   @if $borderThemeVar {
-    border-color: var( #{$borderThemeVar} , var( --scw-color-grey ) );
+    border-color: var( #{$borderThemeVar}-02 , var( --scw-color-grey-02 ) );
   } @else {
-    border-color: var( --scw-color-grey );
+    border-color: var( --scw-color-grey-02 );
   }
   align-self: stretch;
 }
@@ -41014,9 +41014,9 @@
   text-align: LEFT;
   font: var( --scw-type-text-04-font );
   @if $themeVar {
-    color: var( #{$themeVar} , rgba(114,118,121,1) );
+    color: var( #{$themeVar}-04 , var( --scw-color-grey-04 ) );
   } @else {
-    color: rgba(114,118,121,1);
+    color: var( --scw-color-grey-04 );
   }
   flex: 1;
 }
@@ -41310,9 +41310,9 @@
   $borderThemeVar: false
 ) {
   @if $bgThemeVar {
-    background-color: var( #{$bgThemeVar}-04 , var( --scw-color-grey-04 ) );
+    background-color: var( #{$bgThemeVar}-01 , var( --scw-color-primary-01 ) );
   } @else {
-    background-color: var( --scw-color-grey-04 );
+    background-color: var( --scw-color-primary-01 );
   }
 }
@@ -43537,9 +43537,9 @@
   text-align: LEFT;
   font: var( --scw-type-text-04-font );
   @if $themeVar {
-    color: var( #{$themeVar} , rgba(114,118,121,1) );
+    color: var( #{$themeVar}-04 , var( --scw-color-grey-04 ) );
   } @else {
-    color: rgba(114,118,121,1);
+    color: var( --scw-color-grey-04 );
   }
   flex: 1;
 }
@@ -46060,9 +46060,9 @@
   text-align: LEFT;
   font: var( --scw-type-text-04-font );
   @if $themeVar {
-    color: var( #{$themeVar} , rgba(114,118,121,1) );
+    color: var( #{$themeVar}-04 , var( --scw-color-grey-04 ) );
   } @else {
-    color: rgba(114,118,121,1);
+    color: var( --scw-color-grey-04 );
   }
   flex: 1;
 }
@@ -48878,9 +48878,9 @@
   $borderThemeVar: false
 ) {
   @if $bgThemeVar {
-    background-color: var( #{$bgThemeVar}-04 , var( --scw-color-grey-04 ) );
+    background-color: var( #{$bgThemeVar}-06 , var( --scw-color-grey-06 ) );
   } @else {
-    background-color: var( --scw-color-grey-04 );
+    background-color: var( --scw-color-grey-06 );
   }
 }
@@ -51400,9 +51400,9 @@
   $borderThemeVar: false
 ) {
   @if $bgThemeVar {
-    background-color: var( #{$bgThemeVar}-04 , var( --scw-color-grey-04 ) );
+    background-color: var( #{$bgThemeVar}-06 , var( --scw-color-grey-06 ) );
   } @else {
-    background-color: var( --scw-color-grey-04 );
+    background-color: var( --scw-color-grey-06 );
   }
 }
@@ -76331,7 +76331,7 @@
 @mixin comp-scw-input-size-large-type-rounded--sizing {
   width: 282px;
-  height: 118px;
+  height: 113px;
 }
 @mixin comp-scw-input-size-large-type-rounded--width {
@@ -76339,7 +76339,7 @@
 }
 @mixin comp-scw-input-size-large-type-rounded--height {
-  height: 118px;
+  height: 113px;
 }
 @mixin comp-scw-input-size-large-type-rounded--padding {
@@ -76369,14 +76369,14 @@
   left: var( --scw-spacing-2 );
   width: 282px;
   bottom: calc( var( --scw-spacing-1 ) * 24 );
-  height: 118px;
+  height: 113px;
 }
 @mixin comp-scw-input-size-large-type-rounded--html-autolayout-margins {
   display: inline-block;
   margin-left: var( --scw-spacing-2 );
   margin-right: calc( var( --scw-spacing-1 ) * 141.1 );
-  margin-top: calc( var( --scw-spacing-1 ) * 72.8 );
+  margin-top: calc( var( --scw-spacing-1 ) * 73.3 );
   margin-bottom: calc( var( --scw-spacing-1 ) * 24 );
 }
@@ -76384,7 +76384,7 @@
   display: inline-block;
   padding-left: var( --scw-spacing-2 );
   padding-right: calc( var( --scw-spacing-1 ) * 141.1 );
-  padding-top: calc( var( --scw-spacing-1 ) * 72.8 );
+  padding-top: calc( var( --scw-spacing-1 ) * 73.3 );
   padding-bottom: calc( var( --scw-spacing-1 ) * 24 );
 }
@@ -76444,7 +76444,7 @@
   margin-left: 0px;
   margin-right: calc( var( --scw-spacing-1 ) * 22.5 );
   margin-top: 0px;
-  margin-bottom: calc( var( --scw-spacing-1 ) * 9.5 );
+  margin-bottom: var( --scw-spacing-9 );
 }
 @mixin comp-scw-input-size-large-type-rounded-label--html-autolayout-padding {
@@ -76452,7 +76452,7 @@
   padding-left: 0px;
   padding-right: calc( var( --scw-spacing-1 ) * 22.5 );
   padding-top: 0px;
-  padding-bottom: calc( var( --scw-spacing-1 ) * 9.5 );
+  padding-bottom: var( --scw-spacing-9 );
 }
@@ -76767,7 +76767,7 @@
 @mixin comp-scw-input-size-large-type-rounded-input--sizing {
   width: 282px;
-  height: 65px;
+  height: 60px;
 }
 @mixin comp-scw-input-size-large-type-rounded-input--width {
@@ -76775,7 +76775,7 @@
 }
 @mixin comp-scw-input-size-large-type-rounded-input--height {
-  height: 65px;
+  height: 60px;
 }
 @mixin comp-scw-input-size-large-type-rounded-input--padding {
@@ -76875,16 +76875,16 @@
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 0.5 );
   margin-right: calc( var( --scw-spacing-1 ) * 23.7 );
-  margin-top: 0px;
-  margin-bottom: 0px;
+  margin-top: calc( var( --scw-spacing-1 ) * -0.25 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * -0.25 );
 }
 @mixin comp-scw-input-size-large-type-rounded-input-icon-left--html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 0.5 );
   padding-right: calc( var( --scw-spacing-1 ) * 23.7 );
-  padding-top: 0px;
-  padding-bottom: 0px;
+  padding-top: calc( var( --scw-spacing-1 ) * -0.25 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * -0.25 );
 }
@@ -77078,7 +77078,7 @@
 @mixin comp-scw-input-size-large-type-rounded-input-placeholder--sizing {
   width: 172px;
-  height: 31px;
+  height: 27px;
 }
 @mixin comp-scw-input-size-large-type-rounded-input-placeholder--width {
@@ -77086,7 +77086,7 @@
 }
 @mixin comp-scw-input-size-large-type-rounded-input-placeholder--height {
-  height: 31px;
+  height: 27px;
 }
 @mixin comp-scw-input-size-large-type-rounded-input-placeholder--padding {
@@ -77119,16 +77119,16 @@
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 4.5 );
   margin-right: calc( var( --scw-spacing-1 ) * 6.5 );
-  margin-top: calc( var( --scw-spacing-1 ) * 1.7 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 1.7 );
+  margin-top: calc( var( --scw-spacing-1 ) * 1.65 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 1.65 );
 }
 @mixin comp-scw-input-size-large-type-rounded-input-placeholder--html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 4.5 );
   padding-right: calc( var( --scw-spacing-1 ) * 6.5 );
-  padding-top: calc( var( --scw-spacing-1 ) * 1.7 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 1.7 );
+  padding-top: calc( var( --scw-spacing-1 ) * 1.65 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 1.65 );
 }
@@ -77136,7 +77136,7 @@
   $themeVar: false
 ) {
   text-align: LEFT;
-  font: var( --scw-type-text-06-font );
+  font: var( --scw-type-text-font );
   @if $themeVar {
     color: var( #{$themeVar} , rgba(114,118,121,1) );
   } @else {
@@ -77147,7 +77147,7 @@
 @mixin comp-scw-input-size-large-type-rounded-input-placeholder-placeholder--sizing {
   width: 152px;
-  height: 31px;
+  height: 27px;
 }
 @mixin comp-scw-input-size-large-type-rounded-input-placeholder-placeholder--width {
@@ -77155,7 +77155,7 @@
 }
 @mixin comp-scw-input-size-large-type-rounded-input-placeholder-placeholder--height {
-  height: 31px;
+  height: 27px;
 }
 @mixin comp-scw-input-size-large-type-rounded-input-placeholder-placeholder--padding {
@@ -77240,16 +77240,16 @@
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 21.7 );
   margin-right: calc( var( --scw-spacing-1 ) * 0.5 );
-  margin-top: 0px;
-  margin-bottom: 0px;
+  margin-top: calc( var( --scw-spacing-1 ) * -0.25 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * -0.25 );
 }
 @mixin comp-scw-input-size-large-type-rounded-input-icon-right--html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 21.7 );
   padding-right: calc( var( --scw-spacing-1 ) * 0.5 );
-  padding-top: 0px;
-  padding-bottom: 0px;
+  padding-top: calc( var( --scw-spacing-1 ) * -0.25 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * -0.25 );
 }
@@ -77543,7 +77543,7 @@
   display: inline-block;
   margin-left: 0px;
   margin-right: calc( var( --scw-spacing-1 ) * 22.5 );
-  margin-top: calc( var( --scw-spacing-1 ) * 9.8 );
+  margin-top: calc( var( --scw-spacing-1 ) * 9.3 );
   margin-bottom: 0px;
 }
@@ -77551,7 +77551,7 @@
   display: inline-block;
   padding-left: 0px;
   padding-right: calc( var( --scw-spacing-1 ) * 22.5 );
-  padding-top: calc( var( --scw-spacing-1 ) * 9.8 );
+  padding-top: calc( var( --scw-spacing-1 ) * 9.3 );
   padding-bottom: 0px;
 }
@@ -77622,7 +77622,7 @@
 @mixin comp-scw-input-state-success-size-large-type-rounded--sizing {
   width: 282px;
-  height: 118px;
+  height: 113px;
 }
 @mixin comp-scw-input-state-success-size-large-type-rounded--width {
@@ -77630,7 +77630,7 @@
 }
 @mixin comp-scw-input-state-success-size-large-type-rounded--height {
-  height: 118px;
+  height: 113px;
 }
 @mixin comp-scw-input-state-success-size-large-type-rounded--padding {
@@ -77660,14 +77660,14 @@
   left: calc( var( --scw-spacing-1 ) * 130.8 );
   width: 282px;
   bottom: calc( var( --scw-spacing-1 ) * 24 );
-  height: 118px;
+  height: 113px;
 }
 @mixin comp-scw-input-state-success-size-large-type-rounded--html-autolayout-margins {
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 130.8 );
   margin-right: calc( var( --scw-spacing-1 ) * 12.3 );
-  margin-top: calc( var( --scw-spacing-1 ) * 72.8 );
+  margin-top: calc( var( --scw-spacing-1 ) * 73.3 );
   margin-bottom: calc( var( --scw-spacing-1 ) * 24 );
 }
@@ -77675,7 +77675,7 @@
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 130.8 );
   padding-right: calc( var( --scw-spacing-1 ) * 12.3 );
-  padding-top: calc( var( --scw-spacing-1 ) * 72.8 );
+  padding-top: calc( var( --scw-spacing-1 ) * 73.3 );
   padding-bottom: calc( var( --scw-spacing-1 ) * 24 );
 }
@@ -77735,7 +77735,7 @@
   margin-left: 0px;
   margin-right: calc( var( --scw-spacing-1 ) * 22.5 );
   margin-top: 0px;
-  margin-bottom: calc( var( --scw-spacing-1 ) * 9.5 );
+  margin-bottom: var( --scw-spacing-9 );
 }
 @mixin comp-scw-input-state-success-size-large-type-rounded-label--html-autolayout-padding {
@@ -77743,7 +77743,7 @@
   padding-left: 0px;
   padding-right: calc( var( --scw-spacing-1 ) * 22.5 );
   padding-top: 0px;
-  padding-bottom: calc( var( --scw-spacing-1 ) * 9.5 );
+  padding-bottom: var( --scw-spacing-9 );
 }
@@ -78058,7 +78058,7 @@
 @mixin comp-scw-input-state-success-size-large-type-rounded-input--sizing {
   width: 282px;
-  height: 65px;
+  height: 60px;
 }
 @mixin comp-scw-input-state-success-size-large-type-rounded-input--width {
@@ -78066,7 +78066,7 @@
 }
 @mixin comp-scw-input-state-success-size-large-type-rounded-input--height {
-  height: 65px;
+  height: 60px;
 }
 @mixin comp-scw-input-state-success-size-large-type-rounded-input--padding {
@@ -78166,16 +78166,16 @@
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 0.5 );
   margin-right: calc( var( --scw-spacing-1 ) * 23.7 );
-  margin-top: 0px;
-  margin-bottom: 0px;
+  margin-top: calc( var( --scw-spacing-1 ) * -0.25 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * -0.25 );
 }
 @mixin comp-scw-input-state-success-size-large-type-rounded-input-icon-left--html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 0.5 );
   padding-right: calc( var( --scw-spacing-1 ) * 23.7 );
-  padding-top: 0px;
-  padding-bottom: 0px;
+  padding-top: calc( var( --scw-spacing-1 ) * -0.25 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * -0.25 );
 }
@@ -78369,7 +78369,7 @@
 @mixin comp-scw-input-state-success-size-large-type-rounded-input-placeholder--sizing {
   width: 172px;
-  height: 31px;
+  height: 27px;
 }
 @mixin comp-scw-input-state-success-size-large-type-rounded-input-placeholder--width {
@@ -78377,7 +78377,7 @@
 }
 @mixin comp-scw-input-state-success-size-large-type-rounded-input-placeholder--height {
-  height: 31px;
+  height: 27px;
 }
 @mixin comp-scw-input-state-success-size-large-type-rounded-input-placeholder--padding {
@@ -78410,16 +78410,16 @@
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 4.5 );
   margin-right: calc( var( --scw-spacing-1 ) * 6.5 );
-  margin-top: calc( var( --scw-spacing-1 ) * 1.7 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 1.7 );
+  margin-top: calc( var( --scw-spacing-1 ) * 1.65 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 1.65 );
 }
 @mixin comp-scw-input-state-success-size-large-type-rounded-input-placeholder--html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 4.5 );
   padding-right: calc( var( --scw-spacing-1 ) * 6.5 );
-  padding-top: calc( var( --scw-spacing-1 ) * 1.7 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 1.7 );
+  padding-top: calc( var( --scw-spacing-1 ) * 1.65 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 1.65 );
 }
@@ -78427,7 +78427,7 @@
   $themeVar: false
 ) {
   text-align: LEFT;
-  font: var( --scw-type-text-06-font );
+  font: var( --scw-type-text-font );
   @if $themeVar {
     color: var( #{$themeVar} , rgba(114,118,121,1) );
   } @else {
@@ -78438,7 +78438,7 @@
 @mixin comp-scw-input-state-success-size-large-type-rounded-input-placeholder-placeholder--sizing {
   width: 152px;
-  height: 31px;
+  height: 27px;
 }
 @mixin comp-scw-input-state-success-size-large-type-rounded-input-placeholder-placeholder--width {
@@ -78446,7 +78446,7 @@
 }
 @mixin comp-scw-input-state-success-size-large-type-rounded-input-placeholder-placeholder--height {
-  height: 31px;
+  height: 27px;
 }
 @mixin comp-scw-input-state-success-size-large-type-rounded-input-placeholder-placeholder--padding {
@@ -78531,16 +78531,16 @@
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 21.7 );
   margin-right: calc( var( --scw-spacing-1 ) * 0.5 );
-  margin-top: 0px;
-  margin-bottom: 0px;
+  margin-top: calc( var( --scw-spacing-1 ) * -0.25 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * -0.25 );
 }
 @mixin comp-scw-input-state-success-size-large-type-rounded-input-icon-right--html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 21.7 );
   padding-right: calc( var( --scw-spacing-1 ) * 0.5 );
-  padding-top: 0px;
-  padding-bottom: 0px;
+  padding-top: calc( var( --scw-spacing-1 ) * -0.25 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * -0.25 );
 }
@@ -78782,7 +78782,7 @@
   display: inline-block;
   margin-left: 0px;
   margin-right: calc( var( --scw-spacing-1 ) * 22.5 );
-  margin-top: calc( var( --scw-spacing-1 ) * 9.8 );
+  margin-top: calc( var( --scw-spacing-1 ) * 9.3 );
   margin-bottom: 0px;
 }
@@ -78790,7 +78790,7 @@
   display: inline-block;
   padding-left: 0px;
   padding-right: calc( var( --scw-spacing-1 ) * 22.5 );
-  padding-top: calc( var( --scw-spacing-1 ) * 9.8 );
+  padding-top: calc( var( --scw-spacing-1 ) * 9.3 );
   padding-bottom: 0px;
 }
@@ -80093,7 +80093,7 @@
 @mixin comp-scw-input-state-focused-size-large-type-rounded--sizing {
   width: 282px;
-  height: 118px;
+  height: 113px;
 }
 @mixin comp-scw-input-state-focused-size-large-type-rounded--width {
@@ -80101,7 +80101,7 @@
 }
 @mixin comp-scw-input-state-focused-size-large-type-rounded--height {
-  height: 118px;
+  height: 113px;
 }
 @mixin comp-scw-input-state-focused-size-large-type-rounded--padding {
@@ -80131,14 +80131,14 @@
   left: calc( var( --scw-spacing-1 ) * 34.2 );
   width: 282px;
   bottom: calc( var( --scw-spacing-1 ) * 24 );
-  height: 118px;
+  height: 113px;
 }
 @mixin comp-scw-input-state-focused-size-large-type-rounded--html-autolayout-margins {
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 34.2 );
   margin-right: calc( var( --scw-spacing-1 ) * 108.9 );
-  margin-top: calc( var( --scw-spacing-1 ) * 72.8 );
+  margin-top: calc( var( --scw-spacing-1 ) * 73.3 );
   margin-bottom: calc( var( --scw-spacing-1 ) * 24 );
 }
@@ -80146,7 +80146,7 @@
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 34.2 );
   padding-right: calc( var( --scw-spacing-1 ) * 108.9 );
-  padding-top: calc( var( --scw-spacing-1 ) * 72.8 );
+  padding-top: calc( var( --scw-spacing-1 ) * 73.3 );
   padding-bottom: calc( var( --scw-spacing-1 ) * 24 );
 }
@@ -80206,7 +80206,7 @@
   margin-left: 0px;
   margin-right: calc( var( --scw-spacing-1 ) * 22.5 );
   margin-top: 0px;
-  margin-bottom: calc( var( --scw-spacing-1 ) * 9.5 );
+  margin-bottom: var( --scw-spacing-9 );
 }
 @mixin comp-scw-input-state-focused-size-large-type-rounded-label--html-autolayout-padding {
@@ -80214,7 +80214,7 @@
   padding-left: 0px;
   padding-right: calc( var( --scw-spacing-1 ) * 22.5 );
   padding-top: 0px;
-  padding-bottom: calc( var( --scw-spacing-1 ) * 9.5 );
+  padding-bottom: var( --scw-spacing-9 );
 }
@@ -80529,7 +80529,7 @@
 @mixin comp-scw-input-state-focused-size-large-type-rounded-input--sizing {
   width: 282px;
-  height: 65px;
+  height: 60px;
 }
 @mixin comp-scw-input-state-focused-size-large-type-rounded-input--width {
@@ -80537,7 +80537,7 @@
 }
 @mixin comp-scw-input-state-focused-size-large-type-rounded-input--height {
-  height: 65px;
+  height: 60px;
 }
 @mixin comp-scw-input-state-focused-size-large-type-rounded-input--padding {
@@ -80637,16 +80637,16 @@
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 0.5 );
   margin-right: calc( var( --scw-spacing-1 ) * 23.7 );
-  margin-top: 0px;
-  margin-bottom: 0px;
+  margin-top: calc( var( --scw-spacing-1 ) * -0.25 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * -0.25 );
 }
 @mixin comp-scw-input-state-focused-size-large-type-rounded-input-icon-left--html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 0.5 );
   padding-right: calc( var( --scw-spacing-1 ) * 23.7 );
-  padding-top: 0px;
-  padding-bottom: 0px;
+  padding-top: calc( var( --scw-spacing-1 ) * -0.25 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * -0.25 );
 }
@@ -80840,7 +80840,7 @@
 @mixin comp-scw-input-state-focused-size-large-type-rounded-input-placeholder--sizing {
   width: 172px;
-  height: 31px;
+  height: 27px;
 }
 @mixin comp-scw-input-state-focused-size-large-type-rounded-input-placeholder--width {
@@ -80848,7 +80848,7 @@
 }
 @mixin comp-scw-input-state-focused-size-large-type-rounded-input-placeholder--height {
-  height: 31px;
+  height: 27px;
 }
 @mixin comp-scw-input-state-focused-size-large-type-rounded-input-placeholder--padding {
@@ -80881,16 +80881,16 @@
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 4.5 );
   margin-right: calc( var( --scw-spacing-1 ) * 6.5 );
-  margin-top: calc( var( --scw-spacing-1 ) * 1.7 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 1.7 );
+  margin-top: calc( var( --scw-spacing-1 ) * 1.65 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 1.65 );
 }
 @mixin comp-scw-input-state-focused-size-large-type-rounded-input-placeholder--html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 4.5 );
   padding-right: calc( var( --scw-spacing-1 ) * 6.5 );
-  padding-top: calc( var( --scw-spacing-1 ) * 1.7 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 1.7 );
+  padding-top: calc( var( --scw-spacing-1 ) * 1.65 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 1.65 );
 }
@@ -80898,7 +80898,7 @@
   $themeVar: false
 ) {
   text-align: LEFT;
-  font: var( --scw-type-text-06-font );
+  font: var( --scw-type-text-font );
   @if $themeVar {
     color: var( #{$themeVar} , rgba(114,118,121,1) );
   } @else {
@@ -80909,7 +80909,7 @@
 @mixin comp-scw-input-state-focused-size-large-type-rounded-input-placeholder-placeholder--sizing {
   width: 152px;
-  height: 31px;
+  height: 27px;
 }
 @mixin comp-scw-input-state-focused-size-large-type-rounded-input-placeholder-placeholder--width {
@@ -80917,7 +80917,7 @@
 }
 @mixin comp-scw-input-state-focused-size-large-type-rounded-input-placeholder-placeholder--height {
-  height: 31px;
+  height: 27px;
 }
 @mixin comp-scw-input-state-focused-size-large-type-rounded-input-placeholder-placeholder--padding {
@@ -81002,16 +81002,16 @@
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 21.7 );
   margin-right: calc( var( --scw-spacing-1 ) * 0.5 );
-  margin-top: 0px;
-  margin-bottom: 0px;
+  margin-top: calc( var( --scw-spacing-1 ) * -0.25 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * -0.25 );
 }
 @mixin comp-scw-input-state-focused-size-large-type-rounded-input-icon-right--html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 21.7 );
   padding-right: calc( var( --scw-spacing-1 ) * 0.5 );
-  padding-top: 0px;
-  padding-bottom: 0px;
+  padding-top: calc( var( --scw-spacing-1 ) * -0.25 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * -0.25 );
 }
@@ -81305,7 +81305,7 @@
   display: inline-block;
   margin-left: 0px;
   margin-right: calc( var( --scw-spacing-1 ) * 22.5 );
-  margin-top: calc( var( --scw-spacing-1 ) * 9.8 );
+  margin-top: calc( var( --scw-spacing-1 ) * 9.3 );
   margin-bottom: 0px;
 }
@@ -81313,7 +81313,7 @@
   display: inline-block;
   padding-left: 0px;
   padding-right: calc( var( --scw-spacing-1 ) * 22.5 );
-  padding-top: calc( var( --scw-spacing-1 ) * 9.8 );
+  padding-top: calc( var( --scw-spacing-1 ) * 9.3 );
   padding-bottom: 0px;
 }
@@ -82615,7 +82615,7 @@
 @mixin comp-scw-input-state-disabled-size-large-type-rounded--sizing {
   width: 282px;
-  height: 118px;
+  height: 113px;
 }
 @mixin comp-scw-input-state-disabled-size-large-type-rounded--width {
@@ -82623,7 +82623,7 @@
 }
 @mixin comp-scw-input-state-disabled-size-large-type-rounded--height {
-  height: 118px;
+  height: 113px;
 }
 @mixin comp-scw-input-state-disabled-size-large-type-rounded--padding {
@@ -82653,14 +82653,14 @@
   left: calc( var( --scw-spacing-1 ) * 66.4 );
   width: 282px;
   bottom: calc( var( --scw-spacing-1 ) * 24 );
-  height: 118px;
+  height: 113px;
 }
 @mixin comp-scw-input-state-disabled-size-large-type-rounded--html-autolayout-margins {
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 66.4 );
   margin-right: calc( var( --scw-spacing-1 ) * 76.7 );
-  margin-top: calc( var( --scw-spacing-1 ) * 72.8 );
+  margin-top: calc( var( --scw-spacing-1 ) * 73.3 );
   margin-bottom: calc( var( --scw-spacing-1 ) * 24 );
 }
@@ -82668,7 +82668,7 @@
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 66.4 );
   padding-right: calc( var( --scw-spacing-1 ) * 76.7 );
-  padding-top: calc( var( --scw-spacing-1 ) * 72.8 );
+  padding-top: calc( var( --scw-spacing-1 ) * 73.3 );
   padding-bottom: calc( var( --scw-spacing-1 ) * 24 );
 }
@@ -82728,7 +82728,7 @@
   margin-left: 0px;
   margin-right: calc( var( --scw-spacing-1 ) * 22.5 );
   margin-top: 0px;
-  margin-bottom: calc( var( --scw-spacing-1 ) * 9.5 );
+  margin-bottom: var( --scw-spacing-9 );
 }
 @mixin comp-scw-input-state-disabled-size-large-type-rounded-label--html-autolayout-padding {
@@ -82736,7 +82736,7 @@
   padding-left: 0px;
   padding-right: calc( var( --scw-spacing-1 ) * 22.5 );
   padding-top: 0px;
-  padding-bottom: calc( var( --scw-spacing-1 ) * 9.5 );
+  padding-bottom: var( --scw-spacing-9 );
 }
@@ -83051,7 +83051,7 @@
 @mixin comp-scw-input-state-disabled-size-large-type-rounded-input--sizing {
   width: 282px;
-  height: 65px;
+  height: 60px;
 }
 @mixin comp-scw-input-state-disabled-size-large-type-rounded-input--width {
@@ -83059,7 +83059,7 @@
 }
 @mixin comp-scw-input-state-disabled-size-large-type-rounded-input--height {
-  height: 65px;
+  height: 60px;
 }
 @mixin comp-scw-input-state-disabled-size-large-type-rounded-input--padding {
@@ -83159,16 +83159,16 @@
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 0.5 );
   margin-right: calc( var( --scw-spacing-1 ) * 23.7 );
-  margin-top: 0px;
-  margin-bottom: 0px;
+  margin-top: calc( var( --scw-spacing-1 ) * -0.25 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * -0.25 );
 }
 @mixin comp-scw-input-state-disabled-size-large-type-rounded-input-icon-left--html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 0.5 );
   padding-right: calc( var( --scw-spacing-1 ) * 23.7 );
-  padding-top: 0px;
-  padding-bottom: 0px;
+  padding-top: calc( var( --scw-spacing-1 ) * -0.25 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * -0.25 );
 }
@@ -83362,7 +83362,7 @@
 @mixin comp-scw-input-state-disabled-size-large-type-rounded-input-placeholder--sizing {
   width: 172px;
-  height: 31px;
+  height: 27px;
 }
 @mixin comp-scw-input-state-disabled-size-large-type-rounded-input-placeholder--width {
@@ -83370,7 +83370,7 @@
 }
 @mixin comp-scw-input-state-disabled-size-large-type-rounded-input-placeholder--height {
-  height: 31px;
+  height: 27px;
 }
 @mixin comp-scw-input-state-disabled-size-large-type-rounded-input-placeholder--padding {
@@ -83403,16 +83403,16 @@
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 4.5 );
   margin-right: calc( var( --scw-spacing-1 ) * 6.5 );
-  margin-top: calc( var( --scw-spacing-1 ) * 1.7 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 1.7 );
+  margin-top: calc( var( --scw-spacing-1 ) * 1.65 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 1.65 );
 }
 @mixin comp-scw-input-state-disabled-size-large-type-rounded-input-placeholder--html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 4.5 );
   padding-right: calc( var( --scw-spacing-1 ) * 6.5 );
-  padding-top: calc( var( --scw-spacing-1 ) * 1.7 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 1.7 );
+  padding-top: calc( var( --scw-spacing-1 ) * 1.65 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 1.65 );
 }
@@ -83420,7 +83420,7 @@
   $themeVar: false
 ) {
   text-align: LEFT;
-  font: var( --scw-type-text-06-font );
+  font: var( --scw-type-text-font );
   @if $themeVar {
     color: var( #{$themeVar}-06 , var( --scw-color-grey-06 ) );
   } @else {
@@ -83431,7 +83431,7 @@
 @mixin comp-scw-input-state-disabled-size-large-type-rounded-input-placeholder-placeholder--sizing {
   width: 152px;
-  height: 31px;
+  height: 27px;
 }
 @mixin comp-scw-input-state-disabled-size-large-type-rounded-input-placeholder-placeholder--width {
@@ -83439,7 +83439,7 @@
 }
 @mixin comp-scw-input-state-disabled-size-large-type-rounded-input-placeholder-placeholder--height {
-  height: 31px;
+  height: 27px;
 }
 @mixin comp-scw-input-state-disabled-size-large-type-rounded-input-placeholder-placeholder--padding {
@@ -83524,16 +83524,16 @@
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 21.7 );
   margin-right: calc( var( --scw-spacing-1 ) * 0.5 );
-  margin-top: 0px;
-  margin-bottom: 0px;
+  margin-top: calc( var( --scw-spacing-1 ) * -0.25 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * -0.25 );
 }
 @mixin comp-scw-input-state-disabled-size-large-type-rounded-input-icon-right--html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 21.7 );
   padding-right: calc( var( --scw-spacing-1 ) * 0.5 );
-  padding-top: 0px;
-  padding-bottom: 0px;
+  padding-top: calc( var( --scw-spacing-1 ) * -0.25 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * -0.25 );
 }
@@ -83718,9 +83718,9 @@
   $borderThemeVar: false
 ) {
   @if $bgThemeVar {
-    background-color: var( #{$bgThemeVar}-04 , var( --scw-color-grey-04 ) );
+    background-color: var( #{$bgThemeVar}-06 , var( --scw-color-grey-06 ) );
   } @else {
-    background-color: var( --scw-color-grey-04 );
+    background-color: var( --scw-color-grey-06 );
   }
 }
@@ -83827,7 +83827,7 @@
   display: inline-block;
   margin-left: 0px;
   margin-right: calc( var( --scw-spacing-1 ) * 22.5 );
-  margin-top: calc( var( --scw-spacing-1 ) * 9.8 );
+  margin-top: calc( var( --scw-spacing-1 ) * 9.3 );
   margin-bottom: 0px;
 }
@@ -83835,7 +83835,7 @@
   display: inline-block;
   padding-left: 0px;
   padding-right: calc( var( --scw-spacing-1 ) * 22.5 );
-  padding-top: calc( var( --scw-spacing-1 ) * 9.8 );
+  padding-top: calc( var( --scw-spacing-1 ) * 9.3 );
   padding-bottom: 0px;
 }
@@ -85137,7 +85137,7 @@
 @mixin comp-scw-input-state-error-size-large-type-rounded--sizing {
   width: 282px;
-  height: 118px;
+  height: 113px;
 }
 @mixin comp-scw-input-state-error-size-large-type-rounded--width {
@@ -85145,7 +85145,7 @@
 }
 @mixin comp-scw-input-state-error-size-large-type-rounded--height {
-  height: 118px;
+  height: 113px;
 }
 @mixin comp-scw-input-state-error-size-large-type-rounded--padding {
@@ -85175,14 +85175,14 @@
   left: calc( var( --scw-spacing-1 ) * 98.6 );
   width: 282px;
   bottom: calc( var( --scw-spacing-1 ) * 24 );
-  height: 118px;
+  height: 113px;
 }
 @mixin comp-scw-input-state-error-size-large-type-rounded--html-autolayout-margins {
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 98.6 );
   margin-right: calc( var( --scw-spacing-1 ) * 44.5 );
-  margin-top: calc( var( --scw-spacing-1 ) * 72.8 );
+  margin-top: calc( var( --scw-spacing-1 ) * 73.3 );
   margin-bottom: calc( var( --scw-spacing-1 ) * 24 );
 }
@@ -85190,7 +85190,7 @@
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 98.6 );
   padding-right: calc( var( --scw-spacing-1 ) * 44.5 );
-  padding-top: calc( var( --scw-spacing-1 ) * 72.8 );
+  padding-top: calc( var( --scw-spacing-1 ) * 73.3 );
   padding-bottom: calc( var( --scw-spacing-1 ) * 24 );
 }
@@ -85250,7 +85250,7 @@
   margin-left: 0px;
   margin-right: calc( var( --scw-spacing-1 ) * 22.5 );
   margin-top: 0px;
-  margin-bottom: calc( var( --scw-spacing-1 ) * 9.5 );
+  margin-bottom: var( --scw-spacing-9 );
 }
 @mixin comp-scw-input-state-error-size-large-type-rounded-label--html-autolayout-padding {
@@ -85258,7 +85258,7 @@
   padding-left: 0px;
   padding-right: calc( var( --scw-spacing-1 ) * 22.5 );
   padding-top: 0px;
-  padding-bottom: calc( var( --scw-spacing-1 ) * 9.5 );
+  padding-bottom: var( --scw-spacing-9 );
 }
@@ -85573,7 +85573,7 @@
 @mixin comp-scw-input-state-error-size-large-type-rounded-input--sizing {
   width: 282px;
-  height: 65px;
+  height: 60px;
 }
 @mixin comp-scw-input-state-error-size-large-type-rounded-input--width {
@@ -85581,7 +85581,7 @@
 }
 @mixin comp-scw-input-state-error-size-large-type-rounded-input--height {
-  height: 65px;
+  height: 60px;
 }
 @mixin comp-scw-input-state-error-size-large-type-rounded-input--padding {
@@ -85681,16 +85681,16 @@
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 0.5 );
   margin-right: calc( var( --scw-spacing-1 ) * 23.7 );
-  margin-top: 0px;
-  margin-bottom: 0px;
+  margin-top: calc( var( --scw-spacing-1 ) * -0.25 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * -0.25 );
 }
 @mixin comp-scw-input-state-error-size-large-type-rounded-input-icon-left--html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 0.5 );
   padding-right: calc( var( --scw-spacing-1 ) * 23.7 );
-  padding-top: 0px;
-  padding-bottom: 0px;
+  padding-top: calc( var( --scw-spacing-1 ) * -0.25 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * -0.25 );
 }
@@ -85884,7 +85884,7 @@
 @mixin comp-scw-input-state-error-size-large-type-rounded-input-placeholder--sizing {
   width: 172px;
-  height: 31px;
+  height: 27px;
 }
 @mixin comp-scw-input-state-error-size-large-type-rounded-input-placeholder--width {
@@ -85892,7 +85892,7 @@
 }
 @mixin comp-scw-input-state-error-size-large-type-rounded-input-placeholder--height {
-  height: 31px;
+  height: 27px;
 }
 @mixin comp-scw-input-state-error-size-large-type-rounded-input-placeholder--padding {
@@ -85925,16 +85925,16 @@
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 4.5 );
   margin-right: calc( var( --scw-spacing-1 ) * 6.5 );
-  margin-top: calc( var( --scw-spacing-1 ) * 1.7 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 1.7 );
+  margin-top: calc( var( --scw-spacing-1 ) * 1.65 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 1.65 );
 }
 @mixin comp-scw-input-state-error-size-large-type-rounded-input-placeholder--html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 4.5 );
   padding-right: calc( var( --scw-spacing-1 ) * 6.5 );
-  padding-top: calc( var( --scw-spacing-1 ) * 1.7 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 1.7 );
+  padding-top: calc( var( --scw-spacing-1 ) * 1.65 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 1.65 );
 }
@@ -85942,7 +85942,7 @@
   $themeVar: false
 ) {
   text-align: LEFT;
-  font: var( --scw-type-text-06-font );
+  font: var( --scw-type-text-font );
   @if $themeVar {
     color: var( #{$themeVar} , rgba(114,118,121,1) );
   } @else {
@@ -85953,7 +85953,7 @@
 @mixin comp-scw-input-state-error-size-large-type-rounded-input-placeholder-placeholder--sizing {
   width: 152px;
-  height: 31px;
+  height: 27px;
 }
 @mixin comp-scw-input-state-error-size-large-type-rounded-input-placeholder-placeholder--width {
@@ -85961,7 +85961,7 @@
 }
 @mixin comp-scw-input-state-error-size-large-type-rounded-input-placeholder-placeholder--height {
-  height: 31px;
+  height: 27px;
 }
 @mixin comp-scw-input-state-error-size-large-type-rounded-input-placeholder-placeholder--padding {
@@ -86046,16 +86046,16 @@
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 21.7 );
   margin-right: calc( var( --scw-spacing-1 ) * 0.5 );
-  margin-top: 0px;
-  margin-bottom: 0px;
+  margin-top: calc( var( --scw-spacing-1 ) * -0.25 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * -0.25 );
 }
 @mixin comp-scw-input-state-error-size-large-type-rounded-input-icon-right--html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 21.7 );
   padding-right: calc( var( --scw-spacing-1 ) * 0.5 );
-  padding-top: 0px;
-  padding-bottom: 0px;
+  padding-top: calc( var( --scw-spacing-1 ) * -0.25 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * -0.25 );
 }
@@ -86349,7 +86349,7 @@
   display: inline-block;
   margin-left: 0px;
   margin-right: calc( var( --scw-spacing-1 ) * 22.5 );
-  margin-top: calc( var( --scw-spacing-1 ) * 9.8 );
+  margin-top: calc( var( --scw-spacing-1 ) * 9.3 );
   margin-bottom: 0px;
 }
@@ -86357,7 +86357,7 @@
   display: inline-block;
   padding-left: 0px;
   padding-right: calc( var( --scw-spacing-1 ) * 22.5 );
-  padding-top: calc( var( --scw-spacing-1 ) * 9.8 );
+  padding-top: calc( var( --scw-spacing-1 ) * 9.3 );
   padding-bottom: 0px;
 }
@@ -136747,7 +136747,7 @@
 @mixin comp-scw-tag--sizing {
   width: 436px;
-  height: 300px;
+  height: 385px;
 }
 @mixin comp-scw-tag--width {
@@ -136755,7 +136755,7 @@
 }
 @mixin comp-scw-tag--height {
-  height: 300px;
+  height: 385px;
 }
 @mixin comp-scw-tag--padding {
@@ -136850,7 +136850,7 @@
   margin-left: var( --scw-spacing-2 );
   margin-right: calc( var( --scw-spacing-1 ) * 28.7 );
   margin-top: calc( var( --scw-spacing-1 ) * 2.2 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 24.8 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 33.3 );
 }
 @mixin comp-scw-tag-default--html-autolayout-padding {
@@ -136858,7 +136858,7 @@
   padding-left: var( --scw-spacing-2 );
   padding-right: calc( var( --scw-spacing-1 ) * 28.7 );
   padding-top: calc( var( --scw-spacing-1 ) * 2.2 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 24.8 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 33.3 );
 }
@@ -137142,7 +137142,7 @@
   position: absolute;
   left: var( --scw-spacing-2 );
   width: 112px;
-  top: calc( var( --scw-spacing-1 ) * 16.3 );
+  top: calc( var( --scw-spacing-1 ) * 19.25 );
   height: 27px;
 }
@@ -137150,16 +137150,16 @@
   display: inline-block;
   margin-left: var( --scw-spacing-2 );
   margin-right: calc( var( --scw-spacing-1 ) * 30.4 );
-  margin-top: calc( var( --scw-spacing-1 ) * 16.3 );
-  margin-bottom: var( --scw-spacing-11 );
+  margin-top: calc( var( --scw-spacing-1 ) * 19.25 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 16.55 );
 }
 @mixin comp-scw-tag-size-small--html-autolayout-padding {
   display: inline-block;
   padding-left: var( --scw-spacing-2 );
   padding-right: calc( var( --scw-spacing-1 ) * 30.4 );
-  padding-top: calc( var( --scw-spacing-1 ) * 16.3 );
-  padding-bottom: var( --scw-spacing-11 );
+  padding-top: calc( var( --scw-spacing-1 ) * 19.25 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 16.55 );
 }
@@ -137452,7 +137452,7 @@
   margin-left: calc( var( --scw-spacing-1 ) * 21.9 );
   margin-right: calc( var( --scw-spacing-1 ) * 8.8 );
   margin-top: calc( var( --scw-spacing-1 ) * 2.2 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 24.8 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 33.3 );
 }
 @mixin comp-scw-tag-theme-color-primary--html-autolayout-padding {
@@ -137460,7 +137460,7 @@
   padding-left: calc( var( --scw-spacing-1 ) * 21.9 );
   padding-right: calc( var( --scw-spacing-1 ) * 8.8 );
   padding-top: calc( var( --scw-spacing-1 ) * 2.2 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 24.8 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 33.3 );
 }
@@ -137744,7 +137744,7 @@
   position: absolute;
   left: calc( var( --scw-spacing-1 ) * 21.9 );
   width: 112px;
-  top: calc( var( --scw-spacing-1 ) * 16.3 );
+  top: calc( var( --scw-spacing-1 ) * 19.25 );
   height: 27px;
 }
@@ -137752,16 +137752,16 @@
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 21.9 );
   margin-right: calc( var( --scw-spacing-1 ) * 10.5 );
-  margin-top: calc( var( --scw-spacing-1 ) * 16.3 );
-  margin-bottom: var( --scw-spacing-11 );
+  margin-top: calc( var( --scw-spacing-1 ) * 19.25 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 16.55 );
 }
 @mixin comp-scw-tag-theme-color-primary-size-small--html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 21.9 );
   padding-right: calc( var( --scw-spacing-1 ) * 10.5 );
-  padding-top: calc( var( --scw-spacing-1 ) * 16.3 );
-  padding-bottom: var( --scw-spacing-11 );
+  padding-top: calc( var( --scw-spacing-1 ) * 19.25 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 16.55 );
 }
@@ -138054,7 +138054,7 @@
   margin-left: var( --scw-spacing-2 );
   margin-right: calc( var( --scw-spacing-1 ) * 28.7 );
   margin-top: calc( var( --scw-spacing-1 ) * 6.2 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 20.8 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 29.3 );
 }
 @mixin comp-scw-tag-state-hover--html-autolayout-padding {
@@ -138062,7 +138062,7 @@
   padding-left: var( --scw-spacing-2 );
   padding-right: calc( var( --scw-spacing-1 ) * 28.7 );
   padding-top: calc( var( --scw-spacing-1 ) * 6.2 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 20.8 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 29.3 );
 }
@@ -138346,7 +138346,7 @@
   position: absolute;
   left: var( --scw-spacing-2 );
   width: 112px;
-  top: calc( var( --scw-spacing-1 ) * 20 );
+  top: calc( var( --scw-spacing-1 ) * 22.95 );
   height: 27px;
 }
@@ -138354,16 +138354,16 @@
   display: inline-block;
   margin-left: var( --scw-spacing-2 );
   margin-right: calc( var( --scw-spacing-1 ) * 30.4 );
-  margin-top: calc( var( --scw-spacing-1 ) * 20 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 7.3 );
+  margin-top: calc( var( --scw-spacing-1 ) * 22.95 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 12.85 );
 }
 @mixin comp-scw-tag-state-hover-size-small--html-autolayout-padding {
   display: inline-block;
   padding-left: var( --scw-spacing-2 );
   padding-right: calc( var( --scw-spacing-1 ) * 30.4 );
-  padding-top: calc( var( --scw-spacing-1 ) * 20 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 7.3 );
+  padding-top: calc( var( --scw-spacing-1 ) * 22.95 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 12.85 );
 }
@@ -138656,7 +138656,7 @@
   margin-left: calc( var( --scw-spacing-1 ) * 21.9 );
   margin-right: calc( var( --scw-spacing-1 ) * 8.8 );
   margin-top: calc( var( --scw-spacing-1 ) * 6.2 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 20.8 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 29.3 );
 }
 @mixin comp-scw-tag-theme-color-primary-state-hover--html-autolayout-padding {
@@ -138664,7 +138664,7 @@
   padding-left: calc( var( --scw-spacing-1 ) * 21.9 );
   padding-right: calc( var( --scw-spacing-1 ) * 8.8 );
   padding-top: calc( var( --scw-spacing-1 ) * 6.2 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 20.8 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 29.3 );
 }
@@ -138948,7 +138948,7 @@
   position: absolute;
   left: calc( var( --scw-spacing-1 ) * 21.9 );
   width: 112px;
-  top: calc( var( --scw-spacing-1 ) * 20 );
+  top: calc( var( --scw-spacing-1 ) * 22.95 );
   height: 27px;
 }
@@ -138956,16 +138956,16 @@
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 21.9 );
   margin-right: calc( var( --scw-spacing-1 ) * 10.5 );
-  margin-top: calc( var( --scw-spacing-1 ) * 20 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 7.3 );
+  margin-top: calc( var( --scw-spacing-1 ) * 22.95 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 12.85 );
 }
 @mixin comp-scw-tag-theme-color-primary-state-hover-size-small--html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 21.9 );
   padding-right: calc( var( --scw-spacing-1 ) * 10.5 );
-  padding-top: calc( var( --scw-spacing-1 ) * 20 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 7.3 );
+  padding-top: calc( var( --scw-spacing-1 ) * 22.95 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 12.85 );
 }
@@ -139203,9 +139203,9 @@
   $borderThemeVar: false
 ) {
   @if $bgThemeVar {
-    background-color: var( #{$bgThemeVar}-02 , var( --scw-color-grey-02 ) );
+    background-color: var( #{$bgThemeVar}-03 , var( --scw-color-grey-03 ) );
   } @else {
-    background-color: var( --scw-color-grey-02 );
+    background-color: var( --scw-color-grey-03 );
   }
   border-radius: 30px 30px 30px 30px;
 }
@@ -139258,7 +139258,7 @@
   margin-left: var( --scw-spacing-2 );
   margin-right: calc( var( --scw-spacing-1 ) * 28.7 );
   margin-top: calc( var( --scw-spacing-1 ) * 10.2 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 16.8 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 25.3 );
 }
 @mixin comp-scw-tag-state-selected--html-autolayout-padding {
@@ -139266,7 +139266,7 @@
   padding-left: var( --scw-spacing-2 );
   padding-right: calc( var( --scw-spacing-1 ) * 28.7 );
   padding-top: calc( var( --scw-spacing-1 ) * 10.2 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 16.8 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 25.3 );
 }
@@ -139424,25 +139424,25 @@
 @mixin comp-scw-tag-state-selected-scw-icon-icon-vector--absolute-layout {
   position: absolute;
   left: calc( var( --scw-spacing-1 ) * 0.08037109375 );
-  right: calc( var( --scw-spacing-1 ) * 0.08034315109252929 );
+  right: calc( var( --scw-spacing-1 ) * 0.08034305572509766 );
   top: calc( var( --scw-spacing-1 ) * 0.1568359375 );
-  bottom: calc( var( --scw-spacing-1 ) * 0.15691490173339845 );
+  bottom: calc( var( --scw-spacing-1 ) * 0.1569148063659668 );
 }
 @mixin comp-scw-tag-state-selected-scw-icon-icon-vector--html-autolayout-margins {
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 0.08037109375 );
-  margin-right: calc( var( --scw-spacing-1 ) * 0.08034315109252929 );
+  margin-right: calc( var( --scw-spacing-1 ) * 0.08034305572509766 );
   margin-top: calc( var( --scw-spacing-1 ) * 0.1568359375 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 0.15691490173339845 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 0.1569148063659668 );
 }
 @mixin comp-scw-tag-state-selected-scw-icon-icon-vector--html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 0.08037109375 );
-  padding-right: calc( var( --scw-spacing-1 ) * 0.08034315109252929 );
+  padding-right: calc( var( --scw-spacing-1 ) * 0.08034305572509766 );
   padding-top: calc( var( --scw-spacing-1 ) * 0.1568359375 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 0.15691490173339845 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.1569148063659668 );
 }
@@ -139499,7 +139499,7 @@
 }
-@mixin comp-scw-tag-state-selected-size-small (
+@mixin comp-scw-tag-state-selected-hover (
   $bgThemeVar: false,
   $borderThemeVar: false
 ) {
@@ -139511,6 +139511,307 @@
   border-radius: 30px 30px 30px 30px;
 }
+@mixin comp-scw-tag-state-selected-hover--sizing {
+  width: 129px;
+  height: 30px;
+}
+@mixin comp-scw-tag-state-selected-hover--width {
+  width: 129px;
+}
+@mixin comp-scw-tag-state-selected-hover--height {
+  height: 30px;
+}
+@mixin comp-scw-tag-state-selected-hover--padding {
+  padding-left: var( --scw-spacing-1 );
+  padding-right: var( --scw-spacing-1 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.5 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.5 );
+}
+@mixin comp-scw-tag-state-selected-hover--figma-autolayout {
+  display: flex;
+  flex-flow: row nowrap;
+  justify-content: center;
+  align-items: center;
+  padding-left: var( --scw-spacing-1 );
+  padding-right: var( --scw-spacing-1 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.5 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.5 );
+  & > *:not(:last-child) {
+        margin-right: calc( var( --scw-spacing-1 ) * 0.5 );
+        --margin-right: calc( var( --scw-spacing-1 ) * 0.5 );
+      }
+}
+@mixin comp-scw-tag-state-selected-hover--absolute-layout {
+  position: absolute;
+  left: var( --scw-spacing-2 );
+  width: 129px;
+  top: calc( var( --scw-spacing-1 ) * 14.2 );
+  height: 30px;
+}
+@mixin comp-scw-tag-state-selected-hover--html-autolayout-margins {
+  display: inline-block;
+  margin-left: var( --scw-spacing-2 );
+  margin-right: calc( var( --scw-spacing-1 ) * 28.7 );
+  margin-top: calc( var( --scw-spacing-1 ) * 14.2 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 21.3 );
+}
+@mixin comp-scw-tag-state-selected-hover--html-autolayout-padding {
+  display: inline-block;
+  padding-left: var( --scw-spacing-2 );
+  padding-right: calc( var( --scw-spacing-1 ) * 28.7 );
+  padding-top: calc( var( --scw-spacing-1 ) * 14.2 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 21.3 );
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon (
+  $bgThemeVar: false,
+  $borderThemeVar: false
+) {
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar} , rgba(0,0,0,0) );
+  } @else {
+    background-color: rgba(0,0,0,0);
+  }
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon--sizing {
+  width: 15px;
+  height: 15px;
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon--width {
+  width: 15px;
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon--height {
+  height: 15px;
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon--padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon--figma-autolayout {
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon--absolute-layout {
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon--html-autolayout-margins {
+  display: inline-block;
+  margin-left: var( --scw-spacing-1 );
+  margin-right: calc( var( --scw-spacing-1 ) * 10.4 );
+  margin-top: calc( var( --scw-spacing-1 ) * 0.75 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 0.75 );
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon--html-autolayout-padding {
+  display: inline-block;
+  padding-left: var( --scw-spacing-1 );
+  padding-right: calc( var( --scw-spacing-1 ) * 10.4 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.75 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.75 );
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon-icon (
+  $bgThemeVar: false,
+  $borderThemeVar: false
+) {
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar} , rgba(0,0,0,0) );
+  } @else {
+    background-color: rgba(0,0,0,0);
+  }
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon-icon--sizing {
+  width: 15px;
+  height: 15px;
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon-icon--width {
+  width: 15px;
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon-icon--height {
+  height: 15px;
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon-icon--padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon-icon--figma-autolayout {
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon-icon--absolute-layout {
+  position: absolute;
+  left: 0px;
+  right: 0px;
+  top: 0px;
+  bottom: 0px;
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon-icon--html-autolayout-margins {
+  display: inline-block;
+  margin-left: 0px;
+  margin-right: 0px;
+  margin-top: 0px;
+  margin-bottom: 0px;
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon-icon--html-autolayout-padding {
+  display: inline-block;
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon-icon-vector (
+  $bgThemeVar: false,
+  $borderThemeVar: false
+) {
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar}-10 , var( --scw-color-grey-10 ) );
+  } @else {
+    background-color: var( --scw-color-grey-10 );
+  }
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon-icon-vector--sizing {
+  width: 13.3929px;
+  height: 11.8625px;
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon-icon-vector--width {
+  width: 13.3929px;
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon-icon-vector--height {
+  height: 11.8625px;
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon-icon-vector--padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon-icon-vector--figma-autolayout {
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon-icon-vector--absolute-layout {
+  position: absolute;
+  left: calc( var( --scw-spacing-1 ) * 0.08037109375 );
+  right: calc( var( --scw-spacing-1 ) * 0.08034315109252929 );
+  top: calc( var( --scw-spacing-1 ) * 0.1568359375 );
+  bottom: calc( var( --scw-spacing-1 ) * 0.15691490173339845 );
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon-icon-vector--html-autolayout-margins {
+  display: inline-block;
+  margin-left: calc( var( --scw-spacing-1 ) * 0.08037109375 );
+  margin-right: calc( var( --scw-spacing-1 ) * 0.08034315109252929 );
+  margin-top: calc( var( --scw-spacing-1 ) * 0.1568359375 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 0.15691490173339845 );
+}
+@mixin comp-scw-tag-state-selected-hover-scw-icon-icon-vector--html-autolayout-padding {
+  display: inline-block;
+  padding-left: calc( var( --scw-spacing-1 ) * 0.08037109375 );
+  padding-right: calc( var( --scw-spacing-1 ) * 0.08034315109252929 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.1568359375 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.15691490173339845 );
+}
+@mixin comp-scw-tag-state-selected-hover-category-label (
+  $themeVar: false
+) {
+  text-align: CENTER;
+  font: var( --scw-type-text-semibold-02-font );
+  @if $themeVar {
+    color: var( #{$themeVar}-10 , var( --scw-color-grey-10 ) );
+  } @else {
+    color: var( --scw-color-grey-10 );
+  }
+}
+@mixin comp-scw-tag-state-selected-hover-category-label--sizing {
+  width: 109px;
+  height: 20px;
+}
+@mixin comp-scw-tag-state-selected-hover-category-label--width {
+  width: 109px;
+}
+@mixin comp-scw-tag-state-selected-hover-category-label--height {
+  height: 20px;
+}
+@mixin comp-scw-tag-state-selected-hover-category-label--padding {
+  padding-left: initial;
+  padding-right: initial;
+  padding-top: initial;
+  padding-bottom: initial;
+}
+@mixin comp-scw-tag-state-selected-hover-category-label--absolute-layout {
+}
+@mixin comp-scw-tag-state-selected-hover-category-label--html-autolayout-margins {
+  display: inline-block;
+  margin-left: var( --scw-spacing-1 );
+  margin-right: var( --scw-spacing-1 );
+  margin-top: calc( var( --scw-spacing-1 ) * 0.5 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 0.5 );
+}
+@mixin comp-scw-tag-state-selected-hover-category-label--html-autolayout-padding {
+  display: inline-block;
+  padding-left: var( --scw-spacing-1 );
+  padding-right: var( --scw-spacing-1 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.5 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.5 );
+}
+@mixin comp-scw-tag-state-selected-size-small (
+  $bgThemeVar: false,
+  $borderThemeVar: false
+) {
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar}-03 , var( --scw-color-grey-03 ) );
+  } @else {
+    background-color: var( --scw-color-grey-03 );
+  }
+  border-radius: 30px 30px 30px 30px;
+}
 @mixin comp-scw-tag-state-selected-size-small--sizing {
   width: 112px;
   height: 27px;
@@ -139550,7 +139851,7 @@
   position: absolute;
   left: var( --scw-spacing-2 );
   width: 112px;
-  top: calc( var( --scw-spacing-1 ) * 23.7 );
+  top: calc( var( --scw-spacing-1 ) * 26.65 );
   height: 27px;
 }
@@ -139558,16 +139859,16 @@
   display: inline-block;
   margin-left: var( --scw-spacing-2 );
   margin-right: calc( var( --scw-spacing-1 ) * 30.4 );
-  margin-top: calc( var( --scw-spacing-1 ) * 23.7 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 3.6 );
+  margin-top: calc( var( --scw-spacing-1 ) * 26.65 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 9.15 );
 }
 @mixin comp-scw-tag-state-selected-size-small--html-autolayout-padding {
   display: inline-block;
   padding-left: var( --scw-spacing-2 );
   padding-right: calc( var( --scw-spacing-1 ) * 30.4 );
-  padding-top: calc( var( --scw-spacing-1 ) * 23.7 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 3.6 );
+  padding-top: calc( var( --scw-spacing-1 ) * 26.65 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 9.15 );
 }
@@ -139725,7 +140026,7 @@
 @mixin comp-scw-tag-state-selected-size-small-scw-icon-icon-vector--absolute-layout {
   position: absolute;
   left: calc( var( --scw-spacing-1 ) * 0.0642578125 );
-  right: calc( var( --scw-spacing-1 ) * 0.06431360244750976 );
+  right: calc( var( --scw-spacing-1 ) * 0.06431350708007813 );
   top: calc( var( --scw-spacing-1 ) * 0.1255859375 );
   bottom: calc( var( --scw-spacing-1 ) * 0.12541465759277343 );
 }
@@ -139733,7 +140034,7 @@
 @mixin comp-scw-tag-state-selected-size-small-scw-icon-icon-vector--html-autolayout-margins {
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 0.0642578125 );
-  margin-right: calc( var( --scw-spacing-1 ) * 0.06431360244750976 );
+  margin-right: calc( var( --scw-spacing-1 ) * 0.06431350708007813 );
   margin-top: calc( var( --scw-spacing-1 ) * 0.1255859375 );
   margin-bottom: calc( var( --scw-spacing-1 ) * 0.12541465759277343 );
 }
@@ -139741,7 +140042,7 @@
 @mixin comp-scw-tag-state-selected-size-small-scw-icon-icon-vector--html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 0.0642578125 );
-  padding-right: calc( var( --scw-spacing-1 ) * 0.06431360244750976 );
+  padding-right: calc( var( --scw-spacing-1 ) * 0.06431350708007813 );
   padding-top: calc( var( --scw-spacing-1 ) * 0.1255859375 );
   padding-bottom: calc( var( --scw-spacing-1 ) * 0.12541465759277343 );
 }
@@ -139800,6 +140101,307 @@
 }
+@mixin comp-scw-tag-state-selected-hover-size-small (
+  $bgThemeVar: false,
+  $borderThemeVar: false
+) {
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar}-02 , var( --scw-color-grey-02 ) );
+  } @else {
+    background-color: var( --scw-color-grey-02 );
+  }
+  border-radius: 30px 30px 30px 30px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small--sizing {
+  width: 112px;
+  height: 27px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small--width {
+  width: 112px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small--height {
+  height: 27px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small--padding {
+  padding-left: var( --scw-spacing-1 );
+  padding-right: var( --scw-spacing-1 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.5 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.5 );
+}
+@mixin comp-scw-tag-state-selected-hover-size-small--figma-autolayout {
+  display: flex;
+  flex-flow: row nowrap;
+  justify-content: center;
+  align-items: center;
+  padding-left: var( --scw-spacing-1 );
+  padding-right: var( --scw-spacing-1 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.5 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.5 );
+  & > *:not(:last-child) {
+        margin-right: calc( var( --scw-spacing-1 ) * 0.5 );
+        --margin-right: calc( var( --scw-spacing-1 ) * 0.5 );
+      }
+}
+@mixin comp-scw-tag-state-selected-hover-size-small--absolute-layout {
+  position: absolute;
+  left: var( --scw-spacing-2 );
+  width: 112px;
+  top: calc( var( --scw-spacing-1 ) * 30.35 );
+  height: 27px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small--html-autolayout-margins {
+  display: inline-block;
+  margin-left: var( --scw-spacing-2 );
+  margin-right: calc( var( --scw-spacing-1 ) * 30.4 );
+  margin-top: calc( var( --scw-spacing-1 ) * 30.35 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 5.45 );
+}
+@mixin comp-scw-tag-state-selected-hover-size-small--html-autolayout-padding {
+  display: inline-block;
+  padding-left: var( --scw-spacing-2 );
+  padding-right: calc( var( --scw-spacing-1 ) * 30.4 );
+  padding-top: calc( var( --scw-spacing-1 ) * 30.35 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 5.45 );
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon (
+  $bgThemeVar: false,
+  $borderThemeVar: false
+) {
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar} , rgba(0,0,0,0) );
+  } @else {
+    background-color: rgba(0,0,0,0);
+  }
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon--sizing {
+  width: 12px;
+  height: 12px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon--width {
+  width: 12px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon--height {
+  height: 12px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon--padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon--figma-autolayout {
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon--absolute-layout {
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon--html-autolayout-margins {
+  display: inline-block;
+  margin-left: var( --scw-spacing-1 );
+  margin-right: var( --scw-spacing-9 );
+  margin-top: calc( var( --scw-spacing-1 ) * 0.75 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 0.75 );
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon--html-autolayout-padding {
+  display: inline-block;
+  padding-left: var( --scw-spacing-1 );
+  padding-right: var( --scw-spacing-9 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.75 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.75 );
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon-icon (
+  $bgThemeVar: false,
+  $borderThemeVar: false
+) {
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar} , rgba(0,0,0,0) );
+  } @else {
+    background-color: rgba(0,0,0,0);
+  }
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon-icon--sizing {
+  width: 12px;
+  height: 12px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon-icon--width {
+  width: 12px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon-icon--height {
+  height: 12px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon-icon--padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon-icon--figma-autolayout {
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon-icon--absolute-layout {
+  position: absolute;
+  left: 0px;
+  right: 0px;
+  top: 0px;
+  bottom: 0px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon-icon--html-autolayout-margins {
+  display: inline-block;
+  margin-left: 0px;
+  margin-right: 0px;
+  margin-top: 0px;
+  margin-bottom: 0px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon-icon--html-autolayout-padding {
+  display: inline-block;
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon-icon-vector (
+  $bgThemeVar: false,
+  $borderThemeVar: false
+) {
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar}-10 , var( --scw-color-grey-10 ) );
+  } @else {
+    background-color: var( --scw-color-grey-10 );
+  }
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon-icon-vector--sizing {
+  width: 10.7143px;
+  height: 9.49px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon-icon-vector--width {
+  width: 10.7143px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon-icon-vector--height {
+  height: 9.49px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon-icon-vector--padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon-icon-vector--figma-autolayout {
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon-icon-vector--absolute-layout {
+  position: absolute;
+  left: calc( var( --scw-spacing-1 ) * 0.0642578125 );
+  right: calc( var( --scw-spacing-1 ) * 0.06431360244750976 );
+  top: calc( var( --scw-spacing-1 ) * 0.1255859375 );
+  bottom: calc( var( --scw-spacing-1 ) * 0.12541465759277343 );
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon-icon-vector--html-autolayout-margins {
+  display: inline-block;
+  margin-left: calc( var( --scw-spacing-1 ) * 0.0642578125 );
+  margin-right: calc( var( --scw-spacing-1 ) * 0.06431360244750976 );
+  margin-top: calc( var( --scw-spacing-1 ) * 0.1255859375 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 0.12541465759277343 );
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-scw-icon-icon-vector--html-autolayout-padding {
+  display: inline-block;
+  padding-left: calc( var( --scw-spacing-1 ) * 0.0642578125 );
+  padding-right: calc( var( --scw-spacing-1 ) * 0.06431360244750976 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.1255859375 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.12541465759277343 );
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-category-label (
+  $themeVar: false
+) {
+  text-align: CENTER;
+  font: var( --scw-type-text-semibold-01-font );
+  @if $themeVar {
+    color: var( #{$themeVar}-10 , var( --scw-color-grey-10 ) );
+  } @else {
+    color: var( --scw-color-grey-10 );
+  }
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-category-label--sizing {
+  width: 92px;
+  height: 17px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-category-label--width {
+  width: 92px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-category-label--height {
+  height: 17px;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-category-label--padding {
+  padding-left: initial;
+  padding-right: initial;
+  padding-top: initial;
+  padding-bottom: initial;
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-category-label--absolute-layout {
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-category-label--html-autolayout-margins {
+  display: inline-block;
+  margin-left: var( --scw-spacing-1 );
+  margin-right: var( --scw-spacing-1 );
+  margin-top: calc( var( --scw-spacing-1 ) * 0.5 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 0.5 );
+}
+@mixin comp-scw-tag-state-selected-hover-size-small-category-label--html-autolayout-padding {
+  display: inline-block;
+  padding-left: var( --scw-spacing-1 );
+  padding-right: var( --scw-spacing-1 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.5 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.5 );
+}
 @mixin comp-scw-tag-theme-color-primary-state-selected (
   $bgThemeVar: false,
   $borderThemeVar: false
@@ -139860,7 +140462,7 @@
   margin-left: calc( var( --scw-spacing-1 ) * 21.9 );
   margin-right: calc( var( --scw-spacing-1 ) * 8.8 );
   margin-top: calc( var( --scw-spacing-1 ) * 10.2 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 16.8 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 25.3 );
 }
 @mixin comp-scw-tag-theme-color-primary-state-selected--html-autolayout-padding {
@@ -139868,7 +140470,7 @@
   padding-left: calc( var( --scw-spacing-1 ) * 21.9 );
   padding-right: calc( var( --scw-spacing-1 ) * 8.8 );
   padding-top: calc( var( --scw-spacing-1 ) * 10.2 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 16.8 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 25.3 );
 }
@@ -140026,25 +140628,25 @@
 @mixin comp-scw-tag-theme-color-primary-state-selected-scw-icon-icon-vector--absolute-layout {
   position: absolute;
   left: calc( var( --scw-spacing-1 ) * 0.08037109375 );
-  right: calc( var( --scw-spacing-1 ) * 0.08034315109252929 );
+  right: calc( var( --scw-spacing-1 ) * 0.08034305572509766 );
   top: calc( var( --scw-spacing-1 ) * 0.1568359375 );
-  bottom: calc( var( --scw-spacing-1 ) * 0.15691490173339845 );
+  bottom: calc( var( --scw-spacing-1 ) * 0.1569148063659668 );
 }
 @mixin comp-scw-tag-theme-color-primary-state-selected-scw-icon-icon-vector--html-autolayout-margins {
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 0.08037109375 );
-  margin-right: calc( var( --scw-spacing-1 ) * 0.08034315109252929 );
+  margin-right: calc( var( --scw-spacing-1 ) * 0.08034305572509766 );
   margin-top: calc( var( --scw-spacing-1 ) * 0.1568359375 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 0.15691490173339845 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 0.1569148063659668 );
 }
 @mixin comp-scw-tag-theme-color-primary-state-selected-scw-icon-icon-vector--html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 0.08037109375 );
-  padding-right: calc( var( --scw-spacing-1 ) * 0.08034315109252929 );
+  padding-right: calc( var( --scw-spacing-1 ) * 0.08034305572509766 );
   padding-top: calc( var( --scw-spacing-1 ) * 0.1568359375 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 0.15691490173339845 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.1569148063659668 );
 }
@@ -140101,6 +140703,307 @@
 }
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover (
+  $bgThemeVar: false,
+  $borderThemeVar: false
+) {
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar}-01 , var( --scw-color-primary-01 ) );
+  } @else {
+    background-color: var( --scw-color-primary-01 );
+  }
+  border-radius: 30px 30px 30px 30px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover--sizing {
+  width: 129px;
+  height: 30px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover--width {
+  width: 129px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover--height {
+  height: 30px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover--padding {
+  padding-left: var( --scw-spacing-1 );
+  padding-right: var( --scw-spacing-1 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.5 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.5 );
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover--figma-autolayout {
+  display: flex;
+  flex-flow: row nowrap;
+  justify-content: center;
+  align-items: center;
+  padding-left: var( --scw-spacing-1 );
+  padding-right: var( --scw-spacing-1 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.5 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.5 );
+  & > *:not(:last-child) {
+        margin-right: calc( var( --scw-spacing-1 ) * 0.5 );
+        --margin-right: calc( var( --scw-spacing-1 ) * 0.5 );
+      }
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover--absolute-layout {
+  position: absolute;
+  left: calc( var( --scw-spacing-1 ) * 21.9 );
+  width: 129px;
+  top: calc( var( --scw-spacing-1 ) * 14.2 );
+  height: 30px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover--html-autolayout-margins {
+  display: inline-block;
+  margin-left: calc( var( --scw-spacing-1 ) * 21.9 );
+  margin-right: calc( var( --scw-spacing-1 ) * 8.8 );
+  margin-top: calc( var( --scw-spacing-1 ) * 14.2 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 21.3 );
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover--html-autolayout-padding {
+  display: inline-block;
+  padding-left: calc( var( --scw-spacing-1 ) * 21.9 );
+  padding-right: calc( var( --scw-spacing-1 ) * 8.8 );
+  padding-top: calc( var( --scw-spacing-1 ) * 14.2 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 21.3 );
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon (
+  $bgThemeVar: false,
+  $borderThemeVar: false
+) {
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar} , rgba(0,0,0,0) );
+  } @else {
+    background-color: rgba(0,0,0,0);
+  }
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon--sizing {
+  width: 15px;
+  height: 15px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon--width {
+  width: 15px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon--height {
+  height: 15px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon--padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon--figma-autolayout {
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon--absolute-layout {
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon--html-autolayout-margins {
+  display: inline-block;
+  margin-left: var( --scw-spacing-1 );
+  margin-right: calc( var( --scw-spacing-1 ) * 10.4 );
+  margin-top: calc( var( --scw-spacing-1 ) * 0.75 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 0.75 );
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon--html-autolayout-padding {
+  display: inline-block;
+  padding-left: var( --scw-spacing-1 );
+  padding-right: calc( var( --scw-spacing-1 ) * 10.4 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.75 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.75 );
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon-icon (
+  $bgThemeVar: false,
+  $borderThemeVar: false
+) {
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar} , rgba(0,0,0,0) );
+  } @else {
+    background-color: rgba(0,0,0,0);
+  }
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon-icon--sizing {
+  width: 15px;
+  height: 15px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon-icon--width {
+  width: 15px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon-icon--height {
+  height: 15px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon-icon--padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon-icon--figma-autolayout {
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon-icon--absolute-layout {
+  position: absolute;
+  left: 0px;
+  right: 0px;
+  top: 0px;
+  bottom: 0px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon-icon--html-autolayout-margins {
+  display: inline-block;
+  margin-left: 0px;
+  margin-right: 0px;
+  margin-top: 0px;
+  margin-bottom: 0px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon-icon--html-autolayout-padding {
+  display: inline-block;
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon-icon-vector (
+  $bgThemeVar: false,
+  $borderThemeVar: false
+) {
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar}-10 , var( --scw-color-grey-10 ) );
+  } @else {
+    background-color: var( --scw-color-grey-10 );
+  }
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon-icon-vector--sizing {
+  width: 13.3929px;
+  height: 11.8625px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon-icon-vector--width {
+  width: 13.3929px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon-icon-vector--height {
+  height: 11.8625px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon-icon-vector--padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon-icon-vector--figma-autolayout {
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon-icon-vector--absolute-layout {
+  position: absolute;
+  left: calc( var( --scw-spacing-1 ) * 0.08037109375 );
+  right: calc( var( --scw-spacing-1 ) * 0.08034315109252929 );
+  top: calc( var( --scw-spacing-1 ) * 0.1568359375 );
+  bottom: calc( var( --scw-spacing-1 ) * 0.15691490173339845 );
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon-icon-vector--html-autolayout-margins {
+  display: inline-block;
+  margin-left: calc( var( --scw-spacing-1 ) * 0.08037109375 );
+  margin-right: calc( var( --scw-spacing-1 ) * 0.08034315109252929 );
+  margin-top: calc( var( --scw-spacing-1 ) * 0.1568359375 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 0.15691490173339845 );
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-scw-icon-icon-vector--html-autolayout-padding {
+  display: inline-block;
+  padding-left: calc( var( --scw-spacing-1 ) * 0.08037109375 );
+  padding-right: calc( var( --scw-spacing-1 ) * 0.08034315109252929 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.1568359375 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.15691490173339845 );
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-category-label (
+  $themeVar: false
+) {
+  text-align: CENTER;
+  font: var( --scw-type-text-semibold-02-font );
+  @if $themeVar {
+    color: var( #{$themeVar}-10 , var( --scw-color-grey-10 ) );
+  } @else {
+    color: var( --scw-color-grey-10 );
+  }
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-category-label--sizing {
+  width: 109px;
+  height: 20px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-category-label--width {
+  width: 109px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-category-label--height {
+  height: 20px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-category-label--padding {
+  padding-left: initial;
+  padding-right: initial;
+  padding-top: initial;
+  padding-bottom: initial;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-category-label--absolute-layout {
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-category-label--html-autolayout-margins {
+  display: inline-block;
+  margin-left: var( --scw-spacing-1 );
+  margin-right: var( --scw-spacing-1 );
+  margin-top: calc( var( --scw-spacing-1 ) * 0.5 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 0.5 );
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-category-label--html-autolayout-padding {
+  display: inline-block;
+  padding-left: var( --scw-spacing-1 );
+  padding-right: var( --scw-spacing-1 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.5 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.5 );
+}
 @mixin comp-scw-tag-theme-color-primary-state-selected-size-small (
   $bgThemeVar: false,
   $borderThemeVar: false
@@ -140152,7 +141055,7 @@
   position: absolute;
   left: calc( var( --scw-spacing-1 ) * 21.9 );
   width: 112px;
-  top: calc( var( --scw-spacing-1 ) * 23.7 );
+  top: calc( var( --scw-spacing-1 ) * 26.65 );
   height: 27px;
 }
@@ -140160,16 +141063,16 @@
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 21.9 );
   margin-right: calc( var( --scw-spacing-1 ) * 10.5 );
-  margin-top: calc( var( --scw-spacing-1 ) * 23.7 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 3.6 );
+  margin-top: calc( var( --scw-spacing-1 ) * 26.65 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 9.15 );
 }
 @mixin comp-scw-tag-theme-color-primary-state-selected-size-small--html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 21.9 );
   padding-right: calc( var( --scw-spacing-1 ) * 10.5 );
-  padding-top: calc( var( --scw-spacing-1 ) * 23.7 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 3.6 );
+  padding-top: calc( var( --scw-spacing-1 ) * 26.65 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 9.15 );
 }
@@ -140327,7 +141230,7 @@
 @mixin comp-scw-tag-theme-color-primary-state-selected-size-small-scw-icon-icon-vector--absolute-layout {
   position: absolute;
   left: calc( var( --scw-spacing-1 ) * 0.0642578125 );
-  right: calc( var( --scw-spacing-1 ) * 0.06431360244750976 );
+  right: calc( var( --scw-spacing-1 ) * 0.06431350708007813 );
   top: calc( var( --scw-spacing-1 ) * 0.1255859375 );
   bottom: calc( var( --scw-spacing-1 ) * 0.12541465759277343 );
 }
@@ -140335,7 +141238,7 @@
 @mixin comp-scw-tag-theme-color-primary-state-selected-size-small-scw-icon-icon-vector--html-autolayout-margins {
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 0.0642578125 );
-  margin-right: calc( var( --scw-spacing-1 ) * 0.06431360244750976 );
+  margin-right: calc( var( --scw-spacing-1 ) * 0.06431350708007813 );
   margin-top: calc( var( --scw-spacing-1 ) * 0.1255859375 );
   margin-bottom: calc( var( --scw-spacing-1 ) * 0.12541465759277343 );
 }
@@ -140343,7 +141246,7 @@
 @mixin comp-scw-tag-theme-color-primary-state-selected-size-small-scw-icon-icon-vector--html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 0.0642578125 );
-  padding-right: calc( var( --scw-spacing-1 ) * 0.06431360244750976 );
+  padding-right: calc( var( --scw-spacing-1 ) * 0.06431350708007813 );
   padding-top: calc( var( --scw-spacing-1 ) * 0.1255859375 );
   padding-bottom: calc( var( --scw-spacing-1 ) * 0.12541465759277343 );
 }
@@ -140402,6 +141305,307 @@
 }
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small (
+  $bgThemeVar: false,
+  $borderThemeVar: false
+) {
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar}-01 , var( --scw-color-primary-01 ) );
+  } @else {
+    background-color: var( --scw-color-primary-01 );
+  }
+  border-radius: 30px 30px 30px 30px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small--sizing {
+  width: 112px;
+  height: 27px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small--width {
+  width: 112px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small--height {
+  height: 27px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small--padding {
+  padding-left: var( --scw-spacing-1 );
+  padding-right: var( --scw-spacing-1 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.5 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.5 );
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small--figma-autolayout {
+  display: flex;
+  flex-flow: row nowrap;
+  justify-content: center;
+  align-items: center;
+  padding-left: var( --scw-spacing-1 );
+  padding-right: var( --scw-spacing-1 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.5 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.5 );
+  & > *:not(:last-child) {
+        margin-right: calc( var( --scw-spacing-1 ) * 0.5 );
+        --margin-right: calc( var( --scw-spacing-1 ) * 0.5 );
+      }
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small--absolute-layout {
+  position: absolute;
+  left: calc( var( --scw-spacing-1 ) * 21.9 );
+  width: 112px;
+  top: calc( var( --scw-spacing-1 ) * 30.35 );
+  height: 27px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small--html-autolayout-margins {
+  display: inline-block;
+  margin-left: calc( var( --scw-spacing-1 ) * 21.9 );
+  margin-right: calc( var( --scw-spacing-1 ) * 10.5 );
+  margin-top: calc( var( --scw-spacing-1 ) * 30.35 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 5.45 );
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small--html-autolayout-padding {
+  display: inline-block;
+  padding-left: calc( var( --scw-spacing-1 ) * 21.9 );
+  padding-right: calc( var( --scw-spacing-1 ) * 10.5 );
+  padding-top: calc( var( --scw-spacing-1 ) * 30.35 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 5.45 );
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon (
+  $bgThemeVar: false,
+  $borderThemeVar: false
+) {
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar} , rgba(0,0,0,0) );
+  } @else {
+    background-color: rgba(0,0,0,0);
+  }
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon--sizing {
+  width: 12px;
+  height: 12px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon--width {
+  width: 12px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon--height {
+  height: 12px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon--padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon--figma-autolayout {
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon--absolute-layout {
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon--html-autolayout-margins {
+  display: inline-block;
+  margin-left: var( --scw-spacing-1 );
+  margin-right: var( --scw-spacing-9 );
+  margin-top: calc( var( --scw-spacing-1 ) * 0.75 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 0.75 );
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon--html-autolayout-padding {
+  display: inline-block;
+  padding-left: var( --scw-spacing-1 );
+  padding-right: var( --scw-spacing-9 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.75 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.75 );
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon-icon (
+  $bgThemeVar: false,
+  $borderThemeVar: false
+) {
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar} , rgba(0,0,0,0) );
+  } @else {
+    background-color: rgba(0,0,0,0);
+  }
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon-icon--sizing {
+  width: 12px;
+  height: 12px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon-icon--width {
+  width: 12px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon-icon--height {
+  height: 12px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon-icon--padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon-icon--figma-autolayout {
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon-icon--absolute-layout {
+  position: absolute;
+  left: 0px;
+  right: 0px;
+  top: 0px;
+  bottom: 0px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon-icon--html-autolayout-margins {
+  display: inline-block;
+  margin-left: 0px;
+  margin-right: 0px;
+  margin-top: 0px;
+  margin-bottom: 0px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon-icon--html-autolayout-padding {
+  display: inline-block;
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon-icon-vector (
+  $bgThemeVar: false,
+  $borderThemeVar: false
+) {
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar}-10 , var( --scw-color-grey-10 ) );
+  } @else {
+    background-color: var( --scw-color-grey-10 );
+  }
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon-icon-vector--sizing {
+  width: 10.7143px;
+  height: 9.49px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon-icon-vector--width {
+  width: 10.7143px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon-icon-vector--height {
+  height: 9.49px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon-icon-vector--padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon-icon-vector--figma-autolayout {
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon-icon-vector--absolute-layout {
+  position: absolute;
+  left: calc( var( --scw-spacing-1 ) * 0.0642578125 );
+  right: calc( var( --scw-spacing-1 ) * 0.06431360244750976 );
+  top: calc( var( --scw-spacing-1 ) * 0.1255859375 );
+  bottom: calc( var( --scw-spacing-1 ) * 0.12541465759277343 );
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon-icon-vector--html-autolayout-margins {
+  display: inline-block;
+  margin-left: calc( var( --scw-spacing-1 ) * 0.0642578125 );
+  margin-right: calc( var( --scw-spacing-1 ) * 0.06431360244750976 );
+  margin-top: calc( var( --scw-spacing-1 ) * 0.1255859375 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 0.12541465759277343 );
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-scw-icon-icon-vector--html-autolayout-padding {
+  display: inline-block;
+  padding-left: calc( var( --scw-spacing-1 ) * 0.0642578125 );
+  padding-right: calc( var( --scw-spacing-1 ) * 0.06431360244750976 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.1255859375 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.12541465759277343 );
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-category-label (
+  $themeVar: false
+) {
+  text-align: CENTER;
+  font: var( --scw-type-text-semibold-01-font );
+  @if $themeVar {
+    color: var( #{$themeVar}-10 , var( --scw-color-grey-10 ) );
+  } @else {
+    color: var( --scw-color-grey-10 );
+  }
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-category-label--sizing {
+  width: 92px;
+  height: 17px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-category-label--width {
+  width: 92px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-category-label--height {
+  height: 17px;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-category-label--padding {
+  padding-left: initial;
+  padding-right: initial;
+  padding-top: initial;
+  padding-bottom: initial;
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-category-label--absolute-layout {
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-category-label--html-autolayout-margins {
+  display: inline-block;
+  margin-left: var( --scw-spacing-1 );
+  margin-right: var( --scw-spacing-1 );
+  margin-top: calc( var( --scw-spacing-1 ) * 0.5 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 0.5 );
+}
+@mixin comp-scw-tag-theme-color-primary-state-selected-hover-size-small-category-label--html-autolayout-padding {
+  display: inline-block;
+  padding-left: var( --scw-spacing-1 );
+  padding-right: var( --scw-spacing-1 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.5 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.5 );
+}
 @mixin comp-scw-floating-button (
   $bgThemeVar: false,
   $borderThemeVar: false