import re

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

# Replace the red filter with dark brown filter
old_filter = 'filter: invert(18%) sepia(35%) saturate(3015%) hue-rotate(348deg) brightness(92%) contrast(89%);'
new_filter = 'filter: brightness(0) saturate(100%) invert(18%) sepia(21%) saturate(2311%) hue-rotate(341deg) brightness(95%) contrast(86%);'
content = content.replace(old_filter, new_filter)

# Remove the pulse circle
content = content.replace('<span class="cta-dock__pulse" aria-hidden="true"></span>', '')

# Ensure no hover background on the trigger button by appending to styles.css
css_addition = """
.cta-dock__trigger {
    background: transparent !important;
}
.cta-dock__trigger:hover, 
.cta-dock__trigger:focus, 
.cta-dock__trigger:active {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    outline: none !important;
}
.cta-dock__trigger::after, .cta-dock__trigger::before {
    display: none !important;
}
"""

with open('css/styles.css', 'a', encoding='utf-8') as f:
    f.write('\n' + css_addition)

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

print("Widget fixed.")