window.SectionAssumptions = () => {
  const { Section, Card, Tag, Bullet } = window.BITSUI;
  const { Check, Flame, Shield, File } = window.BITSIcons;

  const deps = [
    {
      cat: "From BITSAA / BITS IT",
      tone: "gold",
      items: [
        "AlmaConnect and Almabase data exports (even anonymized samples) for the migration pipeline — both sources needed by W5",
        "AMP team + chapter-lead roster (used to seed moderator roles in Admin Panel)",
        "Current alumni-base sizing confirmation (RFP cites 150–180k users, growing 8–10k/yr — we scale to 100K+ DAU headroom)",
        "Campus email domains across all campuses (Pilani, Goa, Hyderabad, Dubai) for student verification",
        "BITS brand assets — logos, colors, fonts (if not matching our proposed palette)",
        "Payment gateway preference confirmation (assumed: Razorpay)",
        "WhatsApp Business account ownership (created under BITSAA entity)",
        "App Store + Play Store developer accounts (created under BITSAA entity)",
        "Guest house inventory, pricing, booking rules",
        "Gate pass approval workflow — who approves, SLA, escalation",
        "Academic system / ERP integration scope (read-only vs read-write)",
        "BITSian Day 2026 date + venue (launch anchor event)",
        "6–8 UAT volunteers across stakeholder groups for W8–W9",
      ],
    },
    {
      cat: "Product assumptions",
      tone: "navy",
      items: [
        "English-only UI for MVP (Hindi localization in Phase 2)",
        "No Android tablet / iPad optimization at launch — mobile-first only",
        "No admin mobile app — admin web only",
        "Onboarding is voice + form only, never chat/conversational (reduces new-user friction, avoids dead-end chat loops)",
        "Voice interface is push-to-talk, not always-listening",
        "Notifications default to in-app + push; WhatsApp only for critical alerts (fee due, event day-of)",
        "Feed ranking is recency + affinity at launch; personalized ML ranking in Phase 2",
        "No AI 'why this post?' explainer on the feed — removed from scope",
        "Razorpay wiring completes during RFP-completion window (W10–W18), not a launch blocker for MVP",
      ],
    },
    {
      cat: "Commercial assumptions",
      tone: "muted",
      items: [
        "Cloud hosting billed at cost to BITSAA (AWS account owned by BITSAA)",
        "Third-party API costs (Claude, WhatsApp, SMS, Razorpay) billed at cost",
        "App store fees (Apple $99/yr + Google $25 one-time) reimbursed at cost",
        "Domain + SSL purchased under BITSAA account",
        "Source code handed over on launch; IP fully transferred to BITS/BITSAA",
        "Post-launch support contract separate (see Commercials)",
      ],
    },
  ];

  const risks = [
    {
      level: "High",
      title: "AlmaConnect + Almabase export delays",
      mitigation:
        "Start dummy-data pipeline in W1 with schemas mirroring both sources. Real exports integrate in W5–W7, merged + deduped in our migration pipeline. Fallback: users self-onboard and claim imported profiles as data arrives.",
    },
    {
      level: "High",
      title: "AI cost/latency overrun",
      mitigation:
        "Per-user daily budget + rate-limit. Sonnet for routing, Opus only for complex composition. Cost dashboard live from W2.",
    },
    {
      level: "Medium",
      title: "App store review rejection",
      mitigation:
        "Submit TestFlight in W8 (two weeks pre-launch). Apple reviewer account pre-warmed. Privacy nutrition label authored W7.",
    },
    {
      level: "Medium",
      title: "BITS IT integration scope creep",
      mitigation:
        "Scope locked W1 in architecture sign-off. Any new integration ask is a Phase 2 item, not MVP.",
    },
    {
      level: "Low",
      title: "Razorpay KYC delay",
      mitigation:
        "Deferred post-MVP by design. Fundraising + fee payment ships with stub UI; wired up W11+.",
    },
  ];

  const toneForRisk = {
    High: "bg-rose-50 text-rose-900 border-rose-200",
    Medium: "bg-amber-50 text-amber-900 border-amber-200",
    Low: "bg-emerald-50 text-emerald-900 border-emerald-200",
  };

  return (
    <Section
      id="assumptions"
      eyebrow="Assumptions & Dependencies"
      title={<>What we're assuming. What we need from you. What could bite.</>}
      kicker="A proposal without explicit assumptions is one that blows up in week four. Everything below is either a client-side dependency, a product choice we've already made (and are willing to revisit), or a risk we've already thought through."
    >
      <div className="grid lg:grid-cols-12 gap-6">
        {deps.map((d, i) => (
          <Card key={i} className="lg:col-span-4">
            <div className="flex items-center gap-2 mb-4">
              <Tag tone={d.tone}>{d.cat}</Tag>
            </div>
            <ul className="space-y-2">
              {d.items.map((it, j) => (
                <li
                  key={j}
                  className="flex items-start gap-2.5 text-[13px] text-bits-ink/85 leading-relaxed"
                >
                  <span className="mt-0.5 text-bits-goldDeep shrink-0">
                    <Check width="14" height="14" />
                  </span>
                  <span>{it}</span>
                </li>
              ))}
            </ul>
          </Card>
        ))}

        <Card className="lg:col-span-12">
          <div className="flex items-center justify-between mb-5">
            <div>
              <div className="text-[11px] font-semibold uppercase tracking-[0.18em] text-bits-goldDeep mb-1 flex items-center gap-2">
                <Flame width="14" height="14" /> Risk register
              </div>
              <h3 className="font-serif text-2xl text-bits-ink">
                What we're tracking from day one
              </h3>
            </div>
            <Tag tone="muted">Reviewed weekly in gate reviews</Tag>
          </div>
          <div className="grid md:grid-cols-2 gap-3">
            {risks.map((r, i) => (
              <div
                key={i}
                className="p-4 rounded-lg bg-white border border-bits-line/70"
              >
                <div className="flex items-center justify-between gap-2 mb-2">
                  <div className="font-semibold text-bits-ink text-[14px]">
                    {r.title}
                  </div>
                  <span
                    className={`px-2 py-0.5 rounded-full border text-[11px] font-semibold ${toneForRisk[r.level]}`}
                  >
                    {r.level}
                  </span>
                </div>
                <p className="text-[12.5px] text-bits-steel leading-relaxed">
                  <span className="text-bits-goldDeep font-semibold">
                    Mitigation:{" "}
                  </span>
                  {r.mitigation}
                </p>
              </div>
            ))}
          </div>
        </Card>

        <Card className="lg:col-span-12 bg-bits-cream">
          <div className="flex items-center gap-3 mb-3">
            <div className="w-9 h-9 rounded-lg bg-bits-gold/15 text-bits-goldDeep flex items-center justify-center">
              <Shield />
            </div>
            <h3 className="font-serif text-xl text-bits-ink">Data & IP handover</h3>
          </div>
          <ul className="space-y-1.5">
            <Bullet>Source code on private GitHub org, ownership transfers to BITSAA at launch</Bullet>
            <Bullet>Terraform state + AWS account owned by BITSAA from day one</Bullet>
            <Bullet>All user data stored in BITSAA-owned AWS regions</Bullet>
            <Bullet>We retain no production data post-engagement</Bullet>
            <Bullet>3-month warranty period for bug fixes post-launch</Bullet>
          </ul>
        </Card>
      </div>
    </Section>
  );
};