import os
import re

css_vine = """
/* ============================================================
   REUSABLE DESIGN PATTERN: vine-corner-watermark
   ============================================================ */
.has-vine-watermark {
    position: relative !important;
    overflow: hidden !important;
}

.vine-corner-watermark {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    width: clamp(260px, 32vw, 520px) !important;
    height: auto !important;
    max-height: 95% !important;
    object-fit: contain !important;
    object-position: top right !important;
    pointer-events: none !important;
    opacity: 0.65 !important;
    z-index: 1 !important;
    user-select: none !important;
}
"""

# Update CSS files
for css_f in [r'css\styles.css', r'css\design-system.css']:
    if os.path.exists(css_f):
        with open(css_f, 'r', encoding='utf-8') as f:
            c = f.read()
        c = re.sub(r'/\* =+ REUSABLE DESIGN PATTERN: vine-corner-watermark =+ \*/.*?(?=(/\* =+|$))', '', c, flags=re.DOTALL)
        c += "\n" + css_vine
        with open(css_f, 'w', encoding='utf-8') as f:
            f.write(c)

# 1. Update index.html
with open('index.html', 'r', encoding='utf-8') as f:
    c = f.read()

# Replace news section markup to use <img> tag
c = re.sub(
    r'<section id="news-section"[^>]*>.*?(?=<div style="max-width: 1320px)',
    '<section id="news-section" class="has-vine-watermark" style="position: relative; padding: clamp(2rem, 4vw, 3.5rem) 0; background-color: #F5F3EC; color: #1c1917; box-sizing: border-box; overflow: hidden;">\n            <img src="assets/images/shapes/vine-corner-watermark.png" class="vine-corner-watermark" alt="" aria-hidden="true">\n            ',
    c,
    count=1,
    flags=re.DOTALL
)

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

# 2. Update news.html
if os.path.exists('news.html'):
    with open('news.html', 'r', encoding='utf-8') as f:
        c = f.read()
    c = re.sub(
        r'<div class="vine-corner-watermark"[^>]*></div>',
        '<img src="assets/images/shapes/vine-corner-watermark.png" class="vine-corner-watermark" alt="" aria-hidden="true">',
        c
    )
    with open('news.html', 'w', encoding='utf-8') as f:
        f.write(c)

# 3. Update publications.html
if os.path.exists('publications.html'):
    with open('publications.html', 'r', encoding='utf-8') as f:
        c = f.read()
    c = re.sub(
        r'<div class="vine-corner-watermark"[^>]*></div>',
        '<img src="assets/images/shapes/vine-corner-watermark.png" class="vine-corner-watermark" alt="" aria-hidden="true">',
        c
    )
    with open('publications.html', 'w', encoding='utf-8') as f:
        f.write(c)

print("Updated vine-corner-watermark as high-visibility <img> elements with z-index positioning!")