<h1>Edit Plan</h1>

<% if (forbidden) { %>
  <div class="alert alert-danger">Your role does not have permission to edit plans.</div>
<% } else if (!plan) { %>
  <div class="alert alert-danger">Plan not found.</div>
<% } else { %>

<% if (error) { %><div class="alert alert-danger"><%= error %></div><% } %>

<div class="card" style="max-width:480px">
  <p style="color:var(--muted);font-size:12px;margin-top:0">Code <code class="mono"><%= plan.code %></code> (not editable — retire this plan and create a new one to change it)</p>
  <form method="post" action="/billing/plans/<%= plan.id %>/edit">
    <label>Name</label>
    <input type="text" name="name" value="<%= plan.name %>" required>
    <label>Short Description (one line, shown in plan pickers)</label>
    <input type="text" name="description" value="<%= plan.description || '' %>" maxlength="500">
    <label>Detailed Description (for a pricing/storefront page)</label>
    <textarea name="detailedDescription" rows="6"><%= plan.detailed_description || '' %></textarea>
    <div style="display:flex;gap:12px">
      <div style="flex:1"><label>Price</label><input type="number" step="0.01" name="priceAmount" value="<%= plan.price_amount %>" required></div>
      <div style="flex:1"><label>Currency</label><input type="text" name="priceCurrency" value="<%= plan.price_currency %>" maxlength="3"></div>
    </div>
    <label>Billing Interval</label>
    <select name="billingInterval">
      <option value="monthly" <%= plan.billing_interval === 'monthly' ? 'selected' : '' %>>Monthly</option>
      <option value="annual" <%= plan.billing_interval === 'annual' ? 'selected' : '' %>>Annual</option>
    </select>
    <div style="display:flex;gap:12px">
      <div style="flex:1"><label>Seat Limit (blank = unlimited)</label><input type="number" name="seatLimit" value="<%= plan.seat_limit || '' %>"></div>
      <div style="flex:1"><label>Storage GB (blank = unlimited)</label><input type="number" name="storageLimitGb" value="<%= plan.storage_limit_gb || '' %>"></div>
    </div>
    <div style="display:flex;gap:12px;margin-top:16px">
      <button class="btn" type="submit" style="flex:1">Save Changes</button>
      <a href="/billing/plans" class="btn" style="flex:1;text-align:center;background:#2a2e38">Cancel</a>
    </div>
  </form>
</div>

<% } %>
