import re

def fix_responsive():
    with open('index.html', 'r', encoding='utf-8') as f:
        content = f.read()

    # Replacements for grid-template-columns
    replacements = [
        (r'style="(.*?)\bdisplay:\s*grid;\s*grid-template-columns:\s*1fr 1\.05fr;(.*?)"', r'class="responsive-grid-about" style="\1display: grid;\2"'),
        (r'style="(.*?)\bdisplay:\s*grid;\s*grid-template-columns:\s*1fr 1fr;(.*?)"', r'class="responsive-grid-2" style="\1display: grid;\2"'),
        (r'style="(.*?)\bdisplay:\s*grid;\s*grid-template-columns:\s*0\.9fr 1\.1fr;(.*?)"', r'class="responsive-grid-contact" style="\1display: grid;\2"'),
        (r'style="(.*?)\bdisplay:\s*grid;\s*grid-template-columns:\s*repeat\(3, 1fr\);(.*?)"', r'class="responsive-grid-3" style="\1display: grid;\2"'),
        (r'style="(.*?)\bdisplay:\s*grid;\s*grid-template-columns:\s*1\.1fr 0\.8fr 1\.1fr 1\.2fr;(.*?)"', r'class="responsive-grid-footer" style="\1display: grid;\2"'),
    ]

    for patt, repl in replacements:
        content = re.sub(patt, repl, content)

    with open('index.html', 'w', encoding='utf-8') as f:
        f.write(content)

def add_css():
    with open('css/styles.css', 'r', encoding='utf-8') as f:
        content = f.read()
    
    # Also fix header sticky logic background
    content = content.replace('background-color: rgba(20,33,58,0.85);', 'background-color: #1c1917 !important;')
    
    css = """
/* Responsive Grid Overrides */
.responsive-grid-about {
    grid-template-columns: 1fr 1.05fr !important;
}
.responsive-grid-2 {
    grid-template-columns: 1fr 1fr !important;
}
.responsive-grid-contact {
    grid-template-columns: 0.9fr 1.1fr !important;
}
.responsive-grid-3 {
    grid-template-columns: repeat(3, 1fr) !important;
}
.responsive-grid-footer {
    grid-template-columns: 1.1fr 0.8fr 1.1fr 1.2fr !important;
}

@media (max-width: 991px) {
    .responsive-grid-about,
    .responsive-grid-contact,
    .responsive-grid-footer {
        grid-template-columns: 1fr !important;
    }
    .responsive-grid-3 {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 768px) {
    .responsive-grid-2 {
        grid-template-columns: 1fr !important;
    }
    .responsive-grid-3 {
        grid-template-columns: 1fr !important;
    }
}
"""
    if ".responsive-grid-about" not in content:
        with open('css/styles.css', 'a', encoding='utf-8') as f:
            f.write(css)

fix_responsive()
add_css()
print("Done")