Pill CTA Button with Gradient Icon (Tailwind)

<a href="#"
  class="inline-flex items-center gap-3 hover:shadow-2xl transition bg-black/5 ring-black/10 ring-1 rounded-full pt-2 pr-2 pb-2 pl-2 shadow">
  <span class="inline-flex items-center justify-center w-10 h-10 rounded-full" style="background: radial-gradient(100% 100% at 50% 0%, #ff6b6b 0%, #ef4444 60%, #dc2626 100%); box-shadow: inset 0 0 0 2px rgba(255,255,255,0.7), 0 6px 18px rgba(239,68,68,0.35);">
          <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 text-white" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
            <path d="M5 12h14" class=""></path>
            <path d="m12 5 7 7-7 7" class=""></path>
          </svg>
        </span>
  <span class="px-3 text-sm font-medium">Book an appointment</span>
</a>