@extends('layout')

@section('title', 'New series')

@section('content')
    <p style="margin:0 0 16px"><a href="{{ route('channels.show', $channel) }}">← {{ $channel->name }}</a></p>

    <div class="card">
        <h1 style="font-size:20px;margin:0 0 4px">New series</h1>
        <p class="muted" style="margin:0 0 16px">A recurring theme. The scheduler generates a video for it on your chosen cadence and can auto-post it.</p>

        <form method="POST" action="{{ route('series.store', $channel) }}">
            @csrf

            <label for="name">Name</label>
            <input id="name" name="name" required placeholder="e.g. Daily Football Facts" value="{{ old('name') }}">

            <label for="topic">Topic / theme</label>
            <input id="topic" name="topic" required
                   placeholder="e.g. surprising facts about famous footballers" value="{{ old('topic') }}">

            <label for="topic_pool">Topic pool <span class="muted">(optional — one per line; each run rotates to the next for variety)</span></label>
            <textarea id="topic_pool" name="topic_pool" rows="4"
                      placeholder="Top 5 mind-blowing space facts&#10;Amazing deep-sea creatures&#10;Ancient Rome mysteries&#10;How the human body surprises us">{{ old('topic_pool') }}</textarea>

            <div class="row">
                <div>
                    <label for="scene_count">Scenes</label>
                    <input id="scene_count" name="scene_count" type="number" min="1" max="20" value="{{ old('scene_count', 6) }}">
                </div>
                <div>
                    <label for="target_seconds">Target length (sec)</label>
                    <input id="target_seconds" name="target_seconds" type="number" min="10" max="180" placeholder="auto" value="{{ old('target_seconds') }}">
                </div>
                <div>
                    <label for="language">Language</label>
                    <input id="language" name="language" value="{{ old('language', 'English') }}">
                </div>
            </div>

            <label for="style">Style / tone (optional)</label>
            <input id="style" name="style" placeholder="punchy, energetic, viral" value="{{ old('style') }}">

            <label for="voice_id">Voice ID <span class="muted">(optional — ElevenLabs, for this first channel)</span></label>
            <input id="voice_id" name="voice_id" placeholder="leave blank for default voice" value="{{ old('voice_id') }}">

            <div class="row">
                <div>
                    <label for="cadence">Cadence</label>
                    <select id="cadence" name="cadence">
                        <option value="daily" @selected(old('cadence')==='daily')>Daily</option>
                        <option value="weekly" @selected(old('cadence')==='weekly')>Weekly</option>
                        <option value="manual" @selected(old('cadence')==='manual')>Manual (only "Run now")</option>
                    </select>
                </div>
                <div>
                    <label for="post_times">Post times</label>
                    <input id="post_times" name="post_times" placeholder="09:00, 13:00, 18:00" value="{{ old('post_times') }}">
                </div>
            </div>

            <label style="margin-top:14px">Publish to</label>
            @if(empty($platforms))
                <p class="muted" style="margin:4px 0">No connected accounts on this channel yet. <a href="{{ route('channels.show', $channel) }}">Connect some</a> to enable auto-posting.</p>
            @else
                @foreach($platforms as $platform)
                    <label style="display:flex;align-items:center;gap:8px;margin:4px 0;color:var(--text)">
                        <input type="checkbox" name="platforms[]" value="{{ $platform }}" style="width:auto" checked>
                        {{ ucfirst($platform) }}
                    </label>
                @endforeach
            @endif

            <label style="display:flex;align-items:center;gap:8px;margin-top:14px;color:var(--text)">
                <input type="checkbox" name="viral" value="1" style="width:auto" checked>
                🔥 Viral mode (hook + CTA, platform captions & hashtags)
            </label>
            <label style="display:flex;align-items:center;gap:8px;margin-top:8px;color:var(--text)">
                <input type="checkbox" name="motion" value="1" style="width:auto">
                🎬 Motion (AI video clips instead of zoom — slower &amp; costs per clip)
            </label>
            <label style="display:flex;align-items:center;gap:8px;margin-top:8px;color:var(--text)">
                <input type="checkbox" name="countdown" value="1" style="width:auto">
                🔢 Countdown (Top-N: rank number on screen + countdown script)
            </label>
            <label style="display:flex;align-items:center;gap:8px;margin-top:8px;color:var(--text)">
                <input type="checkbox" name="economy" value="1" style="width:auto">
                💸 Economy (low-cost: cheaper images, no motion)
            </label>
            <label style="display:flex;align-items:center;gap:8px;margin-top:8px;color:var(--text)">
                <input type="checkbox" name="auto_publish" value="1" style="width:auto" checked>
                Auto-publish each generated video
            </label>
            <label style="display:flex;align-items:center;gap:8px;margin-top:8px;color:var(--muted)">
                <input type="checkbox" name="optimize_timing" value="1" style="width:auto" checked>
                Post at each platform's best time
            </label>

            <button type="submit">Create series</button>
        </form>
    </div>
@endsection