Fix checkbox disabled styling

src/components/form/Checkbox.tsx

@@ -14,14 +14,18 @@ export const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(
             ref={ref}
             type="checkbox"
             className={`h-4 w-4 rounded border-transparent bg-orange-100 text-orange-500 focus:border-transparent focus:outline-none focus:ring-2 focus:ring-orange-500 ${
-              disabled ? "cursor-not-allowed text-orange-200" : ""
+              disabled ? "cursor-not-allowed bg-orange-50 text-orange-200" : ""
             }`}
             disabled={disabled}
             {...rest}
           />
         </div>
         <div className="ml-3 text-sm">
-          <label htmlFor="comments" className="font-medium text-gray-700">
+          <label
+            className={`font-medium  ${
+              disabled ? "text-gray-500" : "text-gray-700"
+            }`}
+          >
             {label}
           </label>
         </div>