/* ============================================================
   RecibIA — Buttons
   ============================================================ */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--ri-space-2xs);
  padding: 0.85rem 1.5rem;
  border-radius: var(--ri-radius-full);
  font-size: var(--ri-text-sm);
  font-weight: 700;
  border: 1px solid transparent;
  white-space: nowrap;
  transition: transform var(--ri-duration) var(--ri-easing),
              background var(--ri-duration) var(--ri-easing),
              border-color var(--ri-duration) var(--ri-easing),
              box-shadow var(--ri-duration) var(--ri-easing);
}

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

.btn--primary {
  background: var(--ri-gradient-brand);
  color: #041613;
  box-shadow: 0 10px 30px -12px rgba(13, 148, 136, 0.55);
}
.btn--primary:hover { box-shadow: 0 14px 34px -10px rgba(13, 148, 136, 0.65); }

.btn--ghost-dark {
  background: transparent;
  border-color: rgba(247, 245, 241, 0.28);
  color: var(--ri-ink-inverse);
}
.btn--ghost-dark:hover { border-color: rgba(247, 245, 241, 0.55); }

.btn--ghost-light {
  background: transparent;
  border-color: var(--ri-border);
  color: var(--ri-ink);
}
.btn--ghost-light:hover { border-color: var(--ri-teal); color: var(--ri-teal); }

.btn--sm {
  padding: 0.6rem 1.1rem;
  font-size: var(--ri-text-xs);
}