@extends('layouts.app')
@section('title', 'Опубликовать кампанию — Presaver')

@section('content')
<h1 class="text-xl font-bold">Опубликовать свою ссылку</h1>
<p class="mt-1 text-sm text-gray-600">
    Доступно баллов: <b>{{ $balance }}</b>. Каждый заказанный пресейв стоит 1 балл.
</p>

@if($balance < 1)
    <div class="mt-4 rounded-xl bg-amber-50 border border-amber-200 text-amber-800 p-4 text-sm">
        Недостаточно баллов. Сначала сделайте пресейвы чужих треков в кабинете.
    </div>
@else
    <form method="POST" action="{{ route('campaigns.store') }}" class="mt-5 space-y-5">
        @csrf
        <div>
            <label class="block text-sm font-medium mb-1">Ссылка band.link</label>
            <input type="url" name="band_link_url" value="{{ old('band_link_url') }}" required
                   placeholder="https://band.link/xxxxx"
                   class="w-full rounded-lg border border-gray-300 px-3 py-2.5 focus:border-brand focus:ring-brand">
        </div>

        <div>
            <label class="block text-sm font-medium mb-1">Сколько пресейвов заказать</label>
            <div class="flex items-center gap-3">
                <input type="range" name="target_presaves" min="1" max="{{ $balance }}"
                       value="{{ old('target_presaves', min(4, $balance)) }}"
                       oninput="document.getElementById('tp-val').textContent = this.value"
                       class="flex-1 accent-indigo-600">
                <span id="tp-val" class="w-10 text-right font-semibold">{{ old('target_presaves', min(4, $balance)) }}</span>
            </div>
            <p class="mt-1 text-xs text-gray-500">Спишется столько же баллов. Можно потратить все баллы на одну ссылку.</p>
        </div>

        <button type="submit"
                class="w-full rounded-lg bg-brand text-white px-4 py-3 font-medium hover:bg-brand-dark">
            Опубликовать и списать баллы
        </button>
    </form>
@endif
@endsection