._VbXxq_i18nFontFamily {
  font-synthesis: weight;
  font-family: adobe-clean, Source Sans Pro, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Ubuntu, Trebuchet MS, Lucida Grande, sans-serif;

  &:lang(ar) {
    font-family: myriad-arabic, adobe-clean, Source Sans Pro, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Ubuntu, Trebuchet MS, Lucida Grande, sans-serif;
  }

  &:lang(he) {
    font-family: myriad-hebrew, adobe-clean, Source Sans Pro, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Ubuntu, Trebuchet MS, Lucida Grande, sans-serif;
  }

  &:lang(zh) {
    font-family: adobe-clean-han-traditional, source-han-traditional, MingLiu, Heiti TC Light, sans-serif;
  }

  &:lang(zh-Hans) {
    font-family: adobe-clean-han-simplified-c, source-han-simplified-c, SimSun, Heiti SC Light, sans-serif;
  }

  &:lang(zh-Hant) {
    font-family: adobe-clean-han-traditional, source-han-traditional, MingLiu, Microsoft JhengHei UI, Microsoft JhengHei, Heiti TC Light, sans-serif;
  }

  &:lang(zh-SG), &:lang(zh-CN) {
    font-family: adobe-clean-han-simplified-c, source-han-simplified-c, SimSun, Heiti SC Light, sans-serif;
  }

  &:lang(ko) {
    font-family: adobe-clean-han-korean, source-han-korean, Malgun Gothic, Apple Gothic, sans-serif;
  }

  &:lang(ja) {
    font-family: adobe-clean-han-japanese, Hiragino Kaku Gothic ProN, ヒラギノ角ゴ ProN W3, Osaka, YuGothic, Yu Gothic, メイリオ, Meiryo, ＭＳ Ｐゴシック, MS PGothic, sans-serif;
  }
}

._VbXxq_spectrum-FocusRing-ring {
  --spectrum-focus-ring-border-radius: var(--spectrum-textfield-border-radius, var(--spectrum-alias-border-radius-regular));
  --spectrum-focus-ring-gap: var(--spectrum-alias-input-focusring-gap);
  --spectrum-focus-ring-size: var(--spectrum-alias-input-focusring-size);
  --spectrum-focus-ring-border-size: 0px;
  --spectrum-focus-ring-color: var(--spectrum-high-contrast-focus-ring-color, var(--spectrum-alias-focus-ring-color, var(--spectrum-alias-focus-color)));

  &:after {
    border-radius: calc(var(--spectrum-focus-ring-border-radius) + var(--spectrum-focus-ring-gap));
    content: "";
    margin: calc(-1 * var(--spectrum-focus-ring-border-size));
    pointer-events: none;
    transition: box-shadow var(--spectrum-global-animation-duration-100, .13s) ease-out,
      margin var(--spectrum-global-animation-duration-100, .13s) ease-out;
    display: block;
    position: absolute;
    inset: 0;
  }
}

._VbXxq_spectrum-FocusRing {
  &._VbXxq_focus-ring {
    &:after {
      margin: calc(var(--spectrum-focus-ring-gap) * -1 - var(--spectrum-focus-ring-border-size));
      box-shadow: 0 0 0 var(--spectrum-focus-ring-size) var(--spectrum-focus-ring-color);
    }
  }
}

._VbXxq_spectrum-FocusRing--quiet {
  &:after {
    border-radius: 0;
  }

  &._VbXxq_focus-ring {
    &:after {
      margin: 0 0 calc(var(--spectrum-focus-ring-gap) * -1 - var(--spectrum-focus-ring-border-size))
        0;
      box-shadow: 0 var(--spectrum-focus-ring-size) 0 var(--spectrum-focus-ring-color);
    }
  }
}

@media (forced-colors: active) {
  ._VbXxq_spectrum-FocusRing, ._VbXxq_spectrum-FocusRing-ring, ._VbXxq_spectrum-FocusRing--quiet {
    --spectrum-high-contrast-focus-ring-color: Highlight;

    &:after {
      forced-color-adjust: none;
    }
  }
}

._VbXxq_spectrum-BaseButton {
  box-sizing: border-box;
  border-radius: var(--spectrum-button-border-radius);
  border-style: solid;
  border-width: var(--spectrum-button-border-width);
  --spectrum-focus-ring-border-radius: var(--spectrum-button-border-radius);
  --spectrum-focus-ring-border-size: var(--spectrum-button-border-width);
  --spectrum-focus-ring-gap: var(--spectrum-alias-focus-ring-gap, var(--spectrum-global-dimension-static-size-25));
  --spectrum-focus-ring-size: var(--spectrum-button-primary-focus-ring-size-key-focus, var(--spectrum-alias-focus-ring-size));
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  justify-content: center;
  align-items: center;
  margin: 0;
  display: inline-flex;
  position: relative;
  overflow: visible;

  button& {
    -webkit-appearance: button;
  }

  vertical-align: top;
  transition: background var(--spectrum-global-animation-duration-100, .13s) ease-out,
    border-color var(--spectrum-global-animation-duration-100, .13s) ease-out,
    color var(--spectrum-global-animation-duration-100, .13s) ease-out,
    box-shadow var(--spectrum-global-animation-duration-100, .13s) ease-out;
  -webkit-user-select: none;
  user-select: none;
  touch-action: none;
  cursor: default;
  isolation: isolate;
  line-height: 1.3;
  text-decoration: none;

  &:focus {
    outline: none;
  }

  &._VbXxq_focus-ring {
    z-index: 3;
  }

  &::-moz-focus-inner {
    border: 0;
    margin-block: -2px;
    padding: 0;
  }

  &:disabled, &._VbXxq_is-disabled {
    cursor: default;
  }

  & ._VbXxq_spectrum-Icon {
    max-block-size: 100%;
    transition: background var(--spectrum-global-animation-duration-100, .13s) ease-out,
      fill var(--spectrum-global-animation-duration-100, .13s) ease-out;
    box-sizing: initial;
    flex-shrink: 0;
    order: 0;
  }
}

._VbXxq_spectrum-Button {
  --spectrum-button-border-radius: var(--spectrum-button-primary-border-radius, var(--spectrum-alias-border-radius-large));
  --spectrum-button-border-width: var(--spectrum-button-primary-border-size, var(--spectrum-alias-border-size-thick));
  min-block-size: var(--spectrum-button-primary-height, var(--spectrum-alias-single-line-height));
  block-size: 0%;
  min-inline-size: var(--spectrum-button-primary-min-width);
  padding: var(--spectrum-global-dimension-size-50)
    calc(var(--spectrum-button-primary-padding-x, var(--spectrum-global-dimension-size-200)) - var(--spectrum-button-primary-border-size, var(--spectrum-alias-border-size-thick)));
  font-size: var(--spectrum-button-primary-text-size, var(--spectrum-alias-pill-button-text-size));
  font-weight: var(--spectrum-button-primary-text-font-weight, var(--spectrum-global-font-weight-bold));
  border-style: solid;
  padding-block-start: calc(var(--spectrum-global-dimension-size-50) - 1px);
  padding-block-end: calc(var(--spectrum-global-dimension-size-50) + 1px);

  &._VbXxq_is-hovered, &:active {
    box-shadow: none;
  }

  & ._VbXxq_spectrum-Icon + ._VbXxq_spectrum-Button-label {
    margin-inline-start: var(--spectrum-button-primary-text-gap, var(--spectrum-global-dimension-size-100));
  }

  & ._VbXxq_spectrum-Button-label + ._VbXxq_spectrum-Icon {
    margin-inline-end: var(--spectrum-button-primary-text-gap, var(--spectrum-global-dimension-size-100));
  }

  &._VbXxq_spectrum-Button--iconOnly {
    min-inline-size: unset;
    padding: var(--spectrum-global-dimension-size-65);
  }

  & ._VbXxq_spectrum-Button-circleLoader {
    align-items: center;
    display: flex;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  &._VbXxq_spectrum-Button--pending {
    & ._VbXxq_spectrum-Button-label, & ._VbXxq_spectrum-Icon {
      opacity: 0;
    }
  }
}

a._VbXxq_spectrum-Button, a._VbXxq_spectrum-ActionButton {
  -webkit-appearance: none;
  -webkit-user-select: none;
  user-select: none;
  cursor: pointer;
}

._VbXxq_spectrum-ActionButton {
  block-size: var(--spectrum-actionbutton-height, var(--spectrum-alias-single-line-height));
  min-inline-size: var(--spectrum-actionbutton-min-width, var(--spectrum-global-dimension-size-400));
  --spectrum-button-border-radius: var(--spectrum-actionbutton-border-radius, var(--spectrum-alias-border-radius-regular));
  --spectrum-button-border-width: var(--spectrum-actionbutton-border-size, var(--spectrum-alias-border-size-thin));
  font-size: var(--spectrum-actionbutton-text-size, var(--spectrum-alias-font-size-default));
  font-weight: var(--spectrum-actionbutton-text-font-weight, var(--spectrum-alias-body-text-font-weight));
  padding: 0;
  position: relative;

  & ._VbXxq_spectrum-Icon {
    padding-inline-start: var(--spectrum-actionbutton-icon-padding-x, var(--spectrum-global-dimension-size-85));
  }

  & ._VbXxq_spectrum-ActionButton-label {
    padding-inline-end: var(--spectrum-actionbutton-text-padding-x, var(--spectrum-global-dimension-size-150));
  }

  & ._VbXxq_spectrum-Icon + ._VbXxq_spectrum-ActionButton-label {
    padding-inline-start: var(--spectrum-actionbutton-icon-padding-x, var(--spectrum-global-dimension-size-85));
  }

  & ._VbXxq_spectrum-ActionButton-label:not([hidden]) + ._VbXxq_spectrum-Icon {
    padding-inline-end: var(--spectrum-actionbutton-icon-padding-x, var(--spectrum-global-dimension-size-85));
  }

  & ._VbXxq_spectrum-ActionButton-label:only-child, & ._VbXxq_spectrum-ActionButton-hold + ._VbXxq_spectrum-ActionButton-label:last-child {
    padding-inline-start: var(--spectrum-actionbutton-text-padding-x, var(--spectrum-global-dimension-size-150));
  }

  & ._VbXxq_spectrum-Icon:only-child, & ._VbXxq_spectrum-ActionButton-hold + ._VbXxq_spectrum-Icon:last-child {
    padding-inline-end: var(--spectrum-actionbutton-icon-padding-x, var(--spectrum-global-dimension-size-85));
  }

  & ._VbXxq_spectrum-ActionGroup-itemIcon._VbXxq_spectrum-ActionGroup-itemIcon {
    padding-inline-end: 0;
  }
}

._VbXxq_spectrum-ActionButton-hold {
  position: absolute;
  inset-block-end: var(--spectrum-actionbutton-hold-icon-padding-bottom, var(--spectrum-global-dimension-size-40));
  inset-inline-end: var(--spectrum-actionbutton-hold-icon-padding-right, var(--spectrum-global-dimension-size-40));
}

[dir="rtl"] ._VbXxq_spectrum-ActionButton-hold {
  transform: rotate(90deg);
}

._VbXxq_spectrum-ActionButton-label, ._VbXxq_spectrum-Button-label {
  text-align: center;
  order: 1;
  place-self: center;
  inline-size: 100%;

  &:empty {
    display: none;
  }
}

._VbXxq_spectrum-ActionButton-label {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

._VbXxq_spectrum-ActionButton--quiet {
  border-width: var(--spectrum-actionbutton-quiet-border-size, var(--spectrum-alias-border-size-thin));
  border-radius: var(--spectrum-actionbutton-quiet-border-radius, var(--spectrum-alias-border-radius-regular));
  font-size: var(--spectrum-actionbutton-quiet-text-size, var(--spectrum-alias-font-size-default));
  font-weight: var(--spectrum-actionbutton-quiet-text-font-weight, var(--spectrum-alias-body-text-font-weight));
}

._VbXxq_spectrum-LogicButton {
  block-size: var(--spectrum-logicbutton-and-height, 24px);
  padding: var(--spectrum-logicbutton-and-padding-x, var(--spectrum-global-dimension-size-100));
  --spectrum-button-border-width: var(--spectrum-logicbutton-and-border-size, var(--spectrum-alias-border-size-thick));
  --spectrum-button-border-radius: var(--spectrum-logicbutton-and-border-radius, var(--spectrum-alias-border-radius-regular));
  font-size: var(--spectrum-logicbutton-and-text-size, var(--spectrum-alias-font-size-default));
  font-weight: var(--spectrum-logicbutton-and-text-font-weight, var(--spectrum-global-font-weight-bold));
  line-height: 0;
}

._VbXxq_spectrum-FieldButton {
  block-size: var(--spectrum-dropdown-height, var(--spectrum-global-dimension-size-400));
  padding: 0 var(--spectrum-dropdown-padding-x, var(--spectrum-global-dimension-size-150));
  font-family: inherit;
  font-weight: normal;
  font-size: var(--spectrum-dropdown-text-size, var(--spectrum-alias-font-size-default));
  -webkit-font-smoothing: initial;
  cursor: default;
  --spectrum-focus-ring-gap: var(--spectrum-alias-input-focusring-gap);
  --spectrum-focus-ring-size: var(--spectrum-alias-input-focusring-size);
  outline: none;
  line-height: normal;
  position: relative;
}

._VbXxq_spectrum-FieldButton {
  padding-block: 0;
  padding-inline: var(--spectrum-dropdown-padding-x, var(--spectrum-global-dimension-size-150));
  --spectrum-button-border-width: var(--spectrum-dropdown-border-size, var(--spectrum-alias-border-size-thin));
  --spectrum-button-border-radius: var(--spectrum-alias-border-radius-regular, var(--spectrum-global-dimension-size-50));
  transition: background-color var(--spectrum-global-animation-duration-100, .13s),
    box-shadow var(--spectrum-global-animation-duration-100, .13s),
    border-color var(--spectrum-global-animation-duration-100, .13s);
  border-style: solid;
  margin: 0;

  &:disabled, &._VbXxq_is-disabled {
    cursor: default;
    border-width: 0;
  }

  &._VbXxq_is-open {
    border-width: var(--spectrum-dropdown-border-size, var(--spectrum-alias-border-size-thin));
  }
}

._VbXxq_spectrum-FieldButton--quiet {
  --spectrum-button-border-width: 0;
  --spectrum-button-border-radius: var(--spectrum-fieldbutton-quiet-border-radius, 0px);
  --spectrum-focus-ring-size: var(--spectrum-alias-focus-ring-size, var(--spectrum-global-dimension-static-size-25));
  margin: 0;
  padding: 0;

  &:disabled, &._VbXxq_is-disabled {
    &._VbXxq_focus-ring {
      box-shadow: none;
    }
  }
}

._VbXxq_spectrum-ClearButton {
  inline-size: var(--spectrum-clearbutton-medium-width, var(--spectrum-alias-single-line-height));
  block-size: var(--spectrum-clearbutton-medium-height, var(--spectrum-alias-single-line-height));
  --spectrum-button-border-radius: 100%;
  --spectrum-button-border-width: 0px;
  border: none;
  margin: 0;
  padding: 0;

  & > ._VbXxq_spectrum-Icon {
    margin-block: 0;
    margin-inline: auto;
  }

  &._VbXxq_spectrum-ClearButton--inset._VbXxq_spectrum-ClearButton--inset {
    box-sizing: border-box;
    transition: unset;

    &:after {
      aspect-ratio: 1;
      height: calc(100% - 2px);
      top: 50%;
      left: 50%;
      right: unset;
      bottom: unset;
      margin: 0;
      transition: unset;
      transform: translate(-50%, -50%);
    }

    &._VbXxq_focus-ring {
      &:after {
        box-shadow: inset 0 0 0 var(--spectrum-focus-ring-size) var(--spectrum-focus-ring-color);
      }
    }
  }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  ._VbXxq_spectrum-ClearButton {
    & > ._VbXxq_spectrum-Icon {
      margin: 0;
    }
  }
}

._VbXxq_spectrum-ClearButton--small {
  inline-size: var(--spectrum-clearbutton-small-width, var(--spectrum-global-dimension-size-300));
  block-size: var(--spectrum-clearbutton-small-height, var(--spectrum-global-dimension-size-300));
}

._VbXxq_spectrum-ClearButton {
  background-color: var(--spectrum-clearbutton-medium-background-color, var(--spectrum-alias-background-color-transparent));
  color: var(--spectrum-clearbutton-medium-icon-color, var(--spectrum-alias-icon-color));

  & ._VbXxq_spectrum-Icon {
    fill: var(--spectrum-clearbutton-medium-icon-color, var(--spectrum-alias-icon-color));
  }

  &._VbXxq_is-hovered {
    background-color: var(--spectrum-clearbutton-medium-background-color-hover, var(--spectrum-alias-background-color-transparent));
    color: var(--spectrum-clearbutton-medium-icon-color-hover, var(--spectrum-alias-icon-color-hover));

    & ._VbXxq_spectrum-Icon {
      fill: var(--spectrum-clearbutton-medium-icon-color-hover, var(--spectrum-alias-icon-color-hover));
    }
  }

  &._VbXxq_is-active {
    background-color: var(--spectrum-clearbutton-medium-background-color-down, var(--spectrum-alias-background-color-transparent));
    color: var(--spectrum-clearbutton-medium-icon-color-down, var(--spectrum-alias-icon-color-down));

    & ._VbXxq_spectrum-Icon {
      fill: var(--spectrum-clearbutton-medium-icon-color-down, var(--spectrum-alias-icon-color-down));
    }
  }

  &._VbXxq_focus-ring {
    background-color: var(--spectrum-clearbutton-medium-background-color-key-focus, var(--spectrum-alias-background-color-transparent));
    color: var(--spectrum-clearbutton-medium-icon-color-key-focus, var(--spectrum-alias-icon-color-focus));

    & ._VbXxq_spectrum-Icon {
      fill: var(--spectrum-clearbutton-medium-icon-color-key-focus, var(--spectrum-alias-icon-color-focus));
    }
  }

  &:disabled, &._VbXxq_is-disabled {
    background-color: var(--spectrum-clearbutton-medium-background-color-disabled, var(--spectrum-alias-background-color-transparent));
    color: var(--spectrum-clearbutton-medium-icon-color-disabled, var(--spectrum-alias-icon-color-disabled));

    & ._VbXxq_spectrum-Icon {
      fill: var(--spectrum-clearbutton-medium-icon-color-disabled, var(--spectrum-alias-icon-color-disabled));
    }
  }
}

._VbXxq_spectrum-ClearButton--overBackground {
  --spectrum-clearbutton-medium-background-color: transparent;
  --spectrum-clearbutton-medium-background-color-hover: #ffffff1a;
  --spectrum-clearbutton-medium-background-color-key-focus: #ffffff1a;
  --spectrum-clearbutton-medium-background-color-down: #ffffff26;
  --spectrum-clearbutton-medium-background-color-disabled: transparent;
  --spectrum-clearbutton-medium-icon-color: white;
  --spectrum-clearbutton-medium-icon-color-hover: white;
  --spectrum-clearbutton-medium-icon-color-down: white;
  --spectrum-clearbutton-medium-icon-color-key-focus: white;
  --spectrum-clearbutton-medium-icon-color-disabled: #ffffff8c;
  --spectrum-focus-ring-color: white;
}

._VbXxq_spectrum-Button {
  &[data-style="fill"] {
    --spectrum-button-text-color: white;
    --spectrum-button-text-color-hover: var(--spectrum-button-text-color);
    --spectrum-button-text-color-down: var(--spectrum-button-text-color);
    --spectrum-button-text-color-key-focus: var(--spectrum-button-text-color);
    --spectrum-button-text-color-disabled: var(--spectrum-alias-text-color-disabled, var(--spectrum-global-color-gray-500));
    --spectrum-button-color-disabled: var(--spectrum-alias-background-color-disabled);
    background-color: var(--spectrum-high-contrast-button-text, var(--spectrum-button-color));
    color: var(--spectrum-high-contrast-button-face, var(--spectrum-button-text-color));
    border-color: #0000;

    &._VbXxq_is-hovered {
      background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-button-color-hover));
      color: var(--spectrum-high-contrast-button-face, var(--spectrum-button-text-color-hover));
    }

    &._VbXxq_focus-ring {
      background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-button-color-key-focus));
      color: var(--spectrum-high-contrast-button-face, var(--spectrum-button-text-color-key-focus));
    }

    &._VbXxq_is-active {
      background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-button-color-down));
      color: var(--spectrum-high-contrast-button-face, var(--spectrum-button-text-color-down));
    }

    &:disabled, &._VbXxq_is-disabled {
      background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-button-color-disabled));
      color: var(--spectrum-high-contrast-gray-text, var(--spectrum-button-text-color-disabled));
    }
  }

  &[data-style="outline"] {
    --spectrum-button-text-color: var(--spectrum-button-color);
    --spectrum-button-text-color-hover: var(--spectrum-button-color-hover);
    --spectrum-button-text-color-down: var(--spectrum-button-color-down);
    --spectrum-button-text-color-key-focus: var(--spectrum-button-color-key-focus);
    --spectrum-button-text-color-disabled: var(--spectrum-alias-text-color-disabled, var(--spectrum-global-color-gray-500));
    --spectrum-button-color-disabled: var(--spectrum-alias-background-color-disabled);
    border-color: var(--spectrum-high-contrast-button-text, var(--spectrum-button-color));
    color: var(--spectrum-high-contrast-button-text, var(--spectrum-button-text-color));
    background-color: #0000;

    &._VbXxq_is-hovered {
      background-color: var(--spectrum-high-contrast-transparent, var(--spectrum-button-background-color-hover));
      border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-button-color-hover));
      color: var(--spectrum-high-contrast-button-text, var(--spectrum-button-text-color-hover));
    }

    &._VbXxq_focus-ring {
      background-color: var(--spectrum-high-contrast-transparent, var(--spectrum-button-background-color-key-focus));
      border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-button-color-key-focus));
      color: var(--spectrum-high-contrast-button-text, var(--spectrum-button-text-color-key-focus));
    }

    &._VbXxq_is-active {
      background-color: var(--spectrum-high-contrast-transparent, var(--spectrum-button-background-color-down));
      border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-button-color-down));
      color: var(--spectrum-high-contrast-button-text, var(--spectrum-button-text-color-down));
    }

    &:disabled, &._VbXxq_is-disabled {
      border-color: var(--spectrum-high-contrast-gray-text, var(--spectrum-button-color-disabled));
      color: var(--spectrum-high-contrast-gray-text, var(--spectrum-button-text-color-disabled));
      background-color: #0000;
    }
  }

  &[data-static-color="white"] {
    --spectrum-focus-ring-color: white;

    &[data-variant="accent"], &[data-variant="negative"], &[data-variant="primary"] {
      &[data-style="fill"] {
        --spectrum-button-color: #ffffffe6;
        --spectrum-button-color-hover: white;
        --spectrum-button-color-down: white;
        --spectrum-button-color-key-focus: white;
        --spectrum-button-color-disabled: #ffffff1a;
        --spectrum-button-text-color: black;
        --spectrum-button-text-color-disabled: #ffffff8c;
      }

      &[data-style="outline"] {
        --spectrum-button-color: #ffffffe6;
        --spectrum-button-color-hover: white;
        --spectrum-button-color-down: white;
        --spectrum-button-color-key-focus: white;
        --spectrum-button-color-disabled: #ffffff40;
        --spectrum-button-text-color: white;
        --spectrum-button-text-color-hover: white;
        --spectrum-button-text-color-down: white;
        --spectrum-button-text-color-key-focus: white;
        --spectrum-button-text-color-disabled: #ffffff8c;
        --spectrum-button-background-color-hover: #ffffff1a;
        --spectrum-button-background-color-down: #ffffff26;
        --spectrum-button-background-color-key-focus: #ffffff1a;
      }
    }

    &[data-variant="secondary"] {
      &[data-style="fill"] {
        --spectrum-button-color: #ffffff12;
        --spectrum-button-color-hover: #ffffff1a;
        --spectrum-button-color-down: #ffffff26;
        --spectrum-button-color-key-focus: #ffffff1a;
        --spectrum-button-color-disabled: #ffffff1a;
        --spectrum-button-text-color: white;
        --spectrum-button-text-color-disabled: #ffffff8c;
      }

      &[data-style="outline"] {
        --spectrum-button-color: #ffffff40;
        --spectrum-button-color-hover: #fff6;
        --spectrum-button-color-down: #ffffff8c;
        --spectrum-button-color-key-focus: #fff6;
        --spectrum-button-color-disabled: #ffffff40;
        --spectrum-button-text-color: white;
        --spectrum-button-text-color-hover: white;
        --spectrum-button-text-color-down: white;
        --spectrum-button-text-color-key-focus: white;
        --spectrum-button-text-color-disabled: #ffffff8c;
        --spectrum-button-background-color-hover: #ffffff1a;
        --spectrum-button-background-color-down: #ffffff26;
        --spectrum-button-background-color-key-focus: #ffffff1a;
      }
    }
  }

  &[data-static-color="black"] {
    --spectrum-focus-ring-color: black;

    &[data-variant="accent"], &[data-variant="negative"], &[data-variant="primary"] {
      &[data-style="fill"] {
        --spectrum-button-color: #000000e6;
        --spectrum-button-color-hover: black;
        --spectrum-button-color-down: black;
        --spectrum-button-color-key-focus: black;
        --spectrum-button-color-disabled: #0000001a;
        --spectrum-button-text-color: white;
        --spectrum-button-text-color-disabled: #0000008c;
      }

      &[data-style="outline"] {
        --spectrum-button-color: #000000e6;
        --spectrum-button-color-hover: black;
        --spectrum-button-color-down: black;
        --spectrum-button-color-key-focus: black;
        --spectrum-button-color-disabled: #00000040;
        --spectrum-button-text-color: black;
        --spectrum-button-text-color-hover: black;
        --spectrum-button-text-color-down: black;
        --spectrum-button-text-color-key-focus: black;
        --spectrum-button-text-color-disabled: #0000008c;
        --spectrum-button-background-color-hover: #0000001a;
        --spectrum-button-background-color-down: #00000026;
        --spectrum-button-background-color-key-focus: #0000001a;
      }
    }

    &[data-variant="secondary"] {
      &[data-style="fill"] {
        --spectrum-button-color: #00000012;
        --spectrum-button-color-hover: #0000001a;
        --spectrum-button-color-down: #00000026;
        --spectrum-button-color-key-focus: #0000001a;
        --spectrum-button-color-disabled: #0000001a;
        --spectrum-button-text-color: black;
        --spectrum-button-text-color-disabled: #0000008c;
      }

      &[data-style="outline"] {
        --spectrum-button-color: #00000040;
        --spectrum-button-color-hover: #0006;
        --spectrum-button-color-down: #0000008c;
        --spectrum-button-color-key-focus: #0006;
        --spectrum-button-color-disabled: #00000040;
        --spectrum-button-text-color: black;
        --spectrum-button-text-color-hover: black;
        --spectrum-button-text-color-down: black;
        --spectrum-button-text-color-key-focus: black;
        --spectrum-button-text-color-disabled: #0000008c;
        --spectrum-button-background-color-hover: #0000001a;
        --spectrum-button-background-color-down: #00000026;
        --spectrum-button-background-color-key-focus: #0000001a;
      }
    }
  }

  &:not([data-static-color]) {
    &[data-variant="accent"] {
      &[data-style="fill"] {
        --spectrum-button-color: var(--spectrum-accent-background-color-default);
        --spectrum-button-color-hover: var(--spectrum-accent-background-color-hover);
        --spectrum-button-color-down: var(--spectrum-accent-background-color-down);
        --spectrum-button-color-key-focus: var(--spectrum-accent-background-color-key-focus);
      }

      &[data-style="outline"] {
        --spectrum-button-color: var(--spectrum-accent-color-900);
        --spectrum-button-color-hover: var(--spectrum-accent-color-1000);
        --spectrum-button-color-down: var(--spectrum-accent-color-1100);
        --spectrum-button-color-key-focus: var(--spectrum-accent-color-1000);
        --spectrum-button-background-color-hover: var(--spectrum-accent-color-200);
        --spectrum-button-background-color-down: var(--spectrum-accent-color-300);
        --spectrum-button-background-color-key-focus: var(--spectrum-accent-color-200);
      }
    }

    &[data-variant="negative"] {
      &[data-style="fill"] {
        --spectrum-button-color: var(--spectrum-negative-background-color-default);
        --spectrum-button-color-hover: var(--spectrum-negative-background-color-hover);
        --spectrum-button-color-down: var(--spectrum-negative-background-color-down);
        --spectrum-button-color-key-focus: var(--spectrum-negative-background-color-key-focus);
      }

      &[data-style="outline"] {
        --spectrum-button-color: var(--spectrum-red-900);
        --spectrum-button-color-hover: var(--spectrum-red-1000);
        --spectrum-button-color-down: var(--spectrum-red-1100);
        --spectrum-button-color-key-focus: var(--spectrum-red-1000);
        --spectrum-button-background-color-hover: var(--spectrum-red-200);
        --spectrum-button-background-color-down: var(--spectrum-red-300);
        --spectrum-button-background-color-key-focus: var(--spectrum-red-200);
      }
    }

    &[data-variant="primary"] {
      &[data-style="fill"] {
        --spectrum-button-color: var(--spectrum-neutral-background-color-default);
        --spectrum-button-color-hover: var(--spectrum-neutral-background-color-hover);
        --spectrum-button-color-down: var(--spectrum-neutral-background-color-down);
        --spectrum-button-color-key-focus: var(--spectrum-neutral-background-color-key-focus);
      }

      &[data-style="outline"] {
        --spectrum-button-color: var(--spectrum-gray-800);
        --spectrum-button-color-hover: var(--spectrum-gray-900);
        --spectrum-button-color-down: var(--spectrum-gray-900);
        --spectrum-button-color-key-focus: var(--spectrum-gray-900);
        --spectrum-button-background-color-hover: var(--spectrum-gray-300);
        --spectrum-button-background-color-down: var(--spectrum-gray-400);
        --spectrum-button-background-color-key-focus: var(--spectrum-gray-300);
      }
    }

    &[data-variant="secondary"] {
      --spectrum-button-text-color: var(--spectrum-gray-800);
      --spectrum-button-text-color-hover: var(--spectrum-gray-900);
      --spectrum-button-text-color-down: var(--spectrum-gray-900);
      --spectrum-button-text-color-key-focus: var(--spectrum-gray-900);

      &[data-style="fill"] {
        --spectrum-button-color: var(--spectrum-gray-200);
        --spectrum-button-color-hover: var(--spectrum-gray-300);
        --spectrum-button-color-down: var(--spectrum-gray-400);
        --spectrum-button-color-key-focus: var(--spectrum-gray-300);
      }

      &[data-style="outline"] {
        --spectrum-button-color: var(--spectrum-gray-300);
        --spectrum-button-color-hover: var(--spectrum-gray-400);
        --spectrum-button-color-down: var(--spectrum-gray-500);
        --spectrum-button-color-key-focus: var(--spectrum-gray-400);
        --spectrum-button-background-color-hover: var(--spectrum-gray-300);
        --spectrum-button-background-color-down: var(--spectrum-gray-400);
        --spectrum-button-background-color-key-focus: var(--spectrum-gray-300);
      }
    }
  }
}

@media (forced-colors: active) {
  ._VbXxq_spectrum-Button, ._VbXxq_spectrum-ActionButton, ._VbXxq_spectrum-FieldButton {
    forced-color-adjust: none;
    --spectrum-high-contrast-transparent: transparent;
    --spectrum-high-contrast-button-face: ButtonFace;
    --spectrum-high-contrast-button-text: ButtonText;
    --spectrum-high-contrast-highlight: Highlight;
    --spectrum-high-contrast-highlight-text: HighlightText;
    --spectrum-high-contrast-gray-text: GrayText;
  }

  ._VbXxq_spectrum-Button, ._VbXxq_spectrum-ActionButton {
    --spectrum-high-contrast-focus-ring-color: ButtonText;
  }

  ._VbXxq_spectrum-FieldButton {
    --spectrum-high-contrast-focus-ring-color: Highlight;
  }

  ._VbXxq_spectrum-Button--pending._VbXxq_is-disabled {
    border-color: var(--spectrum-high-contrast-gray-text);
  }
}

._VbXxq_spectrum-ActionButton {
  background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-background-color, var(--spectrum-global-color-gray-75)));
  border-color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-border-color, var(--spectrum-alias-border-color)));
  color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-text-color, var(--spectrum-alias-text-color)));

  & ._VbXxq_spectrum-Icon {
    fill: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-icon-color, var(--spectrum-alias-icon-color)));
  }

  & ._VbXxq_spectrum-ActionButton-hold {
    fill: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-hold-icon-color, var(--spectrum-alias-icon-color)));
  }

  &._VbXxq_is-hovered {
    background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-background-color-hover, var(--spectrum-global-color-gray-50)));
    border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-actionbutton-border-color-hover, var(--spectrum-alias-border-color-hover)));
    color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-text-color-hover, var(--spectrum-alias-text-color-hover)));

    & ._VbXxq_spectrum-Icon {
      fill: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-icon-color-hover, var(--spectrum-alias-icon-color-hover)));
    }

    & ._VbXxq_spectrum-ActionButton-hold {
      fill: var(--spectrum-actionbutton-hold-icon-color-hover, var(--spectrum-alias-icon-color-hover));
    }
  }

  &._VbXxq_focus-ring {
    background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-background-color-key-focus, var(--spectrum-global-color-gray-50)));
    border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-actionbutton-border-color-hover, var(--spectrum-alias-border-color-hover)));
    color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-text-color-key-focus, var(--spectrum-alias-text-color-hover)));

    & ._VbXxq_spectrum-Icon {
      fill: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-icon-color-key-focus, var(--spectrum-alias-icon-color-focus)));
    }

    & ._VbXxq_spectrum-ActionButton-hold {
      fill: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-hold-icon-color-key-focus, var(--spectrum-alias-icon-color-hover)));
    }
  }

  &._VbXxq_is-active {
    background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-background-color-down, var(--spectrum-global-color-gray-200)));
    border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-actionbutton-border-color-down, var(--spectrum-alias-border-color-down)));
    color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-text-color-down, var(--spectrum-alias-text-color-down)));

    & ._VbXxq_spectrum-ActionButton-hold {
      fill: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-hold-icon-color-down, var(--spectrum-alias-icon-color-down)));
    }
  }

  &:disabled, &._VbXxq_is-disabled {
    background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-background-color-disabled, var(--spectrum-global-color-gray-200)));
    border-color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-border-color-disabled, var(--spectrum-alias-border-color-disabled)));
    color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-text-color-disabled, var(--spectrum-alias-text-color-disabled)));

    & ._VbXxq_spectrum-Icon {
      fill: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-icon-color-disabled, var(--spectrum-alias-icon-color-disabled)));
    }

    & ._VbXxq_spectrum-ActionButton-hold {
      fill: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-hold-icon-color-disabled, var(--spectrum-alias-icon-color-disabled)));
    }
  }

  &._VbXxq_is-selected {
    background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-alias-toggle-color-selected));
    border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-alias-toggle-color-selected));
    color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));

    & ._VbXxq_spectrum-Icon {
      fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));
    }

    &._VbXxq_is-hovered {
      background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-alias-toggle-color-selected-hover));
      border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-alias-toggle-color-selected-hover));
      color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));

      & ._VbXxq_spectrum-Icon {
        fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));
      }
    }

    &._VbXxq_focus-ring {
      background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-alias-toggle-color-selected-key-focus));
      border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-alias-toggle-color-selected-key-focus));
      color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));

      & ._VbXxq_spectrum-Icon {
        fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));
      }
    }

    &._VbXxq_is-active {
      background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-alias-toggle-color-selected-down));
      border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-alias-toggle-color-selected-down));
      color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));

      & ._VbXxq_spectrum-Icon {
        fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-gray-50));
      }
    }

    &:disabled, &._VbXxq_is-disabled {
      background-color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-background-color-selected-disabled, var(--spectrum-global-color-gray-200)));
      border-color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-border-color-selected-disabled, var(--spectrum-alias-border-color-disabled)));
      color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-text-color-selected-disabled, var(--spectrum-alias-text-color-disabled)));

      & ._VbXxq_spectrum-Icon {
        fill: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-icon-color-selected-disabled, var(--spectrum-alias-icon-color-disabled)));
      }
    }
  }
}

._VbXxq_spectrum-ActionButton--emphasized {
  &._VbXxq_spectrum-ActionButton--quiet._VbXxq_is-selected, &._VbXxq_is-selected {
    background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-accent-background-color-default));
    border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-accent-background-color-default));
    color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-text-color-selected, var(--spectrum-global-color-static-white)));

    & ._VbXxq_spectrum-Icon {
      fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-icon-color-selected, var(--spectrum-global-color-static-white)));
    }

    &._VbXxq_focus-ring {
      background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-accent-background-color-key-focus));
      border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-accent-background-color-hover));
      color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-text-color-selected-key-focus, var(--spectrum-global-color-static-white)));

      & ._VbXxq_spectrum-Icon {
        fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-icon-color-selected-key-focus, var(--spectrum-global-color-static-white)));
      }
    }

    &._VbXxq_is-hovered {
      background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-accent-background-color-hover));
      border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-accent-background-color-hover));
      color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-text-color-selected-hover, var(--spectrum-global-color-static-white)));

      & ._VbXxq_spectrum-Icon {
        fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-icon-color-selected-hover, var(--spectrum-global-color-static-white)));
      }
    }

    &._VbXxq_is-active {
      background-color: var(--spectrum-high-contrast-highlight, var(--spectrum-accent-background-color-down));
      border-color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-accent-background-color-down));
      color: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-text-color-selected-down, var(--spectrum-global-color-static-white)));

      & ._VbXxq_spectrum-Icon {
        fill: var(--spectrum-high-contrast-highlight-text, var(--spectrum-actionbutton-emphasized-icon-color-selected-down, var(--spectrum-global-color-static-white)));
      }
    }

    &:disabled, &._VbXxq_is-disabled {
      background-color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-emphasized-background-color-selected-disabled, var(--spectrum-global-color-gray-200)));
      border-color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-emphasized-border-color-selected-disabled, var(--spectrum-alias-border-color-disabled)));
      color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-emphasized-text-color-selected-disabled, var(--spectrum-alias-text-color-disabled)));

      & ._VbXxq_spectrum-Icon {
        fill: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-emphasized-icon-color-selected-disabled, var(--spectrum-alias-icon-color-disabled)));
      }
    }
  }
}

._VbXxq_spectrum-ActionButton--quiet {
  background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-quiet-background-color, var(--spectrum-alias-background-color-transparent)));
  border-color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-quiet-border-color, var(--spectrum-alias-border-color-transparent)));
  color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-quiet-text-color, var(--spectrum-alias-text-color)));

  &._VbXxq_is-hovered {
    background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-quiet-background-color-hover, var(--spectrum-alias-background-color-transparent)));
    border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-actionbutton-quiet-border-color-hover, var(--spectrum-alias-border-color-transparent)));
    color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-quiet-text-color-hover, var(--spectrum-alias-text-color-hover)));
  }

  &._VbXxq_focus-ring {
    background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-quiet-background-color-key-focus, var(--spectrum-alias-background-color-transparent)));
    border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-actionbutton-quiet-border-color-hover, var(--spectrum-alias-border-color-transparent)));
    color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-quiet-text-color-key-focus, var(--spectrum-alias-text-color-hover)));
  }

  &._VbXxq_is-active {
    background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-quiet-background-color-down, var(--spectrum-global-color-gray-300)));
    border-color: var(--spectrum-high-contrast-highlight, var(--spectrum-actionbutton-quiet-border-color-down, var(--spectrum-global-color-gray-300)));
    color: var(--spectrum-high-contrast-button-text, var(--spectrum-actionbutton-quiet-text-color-down, var(--spectrum-alias-text-color-down)));
  }

  &:disabled, &._VbXxq_is-disabled {
    background-color: var(--spectrum-high-contrast-button-face, var(--spectrum-actionbutton-quiet-background-color-disabled, var(--spectrum-alias-background-color-transparent)));
    border-color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-quiet-border-color-disabled, var(--spectrum-alias-border-color-transparent)));
    color: var(--spectrum-high-contrast-gray-text, var(--spectrum-actionbutton-quiet-text-color-disabled, var(--spectrum-alias-text-color-disabled)));
  }
}

._VbXxq_spectrum-ActionButton--staticWhite {
  mix-blend-mode: screen;
  --spectrum-actionbutton-static-background-color: var(--spectrum-actionbutton-static-white-background-color);
  --spectrum-actionbutton-static-background-color-hover: #ffffff1a;
  --spectrum-actionbutton-static-background-color-focus: #ffffff1a;
  --spectrum-actionbutton-static-background-color-active: #ffffff26;
  --spectrum-actionbutton-static-background-color-disabled: var(--spectrum-actionbutton-static-white-background-color-disabled);
  --spectrum-actionbutton-static-background-color-selected: #ffffffe6;
  --spectrum-actionbutton-static-background-color-selected-hover: white;
  --spectrum-actionbutton-static-background-color-selected-focus: white;
  --spectrum-actionbutton-static-background-color-selected-active: white;
  --spectrum-actionbutton-static-background-color-selected-disabled: #ffffff1a;
  --spectrum-actionbutton-static-border-color: var(--spectrum-actionbutton-static-white-border-color);
  --spectrum-actionbutton-static-border-color-hover: var(--spectrum-actionbutton-static-white-border-color-hover);
  --spectrum-actionbutton-static-border-color-active: var(--spectrum-actionbutton-static-white-border-color-down);
  --spectrum-actionbutton-static-border-color-selected: var(--spectrum-actionbutton-static-background-color-selected);
  --spectrum-actionbutton-static-border-color-focus: var(--spectrum-actionbutton-static-white-border-color-key-focus);
  --spectrum-actionbutton-static-border-color-disabled: var(--spectrum-actionbutton-static-white-border-color-disabled);
  --spectrum-actionbutton-static-border-color-selected-disabled: var(--spectrum-actionbutton-static-white-border-color-selected-disabled);
  --spectrum-actionbutton-static-color: white;
  --spectrum-actionbutton-static-color-selected: black;
  --spectrum-actionbutton-static-color-disabled: #ffffff8c;
  --spectrum-actionbutton-static-color-selected-disabled: var(--spectrum-actionbutton-static-color-disabled);
}

._VbXxq_spectrum-ActionButton--staticWhite._VbXxq_spectrum-ActionButton--quiet {
  --spectrum-actionbutton-static-border-color: transparent;
  --spectrum-actionbutton-static-border-color-hover: transparent;
  --spectrum-actionbutton-static-border-color-active: transparent;
  --spectrum-actionbutton-static-border-color-selected: transparent;
}

._VbXxq_spectrum-ActionButton--staticBlack {
  mix-blend-mode: multiply;
  --spectrum-actionbutton-static-background-color: var(--spectrum-actionbutton-static-black-background-color);
  --spectrum-actionbutton-static-background-color-hover: #0000001a;
  --spectrum-actionbutton-static-background-color-focus: #0000001a;
  --spectrum-actionbutton-static-background-color-active: #00000026;
  --spectrum-actionbutton-static-background-color-selected: #000000e6;
  --spectrum-actionbutton-static-background-color-disabled: var(--spectrum-actionbutton-static-black-background-color-disabled);
  --spectrum-actionbutton-static-background-color-selected-hover: black;
  --spectrum-actionbutton-static-background-color-selected-focus: black;
  --spectrum-actionbutton-static-background-color-selected-active: black;
  --spectrum-actionbutton-static-background-color-selected-disabled: #0000001a;
  --spectrum-actionbutton-static-border-color: var(--spectrum-actionbutton-static-black-border-color);
  --spectrum-actionbutton-static-border-color-hover: var(--spectrum-actionbutton-static-black-border-color-hover);
  --spectrum-actionbutton-static-border-color-active: var(--spectrum-actionbutton-static-black-border-color-down);
  --spectrum-actionbutton-static-border-color-selected: var(--spectrum-actionbutton-static-background-color-selected);
  --spectrum-actionbutton-static-border-color-focus: var(--spectrum-actionbutton-static-black-border-color-key-focus);
  --spectrum-actionbutton-static-border-color-disabled: var(--spectrum-actionbutton-static-black-border-color-disabled);
  --spectrum-actionbutton-static-border-color-selected-disabled: var(--spectrum-actionbutton-static-black-border-color-selected-disabled);
  --spectrum-actionbutton-static-color: black;
  --spectrum-actionbutton-static-color-selected: white;
  --spectrum-actionbutton-static-color-disabled: #0000008c;
  --spectrum-actionbutton-static-color-selected-disabled: var(--spectrum-actionbutton-static-color-disabled);
}

._VbXxq_spectrum-ActionButton--staticBlack._VbXxq_spectrum-ActionButton--quiet {
  --spectrum-actionbutton-static-border-color: transparent;
  --spectrum-actionbutton-static-border-color-hover: transparent;
  --spectrum-actionbutton-static-border-color-active: transparent;
  --spectrum-actionbutton-static-border-color-selected: transparent;
}

._VbXxq_spectrum-ActionButton--staticColor {
  background-color: var(--spectrum-actionbutton-static-background-color);
  border-color: var(--spectrum-actionbutton-static-border-color);
  color: var(--spectrum-actionbutton-static-color);
  --spectrum-focus-ring-color: var(--spectrum-actionbutton-static-color);

  & ._VbXxq_spectrum-Icon {
    fill: var(--spectrum-actionbutton-static-color);
  }

  &._VbXxq_is-hovered {
    background-color: var(--spectrum-actionbutton-static-background-color-hover);
    border-color: var(--spectrum-actionbutton-static-border-color-hover);
    color: var(--spectrum-actionbutton-static-color);

    & ._VbXxq_spectrum-Icon, & ._VbXxq_spectrum-ActionButton-hold {
      fill: var(--spectrum-actionbutton-static-color);
    }
  }

  &._VbXxq_focus-ring {
    background-color: var(--spectrum-actionbutton-static-background-color-focus);
    border-color: var(--spectrum-actionbutton-static-border-color-focus);
    box-shadow: none;
    color: var(--spectrum-actionbutton-static-color);

    &._VbXxq_is-hovered, &._VbXxq_is-active {
      border-color: var(--spectrum-actionbutton-static-border-color-focus);
    }

    & ._VbXxq_spectrum-Icon, & ._VbXxq_spectrum-ActionButton-hold {
      fill: var(--spectrum-actionbutton-static-color);
    }
  }

  &._VbXxq_is-active {
    background-color: var(--spectrum-actionbutton-static-background-color-active);
    border-color: var(--spectrum-actionbutton-static-border-color-active);
    color: var(--spectrum-actionbutton-static-color);

    & ._VbXxq_spectrum-ActionButton-hold {
      fill: var(--spectrum-actionbutton-static-color);
    }
  }

  &:disabled, &._VbXxq_is-disabled {
    background-color: var(--spectrum-actionbutton-static-background-color-disabled);
    border-color: var(--spectrum-actionbutton-static-border-color-disabled);
    color: var(--spectrum-actionbutton-static-color-disabled);

    & ._VbXxq_spectrum-Icon, & ._VbXxq_spectrum-ActionButton-hold {
      fill: var(--spectrum-actionbutton-static-color-disabled);
    }
  }

  &._VbXxq_spectrum-ActionButton--quiet._VbXxq_is-selected, &._VbXxq_is-selected {
    background-color: var(--spectrum-actionbutton-static-background-color-selected);
    border-color: var(--spectrum-actionbutton-static-border-color-selected);
    color: var(--spectrum-actionbutton-static-color-selected);

    & ._VbXxq_spectrum-Icon {
      fill: var(--spectrum-actionbutton-static-color-selected);
    }

    &._VbXxq_focus-ring {
      background-color: var(--spectrum-actionbutton-static-background-color-selected-focus);
      border-color: var(--spectrum-actionbutton-static-background-color-selected-focus);
      color: var(--spectrum-actionbutton-static-color-selected);
      box-shadow: none;

      & ._VbXxq_spectrum-Icon {
        fill: var(--spectrum-actionbutton-static-color-selected);
      }
    }

    &._VbXxq_is-hovered, &._VbXxq_is-active {
      background-color: var(--spectrum-actionbutton-static-background-color-selected-hover);
      border-color: var(--spectrum-actionbutton-static-background-color-selected-hover);
      color: var(--spectrum-actionbutton-static-color-selected);

      & ._VbXxq_spectrum-Icon {
        fill: var(--spectrum-actionbutton-static-color-selected);
      }
    }

    &:disabled, &._VbXxq_is-disabled {
      background-color: var(--spectrum-actionbutton-static-background-color-selected-disabled);
      border-color: var(--spectrum-actionbutton-static-border-color-selected-disabled);
      color: var(--spectrum-actionbutton-static-color-selected-disabled);

      & ._VbXxq_spectrum-Icon {
        fill: var(--spectrum-actionbutton-static-color-selected-disabled);
      }

      & ._VbXxq_spectrum-ActionButton-hold {
        fill: var(--spectrum-actionbutton-static-color-disabled);
      }
    }
  }

  &._VbXxq_spectrum-ActionButton--quiet {
    --spectrum-actionbutton-static-background-color: transparent;
    --spectrum-actionbutton-static-background-color-disabled: transparent;
    --spectrum-actionbutton-static-border-color: transparent;
    --spectrum-actionbutton-static-border-color-disabled: transparent;
    --spectrum-actionbutton-static-border-color-selected-hover: transparent;
    --spectrum-actionbutton-static-border-color-focus: transparent;
    --spectrum-actionbutton-static-border-color-active: transparent;
    --spectrum-actionbutton-static-border-color-selected-disabled: transparent;
  }
}

._VbXxq_spectrum-LogicButton--and {
  background-color: var(--spectrum-global-color-static-blue-600, #1473e6);
  border-color: var(--spectrum-global-color-static-blue-600, #1473e6);
  color: var(--spectrum-logicbutton-and-text-color, var(--spectrum-global-color-static-white));

  &._VbXxq_is-hovered {
    background-color: var(--spectrum-global-color-static-blue-700, #0d66d0);
    border-color: var(--spectrum-global-color-static-blue-700, #0d66d0);
    color: var(--spectrum-logicbutton-and-text-color, var(--spectrum-global-color-static-white));
  }

  &:disabled, &._VbXxq_is-disabled {
    background-color: var(--spectrum-logicbutton-and-background-color-disabled, var(--spectrum-global-color-gray-200));
    border-color: var(--spectrum-logicbutton-and-border-color-disabled, var(--spectrum-global-color-gray-200));
    color: var(--spectrum-logicbutton-and-text-color-disabled, var(--spectrum-alias-text-color-disabled));
  }
}

._VbXxq_spectrum-LogicButton--or {
  background-color: var(--spectrum-global-color-static-magenta-500, #d83790);
  border-color: var(--spectrum-global-color-static-magenta-500, #d83790);
  color: var(--spectrum-logicbutton-or-text-color, var(--spectrum-global-color-static-white));

  &._VbXxq_is-hovered {
    background-color: var(--spectrum-global-color-static-magenta-600, #ca2982);
    border-color: var(--spectrum-global-color-static-magenta-600, #ca2982);
    color: var(--spectrum-logicbutton-or-text-color, var(--spectrum-global-color-static-white));
  }

  &:disabled, &._VbXxq_is-disabled {
    background-color: var(--spectrum-logicbutton-and-background-color-disabled, var(--spectrum-global-color-gray-200));
    border-color: var(--spectrum-logicbutton-and-border-color-disabled, var(--spectrum-global-color-gray-200));
    color: var(--spectrum-logicbutton-and-text-color-disabled, var(--spectrum-alias-text-color-disabled));
  }
}

._VbXxq_spectrum-FieldButton {
  color: var(--spectrum-fieldbutton-text-color, var(--spectrum-alias-text-color));
  background-color: var(--spectrum-fieldbutton-background-color, var(--spectrum-global-color-gray-75));
  border-color: var(--spectrum-fieldbutton-border-color, var(--spectrum-alias-border-color));

  & ._VbXxq_spectrum-Icon {
    fill: var(--spectrum-fieldbutton-icon-color, var(--spectrum-alias-icon-color));
  }

  &._VbXxq_is-hovered {
    color: var(--spectrum-fieldbutton-text-color-hover, var(--spectrum-alias-text-color-hover));
    background-color: var(--spectrum-fieldbutton-background-color-hover, var(--spectrum-global-color-gray-50));
    border-color: var(--spectrum-fieldbutton-border-color-hover, var(--spectrum-alias-border-color-hover));

    & ._VbXxq_spectrum-Icon {
      fill: var(--spectrum-fieldbutton-icon-color-hover, var(--spectrum-alias-icon-color-hover));
    }
  }

  &._VbXxq_is-active, &._VbXxq_is-selected {
    background-color: var(--spectrum-fieldbutton-background-color-down, var(--spectrum-global-color-gray-200));
    border-color: var(--spectrum-fieldbutton-border-color-down, var(--spectrum-alias-border-color-down));

    & ._VbXxq_spectrum-Icon {
      fill: var(--spectrum-fieldbutton-icon-color-down, var(--spectrum-alias-icon-color-down));
    }
  }

  &._VbXxq_focus-ring, &._VbXxq_is-focused {
    background-color: var(--spectrum-fieldbutton-background-color-key-focus, var(--spectrum-global-color-gray-50));
    border-color: var(--spectrum-fieldbutton-border-color-key-focus, var(--spectrum-alias-border-color-focus));
    color: var(--spectrum-fieldbutton-text-color-key-focus, var(--spectrum-alias-text-color-hover));

    & ._VbXxq_spectrum-Icon {
      fill: var(--spectrum-fieldbutton-icon-color-key-focus, var(--spectrum-alias-icon-color-focus));
    }

    &._VbXxq_is-placeholder {
      fill: var(--spectrum-fieldbutton-placeholder-text-color-key-focus, var(--spectrum-alias-placeholder-text-color-hover));
    }
  }

  &._VbXxq_spectrum-FieldButton--invalid {
    border-color: var(--spectrum-fieldbutton-border-color-error, var(--spectrum-global-color-red-500));

    &._VbXxq_is-hovered {
      border-color: var(--spectrum-fieldbutton-border-color-error-hover, var(--spectrum-global-color-red-600));
    }

    &._VbXxq_is-active, &._VbXxq_is-selected {
      border-color: var(--spectrum-fieldbutton-border-color-error-down, var(--spectrum-global-color-red-600));
    }

    &._VbXxq_focus-ring, &._VbXxq_is-focused {
      border-color: var(--spectrum-fieldbutton-border-color-error-key-focus, var(--spectrum-alias-border-color-focus));
    }
  }

  &:disabled, &._VbXxq_is-disabled {
    background-color: var(--spectrum-fieldbutton-background-color-disabled, var(--spectrum-global-color-gray-200));
    color: var(--spectrum-fieldbutton-text-color-disabled, var(--spectrum-alias-text-color-disabled));

    & ._VbXxq_spectrum-Icon {
      fill: var(--spectrum-fieldbutton-icon-color-disabled, var(--spectrum-alias-icon-color-disabled));
    }
  }
}

._VbXxq_spectrum-FieldButton--quiet {
  color: var(--spectrum-fieldbutton-text-color, var(--spectrum-alias-text-color));
  border-color: var(--spectrum-fieldbutton-quiet-border-color, var(--spectrum-alias-border-color-transparent));
  background-color: var(--spectrum-fieldbutton-quiet-background-color, var(--spectrum-alias-background-color-transparent));

  &._VbXxq_is-hovered {
    background-color: var(--spectrum-fieldbutton-quiet-background-color-hover, var(--spectrum-alias-background-color-transparent));
    color: var(--spectrum-fieldbutton-text-color-hover, var(--spectrum-alias-text-color-hover));
  }

  &._VbXxq_focus-ring, &._VbXxq_is-focused {
    background-color: var(--spectrum-fieldbutton-quiet-background-color-key-focus, var(--spectrum-alias-background-color-transparent));

    &._VbXxq_is-placeholder {
      color: var(--spectrum-fieldbutton-quiet-placeholder-text-color-key-focus, var(--spectrum-alias-placeholder-text-color-hover));
    }
  }

  &._VbXxq_is-active, &._VbXxq_is-selected {
    background-color: var(--spectrum-fieldbutton-quiet-background-color-down, var(--spectrum-alias-background-color-transparent));
    border-color: var(--spectrum-fieldbutton-quiet-border-color-down, var(--spectrum-alias-border-color-transparent));

    &._VbXxq_focus-ring, &._VbXxq_is-focused {
      background-color: var(--spectrum-fieldbutton-quiet-background-color-key-focus, var(--spectrum-alias-background-color-transparent));
    }
  }

  &:disabled, &._VbXxq_is-disabled {
    background-color: var(--spectrum-fieldbutton-quiet-background-color-disabled, var(--spectrum-alias-background-color-transparent));
    color: var(--spectrum-fieldbutton-text-color-disabled, var(--spectrum-alias-text-color-disabled));
  }
}

@media (forced-colors: active) {
  ._VbXxq_spectrum-ActionButton, ._VbXxq_spectrum-ClearButton, ._VbXxq_spectrum-LogicButton, ._VbXxq_spectrum-FieldButton {
    forced-color-adjust: none;
    --spectrum-clearbutton-medium-icon-color: ButtonText;
    --spectrum-clearbutton-medium-icon-color-disabled: GrayText;
    --spectrum-clearbutton-medium-icon-color-down: Highlight;
    --spectrum-clearbutton-medium-icon-color-hover: Highlight;
    --spectrum-clearbutton-medium-icon-color-key-focus: Highlight;
    --spectrum-fieldbutton-background-color: ButtonFace;
    --spectrum-fieldbutton-background-color-disabled: ButtonFace;
    --spectrum-fieldbutton-background-color-down: ButtonFace;
    --spectrum-fieldbutton-background-color-hover: ButtonFace;
    --spectrum-fieldbutton-background-color-key-focus: ButtonFace;
    --spectrum-fieldbutton-border-color: ButtonText;
    --spectrum-fieldbutton-border-color-down: Highlight;
    --spectrum-fieldbutton-border-color-error: ButtonText;
    --spectrum-fieldbutton-border-color-error-down: Highlight;
    --spectrum-fieldbutton-border-color-error-hover: Highlight;
    --spectrum-fieldbutton-border-color-error-key-focus: Highlight;
    --spectrum-fieldbutton-border-color-hover: Highlight;
    --spectrum-fieldbutton-border-color-key-focus: Highlight;
    --spectrum-fieldbutton-icon-color-disabled: GrayText;
    --spectrum-fieldbutton-placeholder-text-color-key-focus: ButtonText;
    --spectrum-fieldbutton-quiet-background-color: ButtonFace;
    --spectrum-fieldbutton-quiet-background-color-disabled: ButtonFace;
    --spectrum-fieldbutton-quiet-background-color-down: ButtonFace;
    --spectrum-fieldbutton-quiet-background-color-hover: ButtonFace;
    --spectrum-fieldbutton-quiet-background-color-key-focus: ButtonFace;
    --spectrum-fieldbutton-quiet-border-color: ButtonFace;
    --spectrum-fieldbutton-quiet-border-color-down: Highlight;
    --spectrum-fieldbutton-quiet-placeholder-text-color-key-focus: ButtonText;
    --spectrum-fieldbutton-text-color: ButtonText;
    --spectrum-fieldbutton-text-color-disabled: GrayText;
    --spectrum-fieldbutton-text-color-hover: ButtonText;
    --spectrum-fieldbutton-text-color-key-focus: ButtonText;
    --spectrum-logicbutton-and-background-color: ButtonFace;
    --spectrum-logicbutton-and-background-color-disabled: ButtonFace;
    --spectrum-logicbutton-and-background-color-hover: ButtonFace;
    --spectrum-logicbutton-and-border-color: ButtonText;
    --spectrum-logicbutton-and-border-color-disabled: GrayText;
    --spectrum-logicbutton-and-border-color-hover: Highlight;
    --spectrum-logicbutton-and-text-color: ButtonText;
    --spectrum-logicbutton-and-text-color-disabled: GrayText;
    --spectrum-logicbutton-or-background-color: ButtonFace;
    --spectrum-logicbutton-or-background-color-hover: ButtonFace;
    --spectrum-logicbutton-or-border-color: ButtonText;
    --spectrum-logicbutton-or-border-color-hover: Highlight;
    --spectrum-logicbutton-or-text-color: ButtonText;
    --spectrum-button-primary-focus-ring-color-key-focus: CanvasText;
    --spectrum-button-primary-focus-ring-size-key-focus: 3px;
    --spectrum-dropdown-border-color-key-focus: Highlight;
  }

  ._VbXxq_spectrum-Button--overBackground {
    --spectrum-button-over-background-color: ButtonText;
  }

  ._VbXxq_spectrum-ActionButton--staticColor, ._VbXxq_spectrum-ActionButton--staticWhite, ._VbXxq_spectrum-ActionButton--staticBlack, ._VbXxq_spectrum-ActionButton--staticWhite._VbXxq_spectrum-ActionButton--quiet, ._VbXxq_spectrum-ActionButton--staticBlack._VbXxq_spectrum-ActionButton--quiet {
    mix-blend-mode: normal;
    --spectrum-actionbutton-static-background-color: ButtonFace;
    --spectrum-actionbutton-static-background-color-disabled: var(--spectrum-high-contrast-transparent);
    --spectrum-actionbutton-static-background-color-selected-disabled: GrayText;
    --spectrum-actionbutton-static-background-color-hover: ButtonFace;
    --spectrum-actionbutton-static-background-color-focus: ButtonFace;
    --spectrum-actionbutton-static-background-color-active: ButtonFace;
    --spectrum-actionbutton-static-background-color-selected: Highlight;
    --spectrum-actionbutton-static-background-color-selected-hover: Highlight;
    --spectrum-actionbutton-static-background-color-selected-focus: Highlight;
    --spectrum-actionbutton-static-background-color-selected-active: Highlight;
    --spectrum-actionbutton-static-border-color: ButtonText;
    --spectrum-actionbutton-static-border-color-hover: Highlight;
    --spectrum-actionbutton-static-border-color-active: ButtonText;
    --spectrum-actionbutton-static-border-color-focus: CanvasText;
    --spectrum-actionbutton-static-border-color-disabled: GrayText;
    --spectrum-actionbutton-static-border-color-selected-disabled: GrayText;
    --spectrum-actionbutton-static-color: ButtonText;
    --spectrum-actionbutton-static-color-selected: HighlightText;
    --spectrum-actionbutton-static-color-disabled: GrayText;
    --spectrum-actionbutton-static-color-selected-disabled: ButtonFace;
  }
}
/*# sourceMappingURL=button_vars.css.map */
