root = Card([header, periodSection, kpiSection, signupsChart, planSplit, seatsUtil, featureAdoption, npsSection, topCustomers, atRisk, failedPayments, inviteSection])

header = CardHeader("Admin Overview", "Company performance at a glance")

periodSection = Card([periodLabel, periodButtons], "sunk")
periodLabel = TextContent("**Reporting period**", "small-heavy")
periodButtons = Buttons([period30, period90, periodYear])
period30 = Button("30 days", null, "secondary", "normal", "small")
period90 = Button("90 days", null, "primary", "normal", "small")
periodYear = Button("12 months", null, "secondary", "normal", "small")

kpiSection = Card([kpiHeading, kpiTable], "sunk")
kpiHeading = Heading("Key metrics", "h3")
kpiTable = Table([kpiMetric, kpiValue])
kpiMetric = Col("Metric", ["Monthly Recurring Revenue", "Annual Recurring Revenue", "Churn (this month)", "NPS"])
kpiValue = Col("Value", ["$84,200", "$1,010,400", "3.2%", "42"])

signupsChart = Card([signupsHeading, signupsLine], "sunk")
signupsHeading = Heading("New signups — last 90 days", "h3")
signupsLine = LineChart(["Jan", "Feb", "Mar"], [signupsSeries], "natural", "Month", "Signups")
signupsSeries = Series("Signups", [120, 168, 205])

planSplit = Card([planHeading, planPie], "sunk")
planHeading = Heading("Customers by plan", "h3")
planPie = PieChart(["Starter", "Growth", "Enterprise"], [340, 210, 74], "donut")

seatsUtil = Card([seatsHeading, seatsBar], "sunk")
seatsHeading = Heading("Seat utilization", "h3")
seatsBar = SingleStackedBarChart(["Used", "Available"], [620, 180])

featureAdoption = Card([featureHeading, featureBars], "sunk")
featureHeading = Heading("Adoption — newest features", "h3")
featureBars = BarChart(["AI Insights", "Workflows", "SSO"], [aiSeries, wfSeries, ssoSeries], "grouped", "Feature", "% of customers")
aiSeries = Series("AI Insights", [62])
wfSeries = Series("Workflows", [48])
ssoSeries = Series("SSO", [35])

npsSection = Card([npsHeading, npsProgress], "sunk")
npsHeading = Heading("Current NPS", "h3")
npsProgress = Progress(42, "42 / 100")

topCustomers = Card([topHeading, topTable], "sunk")
topHeading = Heading("Ten largest customers", "h3")
topTable = Table([custName, custSeats, custSpend])
custName = Col("Customer", ["Acme Corp", "Globex", "Initech", "Umbrella", "Stark Ind", "Wayne Ent", "Hooli", "Pied Piper", "Vandelay", "Cyberdyne"])
custSeats = Col("Seats", [120, 95, 80, 74, 60, 55, 48, 42, 38, 30])
custSpend = Col("Monthly spend", ["$12,000", "$9,500", "$8,000", "$7,400", "$6,000", "$5,500", "$4,800", "$4,200", "$3,800", "$3,000"])

atRisk = Card([atRiskHeading, atRiskList], "sunk")
atRiskHeading = Heading("Accounts at risk", "h3")
atRiskList = ListBlock([risk1, risk2, risk3, risk4])
risk1 = ListItem("Acme Corp", "No login in 30 days — champion left")
risk2 = ListItem("Globex", "Support ticket about billing overage")
risk3 = ListItem("Initech", "Renewal in 14 days, usage down 40%")
risk4 = ListItem("Umbrella", "Competitor discount offer seen in portal")

failedPayments = Card([fpHeading, fpTable, fpRetry], "sunk")
fpHeading = Heading("Failed payments", "h3")
fpTable = Table([fpCust, fpAmount, fpDate])
fpCust = Col("Customer", ["Stark Ind", "Hooli", "Cyberdyne"])
fpAmount = Col("Amount", ["$6,000", "$4,800", "$3,000"])
fpDate = Col("Due", ["Feb 12", "Feb 14", "Feb 15"])
fpRetry = Buttons([retry1, retry2, retry3])
retry1 = Button("Retry Stark Ind", null, "secondary", "normal", "small")
retry2 = Button("Retry Hooli", null, "secondary", "normal", "small")
retry3 = Button("Retry Cyberdyne", null, "secondary", "normal", "small")

inviteSection = Card([inviteHeading, inviteForm], "sunk")
inviteHeading = Heading("Invite an admin", "h3")
inviteForm = Form("invite-admin", inviteButtons, [inviteEmail])
inviteEmail = FormControl("Admin email", inviteInput, "They will get a secure invite link")
inviteInput = Input("email", "teammate@company.com", "email")
inviteButtons = Buttons([inviteSend])
inviteSend = Button("Send invite", null, "primary")