"""Parche idempotente: sustituye el CSS del index.html por una versión responsive.
Se ejecuta en el servidor dentro de ~/apps/quimica/.
"""
import re

CSS = """<style>
*{box-sizing:border-box}
body{background:#0b1721;color:white;font-family:Arial,sans-serif;margin:0;padding:24px 16px;-webkit-text-size-adjust:100%}
.container{max-width:900px;margin:auto}
h1{text-align:center;color:#facc15;font-size:1.6rem;word-break:break-word}
.card{background:#1e293b;padding:20px;margin:20px 0;border-radius:15px;border-left:5px solid #facc15}
.card h2{margin-top:0;font-size:1.15rem;word-break:break-word}
.card p{line-height:1.5;word-break:break-word}
.card ul{padding-left:20px;line-height:1.5}
.btn{display:inline-block;padding:12px 20px;background:#f59e0b;color:white;text-decoration:none;border-radius:10px;font-weight:bold}
.btn:hover{background:#d97706}
.proximamente{opacity:0.8}
@media (max-width:600px){
  body{padding:16px 10px}
  h1{font-size:1.3rem}
  .card{padding:15px;margin:14px 0}
  .btn{width:100%;text-align:center}
}
</style>"""


def main():
    p = "templates/index.html"
    with open(p, encoding="utf-8") as f:
        t = f.read()
    nuevo, n = re.subn(r"<style>.*?</style>", CSS, t, count=1, flags=re.S)
    if n == 0:
        print("no se encontró bloque <style>")
        return
    with open(p, "w", encoding="utf-8") as f:
        f.write(nuevo)
    print("CSS reemplazado. @media:", "@media" in nuevo,
          "| tarjeta:", "reacciones-quimicas" in nuevo)


if __name__ == "__main__":
    main()