{{--
    The plan form, shared by Add and Edit so the two cannot drift apart.

    $prefix  unique id prefix, so Add and Edit can both exist on the page
    $plan    null when adding
    $isEdit  true for the shared Edit modal, which starts empty and is filled
             from the row that was clicked. Its checkboxes must NOT carry Add's
             defaults: an unticked box that JavaScript then ticks is recoverable,
             but a box that starts ticked and is never corrected silently puts a
             retired plan back on sale.
--}}
@php
    $p      = $plan ?? null;
    $isEdit = $isEdit ?? false;
@endphp

<div class="row">
    <div class="col-md-6">
        <div class="form-group">
            <label class="control-label">Plan Name<span style="color: red">*</span></label>
            <input type="text" maxlength="120" name="name" class="form-control" required
                   id="{{ $prefix }}_name" placeholder="e.g. Professional"
                   value="{{ old('name', $p->name ?? '') }}">
        </div>
    </div>
    <div class="col-md-3">
        <div class="form-group">
            <label class="control-label">Price / month<span style="color: red">*</span></label>
            <input type="number" step="0.01" min="0.5" name="price" class="form-control" required
                   id="{{ $prefix }}_price" placeholder="149.00"
                   value="{{ old('price', $p->price ?? '') }}">
        </div>
    </div>
    <div class="col-md-3">
        <div class="form-group">
            <label class="control-label">Projects / month<span style="color: red">*</span></label>
            <input type="number" min="0" name="project_limit" class="form-control" required
                   id="{{ $prefix }}_project_limit" placeholder="20"
                   value="{{ old('project_limit', $p->project_limit ?? '') }}">
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-6">
        <div class="form-group">
            <label class="control-label">Tagline</label>
            <input type="text" maxlength="191" name="tagline" class="form-control"
                   id="{{ $prefix }}_tagline" placeholder="One line under the plan name"
                   value="{{ old('tagline', $p->tagline ?? '') }}">
        </div>
    </div>
    <div class="col-md-3">
        <div class="form-group">
            <label class="control-label">Badge</label>
            <input type="text" maxlength="64" name="badge" class="form-control"
                   id="{{ $prefix }}_badge" placeholder="Most Popular"
                   value="{{ old('badge', $p->badge ?? '') }}">
        </div>
    </div>
    <div class="col-md-3">
        <div class="form-group">
            <label class="control-label">Was price</label>
            <input type="number" step="0.01" min="0" name="compare_at_price" class="form-control"
                   id="{{ $prefix }}_compare_at_price" placeholder="shown struck through"
                   value="{{ old('compare_at_price', $p->compare_at_price ?? '') }}">
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-6">
        <div class="form-group">
            <label class="control-label">Button Text</label>
            <input type="text" maxlength="64" name="cta_label" class="form-control"
                   id="{{ $prefix }}_cta_label" placeholder="Select Professional"
                   value="{{ old('cta_label', $p->cta_label ?? '') }}">
        </div>
    </div>
    <div class="col-md-3">
        <div class="form-group">
            <label class="control-label">Display Order<span style="color: red">*</span></label>
            <input type="number" min="0" max="9999" name="sort_order" class="form-control" required
                   id="{{ $prefix }}_sort_order"
                   value="{{ old('sort_order', $p->sort_order ?? 10) }}">
        </div>
    </div>
    <div class="col-md-3">
        <div class="form-group">
            <label class="control-label">Options</label>
            <div class="checkbox" style="margin-top:0;">
                <label>
                    <input type="checkbox" name="is_active" value="1" id="{{ $prefix }}_is_active"
                           {{ ! $isEdit && old('is_active', $p->is_active ?? 1) ? 'checked' : '' }}>
                    On sale
                </label>
            </div>
            <div class="checkbox" style="margin-top:0;">
                <label>
                    <input type="checkbox" name="is_featured" value="1" id="{{ $prefix }}_is_featured"
                           {{ ! $isEdit && old('is_featured', $p->is_featured ?? 0) ? 'checked' : '' }}>
                    Highlight this plan
                </label>
            </div>
            <div class="checkbox" style="margin-top:0;">
                <label>
                    <input type="checkbox" name="is_unlimited" value="1" id="{{ $prefix }}_is_unlimited"
                           {{ ! $isEdit && old('is_unlimited', $p->is_unlimited ?? 0) ? 'checked' : '' }}>
                    Unlimited projects
                </label>
            </div>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-12">
        <div class="form-group">
            <label class="control-label">Features &mdash; one per line</label>
            <textarea name="features" rows="5" class="form-control" id="{{ $prefix }}_features"
                      placeholder="20 projects a month :: Unused projects roll over.">{{ old('features', $p->features_text ?? '') }}</textarea>
            <p class="help-block">
                Anything after <code>::</code> becomes the explanation shown behind the expander on the
                plan picker.
            </p>
        </div>
    </div>
</div>