@extends('layouts.app')

@section('content')
<section class="section light">
    <div class="container">
        <div class="post-header" style="margin-bottom: 40px;">
            <h1 style="font-size: 3rem;">Edit Slide</h1>
            <p>Update the content or image for this home page slider.</p>
        </div>

        <div class="form-container">
            @if($errors->any())
                <div class="alert-error">
                    <ul style="margin-left: 20px;">
                        @foreach($errors->all() as $error)
                            <li>{{ $error }}</li>
                        @endforeach
                    </ul>
                </div>
            @endif

            <form action="{{ route('slider.update', $slider) }}" method="POST" enctype="multipart/form-data">
                @csrf
                @method('PUT')
                <div class="form-group">
                    <label>Main Title</label>
                    <input type="text" name="title" value="{{ old('title', $slider->title) }}" required autofocus>
                </div>

                <div class="form-group">
                    <label>Subtitle / Top Label</label>
                    <input type="text" name="subtitle" value="{{ old('subtitle', $slider->subtitle) }}">
                </div>

                <div class="form-group">
                    <label>Short Description</label>
                    <textarea name="description" rows="3">{{ old('description', $slider->description) }}</textarea>
                </div>

                <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 20px;">
                    <div class="form-group">
                        <label>Button Text</label>
                        <input type="text" name="button_text" value="{{ old('button_text', $slider->button_text) }}">
                    </div>

                    <div class="form-group">
                        <label>Button Link</label>
                        <input type="text" name="button_link" value="{{ old('button_link', $slider->button_link) }}">
                    </div>
                </div>

                <div class="form-group">
                    <label>Update Slider Image (Leave blank to keep current)</label>
                    <div style="margin-bottom: 15px;">
                        <img src="{{ asset('storage/' . $slider->image_path) }}" style="width: 200px; border-radius: 8px; border: 1px solid #eee;">
                    </div>
                    <input type="file" name="image" accept="image/*">
                </div>

                <div class="form-group">
                    <label>Display Order</label>
                    <input type="number" name="order" value="{{ old('order', $slider->order) }}" style="width: 100px;">
                </div>

                <div style="text-align: right; margin-top: 40px;">
                    <a href="{{ route('slider.index') }}" style="margin-right: 20px; color: #666; text-decoration: none; font-weight: 600;">Cancel</a>
                    <button type="submit" class="button button-primary" style="margin: 0; padding: 16px 50px;">Update Slide</button>
                </div>
            </form>
        </div>
    </div>
</section>
@endsection