/* ============================================================
   Buttons (extracted from main.css)
   Semantic variants (.btn--primary, .btn--info, etc.) live in
   main.css alongside other utilities — keep them there until a
   follow-up pass consolidates.
   ============================================================ */

.btn {
  display: inline-block;
  color: var(--text-inverse) !important;
  background-color: var(--brand-black);
  padding: var(--space-3) var(--space-5);
  border-radius: var(--radius-xl);
  text-transform: uppercase;
  font-weight: var(--fw-bold);
  font-size: var(--fs-base);
  text-align: center;
  cursor: pointer;
  transition: var(--transition-slow);
  border: none;
}

.btn:hover,
.btn:focus-visible {
  background-color: var(--brand-gold);
  color: var(--brand-black) !important;
  transform: translateY(-2px);
}

.btn:active {
  transform: translateY(1px);
}

.btn:disabled {
  background-color: var(--text-color-secondary);
  color: var(--white) !important;
  cursor: not-allowed;
}

.return-btn {
  display: inline-block;
  position: absolute;
  margin-bottom: 20px;
  padding: 10px 20px;
  max-width: 8rem;
  z-index: 80;
}

/* Special Button Styles */
.logout {
  margin-top: var(--spacing-sm);
  background-color: #c30e0e;
  color: var(--white) !important;
}

.logout:hover {
  background-color: #630808;
}

.default-btn {
  color: var(--white) !important;
  background-color: var(--text-color-secondary);
}

.set-default-btn {
  color: var(--primary-color) !important;
  background-color: var(--accent-color);
}

.set-default-btn:hover {
  color: var(--white) !important;
  background-color: var(--text-color-secondary);
}

/* Icon-next-to-text spacing inside .btn (so emoji/fa + label don't cramp) */
.btn i + span,
.btn span + i { margin-left: var(--space-2); }