"""Rebuild the four new pages in META 2027's own visual language.

The first versions were technically compatible — right shell, right stylesheet — but they read
like documents, not like this site: a plain <table> for the dates, inline styles for the scam
warning, undifferentiated card pairs for six symposia. This pass rewrites the bodies using the
components the site already speaks (.tl timeline, .info-card, .alt-band, .btn, .cfp-status) plus
two small additions to meta27.css (.tba-panel, .sym-nav) rather than inline styling.

The shell comes from programme.html at its current state — which now carries the dropdown nav —
so the four pages inherit navigation, footer and scripts without any special-casing. Active state
is then set per page the same way gen_nav.py does it.
"""

import re

shell = open('programme.html', encoding='utf-8').read()


def page(slug, title, description, hero_class, kicker, h1, lead, body, active='programme.html'):
    out = shell
    out = re.sub(r'<title>.*?</title>', lambda m: '<title>%s</title>' % title, out, count=1, flags=re.S)
    for pat in [r'(<meta name="description" content=")[^"]*(")',
                r'(<meta property="og:description" content=")[^"]*(")',
                r'(<meta name="twitter:description" content=")[^"]*(")']:
        out = re.sub(pat, lambda m: m.group(1) + description + m.group(2), out, count=1)
    for pat in [r'(<meta property="og:title" content=")[^"]*(")',
                r'(<meta name="twitter:title" content=")[^"]*(")']:
        out = re.sub(pat, lambda m: m.group(1) + title + m.group(2), out, count=1)
    for pat in [r'(<link rel="canonical" href="https://metaconferences\.org/META27/)[^"]*(")',
                r'(<meta property="og:url" content="https://metaconferences\.org/META27/)[^"]*(")']:
        out = re.sub(pat, lambda m: m.group(1) + slug + m.group(2), out, count=1)

    hero = ('<header class="sub-hero %s">\n  <div class="wrap">\n'
            '    <p class="kicker">%s</p>\n    <h1>%s</h1>\n'
            '    <p class="lead">%s</p>\n  </div>\n</header>'
            % (hero_class, kicker, h1, lead))
    out = re.sub(r'<header class="sub-hero[^"]*">.*?</header>', lambda m: hero, out, count=1, flags=re.S)

    start = out.index('</header>') + len('</header>')
    end = out.index('<footer')
    out = out[:start] + '\n\n' + body + '\n\n' + out[end:]

    # active state: the shell says Program; recompute for pages living under another group
    if active != 'programme.html':
        out = out.replace('<a href="programme.html" class="active">Program',
                          '<a href="programme.html">Program')
        out = out.replace('<a href="%s">' % active, '<a href="%s" class="active">' % active, 1)
    open(slug, 'w', encoding='utf-8').write(out)
    print('%-22s %6d octets' % (slug, len(out)))


# ================================================================ dates.html
# The full calendar as the site's own timeline, then one card per deadline with what it
# actually means for an author — the notes a table cell had no room for.

DATES_TL = """      <div class="step"><span class="dot"></span><div class="st">Call for Papers</div><div class="sd">September 1, 2026</div></div>
      <div class="step next"><span class="dot"></span><div class="st">Abstract Deadline</div><div class="sd">February 12, 2027</div></div>
      <div class="step"><span class="dot"></span><div class="st">Acceptance Notification</div><div class="sd">February 19, 2027</div></div>
      <div class="step"><span class="dot"></span><div class="st">Early Registration</div><div class="sd">until April 23, 2027</div></div>
      <div class="step"><span class="dot"></span><div class="st">Advanced Registration</div><div class="sd">until June 5, 2027</div></div>
      <div class="step"><span class="dot"></span><div class="st">Full Papers</div><div class="sd">2June 5, 2027</div></div>
      <div class="step"><span class="dot"></span><div class="st">META 2027</div><div class="sd">July 13 &ndash; 16, 2027</div></div>"""

dates_body = """<section>
  <div class="wrap">
    <p class="kicker reveal">At a glance</p>
    <h2 class="sec reveal">The road to Niagara Falls</h2>
    <div class="tl reveal">
""" + DATES_TL + """
    </div>
  </div>
</section>

<section class="alt-band">
  <div class="wrap">
    <p class="kicker reveal">In detail</p>
    <h2 class="sec reveal">What each date means</h2>
    <div class="two-col grid-2x2" style="margin-top:44px">
      <div class="info-card reveal"><h3>September 1, 2026 &mdash; Call for Papers opens</h3>
        <p>Submissions open through the <a href="portal.html">Author & Submission Portal</a>. Two to four
        pages, using the official <a href="submit.html#templates">META 2027 template</a>.</p></div>
      <div class="info-card reveal"><h3>February 12, 2027 &mdash; Abstract submission deadline</h3>
        <p>23:00 CET. The portal stays open after this date for invited papers and late poster
        submissions, at the discretion of the Technical Program Committee.</p></div>
      <div class="info-card reveal"><h3>February 19, 2027 &mdash; Acceptance notification</h3>
        <p>Every submitting author is notified by email. Accepted contributions are presented in
        oral or poster format; the final presentation format is assigned by the Technical
        Program Committee and announced with the program.</p></div>
      <div class="info-card reveal"><h3>April 23, 2027 &mdash; Early bird registration deadline</h3>
        <p>23:00 CET. Last day for reduced registration rates.</p></div>
      <div class="info-card reveal"><h3>June 5, 2027 &mdash; Advanced registration deadline</h3>
        <p>Every <strong>presenting author</strong> must be registered by this date for their paper
        to appear in the program.</p></div>
      <div class="info-card reveal"><h3>2June 5, 2027 &mdash; Full-paper submission deadline</h3>
        <p>23:00 CET. Final versions of accepted papers, for the Scopus-indexed proceedings.</p></div>
    </div>
    <p class="reveal" style="margin-top:36px">Questions about a date &mdash;
      <a href="mailto:contact@metaconferences.org">contact@metaconferences.org</a>.</p>
  </div>
</section>

<section>
  <div class="wrap" style="text-align:center">
    <h2 class="sec reveal">July 13 &ndash; 16, 2027</h2>
    <p class="tlead reveal" style="margin:18px auto 0">Niagara Falls Convention Centre, Ontario, Canada.</p>
    <div class="hero-cta reveal">
      <a class="btn btn-gold" href="submit.html">Read the Call for Papers</a>
      <a class="btn btn-navy" href="attend.html">Plan your journey</a>
    </div>
  </div>
</section>"""

page('dates.html',
     'Important Dates — META 2027 · Niagara Falls, July 13–16, 2027',
     'Every META 2027 deadline: Call for Papers September 1, 2026, abstract deadline 12 February '
     '2027, acceptance notification February 19, 2027, conference July 13–16, 2027.',
     'hero-programme', 'Program', 'Important dates',
     'Seven dates carry the whole conference &mdash; from the opening of the call to the closing '
     'session beside the Falls.',
     dates_body)

# ================================================================ symposia.html
# Six symposia as the site's cards: a jump list up top, then one section per symposium with
# description, chairs and topics. Chairs read as people, topics as a compact two-column list.

import json
syms = json.load(open('symposia.json', encoding='utf-8'))
ROMAN = ['i', 'ii', 'iii', 'iv', 'v', 'vi']

jump = '\n'.join(
    '      <a class="sym-jump reveal" href="#sym-%s"><span class="sym-no">%s</span>%s</a>'
    % (ROMAN[i], ROMAN[i].upper(),
       re.sub(r'^Symposium [IVX]+:\s*', '', s['title']))
    for i, s in enumerate(syms))

blocks = []
for i, s in enumerate(syms):
    title = re.sub(r'^Symposium [IVX]+:\s*', '', s['title'])
    chairs_head = 'Symposium Chair' if len(s['chairs']) == 1 else 'Symposium Co-Chairs'
    chairs = '\n'.join(
        '            <li><strong>%s</strong><br><span class="muted">%s</span></li>' % (n, a)
        for n, a in s['chairs'])
    desc = '\n'.join('        <p>%s</p>' % d for d in s['desc'])
    topics = '\n'.join('          <li>%s</li>' % t for t in s['topics'])
    blocks.append("""<section%s id="sym-%s">
  <div class="wrap">
    <p class="kicker reveal">Symposium %s</p>
    <h2 class="sec reveal">%s</h2>
    <div class="reveal" style="max-width:860px;margin-top:22px">
%s
    </div>
    <div class="two-col" style="margin-top:36px">
      <div class="info-card reveal"><h3>%s</h3>
        <ul class="sym-chairs">
%s
        </ul>
      </div>
      <div class="info-card reveal"><h3>Topics</h3>
        <ul class="tlist" style="margin-top:6px">
%s
        </ul>
      </div>
    </div>
  </div>
</section>""" % (' class="alt-band"' if i % 2 else '', ROMAN[i], ROMAN[i].upper(), title,
                 desc, chairs_head, chairs, topics))

symposia_body = """<section>
  <div class="wrap">
    <p class="kicker reveal">Program</p>
    <h2 class="sec reveal">Six focused symposia</h2>
    <p class="tlead reveal" style="margin-top:22px">Each symposium is organized by its chairs
      around one front of the field and runs inside the main program.
      <strong>Invited speakers will be announced once confirmed.</strong></p>
    <div class="sym-nav">
%s
    </div>
  </div>
</section>

%s

<section class="alt-band">
  <div class="wrap" style="text-align:center">
    <h2 class="sec reveal">Bring a topic of your own</h2>
    <p class="tlead reveal" style="margin:18px auto 0">META also welcomes proposals for special
      sessions on emerging themes.</p>
    <div class="hero-cta reveal">
      <a class="btn btn-gold" href="special-sessions.html">Propose a Special Session</a>
    </div>
  </div>
</section>""" % (jump, '\n\n'.join(blocks))

page('symposia.html',
     'Special Symposia — META 2027 · Six Focused Symposia',
     'The six special symposia of META 2027: titles, chairs and topics. Invited speakers will be '
     'announced once confirmed.',
     'hero-programme', 'Program', 'Special symposia',
     'Six symposia, each curated by its chairs around one front of metamaterials and photonics.',
     symposia_body)

# ================================================================ tutorials.html

tutorials_body = """<section>
  <div class="wrap">
    <p class="kicker reveal">Program</p>
    <h2 class="sec reveal">Tutorials &mdash; to be announced</h2>
    <div class="tba-panel reveal">
      <p>META 2027 will offer <strong>technical tutorials</strong> led by experts from across the
      field, chosen for the breadth of the META community. The tutorial program will be
      published on this page once it is settled.</p>
      <p style="margin-top:14px">Tutorials are part of the technical program and are
      <strong>included in the conference registration</strong> at no additional cost.</p>
    </div>
    <div class="two-col grid-2x2" style="margin-top:44px">
      <div class="info-card reveal"><h3>Who they are for</h3>
        <p>Students and newcomers to the field, researchers and educators broadening their range,
        industry professionals after practical methods, and program officers following where the
        field is going.</p></div>
      <div class="info-card reveal"><h3>How they run</h3>
        <p>Focused sessions of one to two hours inside the conference program &mdash; no separate
        ticket, no separate venue.</p></div>
    </div>
  </div>
</section>

<section class="alt-band">
  <div class="wrap" style="text-align:center">
    <h2 class="sec reveal">Meanwhile</h2>
    <div class="hero-cta reveal">
      <a class="btn btn-gold" href="submit.html">Read the Call for Papers</a>
      <a class="btn btn-navy" href="dates.html">See the important dates</a>
    </div>
  </div>
</section>"""

page('tutorials.html',
     'Tutorials — META 2027 · To Be Announced',
     'META 2027 will offer technical tutorials, included in the conference registration. The '
     'tutorial program will be announced on this page.',
     'hero-programme', 'Program', 'Conference tutorials',
     'Expert-led tutorials inside the main program, included in your registration.',
     tutorials_body)

# ================================================================ accommodation.html

accommodation_body = """<section>
  <div class="wrap">
    <p class="kicker reveal">Attend</p>
    <h2 class="sec reveal">Accommodation &mdash; to be announced</h2>
    <div class="tba-panel reveal">
      <p>Hotel information and reserved room blocks for META 2027 will be published on this page.
      <strong>Nothing has been arranged yet</strong>, and no hotel is currently authorized to take
      bookings on behalf of the conference.</p>
    </div>
    <div class="info-card warn reveal" style="margin-top:44px">
      <h3>Important notice &mdash; beware of housing scams</h3>
      <p><strong>META has no official housing partners.</strong> Companies claiming to hold rooms
      for META delegates, or asking for payment to secure accommodation, are not acting for the
      conference. If you are contacted by one, write to
      <a href="mailto:contact@metaconferences.org">contact@metaconferences.org</a>.</p>
    </div>
  </div>
</section>

<section class="alt-band">
  <div class="wrap" style="text-align:center">
    <h2 class="sec reveal">Plan the rest of the journey</h2>
    <div class="hero-cta reveal">
      <a class="btn btn-gold" href="attend.html#venue">Venue &amp; travel</a>
      <a class="btn btn-navy" href="visa.html">Visa &amp; entry</a>
    </div>
  </div>
</section>"""

page('accommodation.html',
     'Accommodation — META 2027 · Niagara Falls, Canada',
     'Accommodation for META 2027 in Niagara Falls will be published here. META has no official '
     'housing partners — beware of housing scams.',
     'hero-about', 'Attend', 'Where to stay',
     'Hotel information for META 2027 will be published here as soon as it is arranged.',
     accommodation_body, active='attend.html')
