/**
 * @file buttons.css
 * Brand button system.
 */

/* Base */
.mp-btn,
.button,
input[type="submit"],
input[type="button"],
button.form-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--mp-space-2);
  padding: var(--mp-space-3) var(--mp-space-6);
  border-radius: var(--mp-radius);
  font-family: var(--mp-font-primary);
  font-size: var(--mp-text-sm);
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  text-decoration: none;
  border: 2px solid transparent;
  transition: all var(--mp-transition-fast);
  white-space: nowrap;
  min-height: 44px; /* WCAG touch target */
}

/* Primary — saffron */
.mp-btn-primary,
input[type="submit"].button--primary,
.button--primary {
  background: var(--mp-primary);
  color: var(--mp-white);
  border-color: var(--mp-primary);
}

.mp-btn-primary:hover,
.button--primary:hover {
  background: var(--mp-primary-hover);
  border-color: var(--mp-primary-hover);
  color: var(--mp-white);
  text-decoration: none;
  transform: translateY(-1px);
  box-shadow: var(--mp-shadow);
}

/* Secondary — outlined */
.mp-btn-secondary,
.button--secondary {
  background: transparent;
  color: var(--mp-primary);
  border-color: var(--mp-primary);
}

.mp-btn-secondary:hover,
.button--secondary:hover {
  background: var(--mp-primary-50);
  text-decoration: none;
}

/* Danger */
.mp-btn-danger,
.button--danger {
  background: var(--mp-error);
  color: var(--mp-white);
  border-color: var(--mp-error);
}

/* Default submit fallback */
input[type="submit"] {
  background: var(--mp-primary);
  color: var(--mp-white);
  border-color: var(--mp-primary);
}

input[type="submit"]:hover {
  background: var(--mp-primary-hover);
  border-color: var(--mp-primary-hover);
}
