1. disapper black border in card 2.

src/components/shared/MetricCard.tsx

@@ -3,16 +3,16 @@ import { useState } from "react";
 
 
 // Reusable Metric Card Component
-const MetricCard = ({ icon: Icon, img: Img, value, label, tooltipText, valueChange, size, extraStyle }: { icon?: any, img?: any, value?: any, label?: any, tooltipText?: any, valueChange?: any, size?: any, extraStyle?: any }) => {
+const MetricCard = ({ icon: Icon, img: Img, value, label, tooltipText, valueChange, size, extraStyle, disabled }: { icon?: any, img?: any, value?: any, label?: any, tooltipText?: any, valueChange?: any, size?: any, extraStyle?: any, disabled?: any }) => {
     const [isHovered, setIsHovered] = useState(false);
-
+console.log(Img);
     if (Img) {
         return (
             <div className="relative cursor-pointer"
                 onMouseEnter={() => setIsHovered(true)}
                 onMouseLeave={() => setIsHovered(false)}>
-                <div className={`${extraStyle}`}>
-                    <img src={Img} alt="Img" className="w-8 2xl:w-10 h-8 2xl:h-10" />
+                <div className={`${extraStyle} ${disabled ? "opacity-30" : ""}`}>
+                    <img src={Img} alt="Img" className={` ${disabled ? "w-6 2xl:w-6 h-6 2xl:h-6" : "w-6 2xl:w-8 h-6 2xl:h-8"}${value === 'Map' ? ' scale-125' : ""} ` } />
                 </div>
                 <div className="">
                     {tooltipText && (