"use client";

import React from "react";
import { FadeLoader } from "react-spinners";

interface GlobalLoadingOverlayProps {
  /** When true, shows a full-screen overlay with loading text */
  show: boolean;
}

/**
 * Full-screen loading overlay. Use for navigation, form submission, or any
 * blocking operation where the whole UI should show a loading state.
 */
export default function GlobalLoadingOverlay({ show }: GlobalLoadingOverlayProps) {
  if (!show) return null;

  return (
    <div
      className="position-fixed  flex items-center justify-center d-flex justify-content-center align-items-center "
    
      aria-live="polite"
      aria-busy="true"
      style={{height:'100vh',width:'100vw',top:'0',left:'0',zIndex:'99999999',backgroundColor:'rgba(0,0,0,0.2)'}}
    >
      <FadeLoader color="#000" />
      {/* <span className="text-lg font-medium text-white/90">Loading...</span> */}
    </div>
  );
}