[BUG]: Debate Details modal content overflow and improper display layout

[spinola103]

Bug Description

While testing the DebateAI application locally, I noticed that the "Debate Details" modal on the Profile page does not display content properly. Some sections appear cut off, and the layout feels compressed, making it difficult to read the full details of a debate.

Steps to Reproduce

1. Go to Profile page
2. Open any Debate Details modal
3. Scroll through sections like "Full Conversation"
4. Observe content overflow and layout issues

Expected Behaviour:
The modal should properly display all content with:
• No content being cut off or hidden
• Smooth and consistent scrolling
• Proper spacing and layout across all sections

Actual Behaviour:
• Content inside the modal is partially hidden or clipped
• Scroll behavior is inconsistent (nested scroll issues)
• Sections like "Full Conversation" are not fully visible
• Layout appears compressed and not properly spaced

Logs and Screenshots

Environment Details

Tested locally after setting up the DebateAI project.

Suggested Fix:
Adjust modal container styling and layout by:
• Setting proper max-height and overflow handling (overflow-y-auto)
• Ensuring consistent scroll behavior for modal content
• Fixing spacing and layout alignment for better readability

Hey @bhavik-mangla , I would like to work on fixing this issue. Kindly assign it to me if approved.

Impact

Medium - Feature works but has issues

Code of Conduct

• I have joined the Discord server and will post updates there
• I have searched existing issues to avoid duplicates

[spinola103]

Hi @bhavik-mangla , I had already requested to be assigned to this issue before working on it.

I will proceed with raising a PR once it is assigned . Kindly assign it to me
Thank you