Billing cycle and payment due date displayed before commitment

The FTC Click-to-Cancel rule (effective 2024) requires that subscription terms — billing cycle, first charge date, renewal schedule — be disclosed clearly before the user submits payment. Reg Z (TILA) 12 CFR 1026.6(b) extends this requirement to open-end credit plans by mandating periodic payment disclosures. A checkout screen that shows only "$9.99/month" without specifying when the first charge fires or when it renews is not a billing disclosure — it is a price tag. Users who discover unexpected timing (e.g., charged immediately on free-trial signup) dispute the charge, generating chargebacks and triggering payment processor scrutiny.

Render all three required billing details on the checkout page — frequency, first charge timing, and renewal date — before the user submits payment. In app/checkout/page.tsx:

// app/checkout/page.tsx
<div className="billing-disclosure">
  <strong>Billing Summary</strong>
  <ul>
    <li>Plan: Premium — $9.99/month</li>
    <li>First charge: Today upon confirmation</li>
    <li>Renewal: Monthly on the same calendar date</li>
    <li>Cancel anytime — no early termination fee</li>
  </ul>
</div>

Place this block above the payment form's submit button, not below it. For annual plans, also show the per-month equivalent and the exact annual charge amount.

• ID: billing-terms

• Severity: high

• What to look for: Count all subscription or recurring billing products in the project. For each, check the checkout flow and product pages for disclosure of at least 3 billing details: (1) billing cycle frequency (monthly, quarterly, annual), (2) when the first charge occurs, and (3) when subsequent charges renew.

• Pass criteria: For each recurring product, at least 3 of the following billing details are clearly displayed before the user submits payment: billing cycle, first charge date, renewal date, and cancellation terms. The information appears on the checkout page or pricing page, not solely in the terms document. Report even on pass: "Found X of 3 required billing details for Y recurring products."

• Fail criteria: Fewer than 3 billing details are disclosed before commitment, or billing details only appear in fine print or the terms document, or any recurring product lacks a billing summary entirely.

• Do NOT pass when: The checkout page shows only a dollar amount (e.g., "$9.99/month") without specifying when the first charge occurs or when it renews — a bare price tag is not a billing disclosure.

• Skip (N/A) when: The project has no recurring billing or subscription products.

• Detail on fail: Specify which billing details are missing. Quote the checkout page file path. Example: "Checkout page (app/checkout/page.tsx) shows monthly price ($9.99) but does not say when the first charge occurs or when monthly charges renew. Payment due date only appears in the Terms & Conditions."

• Remediation: Add billing details to your checkout page in app/checkout/page.tsx or equivalent:

  // app/checkout/page.tsx
  <div className="billing-disclosure">
    <p>
      <strong>Billing Summary</strong><br />
      Plan: Premium ($9.99/month)<br />
      First charge: Today<br />
      Renewal: Monthly on the same date<br />
      Cancel anytime — no early termination fee
    </p>
  </div>