/* Base button */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  padding: 12px 24px;
  border-radius: 8px;
  border: 0;
  text-decoration: none;
  cursor: pointer;
  width: auto;              /* prevent full-width */
  color: #fff;
}

/* Anchor buttons must never fall back to browser blue/purple visited-link colors. */
a.btn,
a.btn:link,
a.btn:visited,
a.btn:hover,
a.btn:active,
a.btn:focus {
  width: auto;
  color: #fff;
  text-decoration: none;
}

button.btn {
  appearance: none;
  -webkit-appearance: none; /* fix mobile default styles */
  color: #fff;
}

/* Loud red button (global) */
.btn-loud { background: #ff3333; color: #fff; font-weight: 700; }
.btn-loud:visited { color: #fff; }
.btn-loud:hover { background: #cc0000; color: #fff; }

/* RFD interaction feedback -------------------------------------------------
   Every intentional control should acknowledge the finger immediately,
   before a network request has time to finish. */
button,
[role="button"],
a.btn,
a[class*="button"],
a[class*="action"],
a[class*="primary"],
a[class*="secondary"],
input[type="button"],
input[type="submit"] {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  transition: transform 70ms ease, filter 70ms ease, opacity 70ms ease, box-shadow 90ms ease;
  transform-origin: center;
}

button:active:not(:disabled),
[role="button"]:active,
a.btn:active,
a[class*="button"]:active,
a[class*="action"]:active,
a[class*="primary"]:active,
a[class*="secondary"]:active,
input[type="button"]:active:not(:disabled),
input[type="submit"]:active:not(:disabled),
.rfd-pressing {
  transform: scale(.965);
  filter: brightness(1.14) saturate(1.08);
  opacity: .94;
}

button:disabled,
input[type="button"]:disabled,
input[type="submit"]:disabled,
[aria-disabled="true"] {
  cursor: wait;
}

.rfd-action-pulse {
  animation: rfdActionPulse 180ms ease-out;
}

@keyframes rfdActionPulse {
  0% { box-shadow: 0 0 0 0 rgba(255,255,255,.34); }
  100% { box-shadow: 0 0 0 9px rgba(255,255,255,0); }
}

@media (prefers-reduced-motion: reduce) {
  button,
  [role="button"],
  a.btn,
  a[class*="button"],
  a[class*="action"],
  a[class*="primary"],
  a[class*="secondary"],
  input[type="button"],
  input[type="submit"] {
    transition: none;
  }
  .rfd-action-pulse { animation: none; }
}