@extends('admin.layout')

@section('title', 'Editar Slide')

@section('content')
<div class="d-flex justify-content-between align-items-center mb-4">
    <h2 class="mb-0">✏️ Editar Slide</h2>
    <a href="{{ route('admin.carousel.index') }}" class="btn btn-secondary shadow-sm">
        <i class="bi bi-arrow-left"></i> Volver a la Lista
    </a>
</div>

<div class="card shadow-sm border-0">
    <div class="card-body">
        <form action="{{ route('admin.carousel.update', $carouselItem->id) }}" method="POST" enctype="multipart/form-data">
            @csrf
            @method('PUT')

            <div class="row mb-3">
                <div class="col-md-6">
                    <label class="form-label font-weight-bold">Título</label>
                    <input type="text" name="titulo" class="form-control" value="{{ old('titulo', $carouselItem->titulo) }}">
                </div>
                <div class="col-md-6">
                    <label class="form-label font-weight-bold">Subtítulo</label>
                    <input type="text" name="subtitulo" class="form-control" value="{{ old('subtitulo', $carouselItem->subtitulo) }}">
                </div>
            </div>

            <div class="row mb-3">
                <div class="col-md-6">
                    <label class="form-label font-weight-bold">Texto del Botón</label>
                    <input type="text" name="boton_texto" class="form-control" value="{{ old('boton_texto', $carouselItem->boton_texto) }}">
                </div>
                <div class="col-md-6">
                    <label class="form-label font-weight-bold">Enlace del Botón (URL)</label>
                    <input type="text" name="boton_enlace" class="form-control" value="{{ old('boton_enlace', $carouselItem->boton_enlace) }}" placeholder="Ej: /eventos o https://...">
                </div>
            </div>

            <div class="row mb-3 mt-4 align-items-center">
                <div class="col-md-3 text-center mb-3">
                    <label class="form-label font-weight-bold w-100 text-start">Imagen Actual</label>
                    <img src="{{ Str::startsWith($carouselItem->imagen, 'http') ? $carouselItem->imagen : asset($carouselItem->imagen) }}" 
                         alt="Slide actual" class="img-thumbnail w-100 shadow-sm" style="max-height: 150px; object-fit: cover;">
                </div>
                <div class="col-md-5">
                    <label class="form-label font-weight-bold">Reemplazar Imagen (Opcional)</label>
                    <input type="file" name="imagen" class="form-control" accept="image/*">
                    <small class="text-muted d-block mt-1">Si no subís nada se conservará la actual.</small>
                    @error('imagen')
                        <div class="text-danger small mt-1">{{ $message }}</div>
                    @enderror
                </div>
                
                <div class="col-md-2 mt-4 text-center">
                    <div class="form-check form-switch fs-5 h-100 d-flex flex-column align-items-center justify-content-center">
                        <label class="form-check-label ms-2 fs-6 mb-2" for="activo">Visible</label>
                        <input class="form-check-input mt-0" type="checkbox" role="switch" name="activo" id="activo" value="1" style="height: 25px; width: 50px;" {{ $carouselItem->activo ? 'checked' : '' }}>
                    </div>
                </div>
                <div class="col-md-2">
                    <label class="form-label font-weight-bold">Orden</label>
                    <input type="number" name="orden" class="form-control" value="{{ old('orden', $carouselItem->orden) }}">
                </div>
            </div>

            <div class="text-end mt-4">
                <button type="submit" class="btn btn-primary px-4 shadow-sm">
                    <i class="bi bi-save me-1"></i> Actualizar Slide
                </button>
            </div>
        </form>
    </div>
</div>
@endsection