// Footer.jsx — подвал на тёмно-зелёном
function Footer({ onNav, newsHidden = true }) {
  const cols = [
    { h: "Миссия", links: ["О миссии", "Где мы служим"] },
    { h: "Участие", links: ["Служение", "Поддержать", "Контакты"] },
    { h: "Медиа", links: ["Медиа", "Подписка", "Новости"] },
  ].map((col) => ({
    ...col,
    links: col.links.filter((link) => !(newsHidden && link === "Новости")),
  }));
  return (
    <footer style={{ background: "var(--green-deep-2)", padding: "72px 40px 40px" }}>
      <div style={{ maxWidth: 1280, margin: "0 auto" }}>
        <div style={{ display: "grid", gridTemplateColumns: "1.4fr 1fr 1fr 1fr", gap: 48 }} className="kit-foot">
          <div>
            <Logo color="var(--cream)" markWidth={46} fontSize={16} />
            <p style={{ fontFamily: "var(--font-ui)", fontSize: 14.5, lineHeight: 1.6,
              color: "rgba(243,238,218,.7)", margin: "20px 0 0", maxWidth: 280 }}>
              Евангельская миссия в Северной Осетии. Возвещаем Христа и служим людям.
            </p>
          </div>
          {cols.map((c) => (
            <div key={c.h}>
              <h4 style={{ fontFamily: "var(--font-ui)", fontWeight: 600, fontSize: 13,
                letterSpacing: ".12em", textTransform: "uppercase", color: "var(--terracotta-bright)",
                margin: "0 0 18px" }}>{c.h}</h4>
              <div style={{ display: "flex", flexDirection: "column", gap: 12 }}>
                {c.links.map((l) => (
                  <button key={l} onClick={() => onNav(l)} style={{ background: "none", border: "none",
                    textAlign: "left", padding: 0, cursor: "pointer", fontFamily: "var(--font-ui)",
                    fontSize: 14.5, color: "rgba(243,238,218,.78)", transition: "color .2s" }}
                    onMouseEnter={(e) => e.currentTarget.style.color = "var(--cream)"}
                    onMouseLeave={(e) => e.currentTarget.style.color = "rgba(243,238,218,.78)"}>{l}</button>
                ))}
              </div>
            </div>
          ))}
        </div>
        <div style={{ borderTop: "1px solid rgba(243,238,218,.14)", marginTop: 56, paddingTop: 28,
          display: "flex", justifyContent: "space-between", alignItems: "center", flexWrap: "wrap", gap: 16 }}>
          <span style={{ fontFamily: "var(--font-ui)", fontSize: 13.5, color: "rgba(243,238,218,.55)" }}>
            © 2026 Местная религиозная организация «Северо-Осетинская миссия христианского милосердия» Российского Союза Евангельских Христиан-Баптистов. Все права защищены.
          </span>
        </div>
      </div>
    </footer>
  );
}

Object.assign(window, { Footer });