@ebay/skin 19.13.0 → 19.14.0

package/dist/bundles/skin-headless.css

@@ -250,12 +250,12 @@ ul.accordion--large summary.details__summary{
   --dialog-lightbox-max-width:616px;
 }
 .alert-dialog[role=alertdialog]{
+  align-items:flex-start;
   background-color:var(--dialog-scrim-color-show);
   bottom:0;
+  justify-content:center;
   left:0;
   -webkit-overflow-scrolling:touch;
-  align-items:flex-start;
-  justify-content:center;
   position:fixed;
   right:0;
   top:0;
@@ -778,17 +778,19 @@ a.fake-btn__cell--fixed-height svg.icon,button.btn__cell--fixed-height svg.icon{
 }
 
 a.fake-btn--primary,button.btn--primary{
-  background-color:var(--btn-primary-background-color, var(--color-background-accent));
-  border-color:var(--btn-primary-border-color, var(--color-stroke-accent));
-  color:var(--btn-primary-foreground-color, var(--color-foreground-on-accent));
+  background-color:var(--color-background-accent);
+  border-color:var(--color-stroke-accent);
+  color:var(--color-foreground-on-accent);
   font-weight:700;
-  overflow:hidden;
-  position:relative;
   transition:all var(--motion-duration-short-3) var(--motion-easing-quick-enter);
 }
 a.fake-btn--primary:active,button.btn--primary:active{
   transform:scale(.97);
 }
+a.fake-btn--primary,button.btn--primary{
+  overflow:hidden;
+  position:relative;
+}
 a.fake-btn--primary:after,button.btn--primary:after{
   background-color:var(--state-layer-neutral);
   content:"";
@@ -811,13 +813,13 @@ a.fake-btn--primary{
 }
 
 a.fake-btn--primary:visited{
-  color:var(--btn-primary-foreground-color, var(--color-foreground-on-accent));
+  color:var(--color-foreground-on-accent);
 }
 
 a.fake-btn--primary.fake-btn--destructive,button.btn--primary.btn--destructive{
-  background-color:var(--btn-primary-destructive-background-color, var(--color-background-attention));
-  border-color:var(--btn-primary-destructive-border-color, var(--color-stroke-attention));
-  color:var(--btn-primary-destructive-foreground-color, var(--color-foreground-on-attention));
+  background-color:var(--color-background-attention);
+  border-color:var(--color-stroke-attention);
+  color:var(--color-foreground-on-attention);
   font-weight:700;
   overflow:hidden;
   position:relative;
@@ -840,8 +842,8 @@ a.fake-btn--primary.fake-btn--destructive:not([disabled],[aria-disabled=true]):a
 }
 
 button.btn--primary.btn--destructive[aria-disabled=true],button.btn--primary.btn--destructive[disabled]{
-  background-color:var(--btn-primary-destructive-disabled-background, var(--color-background-disabled));
-  border-color:var(--btn-primary-destructive-disabled-border, var(--color-stroke-disabled));
+  background-color:var(--color-background-disabled);
+  border-color:var(--color-stroke-disabled);
 }
 
 button.btn .progress-spinner{
@@ -894,15 +896,17 @@ a.fake-btn--primary:not([href]),a.fake-btn--primary[aria-disabled=true]{
 
 a.fake-btn--secondary,button.btn--secondary{
   background-color:var(--btn-secondary-background-color, transparent);
-  border-color:var(--btn-secondary-border-color, var(--color-stroke-accent));
-  color:var(--btn-secondary-foreground-color, var(--color-foreground-accent));
-  overflow:hidden;
-  position:relative;
+  border-color:var(--color-stroke-accent);
+  color:var(--color-foreground-accent);
   transition:all var(--motion-duration-short-3) var(--motion-easing-quick-enter);
 }
 a.fake-btn--secondary:active,button.btn--secondary:active{
   transform:scale(.97);
 }
+a.fake-btn--secondary,button.btn--secondary{
+  overflow:hidden;
+  position:relative;
+}
 a.fake-btn--secondary:after,button.btn--secondary:after{
   background-color:var(--state-layer-neutral);
   content:"";
@@ -951,13 +955,15 @@ a.fake-btn--secondary:not([href]),a.fake-btn--secondary[aria-disabled=true]{
 
 a.fake-btn--tertiary,button.btn--tertiary{
   border-color:var(--btn-tertiary-border-color, var(--color-stroke-default));
-  overflow:hidden;
-  position:relative;
   transition:all var(--motion-duration-short-3) var(--motion-easing-quick-enter);
 }
 a.fake-btn--tertiary:active,button.btn--tertiary:active{
   transform:scale(.97);
 }
+a.fake-btn--tertiary,button.btn--tertiary{
+  overflow:hidden;
+  position:relative;
+}
 a.fake-btn--tertiary:after,button.btn--tertiary:after{
   background-color:var(--state-layer-neutral);
   content:"";
@@ -2088,8 +2094,8 @@ span.combobox{
 }
 
 .combobox__listbox{
-  background-color:var(--combobox-listbox-background-color, var(--color-background-elevated));
-  border-radius:var(--combobox-listbox-border-radius, var(--border-radius-50));
+  background-color:var(--color-background-elevated);
+  border-radius:var(--border-radius-50);
   box-shadow:var(--bubble-shadow);
   box-sizing:border-box;
   display:none;
@@ -2126,11 +2132,11 @@ span.combobox{
 
 .combobox__option[role^=option]{
   background-color:initial;
-  border-color:var(--listbox-option-border-color, var(--color-background-primary));
+  border-color:var(--color-background-primary);
   border-style:solid;
   border-width:1px;
   box-sizing:border-box;
-  color:var(--listbox-option-foreground-color, var(--color-foreground-primary));
+  color:var(--color-foreground-primary);
   cursor:default;
   display:inline-grid;
   font-family:inherit;
@@ -2147,7 +2153,7 @@ span.combobox{
   display:none;
 }
 .combobox__option[role^=option]:hover{
-  color:var(--listbox-option-hover-foreground-color, var(--color-foreground-primary));
+  color:var(--color-foreground-primary);
 }
 .combobox__option[role^=option]:active{
   font-weight:700;
@@ -2319,12 +2325,12 @@ span.combobox{
 }
 
 .confirm-dialog[role=dialog]{
+  align-items:flex-start;
   background-color:var(--dialog-scrim-color-show);
   bottom:0;
+  justify-content:center;
   left:0;
   -webkit-overflow-scrolling:touch;
-  align-items:flex-start;
-  justify-content:center;
   position:fixed;
   right:0;
   top:0;
@@ -2749,12 +2755,12 @@ details.details summary:focus:not(:focus-visible){
 }
 /*! DEPRECATED COMPONENT. Will be removed next major version */
 .drawer-dialog[role=dialog]{
+  align-items:flex-end;
   background-color:var(--dialog-scrim-color-show);
   bottom:0;
   left:0;
-  -webkit-overflow-scrolling:touch;
-  align-items:flex-end;
   overflow:hidden;
+  -webkit-overflow-scrolling:touch;
   position:fixed;
   right:0;
   top:0;
@@ -3603,12 +3609,11 @@ span.file-input__content-cta{
 
 a.filter-link,button.filter-button{
   align-items:center;
-  background-color:var(--filter-button-background-color, var(--color-background-secondary));
+  background-color:var(--color-background-secondary);
   border:1px solid transparent;
-  border-color:var(--filter-button-selected-border-color, var(--color-stroke-default));
   border-radius:16px;
   box-sizing:border-box;
-  color:var(--filter-button-foreground-color, var(--color-foreground-primary));
+  color:var(--color-foreground-primary);
   display:inline-flex;
   flex:0 1 auto;
   flex-direction:column;
@@ -3707,9 +3712,7 @@ a.filter-chip,button.filter-chip{
   justify-content:space-between;
   max-width:296px;
   min-width:32px;
-  overflow:hidden;
   padding:0 var(--spacing-150);
-  position:relative;
   text-decoration:none;
   transition:all var(--motion-duration-short-3) var(--motion-easing-quick-enter);
   vertical-align:bottom;
@@ -3717,6 +3720,10 @@ a.filter-chip,button.filter-chip{
 a.filter-chip:active,button.filter-chip:active{
   transform:scale(.97);
 }
+a.filter-chip,button.filter-chip{
+  overflow:hidden;
+  position:relative;
+}
 a.filter-chip:after,button.filter-chip:after{
   background-color:var(--state-layer-neutral);
   content:"";
@@ -3741,8 +3748,8 @@ a.filter-chip--expressive,button.filter-chip--expressive{
 
 .filter-chip__media{
   align-items:center;
-  border-radius:8px;
   border-radius:var(--spacing-400);
+  border-radius:8px;
   display:flex;
   justify-content:center;
   margin-inline-start:-8px;
@@ -4056,12 +4063,11 @@ span.filter-menu-button+span.filter-menu-button{
 
 button.filter-menu-button__button{
   align-items:center;
-  background-color:var(--filter-button-background-color, var(--color-background-secondary));
+  background-color:var(--color-background-secondary);
   border:1px solid transparent;
-  border-color:var(--filter-button-selected-border-color, var(--color-stroke-default));
   border-radius:16px;
   box-sizing:border-box;
-  color:var(--filter-button-foreground-color, var(--color-foreground-primary));
+  color:var(--color-foreground-primary);
   display:inline-flex;
   flex:0 1 auto;
   flex-direction:column;
@@ -4081,7 +4087,7 @@ button.filter-menu-button__button+button.filter-menu-button__button{
   margin-left:8px;
 }
 button.filter-menu-button__button:active,button.filter-menu-button__button:focus,button.filter-menu-button__button:hover{
-  background-color:var(--filter-button-background-color, var(--color-state-secondary-hover));
+  background-color:var(--color-state-secondary-hover);
 }
 
 .filter-menu-button__button-cell{
@@ -4203,8 +4209,6 @@ span.filter-menu-button__radio svg.icon--checked{
   justify-content:space-between;
   line-height:1.4em;
   margin:0;
-  outline-offset:-4px;
-  padding:8px 16px;
   width:100%;
 }
 .filter-menu-button__item:hover{
@@ -4219,6 +4223,10 @@ span.filter-menu-button__radio svg.icon--checked{
 .filter-menu-button__item:disabled:hover,.filter-menu-button__item[aria-disabled=true]:hover{
   background-color:inherit;
 }
+.filter-menu-button__item{
+  outline-offset:-4px;
+  padding:8px 16px;
+}
 .filter-menu-button__item:hover{
   background-color:var(--color-state-primary-hover);
 }
@@ -4251,8 +4259,9 @@ span.filter-menu-button__item{
 button.filter-menu-button__footer{
   background-color:var(--filter-menu-item-background-color, var(--color-background-elevated));
   border:none;
-  border-top:1px solid;
-  border-color:var(--filter-menu-border-color, var(--color-stroke-subtle));
+  border-color:var(--color-stroke-subtle);
+  border-top-style:solid;
+  border-top-width:1px;
   bottom:0;
   box-sizing:border-box;
   color:var(--filter-menu-item-foreground-color, var(--color-foreground-primary));
@@ -5707,10 +5716,12 @@ a.icon-link>svg{
 }
 
 a.icon-link,button.icon-btn{
-  background-color:var(--icon-button-background-color, var(--color-background-secondary));
+  align-items:center;
+  background-color:var(--color-background-secondary);
   border:2px solid transparent;
   border-radius:50px;
   box-sizing:border-box;
+  display:inline-flex;
   font-family:inherit;
   height:40px;
   justify-content:center;
@@ -5720,7 +5731,7 @@ a.icon-link,button.icon-btn{
   width:40px;
 }
 a.icon-link>svg,button.icon-btn>svg{
-  fill:var(--icon-button-icon-foreground-color, var(--color-foreground-primary));
+  fill:var(--color-foreground-primary);
   max-width:75%;
   position:relative;
 }
@@ -5735,17 +5746,17 @@ a.icon-link:not(:focus-visible),button.icon-btn:not(:focus-visible){
 }
 
 a.icon-link.icon-link--primary,button.icon-btn.icon-btn--primary{
-  background-color:var(--btn-primary-background-color, var(--color-background-accent));
-  border-color:var(--btn-primary-border-color, var(--color-stroke-accent));
-  color:var(--btn-primary-foreground-color, var(--color-foreground-on-accent));
+  background-color:var(--color-background-accent);
+  border-color:var(--color-stroke-accent);
+  color:var(--color-foreground-on-accent);
 }
 
 a.icon-link.icon-link--primary>svg,button.icon-btn.icon-btn--primary>svg{
-  fill:var(--icon-button-icon-foreground-color, var(--color-foreground-on-accent));
+  fill:var(--color-foreground-on-accent);
 }
 
 a.icon-link.icon-link--secondary>svg,button.icon-btn.icon-btn--secondary>svg{
-  fill:var(--icon-button-icon-foreground-color, var(--color-foreground-accent));
+  fill:var(--color-foreground-accent);
 }
 
 a.icon-link.icon-link--small .progress-spinner,button.icon-btn.icon-btn--small .progress-spinner{
@@ -5771,7 +5782,7 @@ a.icon-link--transparent,a.icon-link--transparent:active,a.icon-link--transparen
 }
 
 a.icon-link:visited>svg{
-  fill:var(--icon-button-icon-foreground-color, var(--color-foreground-primary));
+  fill:var(--color-foreground-primary);
 }
 
 a:not([href]).icon-link>svg,a[aria-disabled=true].icon-link>svg,button[aria-disabled=true].icon-btn>svg,button[disabled].icon-btn>svg{
@@ -5783,11 +5794,11 @@ a:not([href]).icon-link:focus>svg,a:not([href]).icon-link:hover>svg,a[aria-disab
 }
 
 a.icon-link:visited:focus>svg,a.icon-link:visited:hover>svg{
-  fill:var(--icon-button-icon-hover-foreground-color, var(--color-foreground-primary));
+  fill:var(--color-foreground-primary);
 }
 
 a.icon-link.icon-link--primary:visited>svg{
-  fill:var(--icon-button-icon-foreground-color, var(--color-foreground-on-accent));
+  fill:var(--color-foreground-on-accent);
 }
 
 a.icon-link--badged,button.icon-btn--badged{
@@ -5816,12 +5827,12 @@ a.icon-link.icon-link--primary,a.icon-link.icon-link--secondary,a.icon-link.icon
 }
 
 a:not([href]).icon-link.icon-link--primary,a[aria-disabled=true].icon-link.icon-link--primary,button[aria-disabled=true].icon-btn.icon-btn--primary,button[disabled].icon-btn.icon-btn--primary{
-  background-color:var(--icon-button-disabled-background-color, var(--color-background-disabled));
-  border-color:var(--btn-primary-disabled-border-color, var(--color-stroke-disabled));
+  background-color:var(--color-background-disabled);
+  border-color:var(--color-stroke-disabled);
 }
 
 a:not([href]).icon-link.icon-link--primary>svg,a[aria-disabled=true].icon-link.icon-link--primary>svg,button[aria-disabled=true].icon-btn.icon-btn--primary>svg,button[disabled].icon-btn.icon-btn--primary>svg{
-  fill:var(--icon-button-icon-foreground-color, var(--color-foreground-on-accent));
+  fill:var(--color-foreground-on-accent);
 }
 
 a.icon-link.icon-link--primary .progress-spinner,button.icon-btn.icon-btn--primary .progress-spinner{
@@ -5831,8 +5842,8 @@ a.icon-link.icon-link--primary .progress-spinner,button.icon-btn.icon-btn--prima
 
 a.icon-link.icon-link--secondary,button.icon-btn.icon-btn--secondary{
   background-color:initial;
-  border-color:var(--btn-secondary-border-color, var(--color-stroke-accent));
-  color:var(--btn-secondary-foreground-color, var(--color-foreground-accent));
+  border-color:var(--color-stroke-accent);
+  color:var(--color-foreground-accent);
 }
 
 a.icon-link.icon-link--primary:not([disabled],[aria-disabled=true]):focus,a.icon-link.icon-link--primary:not([disabled],[aria-disabled=true]):hover,button.icon-btn.icon-btn--primary:not([disabled],[aria-disabled=true]):focus,button.icon-btn.icon-btn--primary:not([disabled],[aria-disabled=true]):hover{
@@ -5848,11 +5859,11 @@ a.icon-link.icon-link--secondary .progress-spinner,a.icon-link.icon-link--tertia
 }
 
 a:not([href]).icon-link.icon-link--secondary,a[aria-disabled=true].icon-link.icon-link--secondary,button[aria-disabled=true].icon-btn.icon-btn--secondary,button[disabled].icon-btn.icon-btn--secondary{
-  border-color:var(--btn-secondary-disabled-border-color, var(--color-stroke-disabled));
+  border-color:var(--color-stroke-disabled);
 }
 
 a:not([href]).icon-link.icon-blinktn--secondary>svg,a[aria-disabled=true].icon-link.icon-link--secondary>svg,button[aria-disabled=true].icon-btn.icon-btn--secondary>svg,button[disabled].icon-btn.icon-btn--secondary>svg{
-  fill:var(--icon-button-icon-foreground-color, var(--color-foreground-disabled));
+  fill:var(--color-foreground-disabled);
 }
 
 a.icon-link.icon-link--secondary:not([disabled],[aria-disabled=true]):focus,a.icon-link.icon-link--secondary:not([disabled],[aria-disabled=true]):hover,button.icon-btn.icon-btn--secondary:not([disabled],[aria-disabled=true]):focus,button.icon-btn.icon-btn--secondary:not([disabled],[aria-disabled=true]):hover{
@@ -5864,12 +5875,12 @@ a.icon-link.icon-link--secondary:not([disabled],[aria-disabled=true]):active,but
 
 a.icon-link.icon-link--tertiary,button.icon-btn.icon-btn--tertiary{
   background-color:initial;
-  border-color:var(--btn-primary-border-color, var(--color-stroke-default));
-  color:var(--btn-primary-foreground-color, var(--color-foreground-accent));
+  border-color:var(--color-stroke-default);
+  color:var(--color-foreground-accent);
 }
 
 a:not([href]).icon-link.icon-link--tertiary,a[aria-disabled=true].icon-link.icon-link--tertiary,button[aria-disabled=true].icon-btn.icon-btn--tertiary,button[disabled].icon-btn.icon-btn--tertiary{
-  border-color:var(--btn-tertiary-disabled-border-color, var(--color-stroke-disabled));
+  border-color:var(--color-stroke-disabled);
 }
 
 a.icon-link.icon-link--tertiary:not([disabled],[aria-disabled=true]):focus,a.icon-link.icon-link--tertiary:not([disabled],[aria-disabled=true]):hover,button.icon-btn.icon-btn--tertiary:not([disabled],[aria-disabled=true]):focus,button.icon-btn.icon-btn--tertiary:not([disabled],[aria-disabled=true]):hover{
@@ -7125,12 +7136,12 @@ span.inline-notice{
 }
 
 .lightbox-dialog[role=dialog]{
+  align-items:flex-start;
   background-color:var(--dialog-scrim-color-show);
   bottom:0;
+  justify-content:center;
   left:0;
   -webkit-overflow-scrolling:touch;
-  align-items:flex-start;
-  justify-content:center;
   position:fixed;
   right:0;
   top:0;
@@ -7558,11 +7569,11 @@ div.listbox__options--reverse[role=listbox]{
 
 div.listbox__option[role=option]{
   background-color:initial;
-  border-color:var(--listbox-option-border-color, var(--color-background-primary));
+  border-color:var(--color-background-primary);
   border-style:solid;
   border-width:1px;
   box-sizing:border-box;
-  color:var(--listbox-option-foreground-color, var(--color-foreground-primary));
+  color:var(--color-foreground-primary);
   display:inline-grid;
   font-family:inherit;
   grid-template-columns:auto auto;
@@ -7581,7 +7592,7 @@ div.listbox__option[role=option][hidden]{
 }
 div.listbox__option[role=option]:hover{
   background-color:var(--color-state-primary-hover);
-  color:var(--listbox-option-hover-foreground-color, var(--color-foreground-primary));
+  color:var(--color-foreground-primary);
 }
 div.listbox__option[role=option]:active{
   font-weight:700;
@@ -7599,12 +7610,12 @@ span.listbox__value{
 
 div.listbox__option svg.icon{
   align-self:center;
+  margin-inline-start:var(--spacing-100);
   fill:currentColor;
   margin:0 auto;
   opacity:0;
   stroke:currentColor;
   stroke-width:0;
-  margin-inline-start:var(--spacing-100);
 }
 
 div.listbox__options[role=listbox]:focus .listbox__option--active[role=option]{
@@ -7638,8 +7649,8 @@ span.listbox-button--fluid,span.listbox-button--fluid .btn,span.listbox-button--
 }
 
 div.listbox-button__listbox{
-  background-color:var(--listbox-button-listbox-background-color, var(--color-background-elevated));
-  border-radius:var(--listbox-button-listbox-border-radius, var(--border-radius-50));
+  background-color:var(--color-background-elevated);
+  border-radius:var(--border-radius-50);
   box-shadow:var(--bubble-shadow);
   box-sizing:border-box;
   display:none;
@@ -7768,11 +7779,11 @@ div.listbox-button__option[role=option][aria-selected=true] svg.icon{
 
 div.listbox-button__option[role=option]{
   background-color:initial;
-  border-color:var(--listbox-option-border-color, var(--color-background-primary));
+  border-color:var(--color-background-primary);
   border-style:solid;
   border-width:1px;
   box-sizing:border-box;
-  color:var(--listbox-option-foreground-color, var(--color-foreground-primary));
+  color:var(--color-foreground-primary);
   cursor:default;
   display:inline-grid;
   font-family:inherit;
@@ -7792,7 +7803,7 @@ div.listbox-button__option[role=option][hidden]{
 }
 div.listbox-button__option[role=option]:hover{
   background-color:var(--color-state-primary-hover);
-  color:var(--listbox-option-hover-foreground-color, var(--color-foreground-primary));
+  color:var(--color-foreground-primary);
 }
 div.listbox-button__option[role=option]:active{
   font-weight:700;
@@ -8180,8 +8191,8 @@ div.menu__item[role^=menuitem]:focus:not(:focus-visible){
 }
 
 .fake-menu-button__menu,.menu-button__menu{
-  background-color:var(--menu-button-menu-background-color, var(--color-background-elevated));
-  border-radius:var(--menu-button-menu-border-radius, var(--border-radius-50));
+  background-color:var(--color-background-elevated);
+  border-radius:var(--border-radius-50);
   box-shadow:var(--bubble-shadow);
   box-sizing:border-box;
   display:none;
@@ -8782,10 +8793,10 @@ nav.pagination--fluid ol.pagination__items li{
 .panel-dialog[role=dialog]{
   background-color:var(--dialog-scrim-color-show);
   bottom:0;
-  left:0;
-  -webkit-overflow-scrolling:touch;
   flex-direction:column;
+  left:0;
   overflow:hidden;
+  -webkit-overflow-scrolling:touch;
   position:fixed;
   right:0;
   top:0;
@@ -9531,6 +9542,7 @@ hr.progress-stepper__separator{
   min-width:inherit;
   width:4px;
 }
+
 [dir=rtl] .progress-stepper__item:first-child .progress-stepper__text{
   text-align:right;
 }
@@ -9665,7 +9677,7 @@ input.radio__control[type=radio]:focus:not(:focus-visible)+span.radio__icon{
 
 div[role=region].section-notice,section.section-notice{
   display:grid;
-  grid-template-columns:32px auto auto auto;
+  grid-template-columns:32px auto min-content min-content;
 }
 .section-notice--education{
   background-color:var(--section-notice-education-background-color, var(--color-background-education));
@@ -9757,15 +9769,13 @@ p.section-notice__cta{
     grid-column:4;
     grid-row:1;
     justify-self:flex-end;
-    margin-right:var(--spacing-200);
     margin-top:0;
-    padding-right:var(--spacing-200);
   }
   .section-notice__header~.section-notice__cta{
-    grid-column:4;
+    grid-column:3;
   }
   .section-notice__footer{
-    padding-left:var(--spacing-200);
+    padding-inline-start:var(--spacing-200);
   }
 }
 [dir=rtl] .section-notice__footer{
@@ -9773,15 +9783,10 @@ p.section-notice__cta{
   margin-left:0;
   margin-right:auto;
   padding-left:0;
-  padding-right:0;
 }
 [dir=rtl] .section-notice__main{
   padding-right:0;
 }
-[dir=rtl] p.section-notice__cta{
-  margin-left:16px;
-  padding-left:16px;
-}
 .section-notice__header:has(svg[class*="24"]){
   height:var(--spacing-300);
 }
@@ -10085,9 +10090,7 @@ span.select{
   justify-content:space-between;
   max-width:296px;
   min-width:32px;
-  overflow:hidden;
   padding:0 var(--spacing-150);
-  position:relative;
   text-decoration:none;
   transition:all var(--motion-duration-short-3) var(--motion-easing-quick-enter);
   vertical-align:bottom;
@@ -10095,6 +10098,10 @@ span.select{
 .selection-chip:active{
   transform:scale(.97);
 }
+.selection-chip{
+  overflow:hidden;
+  position:relative;
+}
 .selection-chip:after{
   background-color:var(--state-layer-neutral);
   content:"";