@extends('layouts.dashboard')

@section('title', $hero->exists ? 'Edit hero' : 'Add hero')

@section('content')
    <h1 class="font-display text-3xl mb-6">{{ $hero->exists ? 'Edit hero' : 'Add hero' }}</h1>

    <form method="POST" action="{{ $hero->exists ? route('dashboard.heroes.update', $hero) : route('dashboard.heroes.store') }}" enctype="multipart/form-data" class="card p-6 space-y-4 max-w-xl">
        @csrf
        @if ($hero->exists) @method('PUT') @endif

        <x-dashboard-field name="headline" label="Headline" :value="$hero->headline" required />
        <x-dashboard-field name="sub_line" label="Sub line" :value="$hero->sub_line" />

        <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
            <x-dashboard-field name="button_label" label="Button label" :value="$hero->button_label" />
            <x-dashboard-field name="link" label="Link" :value="$hero->link" />
        </div>

        <div>
            <label for="image" class="label block mb-1">Image</label>
            @if ($hero->image_path)
                <img src="{{ \Illuminate\Support\Facades\Storage::disk('public')->url($hero->image_path) }}" alt="" class="h-24 rounded-card mb-2">
            @endif
            <input id="image" name="image" type="file" accept="image/*" class="input">
        </div>

        <x-dashboard-field name="sort_order" label="Sort order" type="number" :value="$hero->sort_order ?? 0" required class="max-w-xs" />

        <label class="flex items-center gap-2 text-sm">
            <input type="checkbox" name="live" value="1" @checked(old('live', $hero->live ?? false))>
            Live (max 3 rotating)
        </label>
        @error('live') <p class="text-sm text-status-danger">{{ $message }}</p> @enderror

        <label class="flex items-center gap-2 text-sm">
            <input type="checkbox" name="is_placeholder" value="1" @checked(old('is_placeholder', $hero->is_placeholder ?? true))>
            Still placeholder copy
        </label>

        <button type="submit" class="btn btn-primary">Save</button>
    </form>
@endsection