import { useNavigation } from '../../contexts/NavigationContext';
import { useIsMobile } from '../../hooks/useIsMobile';

export function DrawerOverlay() {
  const { drawerOpen, closeDrawer } = useNavigation();
  const isMobile = useIsMobile();

  if (!isMobile || !drawerOpen) return null;

  return (
    <div
      onClick={closeDrawer}
      className="fixed inset-0 z-30 bg-black/60 backdrop-blur-sm"
      aria-hidden="true"
    />
  );
}