@extends('layouts.admin')
@section('title', 'Edit Banner')
@section('page_title', 'Edit Banner')
@section('page_css')
    <link rel="stylesheet" href="{{ asset('css/admin/forms.css') }}">
@endsection
@section('content')
    <x-admin.page-header title="Edit Banner" :breadcrumb="[['label' => 'Banners', 'url' => route('admin.banners.index')], ['label' => $banner->title ?? 'Banner']]" />
    <x-admin.form-card title="Edit Banner Details" :action="route('admin.banners.update', $banner->id)" method="PUT" enctype="multipart">
        <div class="form-grid">
            <div class="form-group">
                <label class="form-label" for="title">Banner Title</label>
                <input type="text" name="title" id="title" value="{{ old('title', $banner->title) }}" class="form-input">
            </div>
            <div class="form-group">
                <label class="form-label" for="position">Position</label>
                <select name="position" id="position" class="form-select">
                    <option value="top" {{ old('position', $banner->position) === 'top' ? 'selected' : '' }}>Top</option>
                    <option value="sidebar" {{ old('position', $banner->position) === 'sidebar' ? 'selected' : '' }}>Sidebar</option>
                    <option value="footer" {{ old('position', $banner->position) === 'footer' ? 'selected' : '' }}>Footer</option>
                    <option value="popup" {{ old('position', $banner->position) === 'popup' ? 'selected' : '' }}>Popup</option>
                    <option value="homepage_hero" {{ old('position', $banner->position) === 'homepage_hero' ? 'selected' : '' }}>Homepage Hero</option>
                </select>
            </div>
            <div class="form-group">
                <label class="form-label" for="link_url">Link URL</label>
                <input type="url" name="link_url" id="link_url" value="{{ old('link_url', $banner->link_url) }}" class="form-input">
            </div>
            <div class="form-group">
                <label class="form-label" for="sort_order">Sort Order</label>
                <input type="number" name="sort_order" id="sort_order" value="{{ old('sort_order', $banner->sort_order) }}" class="form-input" min="0">
            </div>
        </div>
        <div class="form-toggles-row">
            <div class="form-toggle">
                <label class="toggle-label" for="status">Status (Active)</label>
                <label class="toggle-switch">
                    <input type="hidden" name="status" value="inactive">
                    <input type="checkbox" name="status" id="status" value="active" {{ old('status', $banner->status) === 'active' ? 'checked' : '' }}>
                    <span class="toggle-slider"></span>
                </label>
            </div>
        </div>
        <x-admin.image-upload name="image" :current="$banner->image" label="Banner Image" />
        <div class="form-actions">
            <button type="submit" class="btn-primary-action"><i class="bi bi-check-lg"></i> Update Banner</button>
            <a href="{{ route('admin.banners.index') }}" class="btn-cancel">Cancel</a>
        </div>
    </x-admin.form-card>
@endsection
@section('page_js')
    <script src="{{ asset('js/admin/image-preview.js') }}"></script>
@endsection