.mcc-button {
  --mds-button-base-border-color: transparent;
  --mds-button-base-border-radius: calc(0.375rem * var(--size-adjustment));
  --mds-button-base-block-size: var(--mds-spacing-08);
  --mds-button-base-padding-block: calc(var(--mds-spacing-03, 0.5rem) - 1px);
  --mds-button-base-padding-inline: calc(var(--mds-spacing-05, 1rem) - 1px);
  --mds-button-base-background-color: transparent;
  --mds-button-base-color: inherit;
  --mds-button-base-icon-size: var(--mds-spacing-06);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--mds-spacing-03, 0.5rem);
  transition: 70ms cubic-bezier(0, 0, 0.38, 0.9);
  transition-property:
    background-color,
    border-color,
    color;
  border: var(--mds-button-border-width, 1px) solid var(--mds-button-base-border-color);
  border-radius: var(--mds-button-border-radius, var(--mds-button-base-border-radius));
  block-size: var(--mds-button-block-size, var(--mds-button-base-block-size));
  padding-block: var(--mds-button-padding-block, var(--mds-button-base-padding-block));
  padding-inline: var(--mds-button-padding-inline, var(--mds-button-base-padding-inline));
  background-color: var(--mds-button-base-background-color);
  line-height: var(--font-size-line-height-base);
  color: var(--mds-button-base-color);
  font-weight: 600;
  cursor: pointer;
  user-select: none;
}
.mcc-button svg {
  --mds-icon-fill: currentcolor;
  transition-property: none;
  inline-size: var(--mds-button-icon-size, var(--mds-button-base-icon-size));
  block-size: var(--mds-button-icon-size, var(--mds-button-base-icon-size));
}
.mcc-button:hover {
  --mds-button-base-border-color: var(--mds-button-base-border-color-hover);
  --mds-button-base-background-color: var(--mds-button-base-background-color-hover);
  --mds-button-base-color: var(--mds-button-base-color-hover);
}
.mcc-button:focus {
  --mds-outline-offset: var(--mds-spacing-01);
  --mds-outline-color: var(--mds-ui-color-07, #161616);
  outline: var(--mds-spacing-01) solid var(--mds-button-focus-ouline-color, var(--mds-outline-color));
  outline-offset: calc(var(--mds-outline-offset) * -1);
}
.mcc-button:is(:active, .mu-is-active) {
  --mds-button-base-border-color: var(--mds-button-base-border-color-active);
  --mds-button-base-background-color: var(--mds-button-base-background-color-active);
  --mds-button-base-color: var(--mds-button-base-color-active);
}
.mcc-button--sm {
  --mds-button-base-border-radius: calc(0.375rem * var(--size-adjustment));
  --mds-button-base-block-size: var(--mds-spacing-07, 2rem);
  --mds-button-base-padding-block: calc(var(--mds-spacing-02, 0.25rem) - 1px);
  --mds-button-base-padding-inline: calc(var(--mds-spacing-05, 1rem) - 1px);
}
.mcc-button--lg {
  --mds-button-base-border-radius: calc(0.375rem * var(--size-adjustment));
  --mds-button-base-block-size: var(--mds-spacing-09, 3rem);
  --mds-button-base-padding-block: calc(var(--mds-spacing-04, 0.75rem) - 1px);
  --mds-button-base-padding-inline: calc(var(--mds-spacing-05, 1rem) - 1px);
}
.mcc-button--icon-only {
  --mds-button-base-padding-block: 0;
  --mds-button-base-padding-inline: 0;
  inline-size: var(--mds-button-base-block-size);
}
.mcc-button--icon-only .mcc-button__label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.mcc-button--block {
  display: flex;
  inline-size: 100%;
}
@media (max-width: 35.98em) {
  .mcc-button--block-sm-only {
    display: flex;
    inline-size: 100%;
  }
}
@media (min-width: 48em) and (max-width: 61.98em) {
  .mcc-button--block-md-only {
    display: flex;
    inline-size: 100%;
  }
}
@media (min-width: 62em) and (max-width: 79.98em) {
  .mcc-button--block-lg-only {
    display: flex;
    inline-size: 100%;
  }
}
@media (min-width: 48em) {
  .mcc-button--block-md {
    display: flex;
    inline-size: 100%;
  }
}
@media (min-width: 62em) {
  .mcc-button--block-lg {
    display: flex;
    inline-size: 100%;
  }
}
@media (max-width: 47.98em) {
  .mcc-button--block-md-down {
    display: flex;
    inline-size: 100%;
  }
}
@media (max-width: 61.98em) {
  .mcc-button--block-lg-down {
    display: flex;
    inline-size: 100%;
  }
}
.mcc-button--anchor {
  --mds-button-base-border-radius: 0;
  --mds-button-base-block-size: fit-content;
  --mds-button-base-padding-block: 0;
  --mds-button-base-padding-inline: 0;
  --mds-button-base-color: var(--mds-link-color, #1169b3);
  border: 0;
  text-decoration: underline;
  font-weight: 500;
}
@media (forced-colors: active) {
  .mcc-button--anchor {
    --mds-button-base-color: LinkText;
  }
}
.mcc-button--anchor:hover {
  --mds-button-base-color-hover: var(--mds-link-color, #1169b3);
}
.mcc-button--anchor:is(:active, .mu-is-active) {
  --mds-button-base-color-active: var(--mds-link-color-hover, #1260a1);
  text-decoration: underline;
}
@media (forced-colors: active) {
  .mcc-button--anchor:is(:active, .mu-is-active) {
    --mds-button-base-color: LinkText;
  }
}
.mcc-button--anchor:is(:disabled, .mu-is-disabled) {
  --mds-button-base-background-color: transparent;
}
.mcc-button--primary {
  --mds-button-base-border-color: var(--mds-button-primary-border-color, var(--mds-color-primary-border, #1078cf));
  --mds-button-base-background-color: var(--mds-button-primary-background-color, var(--mds-color-primary, #348cd6));
  --mds-button-base-color: var(--mds-button-primary-color, var(--mds-color-primary-on, #fff));
}
.mcc-button--primary:hover {
  --mds-button-base-border-color-hover: var(--mds-button-primary-border-color-hover, var(--mds-color-primary-hover, #1260a1));
  --mds-button-base-background-color-hover: var(--mds-button-primary-background-color-hover, var(--mds-color-primary-hover, #1260a1));
  --mds-button-base-color-hover: var(--mds-button-primary-color-hover, var(--mds-color-primary-on, #fff));
}
.mcc-button--primary:is(:active, .mu-is-active) {
  --mds-button-base-border-color-active: var(--mds-button-primary-border-color-active, var(--mds-color-primary-active, #134773));
  --mds-button-base-background-color-active: var(--mds-button-primary-background-color-active, var(--mds-color-primary-active, #134773));
  --mds-button-base-color-active: var(--mds-button-primary-color-active, var(--mds-color-primary-on, #fff));
}
.mcc-button--secondary {
  --mds-button-base-border-color: var(--mds-button-secondary-border-color, var(--mds-color-secondary-border, #666679));
  --mds-button-base-background-color: var(--mds-button-secondary-background-color, var(--mds-color-secondary, #666679));
  --mds-button-base-color: var(--mds-button-secondary-color, var(--mds-color-secondary-on, #fff));
}
.mcc-button--secondary:hover {
  --mds-button-base-border-color-hover: var(--mds-button-secondary-border-color-hover, var(--mds-color-secondary-hover, #41424f));
  --mds-button-base-background-color-hover: var(--mds-button-secondary-background-color-hover, var(--mds-color-secondary-hover, #41424f));
  --mds-button-base-color-hover: var(--mds-button-secondary-color-hover, var(--mds-color-secondary-on, #fff));
}
.mcc-button--secondary:is(:active, .mu-is-active) {
  --mds-button-base-border-color-active: var(--mds-button-secondary-border-color-active, var(--mds-color-secondary-active, #32333d));
  --mds-button-base-background-color-active: var(--mds-button-secondary-background-color-active, var(--mds-color-secondary-active, #32333d));
  --mds-button-base-color-active: var(--mds-button-secondary-color-active, var(--mds-color-secondary-on, #fff));
}
.mcc-button--success {
  --mds-button-base-border-color: var(--mds-button-success-border-color, var(--mds-color-success-border, #458045));
  --mds-button-base-background-color: var(--mds-button-success-background-color, var(--mds-color-success, #458045));
  --mds-button-base-color: var(--mds-button-success-color, var(--mds-color-success-on, #fff));
}
.mcc-button--success:hover {
  --mds-button-base-border-color-hover: var(--mds-button-success-border-color-hover, var(--mds-color-success-hover, #396639));
  --mds-button-base-background-color-hover: var(--mds-button-success-background-color-hover, var(--mds-color-success-hover, #396639));
  --mds-button-base-color-hover: var(--mds-button-success-color-hover, var(--mds-color-success-on, #fff));
}
.mcc-button--success:is(:active, .mu-is-active) {
  --mds-button-base-border-color-active: var(--mds-button-success-border-color-active, var(--mds-color-success-active, #2e4b2e));
  --mds-button-base-background-color-active: var(--mds-button-success-background-color-active, var(--mds-color-success-active, #2e4b2e));
  --mds-button-base-color-active: var(--mds-button-success-color-active, var(--mds-color-success-on, #fff));
}
.mcc-button--info {
  --mds-button-base-border-color: var(--mds-button-info-border-color, var(--mds-color-info-border, #157a80));
  --mds-button-base-background-color: var(--mds-button-info-background-color, var(--mds-color-info, #157a80));
  --mds-button-base-color: var(--mds-button-info-color, var(--mds-color-info-on, #fff));
}
.mcc-button--info:hover {
  --mds-button-base-border-color-hover: var(--mds-button-info-border-color-hover, var(--mds-color-info-hover, #156166));
  --mds-button-base-background-color-hover: var(--mds-button-info-background-color-hover, var(--mds-color-info-hover, #156166));
  --mds-button-base-color-hover: var(--mds-button-info-color-hover, var(--mds-color-info-on, #fff));
}
.mcc-button--info:is(:active, .mu-is-active) {
  --mds-button-base-border-color-active: var(--mds-button-info-border-color-active, var(--mds-color-info-active, #16484b));
  --mds-button-base-background-color-active: var(--mds-button-info-background-color-active, var(--mds-color-info-active, #16484b));
  --mds-button-base-color-active: var(--mds-button-info-color-active, var(--mds-color-info-on, #fff));
}
.mcc-button--warning {
  --mds-button-base-border-color: var(--mds-button-warning-border-color, var(--mds-color-warning-border, #f2a900));
  --mds-button-base-background-color: var(--mds-button-warning-background-color, var(--mds-color-warning, #f2a900));
  --mds-button-base-color: var(--mds-button-warning-color, var(--mds-color-warning-on, #161616));
}
.mcc-button--warning:hover {
  --mds-button-base-border-color-hover: var(--mds-button-warning-border-color-hover, var(--mds-color-warning-hover, #bb8406));
  --mds-button-base-background-color-hover: var(--mds-button-warning-background-color-hover, var(--mds-color-warning-hover, #bb8406));
  --mds-button-base-color-hover: var(--mds-button-warning-color-hover, var(--mds-color-warning-on, #161616));
}
.mcc-button--warning:is(:active, .mu-is-active) {
  --mds-button-base-border-color-active: var(--mds-button-warning-border-color-active, var(--mds-color-warning-active, #84600b));
  --mds-button-base-background-color-active: var(--mds-button-warning-background-color-active, var(--mds-color-warning-active, #84600b));
  --mds-button-base-color-active: var(--mds-button-warning-color-active, var(--mds-color-warning-on, #161616));
  --mds-button-base-color-active: var(--mds-button-warning-border-color, #fff);
}
.mcc-button--danger {
  --mds-button-base-border-color: var(--mds-button-danger-border-color, var(--mds-color-danger-border, #dc3545));
  --mds-button-base-background-color: var(--mds-button-danger-background-color, var(--mds-color-danger, #dc3545));
  --mds-button-base-color: var(--mds-button-danger-color, var(--mds-color-danger-on, #fff));
}
.mcc-button--danger:hover {
  --mds-button-base-border-color-hover: var(--mds-button-danger-border-color-hover, var(--mds-color-danger-hover, #ab2d39));
  --mds-button-base-background-color-hover: var(--mds-button-danger-background-color-hover, var(--mds-color-danger-hover, #ab2d39));
  --mds-button-base-color-hover: var(--mds-button-danger-color-hover, var(--mds-color-danger-on, #fff));
}
.mcc-button--danger:is(:active, .mu-is-active) {
  --mds-button-base-border-color-active: var(--mds-button-danger-border-color-active, var(--mds-color-danger-active, #79262e));
  --mds-button-base-background-color-active: var(--mds-button-danger-background-color-active, var(--mds-color-danger-active, #79262e));
  --mds-button-base-color-active: var(--mds-button-danger-color-active, var(--mds-color-danger-on, #fff));
}
.mcc-button--muted {
  --mds-button-base-border-color: var(--mds-button-muted-border-color, var(--mds-color-muted-border, #9393a7));
  --mds-button-base-background-color: var(--mds-button-muted-background-color, var(--mds-color-muted, #9393a7));
  --mds-button-base-color: var(--mds-button-muted-color, var(--mds-color-muted-on, #41424f));
}
.mcc-button--muted:hover {
  --mds-button-base-border-color-hover: var(--mds-button-muted-border-color-hover, var(--mds-color-muted-hover, #7e7e96));
  --mds-button-base-background-color-hover: var(--mds-button-muted-background-color-hover, var(--mds-color-muted-hover, #7e7e96));
  --mds-button-base-color-hover: var(--mds-button-muted-color-hover, var(--mds-color-muted-on, #41424f));
}
.mcc-button--muted:is(:active, .mu-is-active) {
  --mds-button-base-border-color-active: var(--mds-button-muted-border-color-active, var(--mds-color-muted-active, #7e7e96));
  --mds-button-base-background-color-active: var(--mds-button-muted-background-color-active, var(--mds-color-muted-active, #7e7e96));
  --mds-button-base-color-active: var(--mds-button-muted-color-active, var(--mds-color-muted-on, #41424f));
}
.mcc-button--light {
  --mds-button-base-border-color: var(--mds-button-light-border-color, var(--mds-color-light-border, #d5d6e0));
  --mds-button-base-background-color: var(--mds-button-light-background-color, var(--mds-color-light, #d5d6e0));
  --mds-button-base-color: var(--mds-button-light-color, var(--mds-color-light-on, #666679));
}
.mcc-button--light:hover {
  --mds-button-base-border-color-hover: var(--mds-button-light-border-color-hover, var(--mds-color-light-hover, #c4c4d1));
  --mds-button-base-background-color-hover: var(--mds-button-light-background-color-hover, var(--mds-color-light-hover, #c4c4d1));
  --mds-button-base-color-hover: var(--mds-button-light-color-hover, var(--mds-color-light-on, #666679));
}
.mcc-button--light:is(:active, .mu-is-active) {
  --mds-button-base-border-color-active: var(--mds-button-light-border-color-active, var(--mds-color-light-active, #a5a5b6));
  --mds-button-base-background-color-active: var(--mds-button-light-background-color-active, var(--mds-color-light-active, #a5a5b6));
  --mds-button-base-color-active: var(--mds-button-light-color-active, var(--mds-color-light-on, #666679));
}
.mcc-button--dark {
  --mds-button-base-border-color: var(--mds-button-dark-border-color, var(--mds-color-dark-border, #7f7f95));
  --mds-button-base-background-color: var(--mds-button-dark-background-color, var(--mds-color-dark, #a5a5b6));
  --mds-button-base-color: var(--mds-button-dark-color, var(--mds-color-dark-on, #fff));
}
.mcc-button--dark:hover {
  --mds-button-base-border-color-hover: var(--mds-button-dark-border-color-hover, var(--mds-color-dark-hover, #666679));
  --mds-button-base-background-color-hover: var(--mds-button-dark-background-color-hover, var(--mds-color-dark-hover, #666679));
  --mds-button-base-color-hover: var(--mds-button-dark-color-hover, var(--mds-color-dark-on, #fff));
}
.mcc-button--dark:is(:active, .mu-is-active) {
  --mds-button-base-border-color-active: var(--mds-button-dark-border-color-active, var(--mds-color-dark-active, #41424f));
  --mds-button-base-background-color-active: var(--mds-button-dark-background-color-active, var(--mds-color-dark-active, #41424f));
  --mds-button-base-color-active: var(--mds-button-dark-color-active, var(--mds-color-dark-on, #fff));
}
.mcc-button--soft-primary {
  --mds-button-base-border-color: var(--mds-button-primary-soft-border-color, var(--mds-color-primary-soft-border, #348cd6));
  --mds-button-base-background-color: var(--mds-button-primary-soft-background-color, var(--mds-color-primary-soft, #e7f2fa));
  --mds-button-base-color: var(--mds-button-primary-soft-color, var(--mds-color-primary-soft-on, #152029));
}
.mcc-button--soft-primary:hover {
  --mds-button-base-border-color-hover: var(--mds-button-primary-soft-border-color-hover, var(--mds-color-primary-soft-border, #348cd6));
  --mds-button-base-background-color-hover: var(--mds-button-primary-soft-background-color-hover, var(--mds-color-primary-soft-hover, #b7d7f1));
  --mds-button-base-color-hover: var(--mds-button-primary-soft-color-hover, var(--mds-color-primary-soft-on, #152029));
}
.mcc-button--soft-primary:is(:active, .mu-is-active) {
  --mds-button-base-border-color-active: var(--mds-button-primary-soft-border-color-active, var(--mds-color-primary-soft-border, #348cd6));
  --mds-button-base-background-color-active: var(--mds-button-primary-soft-background-color-active, var(--mds-color-primary-soft-active, #88bce7));
  --mds-button-base-color-active: var(--mds-button-primary-soft-color-active, var(--mds-color-primary-soft-on, #152029));
}
.mcc-button--soft-secondary {
  --mds-button-base-border-color: var(--mds-button-secondary-soft-border-color, var(--mds-color-secondary-soft-border, #7f7f95));
  --mds-button-base-background-color: var(--mds-button-secondary-soft-background-color, var(--mds-color-secondary-soft, #eeeef1));
  --mds-button-base-color: var(--mds-button-secondary-soft-color, var(--mds-color-secondary-soft-on, #161616));
}
.mcc-button--soft-secondary:hover {
  --mds-button-base-border-color-hover: var(--mds-button-secondary-soft-border-color-hover, var(--mds-color-secondary-soft-border, #7f7f95));
  --mds-button-base-background-color-hover: var(--mds-button-secondary-soft-background-color-hover, var(--mds-color-secondary-soft-hover, #e0e0e7));
  --mds-button-base-color-hover: var(--mds-button-secondary-soft-color-hover, var(--mds-color-secondary-soft-on, #161616));
}
.mcc-button--soft-secondary:is(:active, .mu-is-active) {
  --mds-button-base-border-color-active: var(--mds-button-secondary-soft-border-color-active, var(--mds-color-secondary-soft-border, #7f7f95));
  --mds-button-base-background-color-active: var(--mds-button-secondary-soft-background-color-active, var(--mds-color-secondary-soft-active, #d5d6e0));
  --mds-button-base-color-active: var(--mds-button-secondary-soft-color-active, var(--mds-color-secondary-soft-on, #161616));
}
.mcc-button--soft-success {
  --mds-button-base-border-color: var(--mds-button-success-soft-border-color, var(--mds-color-success-soft-border, #619361));
  --mds-button-base-background-color: var(--mds-button-success-soft-background-color, var(--mds-color-success-soft, #ecf2ec));
  --mds-button-base-color: var(--mds-button-success-soft-color, var(--mds-color-success-soft-on, #1b211b));
}
.mcc-button--soft-success:hover {
  --mds-button-base-border-color-hover: var(--mds-button-success-soft-border-color-hover, var(--mds-color-success-soft-border, #619361));
  --mds-button-base-background-color-hover: var(--mds-button-success-soft-background-color-hover, var(--mds-color-success-soft-hover, #c7d9c7));
  --mds-button-base-color-hover: var(--mds-button-success-soft-color-hover, var(--mds-color-success-soft-on, #1b211b));
}
.mcc-button--soft-success:is(:active, .mu-is-active) {
  --mds-button-base-border-color-active: var(--mds-button-success-soft-border-color-active, var(--mds-color-success-soft-border, #619361));
  --mds-button-base-background-color-active: var(--mds-button-success-soft-background-color-active, var(--mds-color-success-soft-active, #a2c0a2));
  --mds-button-base-color-active: var(--mds-button-success-soft-color-active, var(--mds-color-success-soft-on, #1b211b));
}
.mcc-button--soft-info {
  --mds-button-base-border-color: var(--mds-button-info-soft-border-color, var(--mds-color-info-soft-border, #388e93));
  --mds-button-base-background-color: var(--mds-button-info-soft-background-color, var(--mds-color-info-soft, #e8f2f2));
  --mds-button-base-color: var(--mds-button-info-soft-color, var(--mds-color-info-soft-on, #162021));
}
.mcc-button--soft-info:hover {
  --mds-button-base-border-color-hover: var(--mds-button-info-soft-border-color-hover, var(--mds-color-info-soft-border, #388e93));
  --mds-button-base-background-color-hover: var(--mds-button-info-soft-background-color-hover, var(--mds-color-info-soft-hover, #b9d7d9));
  --mds-button-base-color-hover: var(--mds-button-info-soft-color-hover, var(--mds-color-info-soft-on, #162021));
}
.mcc-button--soft-info:is(:active, .mu-is-active) {
  --mds-button-base-border-color-active: var(--mds-button-info-soft-border-color-active, var(--mds-color-info-soft-border, #388e93));
  --mds-button-base-background-color-active: var(--mds-button-info-soft-background-color-active, var(--mds-color-info-soft-active, #8abdc0));
  --mds-button-base-color-active: var(--mds-button-info-soft-color-active, var(--mds-color-info-soft-on, #162021));
}
.mcc-button--soft-warning {
  --mds-button-base-border-color: var(--mds-button-warning-soft-border-color, var(--mds-color-warning-soft-border, #84600b));
  --mds-button-base-background-color: var(--mds-button-warning-soft-background-color, var(--mds-color-warning-soft, #fef6e6));
  --mds-button-base-color: var(--mds-button-warning-soft-color, var(--mds-color-warning-soft-on, #2c2514));
}
.mcc-button--soft-warning:hover {
  --mds-button-base-border-color-hover: var(--mds-button-warning-soft-border-color-hover, var(--mds-color-warning-soft-border, #84600b));
  --mds-button-base-background-color-hover: var(--mds-button-warning-soft-background-color-hover, var(--mds-color-warning-soft-hover, #fbe5b3));
  --mds-button-base-color-hover: var(--mds-button-warning-soft-color-hover, var(--mds-color-warning-soft-on, #2c2514));
}
.mcc-button--soft-warning:is(:active, .mu-is-active) {
  --mds-button-base-border-color-active: var(--mds-button-warning-soft-border-color-active, var(--mds-color-warning-soft-border, #84600b));
  --mds-button-base-background-color-active: var(--mds-button-warning-soft-background-color-active, var(--mds-color-warning-soft-active, #f9d480));
  --mds-button-base-color-active: var(--mds-button-warning-soft-color-active, var(--mds-color-warning-soft-on, #2c2514));
}
.mcc-button--soft-danger {
  --mds-button-base-border-color: var(--mds-button-danger-soft-border-color, var(--mds-color-danger-soft-border, #dc3545));
  --mds-button-base-background-color: var(--mds-button-danger-soft-background-color, var(--mds-color-danger-soft, #fcebec));
  --mds-button-base-color: var(--mds-button-danger-soft-color, var(--mds-color-danger-soft-on, #2a191b));
}
.mcc-button--soft-danger:hover {
  --mds-button-base-border-color-hover: var(--mds-button-danger-soft-border-color-hover, var(--mds-color-danger-soft-border, #dc3545));
  --mds-button-base-background-color-hover: var(--mds-button-danger-soft-background-color-hover, var(--mds-color-danger-soft-hover, #f5c2c7));
  --mds-button-base-color-hover: var(--mds-button-danger-soft-color-hover, var(--mds-color-danger-soft-on, #2a191b));
}
.mcc-button--soft-danger:is(:active, .mu-is-active) {
  --mds-button-base-border-color-active: var(--mds-button-danger-soft-border-color-active, var(--mds-color-danger-soft-border, #dc3545));
  --mds-button-base-background-color-active: var(--mds-button-danger-soft-background-color-active, var(--mds-color-danger-soft-active, #ee9aa2));
  --mds-button-base-color-active: var(--mds-button-danger-soft-color-active, var(--mds-color-danger-soft-on, #2a191b));
}
.mcc-button--soft-muted {
  --mds-button-base-border-color: var(--mds-button-muted-soft-border-color, var(--mds-color-muted-border, #d5d6e0));
  --mds-button-base-background-color: var(--mds-button-muted-soft-background-color, var(--mds-color-muted, #d5d6e0));
  --mds-button-base-color: var(--mds-button-muted-soft-color, var(--mds-color-muted-on, #41424f));
}
.mcc-button--soft-muted:hover {
  --mds-button-base-border-color-hover: var(--mds-button-muted-soft-border-color-hover, var(--mds-color-muted-border, #d5d6e0));
  --mds-button-base-background-color-hover: var(--mds-button-muted-soft-background-color-hover, var(--mds-color-muted-hover, #bfc1d0));
  --mds-button-base-color-hover: var(--mds-button-muted-soft-color-hover, var(--mds-color-muted-on, #41424f));
}
.mcc-button--soft-muted:is(:active, .mu-is-active) {
  --mds-button-base-border-color-active: var(--mds-button-muted-soft-border-color-active, var(--mds-color-muted-border, #d5d6e0));
  --mds-button-base-background-color-active: var(--mds-button-muted-soft-background-color-active, var(--mds-color-muted-active, #bfc1d0));
  --mds-button-base-color-active: var(--mds-button-muted-soft-color-active, var(--mds-color-muted-on, #41424f));
}
.mcc-button--soft-light {
  --mds-button-base-border-color: var(--mds-button-light-soft-border-color, var(--mds-color-light-soft-border, #d5d6e0));
  --mds-button-base-background-color: var(--mds-button-light-soft-background-color, var(--mds-color-light-soft, #eeeef1));
  --mds-button-base-color: var(--mds-button-light-soft-color, var(--mds-color-light-soft-on, #666679));
}
.mcc-button--soft-light:hover {
  --mds-button-base-border-color-hover: var(--mds-button-light-soft-border-color-hover, var(--mds-color-light-soft-border, #d5d6e0));
  --mds-button-base-background-color-hover: var(--mds-button-light-soft-background-color-hover, var(--mds-color-light-soft-hover, #e0e0e7));
  --mds-button-base-color-hover: var(--mds-button-light-soft-color-hover, var(--mds-color-light-soft-on, #666679));
}
.mcc-button--soft-light:is(:active, .mu-is-active) {
  --mds-button-base-border-color-active: var(--mds-button-light-soft-border-color-active, var(--mds-color-light-soft-border, #d5d6e0));
  --mds-button-base-background-color-active: var(--mds-button-light-soft-background-color-active, var(--mds-color-light-soft-active, #d5d6e0));
  --mds-button-base-color-active: var(--mds-button-light-soft-color-active, var(--mds-color-light-soft-on, #666679));
}
.mcc-button--soft-dark {
  --mds-button-base-border-color: var(--mds-button-dark-soft-border-color, var(--mds-color-dark-soft-border, #a5a5b6));
  --mds-button-base-background-color: var(--mds-button-dark-soft-background-color, var(--mds-color-dark-soft, #a5a5b6));
  --mds-button-base-color: var(--mds-button-dark-soft-color, var(--mds-color-dark-on, #fff));
}
.mcc-button--soft-dark:hover {
  --mds-button-base-border-color-hover: var(--mds-button-dark-soft-border-color-hover, var(--mds-color-dark-soft-border, #a5a5b6));
  --mds-button-base-background-color-hover: var(--mds-button-dark-soft-background-color-hover, var(--mds-color-dark-soft-hover, #9393a7));
  --mds-button-base-color-hover: var(--mds-button-dark-soft-color-hover, var(--mds-color-dark-on, #fff));
}
.mcc-button--soft-dark:is(:active, .mu-is-active) {
  --mds-button-base-border-color-active: var(--mds-button-dark-soft-border-color-active, var(--mds-color-dark-soft-border, #a5a5b6));
  --mds-button-base-background-color-active: var(--mds-button-dark-soft-background-color-active, var(--mds-color-dark-soft-active, #7f7f95));
  --mds-button-base-color-active: var(--mds-button-dark-soft-color-active, var(--mds-color-dark-on, #fff));
}
:is(.mcc-button--outline, [class*=mcc-button--outline]) {
  --mds-button-base-border-color: var(--mds-button-outline-border-color, var(--mds-ui-color-06, #666679));
  --mds-button-base-background-color: var(--mds-button-outline-background-color, var(--mds-ui-color-01, #fff));
  --mds-button-base-color: var(--mds-button-outline-color, var(--mds-text-color-default, #161616));
}
:is(.mcc-button--outline, [class*=mcc-button--outline]):hover {
  --mds-button-base-border-color-hover: var(--mds-button-outline-border-color-hover, var(--mds-ui-color-06, #666679));
  --mds-button-base-background-color-hover: var(--mds-button-outline-background-color-hover, var(--mds-ui-color-03, #e0e0e7));
  --mds-button-base-color-hover: var(--mds-button-outline-color-hover, var(--mds-text-color-default, #161616));
}
:is(.mcc-button--outline, [class*=mcc-button--outline]):is(:active, .mu-is-active) {
  --mds-button-base-border-color-active: var(--mds-button-outline-border-color-active, var(--mds-ui-color-06, #666679));
  --mds-button-base-background-color-active: var(--mds-button-outline-background-color-active, var(--mds-ui-color-04, #d5d6e0));
  --mds-button-base-color-active: var(--mds-button-outline-color-active, var(--mds-text-color-default, #161616));
}
:is(.mcc-button--outline, [class*=mcc-button--outline]):is(:disabled, .mu-is-disabled) {
  --mds-button-base-background-color: transparent;
}
.mcc-button--ghost {
  --mds-button-base-border-color: var(--mds-button-ghost-border-color, transparent);
  --mds-button-base-background-color: var(--mds-button-ghost-background-color, transparent);
  --mds-button-base-color: var(--mds-button-ghost-color, var(--mds-text-color-default, #161616));
}
.mcc-button--ghost:hover {
  --mds-button-base-border-color-hover: var(--mds-button-ghost-border-color-hover, transparent);
  --mds-button-base-background-color-hover: var(--mds-button-ghost-background-color-hover, var(--mds-color-secondary-soft-hover, #e0e0e7));
  --mds-button-base-color-hover: var(--mds-button-ghost-color-hover, var(--mds-text-color-default, #161616));
}
.mcc-button--ghost:is(:active, .mu-is-active) {
  --mds-button-base-border-color-active: var(--mds-button-ghost-border-color-active, transparent);
  --mds-button-base-background-color-active: var(--mds-button-ghost-background-color-active, var(--mds-color-secondary-soft-active, #d5d6e0));
  --mds-button-base-color-active: var(--mds-button-ghost-color-active, var(--mds-text-color-default, #161616));
}
.mcc-button--ghost:is(:disabled, .mu-is-disabled) {
  --mds-button-base-background-color: transparent;
  --mds-button-base-border-color: transparent;
}
:is(.mcc-button--text, [class*=mcc-button--text]) {
  --mds-button-base-color: var(--mds-link-color, #1169b3);
}
:is(.mcc-button--text, [class*=mcc-button--text]):hover {
  --mds-button-base-background-color: var(--mds-color-secondary-soft-hover, #e0e0e7);
}
:is(.mcc-button--text, [class*=mcc-button--text]):is(:active, .mu-is-active) {
  --mds-button-base-background-color: var(--mds-color-primary, #348cd6);
  --mds-button-base-color: var(--mds-color-primary-on, #fff);
}
:is(.mcc-button--text, [class*=mcc-button--text]):is(:disabled, .mu-is-disabled) {
  --mds-button-base-background-color: transparent;
  --mds-button-base-border-color: transparent;
}
.mcc-button:is(:disabled, .mu-is-disabled) {
  --mds-button-base-border-color: var(--mds-disabled-color-medium-emphasis, #d5d6e0);
  --mds-button-base-background-color: var(--mds-disabled-color-medium-emphasis, #d5d6e0);
  --mds-button-base-color: var(--mds-disabled-color, #a5a5b6);
  cursor: not-allowed;
}
/* Mosaic Design System | button | v1.6.2 */
.mcc-button--icon-only {
  position: relative;
}