/* ==========================================================================
   buttons.css — brand pill/gradient button variants Bootstrap doesn't ship
   ========================================================================== */
.btn-gradient {
  background: linear-gradient(90deg, var(--pm-blue), var(--pm-teal));
  color: #fff;
  border: 0;
  border-radius: 50rem;
  font-weight: 600;
  transition: box-shadow .2s ease, transform .2s ease;
}
.btn-gradient:hover, .btn-gradient:focus {
  color: #fff;
  box-shadow: 0 15px 30px -8px rgba(15, 98, 254, .5);
  transform: translateY(-2px);
}
.btn-outline-pm {
  border: 2px solid var(--pm-blue);
  color: var(--pm-blue);
  border-radius: 50rem;
  font-weight: 600;
  background: transparent;
  transition: all .2s ease;
}
.btn-outline-pm:hover { background: var(--pm-blue); color: #fff; }
.btn-outline-light-pm {
  border: 2px solid #4b5563;
  color: #fff;
  border-radius: 50rem;
  font-weight: 600;
  background: transparent;
  transition: all .2s ease;
}
.btn-outline-light-pm:hover { background: #1f2937; border-color: var(--pm-blue); color: #fff; }
.btn-pill { border-radius: 50rem; }

/* Platform-tab pill buttons (Storefront/Channels tabs) */
.pm-tab-btn { border-radius: 50rem; font-weight: 600; padding: .625rem 1.5rem; border: 0; transition: all .3s ease; }
.pm-tab-btn.active { background: linear-gradient(90deg, #6366f1, #a855f7); color: #fff; box-shadow: 0 6px 16px -4px rgba(99,102,241,.5); }
.pm-tab-btn:not(.active) { background: #f3f4f6; color: #4b5563; }
.pm-tab-btn:not(.active):hover { background: #e5e7eb; }