import os
import re

css_exact_rule = """
/* ============================================================
   NAV MENU & DROPDOWN HOVER IDENTICAL GOLD STYLING
   ============================================================ */
.fs-desktop-nav a,
.fs-desktop-nav button,
.fs-desktop-nav .fs-mega-toggle,
button.fs-mega-toggle,
.fs-header .fs-desktop-nav button,
.fs-header .fs-desktop-nav a {
    color: #ffffff !important;
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    font-family: 'DM Sans', sans-serif !important;
    font-size: 0.88rem !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: color 0.2s ease !important;
    opacity: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
}

.fs-desktop-nav a:hover,
.fs-desktop-nav button:hover,
.fs-desktop-nav .fs-mega-toggle:hover,
.fs-desktop-nav .fs-mega-toggle:focus,
.fs-desktop-nav .fs-mega-toggle.hover-active,
.fs-desktop-nav .fs-mega-toggle.active,
button.fs-mega-toggle:hover,
button.fs-mega-toggle:focus,
button.fs-mega-toggle.hover-active,
button.fs-mega-toggle.active,
.fs-header .fs-desktop-nav button:hover,
.fs-header .fs-desktop-nav button:focus,
.fs-header .fs-desktop-nav button.hover-active,
.fs-header .fs-desktop-nav a:hover,
.fs-header .fs-desktop-nav a:focus,
.fs-header .fs-desktop-nav a.active {
    color: #e6c888 !important;
    background: transparent !important;
    background-color: transparent !important;
    opacity: 1 !important;
}

.fs-desktop-nav .fs-mega-toggle::after,
button.fs-mega-toggle::after,
.fs-header .fs-desktop-nav button::after {
    content: ' ▼' !important;
    font-size: 0.6rem !important;
    margin-left: 0.4rem !important;
    color: #ffffff !important;
    transition: color 0.2s ease, transform 0.2s ease !important;
    display: inline-block !important;
}

.fs-desktop-nav .fs-mega-toggle:hover::after,
.fs-desktop-nav .fs-mega-toggle:focus::after,
.fs-desktop-nav .fs-mega-toggle.hover-active::after,
.fs-desktop-nav .fs-mega-toggle.active::after,
button.fs-mega-toggle:hover::after,
button.fs-mega-toggle:focus::after,
button.fs-mega-toggle.hover-active::after,
button.fs-mega-toggle.active::after,
.fs-header .fs-desktop-nav button:hover::after,
.fs-header .fs-desktop-nav button:focus::after,
.fs-header .fs-desktop-nav button.hover-active::after {
    color: #e6c888 !important;
}
"""

# 1. Fix css/styles.css
with open(r'css\styles.css', 'r', encoding='utf-8') as f:
    c = f.read()

c = c.replace(
    'button:not(.btn-fill-animation):not(.footer-accordion-toggle):hover {',
    'button:not(.btn-fill-animation):not(.footer-accordion-toggle):not(.fs-mega-toggle):not(.slider-btn):hover {'
)
c += "\n" + css_exact_rule

with open(r'css\styles.css', 'w', encoding='utf-8') as f:
    f.write(c)
print("Updated css/styles.css")

# 2. Fix css/design-system.css
with open(r'css\design-system.css', 'r', encoding='utf-8') as f:
    c = f.read()
c += "\n" + css_exact_rule
with open(r'css\design-system.css', 'w', encoding='utf-8') as f:
    f.write(c)
print("Updated css/design-system.css")

# 3. Fix all HTML files
html_files = [f for f in os.listdir('.') if f.endswith('.html')]
for fname in html_files:
    with open(fname, 'r', encoding='utf-8') as f:
        content = f.read()

    # Replace in custom-menu-active-styles or inject in head
    if 'id="custom-menu-active-styles"' in content:
        content = re.sub(
            r'(<style id="custom-menu-active-styles">)',
            r'\1\n' + css_exact_rule + '\n',
            content
        )
    elif '<head>' in content:
        content = content.replace('</head>', f'<style>\n{css_exact_rule}\n</style>\n</head>', 1)

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

print(f"Updated exact nav hover rule across all {len(html_files)} HTML files!")