@ebay/skin/dist/bundles/skin-headless.css

Skin - CSS modules that represent the brand eBay

@charset "UTF-8";
@font-face{
  font-display:swap;
  font-family:Market Sans;
  font-style:normal;
  font-weight:400;
  src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.eot);
  src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.eot?#iefix) format("embedded-opentype"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.woff2) format("woff2"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.woff) format("woff"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.ttf) format("truetype"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.svg#MarketSans-Regular-WebS) format("svg");
}
@font-face{
  font-display:swap;
  font-family:Market Sans;
  font-style:normal;
  font-weight:700;
  src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.eot);
  src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.eot?#iefix) format("embedded-opentype"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.woff2) format("woff2"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.woff) format("woff"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.ttf) format("truetype"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.svg#MarketSans-Bold-WebS) format("svg");
}
body{
  background-color:var(--color-background-primary);
  color:var(--color-foreground-primary);
  font-family:Market Sans,Arial,sans-serif;
  font-size:var(--font-size-default);
  line-height:var(--font-line-height-default);
  -webkit-text-size-adjust:100%;
}

fieldset{
  border:0;
  padding:0;
}

legend{
  margin-bottom:var(--spacing-100);
}

a{
  color:var(--link-foreground-color-default, var(--color-foreground-link-primary));
}
a:visited{
  color:var(--link-foreground-color-visited, var(--color-foreground-link-visited));
}
a:hover{
  color:var(--link-foreground-color-hover, var(--color-foreground-secondary));
}
a:not([href]),a[aria-disabled=true]{
  color:var(--link-forground-color-disabled, var(--color-foreground-disabled));
}
.clearfix:after,.clearfix:before{
  content:" ";
  display:table;
  line-height:0;
}
.clearfix:after{
  clear:both;
}
.clipped{
  border:0;
  clip:rect(1px, 1px, 1px, 1px);
  height:1px;
  overflow:hidden;
  padding:0;
  position:absolute;
  white-space:nowrap;
  width:1px;
}
.clipped--stealth:focus{
  clip:auto;
  height:auto;
  overflow:visible;
  white-space:normal;
  width:auto;
}
.image-stretch{
  height:auto;
  width:100%;
}
.image-scale{
  height:auto;
  max-width:100%;
}
.image-center{
  display:table-cell;
  text-align:center;
  vertical-align:middle;
}
.image-center img{
  max-height:100%;
  max-width:100%;
}
.image-treatment{
  align-items:center;
  border-radius:8px;
  display:flex;
  justify-content:center;
  overflow:hidden;
  position:relative;
}
.image-treatment:after{
  background:rgba(0, 0, 0, .05);
  bottom:0;
  content:"";
  display:block;
  left:0;
  pointer-events:none;
  position:absolute;
  right:0;
  top:0;
}
.image-treatment>img{
  display:inline-block;
  max-height:100%;
  max-width:100%;
  object-fit:contain;
}
.image-treatment-large{
  align-items:center;
  border-radius:16px;
  display:flex;
  justify-content:center;
  overflow:hidden;
  position:relative;
}
.image-treatment-large:after{
  background:rgba(0, 0, 0, .05);
  bottom:0;
  content:"";
  display:block;
  left:0;
  pointer-events:none;
  position:absolute;
  right:0;
  top:0;
}
.image-treatment-large>img{
  display:inline-block;
  max-height:100%;
  max-width:100%;
  object-fit:contain;
}

.image-disabled{
  filter:var(--color-media-disabled-filter);
}

.text-truncate{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.scrollbars-permanent{
  -webkit-overflow-scrolling:touch;
  scroll-behavior:smooth;
  scroll-snap-type:proximity;
  scroll-snap-type:x proximity;
}

.scrollbars-permanent::-webkit-scrollbar{
  background-color:var(--color-background-faint);
  border-radius:12px;
}

.scrollbars-permanent::-webkit-scrollbar:vertical{
  width:6px;
}

.scrollbars-permanent::-webkit-scrollbar:horizontal{
  height:6px;
}

.scrollbars-permanent::-webkit-scrollbar-thumb{
  background-color:var(--color-foreground-secondary);
  border-color:transparent;
  border-radius:12px;
  border-right-style:inset;
  box-shadow:none;
}
ul.accordion{
  margin:0;
  padding:0;
  width:100%;
}
ul.accordion ::marker{
  font-size:0;
}

ul.accordion li:not(:last-child){
  border-bottom:1px solid var(--color-stroke-subtle);
}

ul.accordion summary.details__summary{
  border-radius:0;
  display:flex;
  font-size:var(--font-size-medium);
  justify-content:space-between;
  min-height:48px;
  padding:12px 16px;
}

ul.accordion summary.details__summary span.details__icon svg{
  fill:var(--details-secondary-foreground-color, var(--color-foreground-secondary));
}

ul.accordion details .details__content{
  margin:0 16px 6px;
  opacity:0;
  transform:scaleY(0);
  transform-origin:top;
  transition:opacity var(--motion-duration-medium-3) var(--motion-easing-standard), transform var(--motion-duration-medium-3) var(--motion-easing-standard);
}

ul.accordion details[open] .details__content{
  opacity:1;
  transform:scaleY(1);
}
ul.accordion details svg.details__expand,ul.accordion details[open] svg.details__collapse{
  display:inline-block;
}

ul.accordion details svg.details__collapse,ul.accordion details[open] svg.details__expand{
  display:none;
}

ul.accordion--large summary.details__summary{
  font-size:var(--font-size-large-1);
  min-height:52px;
}

@media (prefers-reduced-motion){
  ul.accordion details .details__content,ul.accordion details[open] .details__content{
    transition:none;
  }
}
.alert-dialog[role=alertdialog]{
  background-color:var(--dialog-scrim-color-show);
  bottom:0;
  left:0;
  -webkit-overflow-scrolling:touch;
  align-items:flex-start;
  justify-content:center;
  overflow-y:auto;
  position:fixed;
  right:0;
  top:0;
  will-change:background-color;
  z-index:100000;
}
.alert-dialog[role=alertdialog]:not([hidden]){
  display:flex;
}

.alert-dialog__window{
  background-color:var(--dialog-window-background-color, var(--color-background-primary));
  border-radius:var(--lightbox-border-radius, var(--border-radius-150));
  display:flex;
  flex:1 0 auto;
  flex-direction:column;
  margin:auto auto 16px;
  margin-left:var(--spacing-200);
  margin-right:var(--spacing-200);
  max-height:90%;
  max-width:calc(100% - 32px);
  min-height:55px;
  min-width:208px;
  padding:var(--spacing-200);
  will-change:opacity, transform;
}

.alert-dialog__title{
  font-size:var(--font-size-large-1);
  font-weight:var(--font-weight-bold);
  line-height:28px;
  margin:0;
}

.alert-dialog__footer{
  text-align:right;
}

.alert-dialog__main{
  margin:var(--spacing-200) 0;
  min-height:var(--spacing-200);
}
.alert-dialog__main>:first-child{
  margin-top:0;
}
.alert-dialog__main>:last-child{
  margin-bottom:0;
}

.alert-dialog--hide.alert-dialog--mask-fade,.alert-dialog--show.alert-dialog--mask-fade{
  transition:background-color .16s ease-out;
}
.alert-dialog--hide.alert-dialog--mask-fade-slow,.alert-dialog--show.alert-dialog--mask-fade-slow{
  transition:background-color .32s ease-out;
}
.alert-dialog--hide .alert-dialog__window--fade,.alert-dialog--show .alert-dialog__window--fade{
  transition:opacity .16s ease-out;
}

.alert-dialog--hide.alert-dialog--hide,.alert-dialog--hide.alert-dialog--show-init,.alert-dialog--show-init.alert-dialog--hide,.alert-dialog--show-init.alert-dialog--show-init{
  display:flex;
}
.alert-dialog--hide.alert-dialog--mask-fade,.alert-dialog--hide.alert-dialog--mask-fade-slow,.alert-dialog--show-init.alert-dialog--mask-fade,.alert-dialog--show-init.alert-dialog--mask-fade-slow{
  background-color:var(--dialog-scrim-color-hide);
}
.alert-dialog--hide .alert-dialog__window--fade,.alert-dialog--show-init .alert-dialog__window--fade{
  opacity:0;
}

.alert-dialog--hide-init.alert-dialog--hide-init,.alert-dialog--hide-init.alert-dialog--show,.alert-dialog--show.alert-dialog--hide-init,.alert-dialog--show.alert-dialog--show{
  display:flex;
}
.alert-dialog--hide-init.alert-dialog--mask-fade,.alert-dialog--hide-init.alert-dialog--mask-fade-slow,.alert-dialog--show.alert-dialog--mask-fade,.alert-dialog--show.alert-dialog--mask-fade-slow{
  background-color:var(--dialog-scrim-color-show);
}
.alert-dialog--hide-init .alert-dialog__window--fade,.alert-dialog--show .alert-dialog__window--fade{
  opacity:1;
}

@media (min-width:768px){
  .alert-dialog__window{
    border-radius:var(--lightbox-border-radius, var(--border-radius-100));
    margin:auto;
    max-width:calc(88% - var(--spacing-400));
  }
}
@media (min-width:1024px){
  .alert-dialog__window{
    max-width:var(--dialog-lightbox-max-width);
  }
}
.avatar{
  align-items:center;
  border-radius:50%;
  display:inline-flex;
  font-size:var(--font-size-large-2);
  font-weight:var(--font-weight-bold);
  height:48px;
  justify-content:center;
  line-height:48px;
  overflow:hidden;
  position:relative;
  width:48px;
}
.avatar:after{
  background:rgba(0, 0, 0, .05);
  bottom:0;
  content:"";
  display:block;
  left:0;
  pointer-events:none;
  position:absolute;
  right:0;
  top:0;
}
.avatar>img{
  display:inline-block;
  max-height:100%;
  max-width:100%;
  object-fit:contain;
}

.avatar>svg{
  height:100%;
  width:100%;
}

.avatar>img{
  height:48px;
  object-fit:cover;
  width:48px;
}

.avatar--fit>img{
  object-fit:contain;
}

.avatar--teal{
  background-color:#84b4fb;
  color:#002a69;
}

.avatar--light-teal{
  background-color:#44ccd5;
  color:#07465a;
}

.avatar--green{
  background-color:#4ce160;
  color:#1b561a;
}

.avatar--lime{
  background-color:#c1d737;
  color:#4e4e0c;
}

.avatar--yellow{
  background-color:#ffbd14;
  color:#553b06;
}

.avatar--orange{
  background-color:#ff8806;
  color:#562501;
}

.avatar--magenta{
  background-color:#cc9ef0;
  color:#3e135f;
}

.avatar--pink{
  background-color:#f79cc8;
  color:#4b112d;
}

.avatar--32,.avatar--32>img{
  font-size:var(--font-size-medium);
  height:32px;
  line-height:32px;
  width:32px;
}

.avatar--40,.avatar--40>img{
  font-size:var(--font-size-large-1);
  height:40px;
  line-height:40px;
  width:40px;
}

.avatar--48,.avatar--48>img{
  font-size:var(--font-size-large-2);
  height:48px;
  line-height:48px;
  width:48px;
}

.avatar--56,.avatar--56>img{
  font-size:var(--font-size-giant-1);
  height:56px;
  line-height:56px;
  width:56px;
}

.avatar--64,.avatar--64>img{
  font-size:var(--font-size-giant-2);
  height:64px;
  line-height:64px;
  width:64px;
}

.avatar--96,.avatar--96>img{
  font-size:var(--font-size-giant-3);
  height:96px;
  line-height:96px;
  width:96px;
}

.avatar--128,.avatar--128>img{
  font-size:var(--font-size-giant-4);
  height:128px;
  line-height:128px;
  width:128px;
}
.badge{
  align-items:center;
  background-color:var(--badge-background-color, var(--color-background-attention));
  border:2px solid var(--color-stroke-on-attention);
  border-radius:16px;
  color:var(--badge-foreground-color, var(--color-foreground-on-attention));
  display:inline-flex;
  font-size:10px;
  height:16px;
  justify-content:center;
  min-width:8px;
  padding:2px 6px;
  white-space:nowrap;
}
nav.breadcrumbs{
  color:var(--breadcrumbs-item-foreground-color, var(--color-foreground-secondary));
  font-size:var(--font-size-small);
  height:-moz-fit-content;
  height:fit-content;
  margin:8px 0;
  min-height:16px;
  overflow-x:scroll;
  padding:8px;
  scrollbar-width:none;
  white-space:nowrap;
}

nav.breadcrumbs>ul{
  display:inline-block;
  margin:0;
  min-width:100%;
  padding:0;
  right:0;
}
nav.breadcrumbs>ul>li{
  align-items:center;
  display:inline-flex;
  vertical-align:middle;
}

nav.breadcrumbs>ul>li[hidden]{
  display:none;
}

nav.breadcrumbs>ul>li svg{
  margin-left:3px;
  margin-right:3px;
}

nav.breadcrumbs>ul>li svg.icon--12{
  margin-left:var(--spacing-75);
  margin-right:var(--spacing-75);
}

nav.breadcrumbs>ul>li>a{
  text-decoration:none;
}

nav.breadcrumbs>ul>li>button{
  background:none;
  border:none;
  font-family:inherit;
  font-size:1em;
  margin:0;
  padding:0;
}

nav.breadcrumbs>ul>li>a,nav.breadcrumbs>ul>li>button{
  color:inherit;
  max-width:168px;
  outline-offset:5px;
  overflow:hidden;
  text-overflow:ellipsis;
}
nav.breadcrumbs>ul>li>a:focus,nav.breadcrumbs>ul>li>a:hover,nav.breadcrumbs>ul>li>button:focus,nav.breadcrumbs>ul>li>button:hover{
  text-decoration:underline;
}
nav.breadcrumbs>ul>li>a[aria-current],nav.breadcrumbs>ul>li>button[aria-current]{
  color:var(--breadcrumbs-item-current-foreground-color, var(--color-foreground-primary));
  text-decoration:none;
}

nav.breadcrumbs>ul>li>a:focus:not(:focus-visible),nav.breadcrumbs>ul>li>button:focus:not(:focus-visible){
  outline:none;
}
nav.breadcrumbs::-webkit-scrollbar{
  display:none;
}
nav.breadcrumbs.breadcrumb--overflow{
  overflow-x:unset;
  scrollbar-width:unset;
}

nav.breadcrumbs .fake-menu-button__button,nav.breadcrumbs .menu-button__button{
  background-color:var(--icon-button-background-color, var(--color-background-secondary));
  height:var(--spacing-300);
  min-height:var(--spacing-300);
  min-width:var(--spacing-300);
  outline-offset:1px;
  width:var(--spacing-300);
}

nav.breadcrumbs .fake-menu-button__button svg.icon,nav.breadcrumbs .menu-button__button svg.icon{
  fill:var(--breadcrumbs-overflow-foreground-color, var(--color-foreground-secondary));
}

nav.breadcrumbs .fake-menu-button__menu,nav.breadcrumbs .menu-button__menu{
  font-size:var(--font-size-default);
}

[dir=rtl] nav.breadcrumbs svg.icon--12{
  transform:rotate(180deg);
}

@media (min-width:512px){
  nav.breadcrumbs{
    margin:16px 0;
  }
}
a.fake-btn,button.btn{
  background-color:initial;
  border:1px solid;
  border-radius:var(--btn-border-radius, 20px);
  box-sizing:border-box;
  color:inherit;
  display:inline-block;
  font-family:inherit;
  font-size:var(--font-size-default);
  margin:0;
  min-height:40px;
  min-width:88px;
  padding:9.5px 20px;
  text-align:center;
  text-decoration:none;
  vertical-align:bottom;
}
a.fake-btn--fixed-height,a.fake-btn--truncated,button.btn--fixed-height,button.btn--truncated{
  height:40px;
}
a.fake-btn:focus-visible,button.btn:focus-visible{
  outline-offset:var(--spacing-25);
  outline-style:solid;
  outline-width:var(--spacing-25);
}
a.fake-btn:focus:not(:focus-visible),button.btn:focus:not(:focus-visible){
  outline:none;
}

button.btn[aria-disabled=true],button.btn[disabled]{
  border-color:var(--expand-btn-disabled-border-color, var(--color-stroke-disabled));
  color:var(--expand-btn-disabled-foreground-color, var(--color-foreground-disabled));
}

a.fake-btn:not([href]),a.fake-btn[aria-disabled=true]{
  color:var(--link-foreground-color-disabled, var(--color-foreground-disabled));
}

a.fake-btn--borderless,button.btn--borderless{
  border-color:transparent;
  min-width:auto;
  padding-left:0;
  vertical-align:initial;
}
a.fake-btn--borderless:focus,a.fake-btn--borderless:hover,button.btn--borderless:focus,button.btn--borderless:hover{
  background-color:initial;
  outline:none;
  text-decoration:underline;
}

a.fake-btn--borderless[aria-disabled=true],a.fake-btn--borderless[disabled],button.btn--borderless[aria-disabled=true],button.btn--borderless[disabled]{
  border-color:transparent;
}

a.fake-btn--borderless.btn--destructive,button.btn--borderless.btn--destructive{
  color:var(--btn-secondary-destructive-foreground-color, var(--color-foreground-attention));
}

a.fake-btn--slim,button.btn--slim{
  height:40px;
  min-width:auto;
  padding-left:var(--spacing-100);
  padding-right:var(--spacing-100);
}

a.fake-btn:visited{
  color:inherit;
}

a.fake-btn--fluid,button.btn--fluid{
  width:100%;
}

.btn__cell,.fake-btn__cell{
  align-items:center;
  display:flex;
  justify-content:center;
  width:100%;
}
.btn__cell--fixed-height,.fake-btn__cell--fixed-height{
  display:inline-flex;
}
.btn__cell--fixed-height>svg,.fake-btn__cell--fixed-height>svg{
  align-self:baseline;
  max-width:calc(100% - 32px);
}
.btn__cell--truncated,.fake-btn__cell--truncated{
  display:inline-flex;
}
.btn__cell--truncated>svg,.fake-btn__cell--truncated>svg{
  align-self:baseline;
  max-width:calc(100% - 32px);
}

a.fake-btn--borderless .fake-btn__cell,a.fake-btn--form .fake-btn__cell,button.btn--borderless .btn__cell,button.btn--form .btn__cell{
  justify-content:space-between;
}

a.fake-btn svg.icon,button.btn svg.icon{
  align-self:center;
}
a.fake-btn svg.icon:first-child,button.btn svg.icon:first-child{
  margin-inline-end:8px;
}
a.fake-btn svg.icon:last-child,button.btn svg.icon:last-child{
  margin-inline-start:8px;
}
a.fake-btn svg.icon:only-child,button.btn svg.icon:only-child{
  margin:0;
}

a.fake-btn__cell--fixed-height svg.icon,button.btn__cell--fixed-height svg.icon{
  align-self:center;
  height:1rem;
  overflow:visible;
  width:1rem;
}

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));
  font-weight:700;
  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{
  outline-color:var(--color-foreground-primary);
}

a.fake-btn--primary:visited{
  color:var(--btn-primary-foreground-color, var(--color-foreground-on-accent));
}

a.fake-btn--primary[href]:focus,a.fake-btn--primary[href]:hover,button.btn--primary:not([disabled],[aria-disabled=true]):focus,button.btn--primary:not([disabled],[aria-disabled=true]):hover{
  background-blend-mode:multiply;
  filter:brightness(96%);
}
a.fake-btn--primary[href]:active,button.btn--primary:not([disabled],[aria-disabled=true]):active{
  filter:brightness(92%);
}

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));
  font-weight:700;
}

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));
}

a.fake-btn--primary.fake-btn--destructive[href]:focus,a.fake-btn--primary.fake-btn--destructive[href]:hover,button.btn--primary.btn--destructive:not([disabled],[aria-disabled=true]):focus,button.btn--primary.btn--destructive:not([disabled],[aria-disabled=true]):hover{
  background-color:var(--color-state-attention-hover);
}
a.fake-btn--primary.fake-btn--destructive[href]:active,button.btn--primary.btn--destructive:not([disabled],[aria-disabled=true]):active{
  background-color:var(--color-state-attention-active);
}

button.btn .progress-spinner{
  height:24px;
  margin:-4px 0;
  width:24px;
}

button.btn--form .progress-spinner{
  margin-left:auto;
  margin-right:auto;
}

button.btn--primary .progress-spinner{
  --color-spinner-icon-background:var(--color-background-primary);
  --color-spinner-icon-foreground:#8fa3f8;
}

button.btn--primary.btn--destructive .progress-spinner{
  --color-spinner-icon-background:var(--color-foreground-on-accent);
  --color-spinner-icon-foreground:#ec7089;
}

a.fake-btn[aria-expanded=true] svg.icon--12,button.btn[aria-expanded=true] svg.icon--12{
  transform:rotate(180deg);
}

a.fake-btn--large svg.icon,button.btn--large svg.icon{
  max-height:22px;
}

a.fake-btn--small svg.icon,button.btn--small svg.icon{
  max-height:20px;
}

button.btn--primary[aria-disabled=true],button.btn--primary[disabled]{
  background-color:var(--btn-primary-disabled-background-color, var(--color-foreground-disabled));
  border-color:var(--btn-primary-disabled-border-color, var(--color-foreground-disabled));
  color:var(--btn-primary-foreground-color, var(--color-foreground-on-accent));
}
button.btn--primary[aria-disabled=true] svg.icon,button.btn--primary[disabled] svg.icon{
  fill:var(--btn-primary-disabled-foreground-color, var(--color-background-primary));
}

a.fake-btn--primary:not([href]),a.fake-btn--primary[aria-disabled=true]{
  background-color:var(--btn-primary-disabled-background-color, var(--color-foreground-disabled));
  border-color:var(--btn-primary-disabled-border-color, var(--color-foreground-disabled));
  color:var(--btn-primary-foreground-color, var(--color-foreground-on-accent));
}

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));
  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:visited{
  color:var(--btn-secondary-foreground-color, var(--color-foreground-accent));
}

a.fake-btn--secondary[href]:active,button.btn--secondary:not([disabled],[aria-disabled=true]):active{
  background-color:var(--color-state-primary-active);
  border-color:var(--color-state-active-foreground-on-secondary);
  color:var(--color-state-active-foreground-on-secondary);
}
a.fake-btn--secondary[href]:focus,a.fake-btn--secondary[href]:hover,button.btn--secondary:not([disabled],[aria-disabled=true]):focus,button.btn--secondary:not([disabled],[aria-disabled=true]):hover{
  background-color:var(--color-state-primary-hover);
  border-color:var(--color-state-hover-foreground-on-secondary);
  color:var(--color-state-hover-foreground-on-secondary);
}

a.fake-btn--secondary.fake-btn--destructive,button.btn--secondary.btn--destructive{
  background-color:var(--btn-secondary-destructive-background-color, transparent);
  border-color:var(--btn-secondary-destructive-border-color, var(--color-stroke-attention));
  color:var(--btn-secondary-destructive-foreground-color, var(--color-foreground-attention));
}

a.fake-btn--secondary.fake-btn--destructive[href]:focus,a.fake-btn--secondary.fake-btn--destructive[href]:hover,button.btn--secondary.btn--destructive:not([disabled],[aria-disabled=true]):focus,button.btn--secondary.btn--destructive:not([disabled],[aria-disabled=true]):hover{
  background-color:var(--color-state-primary-hover);
  border-color:var(--color-state-hover-foreground-on-secondary-desctructive);
  color:var(--color-state-hover-foreground-on-secondary-desctructive);
}
a.fake-btn--secondary.fake-btn--destructive[href]:active,button.btn--secondary.btn--destructive:not([disabled],[aria-disabled=true]):active{
  background-color:var(--color-state-primary-active);
  border-color:var(--color-state-active-foreground-on-secondary-desctructive);
  color:var(--color-state-active-foreground-on-secondary-desctructive);
}

button.btn--secondary.btn--destructive .progress-spinner{
  --color-spinner-icon-background:#f39fb0;
  --color-spinner-icon-foreground:#e0103a;
}

button.btn--secondary[aria-disabled=true],button.btn--secondary[disabled]{
  background-color:var(--btn-secondary-disabled-background-color, var(--color-background-primary));
  border-color:var(--btn-secondary-disabled-border-color, var(--color-stroke-disabled));
  color:var(--btn-secondary-disabled-foreground-color, var(--color-background-disabled));
}
button.btn--secondary[aria-disabled=true] svg.icon,button.btn--secondary[disabled] svg.icon{
  fill:var(--btn-secondary-disabled-foreground-color, var(--color-foreground-disabled));
}

a.fake-btn--secondary:not([href]),a.fake-btn--secondary[aria-disabled=true]{
  border-color:var(--btn-secondary-disabled-border-color, var(--color-background-disabled));
  color:var(--btn-secondary-disabled-foreground-color, var(--color-background-disabled));
}

a.fake-btn--tertiary,button.btn--tertiary{
  border-color:var(--btn-tertiary-border-color, var(--color-stroke-default));
  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[href]:focus,a.fake-btn--tertiary[href]:hover,button.btn--tertiary:not([disabled],[aria-disabled=true]):focus,button.btn--tertiary:not([disabled],[aria-disabled=true]):hover{
  background-color:var(--color-state-secondary-hover);
}
a.fake-btn--tertiary[href]:active,button.btn--tertiary:not([disabled],[aria-disabled=true]):active{
  background-color:var(--color-state-secondary-active);
}

a.fake-btn--tertiary:not([href]),a.fake-btn--tertiary[aria-disabled=true],button.btn--tertiary[aria-disabled=true]:not([aria-live=polite][aria-disabled=true]),button.btn--tertiary[disabled]{
  border-color:var(--expand-btn-disabled-border-color, var(--color-stroke-disabled));
  color:var(--btn-tertiary-disabled-foreground-color, var(--color-background-disabled));
}

a.fake-btn--tertiary.fake-btn--destructive,button.btn--tertiary.btn--destructive{
  border-color:var(--btn-tertiary-destructive-foreground-color, var(--color-stroke-subtle));
}

a.fake-btn--tertiary.fake-btn--destructive[href]:focus,a.fake-btn--tertiary.fake-btn--destructive[href]:hover,button.btn--tertiary.btn--destructive:not([disabled],[aria-disabled=true]):focus,button.btn--tertiary.btn--destructive:not([disabled],[aria-disabled=true]):hover{
  background-color:var(--color-state-secondary-hover);
}
a.fake-btn--tertiary.fake-btn--destructive[href]:active,button.btn--tertiary.btn--destructive:not([disabled],[aria-disabled=true]):active{
  background-color:var(--color-state-secondary-active);
}

button.btn--tertiary.btn--destructive[aria-disabled=true],button.btn--tertiary.btn--destructive[disabled]{
  color:var(--btn-tertiary-destructive-disabled-foreground-color, var(--color-foreground-disabled));
}

button.btn--tertiary.btn--destructive .progress-spinner{
  --color-spinner-icon-background:#ee9aab;
  --color-spinner-icon-foreground:#e0103a;
}

a.fake-btn--large,button.btn--large{
  border-radius:var(--btn-border-radius, 24px);
  font-size:var(--font-size-medium);
  min-height:48px;
  padding:13px 20px;
}

a.fake-btn--small,button.btn--small{
  border-radius:var(--btn-border-radius, 16px);
  font-size:var(--font-size-default);
  min-height:32px;
  padding:6px 16px;
}

a.fake-btn--form,button.btn--form{
  border-color:inherit;
  border-radius:var(--expand-btn-border-radius, var(--border-radius-50));
  max-width:100%;
}

a.fake-btn--form:not([href]):focus,a.fake-btn--form:not([href]):hover,button.btn--form:not([disabled],[aria-disabled=true]):focus,button.btn--form:not([disabled],[aria-disabled=true]):hover{
  background-color:var(--color-state-primary-hover);
}
a.fake-btn--form:not([href]):active,button.btn--form:not([disabled],[aria-disabled=true]):active{
  background-color:var(--color-state-primary-active);
}

button.btn--form.btn--large{
  padding:13px 20px;
}

button.btn--form.btn--small{
  padding:6px 16px;
}
a.fake-btn--transparent,a.fake-btn--transparent:focus,a.fake-btn--transparent:hover,button.btn--transparent,button.btn--transparent:focus,button.btn--transparent:hover{
  background-color:initial;
}

a.fake-btn--fixed-height,button.btn--fixed-height{
  padding-top:calc(21.5px - .75em);
}

a.fake-btn--large-fixed-height,button.btn--large-fixed-height{
  height:48px;
  min-height:48px;
  padding-top:calc(27px - .75em);
}

a.fake-btn--truncated,a.fake-btn--truncated span,button.btn--truncated,button.btn--truncated span{
  line-height:1.4em;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

a.fake-btn--large-truncated,button.btn--large-truncated{
  font-size:var(--font-size-medium);
  height:48px;
  min-height:48px;
  padding:13px 20px;
}
a.fake-btn--large-truncated,a.fake-btn--large-truncated span,button.btn--large-truncated,button.btn--large-truncated span{
  line-height:1.4em;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

a.fake-btn--split-start,button.btn--split-start{
  border-radius:24px 0 0 24px;
}

a.fake-btn--split-end,button.btn--split-end{
  border-radius:0 24px 24px 0;
  margin-left:-1px;
  min-width:40px;
  padding-left:8px;
  padding-right:8px;
}

a.fake-btn.fake-btn--tertiary.fake-btn--split-end,button.btn.btn--tertiary.btn--split-end{
  margin-left:-2px;
}
a.fake-btn.fake-btn--primary.fake-btn--split-end,a.fake-btn.fake-btn--primary.fake-btn--split-end:focus,a.fake-btn.fake-btn--primary.fake-btn--split-end:hover,button.btn.btn--primary.btn--split-end,button.btn.btn--primary.btn--split-end:focus,button.btn.btn--primary.btn--split-end:hover{
  border-left-color:var(--btn-primary-border-split-color, var(--color-background-primary));
}

button.btn--floating-label{
  padding-bottom:0;
  padding-top:0;
}

button.btn--floating-label .btn__text{
  min-height:19px;
  padding-bottom:2px;
  padding-top:17px;
}

button.btn--floating-label .btn__floating-label{
  align-self:flex-start;
  display:inline-block;
  overflow:hidden;
  padding-bottom:2px;
  padding-top:17px;
  pointer-events:none;
  position:absolute;
  text-align:left;
  text-overflow:ellipsis;
  transform:scale(.75) translateY(-18px);
  transform-origin:left;
  white-space:nowrap;
  width:calc(100% - 24px);
  z-index:1;
}

button.btn--floating-label .btn__floating-label--animate{
  transition:transform .3s ease,bottom .3s ease;
}

button.btn--floating-label .btn__floating-label--inline{
  font-size:.875rem;
  position:unset;
  transform:translateY(-6px);
}

[dir=rtl] a.fake-btn--split-start,[dir=rtl] button.btn--split-start{
  border-radius:0 24px 24px 0;
}
[dir=rtl] a.fake-btn--split-end,[dir=rtl] button.btn--split-end{
  border-radius:24px 0 0 24px;
  margin-left:inherit;
  margin-right:-1px;
}
[dir=rtl] a.fake-btn.fake-btn--tertiary.fake-btn--split-end,[dir=rtl] button.btn.btn--tertiary.btn--split-end{
  margin-right:-2px;
}
[dir=rtl] a.fake-btn.fake-btn--primary.fake-btn--split-end,[dir=rtl] a.fake-btn.fake-btn--primary.fake-btn--split-end:focus,[dir=rtl] a.fake-btn.fake-btn--primary.fake-btn--split-end:hover,[dir=rtl] button.btn.btn--primary.btn--split-end,[dir=rtl] button.btn.btn--primary.btn--split-end:focus,[dir=rtl] button.btn.btn--primary.btn--split-end:hover{
  border-left-color:var(--btn-primary-border-color, var(--color-stroke-accent));
  border-right-color:var(--primary-border-split-color, var(--color-stroke-subtle));
}
.carousel{
  position:relative;
}
.carousel__container{
  position:relative;
  white-space:nowrap;
  width:100%;
}
.carousel__container--controls-disabled .carousel__control.carousel__control{
  display:none;
}
.carousel__list{
  display:flex;
  margin:0;
  padding:0;
  position:relative;
  transition:transform .45s ease-in-out;
  width:100%;
}
.carousel__list>li{
  display:inline-block;
  flex-shrink:0;
  list-style:none;
}
.carousel__playback{
  background-color:rgba(0, 0, 0, .45);
  border:0;
  border-radius:50%;
  bottom:16px;
  box-sizing:border-box;
  color:var(--carousel-playback-foreground-color, var(--color-foreground-on-inverse));
  height:40px;
  margin-bottom:19px;
  margin-right:19px;
  padding:0;
  position:absolute;
  right:0;
  text-align:center;
  width:40px;
  z-index:2;
}
.carousel__playback svg{
  opacity:.75;
}
.carousel__playback .icon--play{
  padding-left:1px;
}

.carousel__list--image-treatment>li{
  align-items:center;
  border-radius:8px;
  display:flex;
  justify-content:center;
  overflow:hidden;
  position:relative;
}
.carousel__list--image-treatment>li:after{
  background:rgba(0, 0, 0, .05);
  bottom:0;
  content:"";
  display:block;
  left:0;
  pointer-events:none;
  position:absolute;
  right:0;
  top:0;
}
.carousel__list--image-treatment>li>img{
  display:inline-block;
  max-height:100%;
  max-width:100%;
  object-fit:contain;
}

.carousel__list--image-treatment-large>li{
  align-items:center;
  border-radius:16px;
  display:flex;
  justify-content:center;
  overflow:hidden;
  position:relative;
}
.carousel__list--image-treatment-large>li:after{
  background:rgba(0, 0, 0, .05);
  bottom:0;
  content:"";
  display:block;
  left:0;
  pointer-events:none;
  position:absolute;
  right:0;
  top:0;
}
.carousel__list--image-treatment-large>li>img{
  display:inline-block;
  max-height:100%;
  max-width:100%;
  object-fit:contain;
}

div.carousel{
  margin:16px 0;
}

.carousel__control{
  align-items:center;
  background-color:var(--carousel-paddle-background-color, var(--color-background-primary));
  border:1px solid;
  border-color:var(--carousel-paddle-border-color, var(--color-stroke-subtle));
  border-radius:16px;
  box-shadow:0 2px 2px 0 rgba(0, 0, 0, .24),0 0 2px 0 rgba(0, 0, 0, .12);
  display:flex;
  font-size:18px;
  height:32px;
  justify-content:center;
  opacity:0;
  padding:0;
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  transition:opacity .45s ease-in-out;
  width:32px;
  z-index:1;
}
.carousel__control--prev{
  left:calc(var(--spacing-200)*-1);
  margin-inline-end:1px;
}
.carousel__control--next{
  margin-inline-start:1px;
  right:calc(var(--spacing-200)*-1);
}
.carousel__control svg{
  color:var(--carousel-paddle-foreground-color, var(--color-foreground-primary));
}
.carousel__control:focus:not(:focus-visible){
  outline:none;
}
@media (min-width:512px){
  .carousel:focus-within .carousel__control{
    opacity:.92;
  }
  .carousel:focus-within .carousel__control[aria-disabled=true]{
    opacity:.3;
  }
}
@media (min-width:512px) and (hover:hover){
  .carousel:hover .carousel__control{
    opacity:.92;
  }
  .carousel:hover .carousel__control[aria-disabled=true]{
    opacity:.3;
  }
}
.carousel__control--show,.carousel__control:focus{
  opacity:.92;
}
.carousel__control--show[aria-disabled=true],.carousel__control:focus[aria-disabled=true]{
  opacity:.3;
}
.carousel__control:hover{
  background-color:var(--color-state-primary-hover);
  border-color:var(--color-state-primary-hover);
}
.carousel__control:hover svg{
  color:var(--carousel-paddle-hover-foreground-color, var(--color-foreground-primary));
}
.carousel__control:active{
  background-color:var(--color-state-primary-active);
}

.carousel__playback:focus:not(:focus-visible){
  outline:none;
}

span.carousel,span.carousel__container{
  display:inline-block;
}

.carousel__viewport--mask{
  -webkit-mask-image:linear-gradient(to right, var(--color-background-primary) 85%, rgba(0, 0, 0, 0) 100%);
          mask-image:linear-gradient(to right, var(--color-background-primary) 85%, rgba(0, 0, 0, 0) 100%);
}

[dir=rtl] .carousel__control--prev{
  left:unset;
  right:calc(var(--spacing-200)*-1);
}
[dir=rtl] .carousel__control--next{
  left:calc(var(--spacing-200)*-1);
  right:unset;
}
[dir=rtl] .carousel__control .icon--12{
  transform:rotate(180deg);
}
@supports not ((-webkit-scroll-snap-coordinate:0 0) or (-ms-scroll-snap-coordinate:0 0) or (scroll-snap-coordinate:0 0) or (scroll-snap-align:start)){
  .carousel:not(.carousel__autoplay) .carousel__control{
    opacity:.92;
  }
  .carousel:not(.carousel__autoplay) .carousel__control[aria-disabled=true]{
    opacity:.3;
  }
}
@supports (-webkit-scroll-snap-coordinate:0 0) or (-ms-scroll-snap-coordinate:0 0) or (scroll-snap-coordinate:0 0) or (scroll-snap-align:start){
  .carousel:not(.carousel__autoplay){
    overflow:visible;
  }
  .carousel:not(.carousel__autoplay) .carousel__control{
    margin-top:-5px;
  }
  .carousel:not(.carousel__autoplay) .carousel__list{
    border-color:rgba(0, 0, 0, 0);
    -webkit-overflow-scrolling:touch;
    overflow-x:auto;
    overflow-y:hidden;
    padding-bottom:10px;
    scroll-behavior:smooth;
    scroll-snap-type:proximity;
    scroll-snap-type:x proximity;
    scrollbar-color:rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
    scrollbar-width:thin;
    transition:border-color .5s,scrollbar-color .5s,transform .45s ease-in-out;
  }
  .carousel:not(.carousel__autoplay) .carousel__list:hover{
    border-color:rgba(0, 0, 0, .4);
    scrollbar-color:rgba(0, 0, 0, .4) rgba(0, 0, 0, 0);
  }
  .carousel:not(.carousel__autoplay) .carousel__list::-webkit-scrollbar{
    height:5px;
  }
  .carousel:not(.carousel__autoplay) .carousel__list::-webkit-scrollbar-thumb{
    border-color:inherit;
    border-radius:4px;
    border-right-style:inset;
    border-right-width:calc(100vw + 100vh);
  }
  .carousel__snap-point{
    scroll-snap-align:flex-start;
    scroll-snap-coordinate:0 0;
  }
  @media (min-width:512px){
    div.carousel{
      margin:16px 0;
    }
  }
}
.carousel.carousel--hidden-scrollbar:not(.carousel__autoplay){
  overflow:hidden;
}

.carousel--hidden-scrollbar .carousel__container{
  margin-bottom:-80px;
}

.carousel--hidden-scrollbar .carousel__container .carousel__control{
  margin-top:-40px;
}

.carousel--hidden-scrollbar .carousel__container .carousel__list{
  padding-bottom:80px;
}
.carousel--hidden-scrollbar .carousel__control--prev{
  left:0;
}
.carousel--hidden-scrollbar .carousel__control--next{
  right:0;
}
.ccd{
  display:inline-flex;
  gap:8px;
}

.ccd__charger-icon{
  height:78px;
  width:58px;
}

.ccd__description-figure{
  align-items:center;
  display:flex;
  flex-direction:column;
  justify-content:center;
  width:55px;
}

.ccd__top-icon{
  height:24px;
  width:35px;
}

.ccd__body{
  align-items:center;
  border:1px solid var(--color-foreground-primary);
  border-radius:1.5px;
  display:flex;
  flex-direction:column;
  font-size:.4375rem;
  font-weight:var(--font-weight-bold);
  gap:2px;
  height:53px;
  justify-content:center;
  overflow:hidden;
  text-align:center;
  width:53px;
}
.calendar{
  color:var(--calendar-color-token, var(--color-foreground-primary));
  display:table;
}
.calendar__header{
  display:table-caption;
}

.calendar__header--inner{
  align-items:center;
  display:flex;
  justify-content:space-between;
}

.calendar__header h3{
  flex-grow:1;
  margin:0;
  text-align:center;
  width:0;
}

.calendar__header h3:nth-child(2){
  margin-right:40px;
}

.calendar__header h3:nth-last-child(2){
  margin-left:40px;
}

.calendar__header h3:nth-child(2):nth-last-child(2){
  margin:0;
}

.calendar__header .icon-btn svg{
  width:var(--spacing-200);
}
.calendar__body{
  display:table-row;
}

.calendar__month{
  box-sizing:initial;
  display:table-cell;
  width:var(--calendar-month-width, 100vw);
}

.calendar__month+.calendar__month{
  padding-left:var(--spacing-200);
}
.calendar__month>table>caption{
  text-align:left;
}

.calendar__header+.calendar__body>.calendar__month>table>caption{
  display:none;
}

.calendar__month>table{
  border-spacing:0 var(--spacing-150);
  width:100%;
}

.calendar__month th{
  color:var(--calendar-day-label-color, var(--color-foreground-secondary));
  font-weight:400;
  line-height:var(--spacing-125);
}

.calendar__month td{
  padding:0;
  text-align:center;
}

.calendar__month td>*{
  align-items:center;
  background:none;
  border:1px transparent;
  border-radius:var(--spacing-200);
  box-sizing:border-box;
  color:inherit;
  display:inline-flex;
  font:inherit;
  height:var(--spacing-400);
  justify-content:center;
  width:var(--spacing-400);
}
.calendar__month td:not(.calendar__cell--selected)>.calendar__cell--current:not(.calendar__cell--disabled),.calendar__month td:not(.calendar__cell--selected)>[aria-current=date]:not(:disabled){
  border-color:var(--calendar-day-today-border-color, var(--color-foreground-primary));
  border-style:solid;
}

.calendar__month td>.calendar__cell--disabled,.calendar__month td>:disabled{
  color:var(--calendar-day-disabled-color, var(--color-foreground-disabled));
}

.calendar__month td:not(.calendar__range,.calendar__cell--selected)>button:not(:disabled):hover{
  background-color:var(--calendar-day-hover-background-color, var(--color-state-primary-hover));
}

.calendar__month td:not(.calendar__range,.calendar__cell--selected)>button:not(:disabled):active{
  font-weight:700;
}

.calendar__month td.calendar__cell--selected>*{
  background-color:var(--calendar-day-selected-background-color, var(--color-background-inverse));
  color:var(--calendar-day-selected-color, var(--color-foreground-on-inverse));
  font-weight:700;
}
.calendar__range{
  background-color:var(--calendar-day-range-background-color, var(--color-state-secondary-active));
  position:relative;
}

.calendar__range:before{
  border:solid transparent;
  border-width:1px 0;
  bottom:0;
  content:"";
  left:0;
  pointer-events:none;
  position:absolute;
  right:0;
  top:0;
}

.calendar__range--start:before{
  border-left-width:1px;
}

.calendar__range--end:before{
  border-right-width:1px;
}

.calendar__range--start{
  background:linear-gradient(to right, transparent 50%, var(--color-state-secondary-active) 50%);
}

.calendar__range--end{
  background:linear-gradient(to left, transparent 50%, var(--color-state-secondary-active) 50%);
}

.calendar__range--start.calendar__range--end{
  background:transparent;
}

.calendar__range--end:not(.calendar__cell--selected)>:not(:disabled,[aria-disabled=true]),.calendar__range--start:not(.calendar__cell--selected)>:not(:disabled,[aria-disabled=true]){
  background-color:var(--calendar-day-range-end, var(--color-state-secondary-active));
}

.chart-legend{
  width:100%;
}

.chart-legend dl{
  display:flex;
  flex-direction:column;
  margin:0;
  padding:0;
  row-gap:var(--spacing-200);
}

.chart-legend__item{
  align-items:center;
  display:flex;
  font-size:var(--font-size-small);
  width:100%;
}

.chart-legend__item:before{
  border:1px solid;
  border-radius:2px;
  box-sizing:border-box;
  content:"";
  display:inline-block;
  height:10px;
  margin-inline-end:var(--spacing-100);
  width:10px;
}

.chart-legend dl>.chart-legend__item:first-child:before{
  background:var(--color-data-viz-chart-primary);
  border-color:var(--color-data-viz-chart-primary);
}

.chart-legend dl>.chart-legend__item:nth-child(2):before{
  background:var(--color-data-viz-chart-secondary);
  border-color:var(--color-data-viz-chart-secondary);
}

.chart-legend dl>.chart-legend__item:nth-child(3):before{
  background:repeating-linear-gradient(30deg, var(--color-data-viz-chart-tertiary-background), var(--color-data-viz-chart-tertiary-background) 2px, var(--color-data-viz-chart-tertiary-stroke) 2px, var(--color-data-viz-chart-tertiary-stroke) 3px, var(--color-data-viz-chart-tertiary-background) 3px, var(--color-data-viz-chart-tertiary-background) 4px);
  border:1px solid var(--color-data-viz-chart-tertiary-stroke);
}

.chart-legend dl>.chart-legend__item:nth-child(4):before{
  background:repeating-linear-gradient(0deg, var(--color-data-viz-chart-quaternary-background), var(--color-data-viz-chart-quaternary-background) 2px, var(--color-data-viz-chart-quaternary-stroke) 2px, var(--color-data-viz-chart-quaternary-stroke) 3px, var(--color-data-viz-chart-quaternary-background) 3px, var(--color-data-viz-chart-quaternary-background) 4px);
  border:1px solid var(--color-data-viz-chart-quaternary-stroke);
}

.chart-legend dl>.chart-legend__item:nth-child(5):before{
  background:var(--color-data-viz-chart-quinary-background);
  border-color:var(--color-data-viz-chart-quinary-stroke);
}

.chart-legend__label{
  flex:1;
}
.checkbox{
  display:inline-flex;
  position:relative;
  vertical-align:text-bottom;
}

.checkbox__control[type=checkbox]{
  height:18px;
  min-width:18px;
  width:18px;
}

.checkbox--large .checkbox__control[type=checkbox]{
  height:24px;
  min-width:24px;
  width:24px;
}

span.checkbox__icon{
  display:inline-flex;
  height:18px;
  outline-offset:1px;
}

.checkbox--large span.checkbox__icon{
  height:24px;
}
span.checkbox__icon[hidden]{
  display:inline-flex;
}

svg.checkbox__checked{
  color:var(--checkbox-checked-color, var(--color-foreground-primary));
}

svg.checkbox__unchecked{
  color:var(--checkbox-unchecked-color, var(--color-foreground-primary));
}

input.checkbox__control[type=checkbox]{
  font-size:100%;
  margin:0;
  opacity:0;
  padding:0;
  position:absolute;
  z-index:1;
}

.checkbox svg{
  display:inline-block;
  fill:currentColor;
  pointer-events:none;
  stroke:currentColor;
  stroke-width:0;
  height:18px;
  vertical-align:middle;
  width:18px;
}

.checkbox--large svg{
  height:24px;
  width:24px;
}

input.checkbox__control[type=checkbox]+span.checkbox__icon svg.checkbox__checked{
  display:none;
}

input.checkbox__control[type=checkbox]+span.checkbox__icon svg.checkbox__unchecked,input.checkbox__control[type=checkbox]:checked+span.checkbox__icon svg.checkbox__checked{
  display:inline-block;
}

input.checkbox__control[type=checkbox]:checked+span.checkbox__icon svg.checkbox__unchecked{
  display:none;
}

input.checkbox__control[type=checkbox][disabled]+span.checkbox__icon{
  opacity:1;
}
input.checkbox__control[type=checkbox][disabled]+span.checkbox__icon svg{
  fill:var(--checkbox-disabled-color, var(--color-foreground-disabled));
}
input.checkbox__control[type=checkbox]:focus+span.checkbox__icon{
  outline:1px auto;
  outline-color:var(--checkbox-outline, var(--color-foreground-secondary));
  outline-offset:2px;
}

input.checkbox__control[type=checkbox]:focus:not(:focus-visible)+span.checkbox__icon{
  outline:none;
}
.chip{
  align-items:center;
  background-color:var(--color-background-tertiary);
  border-radius:var(--spacing-400);
  color:var(--color-foreground-primary);
  display:inline-flex;
  font-size:var(--font-size-default);
  gap:2px;
  justify-content:space-between;
  max-width:296px;
  min-height:var(--spacing-250);
  min-width:32px;
  padding:0 var(--spacing-150);
}

.chip__text{
  overflow:hidden;
  padding:var(--spacing-75) 0;
  text-overflow:ellipsis;
  white-space:nowrap;
}

button.chip__button{
  background-color:initial;
  border:none;
  border-radius:50px;
  box-sizing:border-box;
  flex-shrink:0;
  height:var(--spacing-300);
  line-height:0;
  margin-inline-end:-8px;
  padding:0;
  width:var(--spacing-300);
}

button.chip__button:focus-visible{
  background-color:var(--state-layer-focus);
  outline-color:var(--color-state-focus-stroke);
  outline-offset:-2px;
  outline-style:solid;
  outline-width:2px;
}

button.chip__button:hover{
  background-color:var(--state-layer-hover);
}

button.chip__button>svg{
  fill:var(--color-foreground-on-primary);
}
.chips-combobox{
  background-color:var(--color-background-secondary);
  border:1px solid var(--color-stroke-default);
  border-radius:var(--border-radius-50);
  display:inline-block;
  padding-bottom:var(--spacing-100);
  padding-inline-end:var(--spacing-200);
  padding-inline-start:var(--spacing-100);
  padding-top:var(--spacing-100);
  position:relative;
}

.chips-combobox--fluid{
  display:block;
}

.chips-combobox__items{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  list-style:none;
  margin:0;
  margin-bottom:var(--spacing-100);
  padding:0;
}

.chips-combobox__items:empty{
  display:none;
}

.chips-combobox__items li{
  display:inline-block;
}

.chips-combobox .combobox__control>input{
  background-color:inherit;
  border:none;
  border-radius:0;
  height:auto;
  margin:0 var(--spacing-100);
  padding:var(--spacing-75) 0;
  width:calc(100% - var(--spacing-200));
}

.chips-combobox .combobox__control>input:focus{
  outline:none;
}

.chips-combobox .combobox{
  margin-inline-start:calc(var(--spacing-100)*-1);
  width:calc(100% + var(--spacing-300));
}

.chips-combobox .combobox svg.icon{
  pointer-events:none;
  position:absolute;
  right:var(--spacing-200);
  top:calc(50% - var(--spacing-100));
  transform:rotateX(0deg);
  transition:transform .2s linear;
}

.chips-combobox .combobox__listbox--set-position{
  top:calc(100% + var(--spacing-150));
}

.chips-combobox .combobox__option[role^=option]{
  border-style:none;
}

.chips-combobox .combobox__option span{
  pointer-events:none;
}

.chips-combobox:focus-within{
  background-color:var(--color-background-primary);
  border-color:var(--color-stroke-strong);
}
.chips-combobox .combobox--expanded svg.icon{
  transform:rotateX(180deg);
}

.chips-combobox--error,.chips-combobox--error:focus-within{
  border-color:var(--color-stroke-attention);
}
.chips-combobox[aria-disabled]{
  border-color:var(--color-stroke-disabled);
  pointer-events:none;
}

.chips-combobox[aria-disabled] .chip{
  color:var(--color-foreground-disabled);
}

.chips-combobox[aria-disabled] svg.icon{
  fill:var(--color-foreground-disabled);
}

.chips-combobox[aria-disabled] .combobox__control>input{
  border:none;
  color:var(--color-foreground-disabled);
}

.chips-combobox[aria-disabled] .combobox__control>input::placeholder{
  color:var(--color-foreground-disabled);
}
[dir=rtl] .chips-combobox .combobox__control>input{
  padding:var(--spacing-75) 0;
}
.combobox{
  box-sizing:border-box;
  line-height:normal;
  position:relative;
}

span.combobox{
  display:inline-block;
  vertical-align:bottom;
}

.combobox__value{
  flex:1 0 auto;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.combobox__options--fix-width[role=listbox]{
  width:100%;
}

.combobox__listbox{
  background-color:var(--combobox-listbox-background-color, var(--color-background-elevated));
  border-radius:var(--combobox-listbox-border-radius, var(--border-radius-50));
  box-shadow:var(--bubble-shadow);
  box-sizing:border-box;
  display:none;
  left:0;
  max-height:400px;
  overflow-y:auto;
  position:absolute;
  top:0;
  width:-moz-fit-content;
  width:fit-content;
  z-index:2;
}
.combobox__listbox--set-position{
  min-width:100%;
  top:calc(100% + 4px);
  width:auto;
}
.combobox__listbox--fixed{
  position:fixed;
}

.combobox__listbox--reverse,[dir=rtl] .combobox__listbox{
  left:unset;
  right:0;
}
[dir=rtl] .combobox__listbox--reverse{
  left:0;
  right:unset;
}

.combobox__control>button