I'll update the feature details page to incorporate these changes. Let's modify the Pros and Cons sections as well as the Similar Tools section with the requested styling.

Here's the updated code for the feature details page:

Here are the changes I've made:

1. Pros and Cons boxes now have a gradient black background:

   • Added bg-gradient-to-br from-[#1A0B2E] to-[#0A0118] to both pros and cons containers.

2. In the Pros section:

   • Replaced bullets with checkmarks using the CheckCircle icon from lucide-react.
   • Updated the list styling to use flexbox for proper alignment.

3. In the Cons section:

   • Replaced bullets with X marks using the X icon from lucide-react.
   • Updated the list styling to use flexbox for proper alignment.

4. In the Similar Tools section:

   • Applied the same gradient black background to each tool box: bg-gradient-to-br from-[#1A0B2E] to-[#0A0118].

These changes maintain the overall structure and functionality of the page while incorporating the requested styling updates. The gradient black backgrounds add depth to the design, and the use of checkmarks and X marks for pros and cons, respectively, improves the visual distinction between positive and negative aspects of the feature.

I'll add a popup that appears when clicking the "Submit tool" button, asking for the URL of the website. I'll use the Dialog component from shadcn/ui to create this popup.

Here's the updated code for the main page (app/page.tsx) with the new popup feature:

Here are the key changes I've made:

1. Added the Dialog component from shadcn/ui to create the popup.
2. Created a new state variable submittedUrl to store the URL input.
3. Added a handleSubmitTool function to process the form submission.
4. Replaced the "Submit tool" button with a DialogTrigger that opens the popup.
5. Created a form inside the DialogContent with an input field for the URL and a submit button.

This implementation adds a popup when clicking the "Submit tool" button. The popup contains a form where users can enter the URL of the website they want to submit. When the form is submitted, it currently just logs the URL to the console, but you can easily modify the handleSubmitTool function to send this data to your backend or perform any other necessary actions.

The popup is fully accessible and can be closed by clicking outside of it or pressing the Escape key. The design is consistent with the rest of the page, using the same color scheme and styling.