@csrf

<label>
    <span>Title</span>
    <input name="title" value="{{ old('title', $slider->title) }}" required>
</label>

<label>
    <span>Subtitle</span>
    <input name="subtitle" value="{{ old('subtitle', $slider->subtitle) }}">
</label>

<div class="form-grid two-columns">
    <label>
        <span>Button Text</span>
        <input name="button_text" value="{{ old('button_text', $slider->button_text) }}" placeholder="Shop now">
    </label>

    <label>
        <span>Button URL</span>
        <input name="button_url" type="url" value="{{ old('button_url', $slider->button_url) }}" placeholder="https://...">
    </label>
</div>

<div class="form-grid two-columns">
    <label>
        <span>Image</span>
        <input name="image" type="file" accept="image/jpeg,image/png,image/webp" @required(! $slider->exists)>
    </label>

    <label>
        <span>Sort Order</span>
        <input name="sort_order" type="number" min="0" step="1" value="{{ old('sort_order', $slider->sort_order ?? 0) }}" required>
    </label>
</div>

@if ($slider->exists)
    <div class="media-list">
        <img src="{{ $slider->imageUrl() }}" alt="{{ $slider->title }}">
    </div>
@endif

<label class="checkbox-label">
    <input name="is_active" type="checkbox" value="1" @checked(old('is_active', $slider->is_active ?? true))>
    <span>Active</span>
</label>

@if ($errors->any())
    <p class="form-error">{{ $errors->first() }}</p>
@endif