{{--
    The campaign editor. $c campaign (or a copy), $mode advertiser|house, $locked (paid: budget, pricing and start are fixed),
    $action, $submit (button label), $rates, $countries, $regions, $copyOf (optional).
--}}
@php
    $old = fn (string $k, $d = null) => old($k, $d);
    $type = $old('media_type', $c->media_type ?: 'image');
    $placements = (array) $old('placements', $c->placements ?? ['results']);
    $cats = (array) $old('categories', $c->categories ?? []);
    $placeKeys = (array) $old('places', $c->places ?? []);
    $pricing = $old('pricing', $c->pricing === 'cpc' ? 'cpc' : 'cpm');
    $budget = $old('budget', $c->budget_cents ? $c->budget_cents / 100 : 100);
@endphp
<div class="editor">
    <form class="card form" method="post" action="{{ $action }}" enctype="multipart/form-data" id="sp-form" novalidate
          data-cpm="{{ $rates['cpm_cents'] }}" data-cpc="{{ $rates['cpc_cents'] }}" data-min="{{ $rates['min_budget_cents'] }}" data-mode="{{ $mode }}" data-locked="{{ $locked ? 1 : 0 }}">
        @csrf
        @include('partials.errors')
        @if (! empty($copyOf))<input type="hidden" name="copy_of" value="{{ $copyOf->id }}">@endif

        <div class="eyebrow">1 · The placement</div>
        <div class="two">
            <div class="field"><label for="e-name">Campaign name <span class="muted">(only you see this)</span></label><input id="e-name" name="name" value="{{ $old('name', $c->name) }}" maxlength="120" required placeholder="e.g. Fall open house"></div>
            <div class="field"><label for="e-adv">Advertiser name <span class="muted">(shown)</span></label><input id="e-adv" name="advertiser_name" value="{{ $old('advertiser_name', $c->advertiser_name) }}" maxlength="80" required></div>
        </div>
        <fieldset class="field">
            <legend>Media</legend>
            <div class="seg">
                @foreach (['image' => 'JPG PNG WebP GIF', 'video' => 'MP4 WebM', 'video_url' => 'YouTube Vimeo Wistia Loom', 'text' => 'No media'] as $k => $hint)
                    <label><input type="radio" name="media_type" value="{{ $k }}" @checked($type === $k)> {{ \App\Models\Campaign::MEDIA[$k] }}<small>{{ $hint }}</small></label>
                @endforeach
            </div>
        </fieldset>
        <div class="field" data-for-type="image" @if ($type !== 'image') hidden @endif>
            <label for="e-img">Image or GIF <span class="muted">(16:9, 1280 × 720 is ideal; 5 MB max)</span></label>
            <input id="e-img" type="file" name="image_file" accept="image/jpeg,image/png,image/webp,image/gif">
            @if ($c->media_type === 'image' && $c->media_path)<span class="hint">Leave empty to keep the current image.</span>@endif
        </div>
        <div class="field" data-for-type="video" @if ($type !== 'video') hidden @endif>
            <label for="e-vid">Video file <span class="muted">(MP4 or WebM, 50 MB max; plays muted, with controls)</span></label>
            <input id="e-vid" type="file" name="video_file" accept="video/mp4,video/webm">
            @if ($c->media_type === 'video' && $c->media_path)<span class="hint">Leave empty to keep the current video.</span>@endif
        </div>
        <div class="field" data-for-type="video_url" @if ($type !== 'video_url') hidden @endif>
            <label for="e-vurl">Video link</label>
            <input id="e-vurl" type="url" name="video_url" value="{{ $old('video_url', $c->video_url) }}" maxlength="500" placeholder="https://www.youtube.com/watch?v=…">
            <span class="hint">Public or unlisted. The player loads only when a visitor presses play, so nothing from the video site loads before that. Plays count as clicks.</span>
        </div>
        <div class="field"><label for="e-head">Headline</label><input id="e-head" name="headline" value="{{ $old('headline', $c->headline) }}" maxlength="90" required></div>
        <div class="field"><label for="e-body">Supporting text <span class="muted">(optional)</span></label><input id="e-body" name="body" value="{{ $old('body', $c->body) }}" maxlength="140"></div>
        <div class="two">
            <div class="field"><label for="e-cta">Button label</label><input id="e-cta" name="cta" value="{{ $old('cta', $c->cta ?: 'Learn more') }}" maxlength="24" required></div>
            <div class="field"><label for="e-url">Destination (https://)</label><input id="e-url" name="destination_url" type="url" value="{{ $old('destination_url', $c->destination_url) }}" maxlength="500" required placeholder="https://www.example.org/nurses"></div>
        </div>

        <div class="eyebrow">2 · Who sees it</div>
        <fieldset class="field">
            <legend>Show on</legend>
            <div class="checkgrid">
                @foreach (\App\Models\Campaign::PLACEMENTS as $k => $label)
                    <label><input type="checkbox" name="placements[]" value="{{ $k }}" @checked(in_array($k, $placements, true))> {{ $label }}</label>
                @endforeach
            </div>
            <span class="hint">Recruiting and job ads are never shown on job pages.</span>
        </fieldset>
        <fieldset class="field">
            <legend>Job categories <span class="muted">(none = all)</span></legend>
            <div class="checkgrid">
                @foreach (config('board.categories') as $cat)
                    <label><input type="checkbox" name="categories[]" value="{{ $cat }}" @checked(in_array($cat, $cats, true))> {{ $cat }}</label>
                @endforeach
            </div>
        </fieldset>
        <fieldset class="field">
            <legend>Countries and states <span class="muted">(none = everywhere)</span></legend>
            <div class="place-list" id="place-list">
                @forelse ($placeKeys as $key)
                    @php $p = \App\Models\AlertLocation::parseKey((string) $key); @endphp
                    @if ($p && ! $p['is_remote'])<label class="place-chip"><input type="checkbox" name="places[]" value="{{ $key }}" checked> {{ (new \App\Models\AlertLocation($p))->label() }}</label>@endif
                @empty
                    <span class="hint" id="place-empty">Everywhere.</span>
                @endforelse
            </div>
            <div class="add-place">
                <select id="np-country" name="new_country" aria-label="Country">
                    <option value="">Country…</option>
                    @foreach ($countries as $code => $name)<option value="{{ $code }}">{{ $name }}</option>@endforeach
                </select>
                <select id="np-region" name="new_region" aria-label="State or region" data-regions='@json($regions)'>
                    <option value="">Anywhere in the country</option>
                    @foreach ($regions as $cc => $list)
                        <optgroup label="{{ \App\Support\Places::countryName($cc) }}">@foreach ($list as $rc => $rn)<option value="{{ $cc }}:{{ $rc }}">{{ $rn }}</option>@endforeach</optgroup>
                    @endforeach
                </select>
                <button class="btn sm" type="button" id="np-add" hidden>Add</button>
            </div>
        </fieldset>

        <div class="eyebrow">3 · {{ $mode === 'house' ? 'Schedule and delivery' : 'Budget and schedule' }}</div>
        @if ($mode === 'advertiser')
            @if ($locked)
                <p class="small">Budget {{ \App\Models\Campaign::money($c->budget_cents) }}, {{ $c->rateLabel() }}. The budget and start date are fixed once paid; to spend more, run it again as a new campaign.</p>
            @else
                <div class="seg two-col">
                    <label><input type="radio" name="pricing" value="cpm" @checked($pricing === 'cpm')> Pay per 1,000 views<small>{{ \App\Models\Campaign::money($rates['cpm_cents']) }} per 1,000 views</small></label>
                    <label><input type="radio" name="pricing" value="cpc" @checked($pricing === 'cpc')> Pay per click<small>{{ \App\Models\Campaign::money($rates['cpc_cents']) }} per click</small></label>
                </div>
                <div class="field"><label for="e-budget">Total budget (US$, {{ \App\Models\Campaign::money($rates['min_budget_cents']) }} minimum)</label>
                    <input id="e-budget" name="budget" type="number" min="{{ $rates['min_budget_cents'] / 100 }}" step="1" value="{{ $budget }}" required><span class="hint" id="e-est"></span></div>
            @endif
        @endif
        <div class="two">
            <div class="field"><label for="e-start">Start</label>
                @if ($locked)<input id="e-start" type="date" value="{{ $c->starts_on?->format('Y-m-d') }}" disabled>@else<input id="e-start" name="starts_on" type="date" value="{{ $old('starts_on', $c->starts_on?->format('Y-m-d')) }}" required>@endif</div>
            <div class="field"><label for="e-end">End <span class="muted">(last day)</span></label><input id="e-end" name="ends_on" type="date" value="{{ $old('ends_on', $c->ends_on?->format('Y-m-d')) }}" required></div>
        </div>
        @if ($mode === 'house')
            <div class="two">
                <div class="field"><label for="e-weight">Weight (1–10)</label><input id="e-weight" name="weight" type="number" min="1" max="10" value="{{ $old('weight', $c->weight ?: 5) }}"><span class="hint">House campaigns fill slots paid campaigns don't use; higher weight shows more often.</span></div>
                <div class="field"><label for="e-cap">View cap <span class="muted">(empty = none)</span></label><input id="e-cap" name="impression_cap" type="number" min="0" value="{{ $old('impression_cap', $c->impression_cap) }}"></div>
            </div>
            <label class="checkline"><input type="hidden" name="paused" value="0"><input type="checkbox" name="paused" value="1" @checked($old('paused', $c->paused))> Paused</label>
        @endif

        <button class="btn accent" type="submit" id="e-submit" data-label="{{ $submit }}">{{ $submit }}</button>
        @if ($mode === 'advertiser' && ! $locked)
            <p class="small muted">Your card is held for the budget, not charged. We charge it only when the campaign is approved; if we don't approve it, the hold is released. Unspent budget is refunded when it ends.</p>
        @endif
    </form>
    <aside class="editor-side">
        <div class="eyebrow">Preview</div>
        <div class="list ppreview" id="sp-preview">@include('partials.sponsor', ['s' => ['campaign' => $c, 'preview' => true]])</div>
        <p class="hint">In job results it sits between job posts. On job pages and blog posts it sits in the sidebar, stacked like this.</p>
        @if ($mode === 'advertiser')
            <div class="card">
                <h3>Campaign policy</h3>
                <ul class="small">
                    <li>Must relate to healthcare work: education, licensing, gear, housing, insurance, services for clinicians.</li>
                    <li>No income or earnings promises.</li>
                    <li>No prescription drugs, supplements or medical claims.</li>
                    <li>The landing page must match the placement and load over HTTPS.</li>
                </ul>
            </div>
        @endif
    </aside>
</div>