// LoadingSpinner.jsx
'use client';

export default function LoadingSpinner() {
  return (
    <div className="min-h-screen flex items-center justify-center">
      <div className="text-center">
        <div className="relative">
          <div className="w-16 h-16 border-4 border-teal-200 rounded-full"></div>
          <div className="w-16 h-16 border-4 border-teal-600 border-t-transparent rounded-full animate-spin absolute top-0 left-0"></div>
        </div>
        <p className="mt-4 text-gray-600 font-semibold">Loading article...</p>
        <p className="text-sm text-gray-500 mt-2">Preparing your reading experience</p>
      </div>
    </div>
  );
}