.wb-stretched::after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  content: "";
}

.wb-stretched__container {
  position: relative;
}

















































:host {
  display: block;
}

:host([link]) {
  display: inline;
}

.wb-button {
  color: var(--wb-button__color, var(--wb-ds-button__color, var(--wb-ds-color-text--default)));
  font-family: var(--wb-button__font-family);
  font-size: var(--wb-button__font-size);
  font-style: var(--wb-button__font-style);
  font-weight: var(--wb-button__font-weight);
  line-height: var(--wb-button__line-height);
  letter-spacing: var(--wb-button__letter-spacing);
  text-transform: var(--wb-button__text-transform);
  text-align: var(--wb-button__text-align);
  opacity: var(--wb-button__opacity);
  padding-top: var(--wb-button__bezel, var(--wb-button__bezel-top, var(--wb-ds-button__bezel, var(--wb-ds-button__bezel-top, var(--wb-ds-space--s, 1rem)))));
  padding-right: var(--wb-button__bezel, var(--wb-button__bezel-right, var(--wb-ds-button__bezel, var(--wb-ds-button__bezel-right, var(--wb-ds-space--s, 1rem)))));
  padding-bottom: var(--wb-button__bezel, var(--wb-button__bezel-bottom, var(--wb-ds-button__bezel, var(--wb-ds-button__bezel-bottom, var(--wb-ds-space--s, 1rem)))));
  padding-left: var(--wb-button__bezel, var(--wb-button__bezel-left, var(--wb-ds-button__bezel, var(--wb-ds-button__bezel-left, var(--wb-ds-space--s, 1rem)))));
  --wb-button__box-shadow--value: var(--wb-button__box-shadow, var(--wb-ds-border-is-box-shadow));
  --wb-button__border-width--value: var(--wb-button__border-width, var(--wb-ds-button__border-width, var(--wb-ds-border-width--default, var(--wb-ds-border-width--default))));
  --wb-button__border-color--value: var(--wb-button__border-color, var(--wb-ds-button__border-color, var(--wb-ds-color-border--default, var(--wb-ds-color-border--default))));
  --wb-button__blur-radius--value: var(--wb-button__blur-radius, var(--wb-ds-border-blur-radius--default, 0));
  --wb-button__spread-radius--value: var(--wb-button__spread-radius, var(--wb-ds-border-spread-radius--default, 0));
  --wb-button__box-shadow-top--value: var(--wb-button__box-shadow-top, inset 0px var(--wb-button__border-width--value) var(--wb-button__blur-radius--value) var(--wb-button__spread-radius--value) var(--wb-button__border-color--value));
  --wb-button__box-shadow-right--value: var(--wb-button__box-shadow-right, inset calc(var(--wb-button__border-width--value) * -1) 0px var(--wb-button__blur-radius--value) var(--wb-button__spread-radius--value) var(--wb-button__border-color--value));
  --wb-button__box-shadow-bottom--value: var(--wb-button__box-shadow-bottom, inset 0px calc(var(--wb-button__border-width--value) * -1) var(--wb-button__blur-radius--value) var(--wb-button__spread-radius--value) var(--wb-button__border-color--value));
  --wb-button__box-shadow-left--value: var(--wb-button__box-shadow-left, inset var(--wb-button__border-width--value) 0px var(--wb-button__blur-radius--value) var(--wb-button__spread-radius--value) var(--wb-button__border-color--value));
  box-shadow: var(--wb-button__box-shadow--value, var(--wb-button__box-shadow-left--value), var(--wb-button__box-shadow-right--value), var(--wb-button__box-shadow-top--value), var(--wb-button__box-shadow-bottom--value));
  border-top: var(--wb-button__border-top, var(--wb-button__border, var(--wb-ds-border-is-border)));
  border-right: var(--wb-button__border-right, var(--wb-button__border, var(--wb-ds-border-is-border)));
  border-bottom: var(--wb-button__border-bottom, var(--wb-button__border, var(--wb-ds-border-is-border)));
  border-left: var(--wb-button__border-left, var(--wb-button__border, var(--wb-ds-border-is-border)));
  border-radius: var(--wb-button__border-radius, var(--wb-ds-button__border-radius, var(--wb-ds-border-radius--default, var(--wb-ds-border-radius--default))));
  outline: var(--wb-button__outline, var(--wb-ds-border-is-outline));
  transition: var(--wb-button__transition, background var(--wb-ds-animation-duration--default) var(--wb-ds-animation-timing-function), color var(--wb-ds-animation-duration--default) var(--wb-ds-animation-timing-function), box-shadow var(--wb-ds-animation-duration--default) var(--wb-ds-animation-timing-function), border var(--wb-ds-animation-duration--default) var(--wb-ds-animation-timing-function));
  background: var(--wb-button__background, var(--wb-ds-button__background, var(--wb-ds-color-background--default, var(--wb-ds-color-background--default, initial))));
  text-decoration: var(--wb-button__text-decoration, var(--wb-ds-button__text-decoration, none));
  cursor: var(--wb-button__cursor, var(--wb-ds-button__cursor, pointer));
  width: var(--wb-button__width);
  text-align: center;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.wb-button slot[name=end] {
  margin-left: var(--wb-button__gutter-x, var(--wb-ds-space--s));
}
.wb-button * {
  --wb-button__bezel: initial;
  --wb-button__bezel-top: initial;
  --wb-button__bezel-right: initial;
  --wb-button__bezel-bottom: initial;
  --wb-button__bezel-left: initial;
}
.wb-button * {
  --wb-button__border-color: initial;
  --wb-button__border-radius: initial;
  --wb-button__border-width: initial;
  --wb-button__box-shadow: initial;
  --wb-button__box-shadow-top: initial;
  --wb-button__box-shadow-right: initial;
  --wb-button__box-shadow-bottom: initial;
  --wb-button__box-shadow-left: initial;
  --wb-button__border: initial;
  --wb-button__border-top: initial;
  --wb-button__border-right: initial;
  --wb-button__border-bottom: initial;
  --wb-button__border-left: initial;
  --wb-button__outline: initial;
  --wb-button__transition: initial;
}
.wb-button * {
  --wb-button__background: initial;
}
.wb-button--fullwidth {
  width: 100%;
}
.wb-button--stretched::after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  content: "";
}
.wb-button--disabled {
  pointer-events: none;
  cursor: default;
}
.wb-button--link {
  --wb-button__color: var(--wb-link__color, var(--wb-ds-link__color, var(--wb-ds-color-text--default)));
  --wb-button__font-family: var(--wb-link__font-family);
  --wb-button__font-size: var(--wb-link__font-size);
  --wb-button__font-style: var(--wb-link__font-style);
  --wb-button__font-weight: var(--wb-link__font-weight);
  --wb-button__line-height: var(--wb-link__line-height);
  --wb-button__letter-spacing: var(--wb-link__letter-spacing);
  --wb-button__text-transform: var(--wb-link__text-transform);
  --wb-button__text-align: var(--wb-link__text-align);
  --wb-button__opacity: var(--wb-link__opacity);
  --wb-button__bezel-top: var(--wb-link__bezel, var(--wb-link__bezel-top, var(--wb-ds-link__bezel, var(--wb-ds-link__bezel-top, 0))));
  --wb-button__bezel-right: var(--wb-link__bezel, var(--wb-link__bezel-right, var(--wb-ds-link__bezel, var(--wb-ds-link__bezel-right, 0))));
  --wb-button__bezel-bottom: var(--wb-link__bezel, var(--wb-link__bezel-bottom, var(--wb-ds-link__bezel, var(--wb-ds-link__bezel-bottom, 0))));
  --wb-button__bezel-left: var(--wb-link__bezel, var(--wb-link__bezel-left, var(--wb-ds-link__bezel, var(--wb-ds-link__bezel-left, 0))));
  --wb-button__border-color: var(--wb-link__border-color, var(--wb-ds-link__border-color, transparent));
  --wb-button__border-radius: var(--wb-link__border-radius, var(--wb-ds-link__border-radius, 0));
  --wb-button__border-width: var(--wb-link__border-width, var(--wb-ds-link__border-width, 0));
  --wb-button__box-shadow: var(--wb-link__box-shadow);
  --wb-button__box-shadow-top: var(--wb-link__box-shadow-top);
  --wb-button__box-shadow-right: var(--wb-link__box-shadow-right);
  --wb-button__box-shadow-bottom: var(--wb-link__box-shadow-bottom);
  --wb-button__box-shadow-left: var(--wb-link__box-shadow-left);
  --wb-button__border: var(--wb-link__border);
  --wb-button__border-top: var(--wb-link__border-top);
  --wb-button__border-right: var(--wb-link__border-right);
  --wb-button__border-bottom: var(--wb-link__border-bottom);
  --wb-button__border-left: var(--wb-link__border-left);
  --wb-button__outline: var(--wb-link__outline);
  --wb-button__transition: color var(--wb-ds-animation-duration--default) var(--wb-ds-animation-timing-function), opacity var(--wb-ds-animation-duration--default) var(--wb-ds-animation-timing-function);
  --wb-button__background: var(--wb-link__background, var(--wb-ds-link__background, transparent));
  --wb-button__text-decoration: var(--wb-link__text-decoration, var(--wb-ds-link__text-decoration, none));
  --wb-button__cursor: var(--wb-link__cursor, var(--wb-ds-link__cursor, pointer));
  --wb-button__width: var(--wb-link__width);
  display: inline;
}


:export {
  props: color, font-family, font-size, font-style, font-weight, line-height, letter-spacing, text-transform, text-align, opacity, bezel-top, bezel-right, bezel-bottom, bezel-left, border-color, border-radius, border-width, box-shadow, box-shadow-top, box-shadow-right, box-shadow-bottom, box-shadow-left, border, border-top, border-right, border-bottom, border-left, outline, transition, background, text-decoration, cursor, width;
  stateProps: color, font-style, font-weight, opacity, border-color, border-width, transition, box-shadow, border, border-top, border-right, border-bottom, border-left, background, text-decoration, cursor;
}