/* Bri Hershberger · The Glass Heart — Legal page */
const { useState, useEffect, useRef } = React;

const SECTIONS = [
  {
    id: "privacy",
    title: "Privacy Policy",
    content: [
      { heading: "Information We Collect", body: "When you contact us through the website form, book a discovery call, or subscribe to any communications, we collect the information you provide — including your name, email address, phone number, and message content. We do not collect any information automatically beyond standard hosting and analytics logs." },
      { heading: "How We Use Your Information", body: "Your information is used solely to respond to your inquiry, schedule and conduct coaching sessions, and send you updates you have opted into. We do not sell, rent, or share your personal information with third parties for marketing purposes." },
      { heading: "Third-Party Services", body: "This website may use third-party services such as scheduling software (e.g. Calendly or similar), payment processors, and email platforms. Each of these services operates under its own privacy policy. We only use reputable providers and encourage you to review their policies as well." },
      { heading: "Data Retention", body: "We retain contact information and session-related notes for as long as necessary to provide coaching services and comply with applicable legal requirements. You may request deletion of your personal data at any time by emailing us." },
      { heading: "Your Rights", body: "Depending on your location, you may have rights regarding your personal data, including the right to access, correct, or delete information we hold about you. To exercise any of these rights, contact us at Bri.theglassheart@gmail.com." },
      { heading: "Contact", body: "For any privacy-related questions, reach out at Bri.theglassheart@gmail.com or by phone at (574) 202-4753." },
    ],
  },
  {
    id: "terms",
    title: "Terms of Service",
    content: [
      { heading: "Coaching Relationship", body: "The Glass Heart offers life coaching services. Life coaching is not therapy, counseling, or mental health treatment. It is not a substitute for professional mental health care. If you are experiencing a mental health crisis, please contact a licensed therapist, counselor, or emergency services immediately." },
      { heading: "Client Responsibilities", body: "Coaching is a collaborative process. You are responsible for implementing the practices, insights, and decisions that arise from your coaching sessions. Results are not guaranteed — they depend on your engagement, consistency, and readiness to do the work." },
      { heading: "Confidentiality", body: "Everything shared in coaching sessions is held in strict confidence. Bri will not disclose your personal information or session content to third parties without your written consent, except where required by law (e.g., imminent risk of harm to yourself or others)." },
      { heading: "Cancellation Policy", body: "Please provide at least 24 hours' notice to cancel or reschedule a session. Late cancellations or no-shows may be subject to a cancellation fee as outlined in your coaching agreement. Discovery calls may be cancelled at any time without penalty." },
      { heading: "Intellectual Property", body: "All content on this website — including copy, frameworks, audio sessions, and downloadable materials — is the intellectual property of Bri Hershberger / The Glass Heart. You may not reproduce, distribute, or sell any content without written permission." },
      { heading: "Limitation of Liability", body: "The Glass Heart is not liable for any indirect, incidental, or consequential damages arising from coaching services or use of this website. Our total liability in any matter is limited to the amount paid for the specific service in question." },
    ],
  },
  {
    id: "disclaimer",
    title: "Disclaimer",
    content: [
      { heading: "Not Therapy", body: "The Glass Heart offers life coaching — not therapy, counseling, psychology, or any licensed mental health service. Bri Hershberger is a life coach in training, not a licensed mental health professional. Sessions are not a substitute for professional mental health treatment." },
      { heading: "Faith-Informed, Not Prescriptive", body: "The Glass Heart Approach is faith-informed. Sessions may include Scripture references, prayer, and inviting God into core memories. This is offered as a tool within the coaching relationship — not as a prescription, a doctrinal statement, or a requirement for participation." },
      { heading: "Results", body: "Testimonials and examples on this website reflect individual experiences and are not a guarantee of results. Outcomes vary based on individual effort, consistency, life circumstances, and readiness for growth." },
      { heading: "External Links", body: "This website may contain links to external resources. We are not responsible for the content or privacy practices of third-party sites. Links are provided for informational purposes only." },
    ],
  },
  {
    id: "refund",
    title: "Refund Policy",
    content: [
      { heading: "Discovery Calls", body: "Free discovery calls may be cancelled at any time with no charge. There is no refund applicable to a no-cost session." },
      { heading: "Coaching Programs", body: "Due to the personal and time-intensive nature of 1:1 coaching, all program payments are non-refundable once sessions have begun. If you need to withdraw before your first session, please contact us within 48 hours of payment for a full refund." },
      { heading: "Self-Paced Programs", body: "Because digital programs (such as Uproot + Thrive) provide immediate access to all content, all sales are final. If you experience a technical issue preventing access, contact us and we will resolve it promptly." },
      { heading: "Exceptions", body: "We understand that life happens. If extraordinary circumstances arise, please reach out directly at Bri.theglassheart@gmail.com. We handle each situation with compassion and care." },
    ],
  },
  {
    id: "contact",
    title: "Contact",
    content: [
      { heading: "Get in Touch", body: "For any legal, privacy, or service-related questions, you may reach us at:" },
      { heading: "Email", body: "Bri.theglassheart@gmail.com" },
      { heading: "Phone", body: "(574) 202-4753" },
      { heading: "Instagram", body: "@t.h.e.g.l.a.s.s.h.e.a.r.t" },
      { heading: "Response Time", body: "We aim to respond to all inquiries within 2–3 business days. Thank you for your patience." },
    ],
  },
];

function SideNav({ active, setActive }) {
  return (
    <nav style={{ position: "sticky", top: 120 }}>
      <div className="smallcaps" style={{ color: "var(--terracotta)", marginBottom: 20 }}>✦ Legal documents</div>
      <ul style={{ listStyle: "none", display: "flex", flexDirection: "column", gap: 0 }}>
        {SECTIONS.map((s) => (
          <li key={s.id}>
            <button
              onClick={() => {
                setActive(s.id);
                document.getElementById(s.id)?.scrollIntoView({ behavior: "smooth", block: "start" });
              }}
              style={{
                display: "block", width: "100%", textAlign: "left",
                padding: "14px 0", background: "transparent", border: "none",
                borderBottom: "1px solid var(--rule)", cursor: "pointer",
                fontFamily: "'Space Grotesk', sans-serif", fontSize: 15, fontWeight: 500,
                color: active === s.id ? "var(--walnut)" : "var(--walnut-soft)",
                borderLeft: active === s.id ? "2px solid var(--terracotta)" : "2px solid transparent",
                paddingLeft: active === s.id ? 12 : 0, transition: "all 0.2s",
              }}
            >
              {s.title}
            </button>
          </li>
        ))}
      </ul>
      <div style={{ marginTop: 32, padding: "20px 22px", background: "var(--cream-2)", borderLeft: "2px solid var(--terracotta)" }}>
        <p style={{ fontSize: 14, lineHeight: 1.6, color: "var(--walnut-soft)" }}>
          Questions? Email us at{" "}
          <a href="mailto:Bri.theglassheart@gmail.com" style={{ color: "var(--terracotta)" }}>
            Bri.theglassheart@gmail.com
          </a>
        </p>
      </div>
    </nav>
  );
}

function LegalContent({ active, setActive }) {
  const sectionRefs = useRef({});

  useEffect(() => {
    const observer = new IntersectionObserver(
      (entries) => {
        entries.forEach((e) => {
          if (e.isIntersecting) setActive(e.target.id);
        });
      },
      { rootMargin: "-30% 0px -60% 0px" }
    );
    SECTIONS.forEach((s) => {
      const el = document.getElementById(s.id);
      if (el) observer.observe(el);
    });
    return () => observer.disconnect();
  }, []);

  return (
    <div style={{ display: "flex", flexDirection: "column", gap: 80 }}>
      {SECTIONS.map((s) => (
        <article key={s.id} id={s.id} ref={(el) => (sectionRefs.current[s.id] = el)}>
          <h2 className="display" style={{ fontSize: "clamp(28px, 3.4vw, 46px)", fontWeight: 500, color: "var(--walnut)", lineHeight: 1.05, marginBottom: 32, paddingBottom: 20, borderBottom: "1px solid var(--rule-strong)" }}>
            {s.title}
          </h2>
          <div style={{ display: "flex", flexDirection: "column", gap: 28 }}>
            {s.content.map((block, i) => (
              <div key={i}>
                <h3 className="grotesk" style={{ fontSize: 15, fontWeight: 600, letterSpacing: "0.06em", textTransform: "uppercase", color: "var(--walnut)", marginBottom: 10 }}>
                  {block.heading}
                </h3>
                <p style={{ fontSize: 16.5, lineHeight: 1.7, color: "var(--walnut-soft)" }}>{block.body}</p>
              </div>
            ))}
          </div>
        </article>
      ))}

      <div style={{ padding: "28px 32px", background: "var(--cream-2)", borderLeft: "2px solid var(--terracotta)" }}>
        <p className="smallcaps" style={{ color: "var(--terracotta)", marginBottom: 10 }}>Last updated: June 2026</p>
        <p style={{ fontSize: 15.5, lineHeight: 1.65, color: "var(--walnut-soft)" }}>
          These policies apply to all services offered by Bri Hershberger / The Glass Heart. By engaging with this website or booking a session, you acknowledge that you have read and understood these terms. We reserve the right to update these policies at any time, with changes effective upon posting.
        </p>
      </div>
    </div>
  );
}

function App() {
  const [active, setActive] = useState("privacy");

  return (
    <>
      <Nav current="legal" />
      <main>
        <PageHero
          eyebrow="Legal"
          title="Transparency"
          italic="in every detail."
          subtitle="Everything you need to know about how we handle your information, what our coaching relationship includes, and your rights as a client."
          verse="In the beginning was the Word — and the Word was truth."
          verseRef="John 1:1"
        />
        <section className="section" style={{ background: "var(--cream)" }}>
          <div className="container">
            <div style={{ display: "grid", gridTemplateColumns: "260px 1fr", gap: 80, alignItems: "start" }}>
              <SideNav active={active} setActive={setActive} />
              <LegalContent active={active} setActive={setActive} />
            </div>
          </div>
        </section>
      </main>
      <Footer />
      <PaletteTweaksPanel />
    </>
  );
}

ReactDOM.createRoot(document.getElementById("root")).render(<App />);