#!/usr/bin/env python3
"""
Fix checklist display issues - ensure all products visible in all categories.
"""

import re

filepath = '/root/clawd/stroller-app/checklist.html'

with open(filepath, 'r') as f:
    html = f.read()

# 1. Increase max-height for category content (line ~926)
html = re.sub(
    r'(\.category-content\s*\{[^}]*max-height:\s*)\d+px',
    r'\g<1>5000px',
    html
)

# 2. Increase max-height for subgroup content (line ~1005)
html = re.sub(
    r'(\.subgroup-content\s*\{[^}]*max-height:\s*)\d+px',
    r'\g<1>3000px',
    html
)

# 3. Make sure subgroups have explicit max-height when not collapsed
# Find the .subgroup-content rule and ensure it has a high max-height
if '.subgroup-content {' in html and 'max-height:' not in html.split('.subgroup-content {')[1].split('}')[0]:
    html = html.replace(
        '.subgroup-content {',
        '.subgroup-content {\n      max-height: 3000px;'
    )

print('✓ Increased max-height values to prevent cutoff')

# 4. Add mobile-specific fix to ensure subgroups are always visible
mobile_css_addition = '''
      
      /* Ensure subgroups fully visible on mobile */
      .subgroup-content {
        max-height: none !important;
      }
      
      .subgroup:not(.collapsed) .subgroup-content {
        max-height: none !important;
      }
'''

# Find the mobile media query section and add this fix
if '@media (max-width: 768px)' in html:
    # Add before the closing of the mobile media query
    parts = html.split('@media (max-width: 768px) {')
    if len(parts) > 1:
        # Find the matching closing brace
        mobile_section = parts[1]
        # Add our fix near the end of mobile styles (before the last closing brace of that section)
        # Actually, let's just add it to the existing .subgroup-content rule in mobile section
        if '.subgroup-content {' in mobile_section:
            mobile_section = mobile_section.replace(
                '.subgroup-content {',
                '.subgroup-content {\n        max-height: none !important;'
            )
            html = parts[0] + '@media (max-width: 768px) {' + mobile_section
            print('✓ Added mobile fix for subgroup visibility')

with open(filepath, 'w') as f:
    f.write(html)

print('✅ Checklist fixes applied!')
print('   - Increased category content max-height to 5000px')
print('   - Increased subgroup content max-height to 3000px')  
print('   - Added mobile-specific fixes for full visibility')