.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--asuite-button-padding);
  border-radius: var(--asuite-button-radius);
  border: var(--asuite-button-border);
  background: var(--asuite-button-bg);
  color: var(--asuite-button-text);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  transition: var(--asuite-transition-control);
}

.button:hover,
.button:focus-visible {
  transform: translateY(-2px);
  background: var(--asuite-button-bg-hover);
  border-color: var(--asuite-button-bg-hover);
  color: var(--asuite-button-text);
  outline: none;
}

.button:disabled,
.button:disabled:hover,
.button:disabled:focus-visible,
.button[aria-disabled="true"],
.button[aria-disabled="true"]:hover,
.button[aria-disabled="true"]:focus-visible {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
  color: var(--asuite-button-text);
  border-color: rgb(var(--asuite-rgb-accent) / 0.6);
  background: var(--asuite-button-bg);
}

.button.primary {
  background: var(--asuite-button-bg);
  color: var(--asuite-button-text);
}

.button.secondary,
.button.ghost {
  background: var(--asuite-button-secondary-bg);
  border-color: rgb(var(--asuite-rgb-accent) / 0.6);
  color: var(--asuite-button-secondary-text);
}

.button.success {
  background: var(--asuite-button-bg);
  color: var(--asuite-button-text);
  border-color: rgb(var(--asuite-rgb-accent) / 0.6);
}

.button.test {
  background: var(--asuite-button-test-bg);
  color: var(--asuite-button-test-text);
  border-color: rgb(var(--asuite-rgb-panel-border));
}

.button.test:hover,
.button.test:focus-visible {
  background: var(--asuite-button-test-bg);
  color: var(--asuite-button-test-text);
  border-color: rgb(var(--asuite-rgb-accent) / 0.6);
}

.button.danger,
.button.danger:hover,
.button.danger:focus-visible {
  background: var(--asuite-button-danger-bg);
  border-color: rgb(var(--asuite-rgb-danger) / 0.6);
  color: var(--asuite-button-danger-text);
}

.brand-accent {
  color: var(--asuite-color-accent);
}
