Update UI styling and Spinner component

Several updates have been made to UI components across various packages. Styling changes have been made in 'global-loader.tsx', 'docs-card.tsx', and 'pricing-table.tsx'. The Spinner component in 'spinner.tsx' has been updated to adjust size and animation properties. Addition of a new prop 'spinnerClassName' in 'loading-overlay.tsx' allows dynamic class assignment. The 'loading.tsx' now exports GlobalLoader directly instead of wrapping it in a function. 'pnpm-lock.yaml' has been updated with a new specifier.

packages/billing/gateway/src/components/pricing-table.tsx

@@ -4,7 +4,7 @@ import { useState } from 'react';
 
 import Link from 'next/link';
 
-import { ArrowRight, CheckCircle, Circle } from 'lucide-react';
+import { ArrowRight, CheckCircle } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
 import { z } from 'zod';
 
@@ -347,7 +347,7 @@ function Price({ children }: React.PropsWithChildren) {
 function ListItem({ children }: React.PropsWithChildren) {
   return (
     <li className={'flex items-center space-x-2.5'}>
-      <Circle className={'fill-primary h-2 w-2'} />
+      <CheckCircle className={'text-primary h-4'} />
 
       <span
         className={cn('text-sm', {